:root{--surface: #eae7e2;--surface-2: #f7f5f1;--primary: #2e74ff;--secondary: #e66a2c;--accent-green: #21a37a;--accent-red: #c9345a;--text: #212121;--text-muted: #5a5a5a;--divider: #c9c3bb;--e1: 0 1px 0 rgba(0,0,0,.2), 0 2px 1px rgba(0,0,0,.12), 0 8px 16px rgba(0,0,0,.15);--e2: 0 3px 0 rgba(0,0,0,.22), 0 2px 2px rgba(0,0,0,.15), 0 12px 24px rgba(0,0,0,.18);--e3: 0 6px 0 rgba(0,0,0,.24), 0 4px 4px rgba(0,0,0,.18), 0 30px 50px rgba(0,0,0,.25);--rim: inset 0 1px 0 rgba(255,255,255,.8);--rim-bottom: inset 0 -1px 0 rgba(0,0,0,.15);--gloss: inset 0 12px 20px rgba(255,255,255,.45);--gloss-strong: inset 0 16px 24px rgba(255,255,255,.6);--inset: inset 0 3px 6px rgba(0,0,0,.35), inset 0 1px 2px rgba(0,0,0,.4);--edge-light: rgba(255,255,255,.9);--edge-dark: rgba(0,0,0,.18);--font-body: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", system-ui, sans-serif;--spacing-xs: 4px;--spacing-sm: 8px;--spacing-md: 16px;--spacing-lg: 24px;--spacing-xl: 32px;--radius-sm: 8px;--radius-md: 12px;--radius-lg: 14px;--transition-fast: .15s cubic-bezier(.2, .8, .2, 1);--transition-base: .22s cubic-bezier(.2, .8, .2, 1);--transition-slow: .35s cubic-bezier(.2, .8, .2, 1)}*{margin:0;padding:0;box-sizing:border-box}body{font-family:var(--font-body);background:var(--surface);color:var(--text);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;line-height:1.6;position:relative}body:before{content:"";position:fixed;top:0;right:0;bottom:0;left:0;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 400 400' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noise'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noise)' opacity='0.05'/%3E%3C/svg%3E"),repeating-linear-gradient(0deg,transparent,transparent 2px,rgba(0,0,0,.02) 2px,rgba(0,0,0,.02) 4px),repeating-linear-gradient(90deg,transparent,transparent 2px,rgba(0,0,0,.02) 2px,rgba(0,0,0,.02) 4px);pointer-events:none;z-index:1}body>*{position:relative;z-index:2}h1,h2,h3,h4,h5,h6{text-shadow:0 1px 2px rgba(255,255,255,.9),0 -1px 1px rgba(0,0,0,.05)}code{font-family:source-code-pro,Menlo,Monaco,Consolas,Courier New,monospace;background:#0000000d;padding:2px 6px;border-radius:4px;font-size:.9em}@media (prefers-reduced-motion: reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}:focus-visible{outline:2px solid var(--primary);outline-offset:2px}::selection{background:#2e74ff33;color:var(--text)}.navbar{background:linear-gradient(180deg,#f5f3ef,#eae7e1,#e2dfd9);border-bottom:1px solid rgba(0,0,0,.15);box-shadow:0 3px #00000014,0 4px 12px #0000001f,inset 0 1px #fff9;position:sticky;top:0;z-index:100;position:relative}.navbar:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background-image:repeating-linear-gradient(90deg,transparent,transparent 1px,rgba(0,0,0,.02) 1px,rgba(0,0,0,.02) 2px);pointer-events:none}.navbar__container{max-width:1200px;margin:0 auto;padding:0 var(--spacing-lg);display:flex;align-items:center;justify-content:space-between;height:64px;position:relative;z-index:1}.navbar__brand{font-size:18px;font-weight:600;color:var(--text);text-decoration:none;text-shadow:0 1px 1px rgba(255,255,255,.8);transition:color var(--transition-fast)}.navbar__brand:hover{color:var(--primary)}.navbar__links{display:flex;gap:var(--spacing-sm);list-style:none;margin:0;padding:0}.navbar__link{position:relative;display:inline-flex;align-items:center;padding:10px 18px;border-radius:var(--radius-sm);background:linear-gradient(180deg,#fff,#faf8f4 30%,#f2efe9);box-shadow:0 2px #00000026,0 1px 1px #0000001a,0 5px 10px #0000001a,inset 0 1px #fffc,inset 0 -1px #0000001a;color:var(--text);text-decoration:none;font-weight:500;font-size:14px;text-shadow:0 1px 0 rgba(255,255,255,.7);transition:transform var(--transition-fast),box-shadow var(--transition-fast),background var(--transition-fast);overflow:hidden}.navbar__link:before{content:"";position:absolute;top:0;left:0;right:0;height:40%;background:linear-gradient(180deg,rgba(255,255,255,.3) 0%,transparent 100%);pointer-events:none}.navbar__link:hover{transform:translateY(-2px);box-shadow:0 3px #0000002e,0 2px 2px #0000001f,0 8px 14px #0000001f,inset 0 1px #ffffffe6,inset 0 -1px #0000001f}.navbar__link--active{background:linear-gradient(180deg,#d8d5cf,#e0ddd7);box-shadow:inset 0 3px 6px #00000040,inset 0 1px 2px #0000004d,inset 0 -1px #fff3;transform:translateY(2px);color:var(--primary);text-shadow:0 1px 0 rgba(255,255,255,.4)}.navbar__link--active:before{opacity:.3}.navbar__link--active:hover{transform:translateY(2px);box-shadow:inset 0 3px 6px #00000040,inset 0 1px 2px #0000004d,inset 0 -1px #fff3}@media (max-width: 768px){.navbar__links{gap:var(--spacing-xs)}.navbar__link{padding:8px 14px;font-size:13px}}.footer{background:linear-gradient(0deg,#ddd9d3,#e8e5df,#ebe8e2);border-top:1px solid rgba(0,0,0,.15);box-shadow:0 -3px #00000014,0 -4px 12px #0000001a,inset 0 1px #fff9;margin-top:auto;position:relative}.footer:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background-image:repeating-linear-gradient(90deg,transparent,transparent 1px,rgba(0,0,0,.02) 1px,rgba(0,0,0,.02) 2px);pointer-events:none}.footer__container{max-width:1200px;margin:0 auto;padding:var(--spacing-lg);display:flex;flex-direction:column;align-items:center;gap:var(--spacing-md);position:relative;z-index:1}.footer__social{display:flex;gap:var(--spacing-md)}.footer__link{display:inline-flex;align-items:center;padding:10px 18px;border-radius:var(--radius-sm);background:linear-gradient(180deg,#fff,#faf8f4 30%,#f2efe9);box-shadow:0 2px #00000026,0 1px 1px #0000001a,0 5px 10px #00000014,inset 0 1px #ffffffb3,inset 0 -1px #00000014;color:var(--text);text-decoration:none;font-weight:500;font-size:14px;text-shadow:0 1px 0 rgba(255,255,255,.7);transition:transform var(--transition-fast),box-shadow var(--transition-fast);position:relative;overflow:hidden}.footer__link:before{content:"";position:absolute;top:0;left:0;right:0;height:40%;background:linear-gradient(180deg,rgba(255,255,255,.25) 0%,transparent 100%);pointer-events:none}.footer__link:hover{transform:translateY(-2px);box-shadow:0 3px #0000002e,0 2px 2px #0000001f,0 8px 14px #0000001a,inset 0 1px #fffc,inset 0 -1px #0000001a;color:var(--primary)}.footer__link:active{transform:translateY(2px);box-shadow:inset 0 3px 6px #00000040,inset 0 1px 2px #0000004d;background:linear-gradient(180deg,#d8d5cf,#e0ddd7)}.footer__link:active:before{opacity:.3}.footer__text{font-size:14px;color:var(--text-muted);margin:0;text-shadow:0 1px 0 rgba(255,255,255,.5)}.card{background:linear-gradient(180deg,#fdfcfa 0%,var(--surface-2) 100%);border-radius:var(--radius-lg);box-shadow:var(--e1),var(--rim),var(--rim-bottom),0 0 0 1px #00000014,inset 0 0 0 1px #ffffff4d;padding:var(--spacing-lg);position:relative}.card:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;border-radius:var(--radius-lg);background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='paper'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.8' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23paper)' opacity='0.08'/%3E%3C/svg%3E"),repeating-linear-gradient(0deg,transparent,transparent 1px,rgba(0,0,0,.025) 1px,rgba(0,0,0,.025) 2px),repeating-linear-gradient(90deg,transparent,transparent 1px,rgba(0,0,0,.025) 1px,rgba(0,0,0,.025) 2px),repeating-linear-gradient(45deg,transparent,transparent 2px,rgba(0,0,0,.015) 2px,rgba(0,0,0,.015) 3px);opacity:1;pointer-events:none;mix-blend-mode:multiply}.card__title{margin:0 0 var(--spacing-md);font-weight:600;font-size:20px;color:var(--text);text-shadow:0 1px 1px rgba(255,255,255,.8);position:relative;z-index:1}.card__content{position:relative;z-index:1}.btn{position:relative;display:inline-flex;align-items:center;justify-content:center;padding:12px 24px;border-radius:var(--radius-md);background:linear-gradient(180deg,#ffffff 0%,#faf8f4 20%,var(--surface-2) 100%);box-shadow:var(--e2),var(--rim),var(--rim-bottom),0 0 0 1px #0000001f,inset 0 0 0 1px #fff6;border:0;cursor:pointer;-webkit-user-select:none;user-select:none;font-family:var(--font-body);font-size:15px;font-weight:500;color:var(--text);text-shadow:0 1px 1px rgba(255,255,255,.8);transition:transform var(--transition-fast),box-shadow var(--transition-fast);overflow:hidden}.btn:before{content:"";position:absolute;top:0;left:0;right:0;height:50%;background:linear-gradient(180deg,rgba(255,255,255,.5) 0%,rgba(255,255,255,.2) 50%,transparent 100%);border-radius:var(--radius-md) var(--radius-md) 50% 50%;pointer-events:none}.btn:after{content:"";position:absolute;top:3px;left:20%;width:40%;height:30%;background:radial-gradient(ellipse at center,rgba(255,255,255,.6) 0%,rgba(255,255,255,.3) 40%,transparent 70%);border-radius:50%;pointer-events:none}.btn:hover{transform:translateY(-2px);box-shadow:0 5px #00000038,0 3px 3px #00000026,0 16px 28px #0003,var(--rim),var(--rim-bottom),0 0 0 1px #0000001f,inset 0 0 0 1px #ffffff80}.btn:active{transform:translateY(3px);box-shadow:var(--inset),0 0 0 1px #00000026;background:linear-gradient(180deg,#ddd9d3,#e8e5df)}.btn:active:before,.btn:active:after{opacity:.3}.btn--primary{color:#fff;text-shadow:0 1px 2px rgba(0,0,0,.3);background:linear-gradient(180deg,#8ab4ff 0%,#6ea3ff 20%,var(--primary) 100%)}.btn--primary:before{background:linear-gradient(180deg,rgba(255,255,255,.4) 0%,rgba(255,255,255,.15) 50%,transparent 100%)}.btn--primary:active{background:linear-gradient(180deg,#245ed1,#1a4dad)}.btn--secondary{color:#fff;text-shadow:0 1px 2px rgba(0,0,0,.3);background:linear-gradient(180deg,#ff9466 0%,#f08956 20%,var(--secondary) 100%)}.btn--secondary:before{background:linear-gradient(180deg,rgba(255,255,255,.35) 0%,rgba(255,255,255,.12) 50%,transparent 100%)}.btn--secondary:active{background:linear-gradient(180deg,#c85423,#a84419)}.btn:disabled{opacity:.5;cursor:not-allowed;box-shadow:0 1px #0000001f,0 4px 8px #00000014}.btn:disabled:hover,.btn:disabled:active{transform:none}.btn:disabled:before,.btn:disabled:after{opacity:.2}.home{flex:1;display:flex;align-items:center;justify-content:center;padding:var(--spacing-xl)}.home__container{width:100%;max-width:800px}.home__card{text-align:center}.home__content{display:flex;flex-direction:column;gap:var(--spacing-lg)}.home__title{margin:0;font-size:48px;font-weight:600;color:var(--text);text-shadow:0 1px 2px rgba(255,255,255,.8)}.home__subtitle{margin:0;font-size:24px;font-weight:500;color:var(--text-muted)}.home__description{margin:0;font-size:16px;line-height:1.8;color:var(--text-muted)}.home__actions{display:flex;gap:var(--spacing-md);justify-content:center;flex-wrap:wrap}@media (max-width: 768px){.home{padding:var(--spacing-lg)}.home__title{font-size:36px}.home__subtitle{font-size:20px}}.about{padding:var(--spacing-xl)}.about__container{max-width:900px;margin:0 auto}.about__heading{font-size:36px;font-weight:600;margin:0 0 var(--spacing-lg);color:var(--text);text-shadow:0 1px 2px rgba(255,255,255,.8)}.about__content{display:flex;flex-direction:column;gap:var(--spacing-lg)}.about__content h2{margin:0 0 var(--spacing-sm);font-size:24px;font-weight:600;color:var(--text)}.about__content p{margin:0;line-height:1.8;color:var(--text-muted)}@media (max-width: 768px){.about{padding:var(--spacing-lg)}.about__heading{font-size:28px}.about__content h2{font-size:20px}}.project-card{background:linear-gradient(180deg,#fdfcfa 0%,var(--surface-2) 100%);border-radius:var(--radius-lg);box-shadow:var(--e1),var(--rim),var(--rim-bottom),0 0 0 1px #00000014,inset 0 0 0 1px #ffffff4d;padding:var(--spacing-lg);display:flex;flex-direction:column;gap:var(--spacing-md);transition:transform var(--transition-base),box-shadow var(--transition-base);position:relative}.project-card:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;border-radius:var(--radius-lg);background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='paper-proj'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.8' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23paper-proj)' opacity='0.06'/%3E%3C/svg%3E"),repeating-linear-gradient(45deg,transparent,transparent 2px,rgba(0,0,0,.015) 2px,rgba(0,0,0,.015) 3px);opacity:1;pointer-events:none;mix-blend-mode:multiply}.project-card:hover{transform:translateY(-3px);box-shadow:var(--e2),var(--rim),var(--rim-bottom),0 0 0 1px #0000001a,inset 0 0 0 1px #fff6}.project-card__title{margin:0;font-size:20px;font-weight:600;color:var(--text);text-shadow:0 1px 1px rgba(255,255,255,.8);position:relative;z-index:1}.project-card__description{margin:0;color:var(--text-muted);line-height:1.6;flex:1;position:relative;z-index:1}.project-card__tags{display:flex;flex-wrap:wrap;gap:var(--spacing-sm);position:relative;z-index:1}.project-card__tag{display:inline-block;padding:6px 12px;border-radius:var(--radius-sm);background:linear-gradient(180deg,#d8d5cf,#e0ddd7);box-shadow:inset 0 2px 4px #0003,inset 0 1px 1px #00000026,inset 0 -1px #fff3;font-size:12px;font-weight:500;color:var(--text-muted);text-shadow:0 1px 0 rgba(255,255,255,.4)}.project-card__link{display:inline-flex;align-items:center;align-self:flex-start;padding:10px 18px;border-radius:var(--radius-md);background:linear-gradient(180deg,#8ab4ff 0%,#6ea3ff 20%,var(--primary) 100%);box-shadow:0 2px #0000002e,0 1px 1px #0000001f,0 6px 12px #00000024,inset 0 1px #fff6,inset 0 -1px #0000001a;color:#fff;text-decoration:none;font-weight:500;font-size:14px;text-shadow:0 1px 2px rgba(0,0,0,.3);transition:transform var(--transition-fast),box-shadow var(--transition-fast);position:relative;z-index:1;overflow:hidden}.project-card__link:before{content:"";position:absolute;top:0;left:0;right:0;height:40%;background:linear-gradient(180deg,rgba(255,255,255,.3) 0%,transparent 100%);pointer-events:none}.project-card__link:hover{transform:translateY(-2px);box-shadow:0 3px #0003,0 2px 2px #00000024,0 10px 16px #00000029,inset 0 1px #ffffff80,inset 0 -1px #0000001f}.project-card__link:active{transform:translateY(2px);box-shadow:inset 0 3px 6px #00000059,inset 0 1px 2px #0006;background:linear-gradient(180deg,#245ed1,#1a4dad)}.project-card__link:active:before{opacity:.3}.projects{padding:var(--spacing-xl)}.projects__container{max-width:1200px;margin:0 auto}.projects__heading{font-size:36px;font-weight:600;margin:0 0 var(--spacing-xl);color:var(--text);text-shadow:0 1px 2px rgba(255,255,255,.8)}.projects__grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:var(--spacing-lg)}@media (max-width: 768px){.projects{padding:var(--spacing-lg)}.projects__heading{font-size:28px}.projects__grid{grid-template-columns:1fr}}.skills{padding:var(--spacing-xl)}.skills__container{max-width:1200px;margin:0 auto}.skills__heading{font-size:36px;font-weight:600;margin:0 0 var(--spacing-xl);color:var(--text);text-shadow:0 1px 2px rgba(255,255,255,.8)}.skills__grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:var(--spacing-lg)}.skills__list{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:var(--spacing-sm)}.skills__item{padding:10px var(--spacing-md);border-radius:var(--radius-sm);background:linear-gradient(180deg,#d5d2cc,#ddd9d3,#e0ddd7);box-shadow:inset 0 3px 5px #00000040,inset 0 1px 2px #0000004d,inset 0 -1px #ffffff40;color:var(--text);font-weight:500;font-size:14px;text-shadow:0 1px 0 rgba(255,255,255,.4)}@media (max-width: 768px){.skills{padding:var(--spacing-lg)}.skills__heading{font-size:28px}.skills__grid{grid-template-columns:1fr}}.contact{padding:var(--spacing-xl)}.contact__container{max-width:800px;margin:0 auto}.contact__heading{font-size:36px;font-weight:600;margin:0 0 var(--spacing-lg);color:var(--text);text-shadow:0 1px 2px rgba(255,255,255,.8)}.contact__content{display:flex;flex-direction:column;gap:var(--spacing-xl)}.contact__description{margin:0;font-size:16px;line-height:1.8;color:var(--text-muted)}.contact__links{display:flex;gap:var(--spacing-md);flex-wrap:wrap}.contact__link{display:inline-flex;align-items:center;padding:12px 24px;border-radius:var(--radius-md);background:linear-gradient(180deg,#ffffff 0%,#faf8f4 20%,var(--surface-2) 100%);box-shadow:0 2px #0000002e,0 1px 1px #0000001f,0 6px 12px #0000001f,inset 0 1px #ffffffb3,inset 0 -1px #0000001a;color:var(--text);text-decoration:none;font-weight:500;font-size:15px;text-shadow:0 1px 0 rgba(255,255,255,.7);transition:transform var(--transition-fast),box-shadow var(--transition-fast);position:relative;overflow:hidden}.contact__link:before{content:"";position:absolute;top:0;left:0;right:0;height:40%;background:linear-gradient(180deg,rgba(255,255,255,.3) 0%,transparent 100%);pointer-events:none}.contact__link:hover{transform:translateY(-2px);box-shadow:0 3px #0003,0 2px 2px #00000024,0 10px 16px #00000024,inset 0 1px #fffc,inset 0 -1px #0000001f;color:var(--primary)}.contact__link:active{transform:translateY(2px);box-shadow:inset 0 3px 6px #0000004d,inset 0 1px 2px #00000059;background:linear-gradient(180deg,#ddd9d3,#e8e5df)}.contact__link:active:before{opacity:.3}.contact__form h2{margin:0 0 var(--spacing-md);font-size:24px;font-weight:600;color:var(--text)}.form{display:flex;flex-direction:column;gap:var(--spacing-lg)}.form__field{display:flex;flex-direction:column;gap:var(--spacing-sm)}.form__label{font-weight:500;font-size:14px;color:var(--text)}.form__input,.form__textarea{padding:12px 16px;border-radius:10px;border:0;background:linear-gradient(180deg,#d5d2cc,#ddd9d3);box-shadow:inset 0 4px 8px #0000004d,inset 0 2px 3px #00000059,inset 0 1px #0003,inset 0 -1px #ffffff4d;font-family:var(--font-body);font-size:15px;color:var(--text);transition:box-shadow var(--transition-fast);position:relative}.form__input:focus,.form__textarea:focus{outline:none;box-shadow:inset 0 4px 8px #0000004d,inset 0 2px 3px #00000059,inset 0 0 0 2px #2e74ff66,0 0 0 2px #2e74ff4d,0 0 8px #2e74ff33;background:linear-gradient(180deg,#d8d5cf,#e0ddd7)}.form__textarea{resize:vertical;min-height:100px}@media (max-width: 768px){.contact{padding:var(--spacing-lg)}.contact__heading{font-size:28px}}.App{min-height:100vh;display:flex;flex-direction:column}.App main{flex:1;display:flex;flex-direction:column}
