html{scroll-behavior:smooth;-webkit-text-size-adjust:100%;overflow-x:hidden}:root{font-family:system-ui,-apple-system,BlinkMacSystemFont,SF Pro Text,Segoe UI,sans-serif;line-height:1.5;font-weight:400;color-scheme:dark;color:#e5e7eb;background-color:#020617;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;--color-body-bg: #020617;--color-surface-soft: rgba(15, 23, 42, .85);--color-surface-strong: #020617;--color-border-subtle: rgba(148, 163, 184, .25);--color-border-soft: rgba(148, 163, 184, .45);--color-text: #e5e7eb;--color-text-soft: #d1d5db;--color-text-muted: #9ca3af;--color-heading: #f9fafb;--color-primary: #f9fafb;--color-secondary: #e5e7eb;--color-tertiary: #9ca3af;--color-accent: #f9fafb;--color-accent-soft: #e5e7eb;--color-error: #f97373;--color-success: #4ade80;--shadow-glow: 0 0 24px rgba(15, 23, 42, .9)}[data-theme=light]{color-scheme:light;--color-body-bg: #f8fafc;--color-surface-soft: rgba(255, 255, 255, .9);--color-surface-strong: #ffffff;--color-border-subtle: rgba(15, 23, 42, .08);--color-border-soft: rgba(15, 23, 42, .15);--color-text: #1e293b;--color-text-soft: #334155;--color-text-muted: #64748b;--color-heading: #0f172a;--color-primary: #0f172a;--color-secondary: #334155;--color-tertiary: #475569;--color-accent: #0f172a;--color-accent-soft: #334155;--shadow-glow: 0 0 20px rgba(0, 0, 0, .1)}a{font-weight:500;color:var(--color-primary);text-decoration:inherit;transition:all .2s ease}a:hover{color:var(--color-secondary);text-shadow:0 0 6px rgba(255,255,255,.5)}body{margin:0;min-width:320px;min-height:100vh;background-color:var(--color-body-bg)}button{font-size:1rem;font-family:inherit}button:focus,button:focus-visible{outline:2px solid var(--color-accent);outline-offset:2px}input,textarea{font-family:inherit}.app{min-height:100vh;min-height:100dvh;background:radial-gradient(circle at 15% 50%,var(--color-surface-soft),transparent 25%),radial-gradient(circle at 85% 30%,var(--color-border-subtle),transparent 25%),radial-gradient(circle at 50% 0%,var(--color-surface-soft),var(--color-body-bg));background-attachment:fixed;color:var(--color-text);transition:background-color .3s ease,color .3s ease}@media(max-width:768px){.app{background-attachment:scroll}}.text-gradient{background:linear-gradient(135deg,var(--color-primary),var(--color-secondary));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.main,.project-detail{padding-block:6rem 4rem}@media(max-width:767px){.main,.project-detail{padding-block:4rem 3rem}}.container{width:min(1120px,100% - 2.5rem);margin-inline:auto}.section{padding-block:3rem;scroll-margin-top:7rem}@media(min-width:768px){.section{padding-block:4rem}}.hero{padding-block:4rem 3rem;scroll-margin-top:7rem}@media(min-width:768px){.hero{padding-block:6rem 5rem}}.section+.section{border-top:1px solid var(--color-border-subtle)}.section-kicker{font-size:.85rem;text-transform:uppercase;letter-spacing:.1em;color:var(--color-primary);margin-bottom:.75rem;font-weight:600}.section-title{font-size:clamp(2rem,3.5vw,2.8rem);margin:0;color:var(--color-heading);letter-spacing:-.02em}.section-body{margin-top:1.25rem;max-width:38rem;color:var(--color-text-muted);font-size:1.1rem}.section-grid{display:grid;gap:3rem}@media(min-width:768px){.section-grid{grid-template-columns:minmax(0,1.1fr) minmax(0,1.3fr);align-items:start}}.header{position:sticky;top:0;z-index:20;-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);background:var(--color-surface-soft);border-bottom:1px solid var(--color-border-subtle);transition:background-color .3s ease,border-color .3s ease;padding-top:env(safe-area-inset-top,0px)}.header-content{display:flex;align-items:center;justify-content:space-between;padding-block:1rem;gap:1.5rem;width:min(1120px,100% - 2.5rem);margin-inline:auto}.brand{display:inline-flex;align-items:center;gap:.75rem;font-weight:700;color:var(--color-heading);font-size:1.2rem}.brand-mark{width:2.4rem;height:2.4rem;display:inline-flex;align-items:center;justify-content:center;border-radius:1rem;background:linear-gradient(135deg,var(--color-primary),var(--color-secondary));color:var(--color-body-bg);font-size:1.2rem;box-shadow:0 4px 12px var(--shadow-glow)}.brand-text{letter-spacing:-.01em}.theme-toggle{display:inline-flex;align-items:center;justify-content:center;width:2.5rem;height:2.5rem;padding:0;border-radius:999px;background:var(--color-surface-soft);color:var(--color-heading);border:1px solid var(--color-border-subtle);cursor:pointer;transition:all .2s ease}.theme-toggle:hover{background:var(--color-border-subtle);transform:rotate(15deg)}.nav{display:flex;gap:.35rem;align-items:center}.nav-toggle{display:inline-flex;flex-direction:column;justify-content:center;gap:.25rem;width:2.5rem;height:2.5rem;border-radius:999px;border:1px solid var(--color-border-subtle);background:var(--color-surface-soft);cursor:pointer;padding:0}.nav-toggle-bar{width:1.2rem;height:.12rem;background:var(--color-heading);border-radius:999px;margin:0 auto}.nav-link{border:none;background:transparent;color:var(--color-text-muted);padding:.5rem 1rem;border-radius:999px;font-size:.95rem;cursor:pointer;transition:all .2s ease}.nav-link:hover{color:var(--color-heading);background:var(--color-border-subtle)}.nav-link-active{color:var(--color-heading);background:var(--color-border-soft);font-weight:500}@media(max-width:767px){.nav{position:absolute;inset-inline:0;top:100%;padding:1rem 1.5rem 1.5rem;flex-direction:column;background:#030014f2;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border-bottom:1px solid var(--color-border-subtle);opacity:0;transform:translateY(-12px);pointer-events:none;transition:opacity .2s ease-out,transform .2s ease-out}.nav-open{opacity:1;transform:translateY(0);pointer-events:auto}}@media(min-width:768px){.nav-toggle{display:none}}.hero-grid{display:grid;gap:2.5rem}@media(min-width:768px){.hero-grid{gap:4rem;grid-template-columns:minmax(0,1.4fr) minmax(0,1fr);align-items:center}}.hero-text{max-width:38rem}.hero-kicker{font-size:.95rem;text-transform:uppercase;letter-spacing:.15em;background:linear-gradient(to right,var(--color-primary),var(--color-secondary));-webkit-background-clip:text;-webkit-text-fill-color:transparent;margin-bottom:1rem;font-weight:700}.hero-title{font-size:clamp(2.5rem,5vw,3.5rem);line-height:1.1;margin:0 0 1.25rem;color:var(--color-heading);font-weight:800;letter-spacing:-.02em}.hero-subtitle{margin:0;color:var(--color-text-muted);font-size:1.2rem;line-height:1.6}.hero-actions{margin-top:2.5rem;display:flex;flex-wrap:wrap;gap:1rem}.contact-grid{display:grid;gap:3rem;align-items:flex-start;justify-content:center}@media(min-width:768px){.contact-grid{grid-template-columns:minmax(0,1fr) minmax(0,1.1fr)}}.contact-form{display:flex;flex-direction:column;gap:1.25rem;width:100%}.field{display:flex;flex-direction:column;gap:.4rem}.field label{font-size:.9rem;font-weight:500;color:var(--color-text-soft)}.hero-highlight{display:flex;justify-content:center;perspective:1000px}.hero-card{position:relative;width:min(22rem,100%);border-radius:2rem;padding:2rem;background:var(--color-surface-soft);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid var(--color-border-subtle);box-shadow:0 25px 50px -12px var(--shadow-glow),inset 0 0 0 1px var(--color-border-subtle);display:grid;gap:1.5rem;transform-style:preserve-3d;animation:hero-float 8s ease-in-out infinite alternate}.hero-card:before{content:"";position:absolute;inset:-1px;border-radius:2rem;padding:1px;background:linear-gradient(135deg,var(--color-primary),transparent,var(--color-secondary));-webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);-webkit-mask-composite:xor;mask-composite:exclude;pointer-events:none}.hero-badge{display:inline-flex;align-items:center;justify-content:center;font-size:.75rem;letter-spacing:.12em;text-transform:uppercase;padding:.4rem .85rem;border-radius:999px;border:1px solid var(--color-border-subtle);color:var(--color-text-soft);background:var(--color-surface-strong);box-shadow:0 0 15px var(--shadow-glow)}.hero-metric{display:flex;align-items:baseline;justify-content:space-between;gap:1rem;margin:0;color:var(--color-text-muted)}.hero-metric-number{font-size:1.8rem;font-weight:700;background:linear-gradient(135deg,var(--color-heading),var(--color-text-soft));-webkit-background-clip:text;-webkit-text-fill-color:transparent}.skills-grid{margin-top:2.5rem;display:grid;gap:1.5rem}@media(min-width:640px){.skills-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(min-width:960px){.skills-grid{grid-template-columns:repeat(4,minmax(0,1fr))}}.card{border-radius:1.25rem;background:var(--color-surface-soft);border:1px solid var(--color-border-subtle);padding:1.75rem;transition:all .3s cubic-bezier(.4,0,.2,1);position:relative;overflow:hidden}.card:after{content:"";position:absolute;inset:0;background:radial-gradient(800px circle at var(--mouse-x) var(--mouse-y),rgba(255,255,255,.08),transparent 40%);opacity:0;transition:opacity .5s}.card:hover:after{opacity:1}.card:hover{transform:translateY(-5px);border-color:var(--color-primary);box-shadow:0 20px 40px -15px var(--shadow-glow);background:var(--color-surface-strong)}.card-title{font-size:1.1rem;margin:0 0 1rem;color:var(--color-heading);font-weight:600}.pill-list{display:flex;flex-wrap:wrap;gap:.6rem;padding:0;margin:0;list-style:none}.pill{padding:.35rem .85rem;border-radius:999px;font-size:.85rem;background:var(--color-surface-soft);color:var(--color-text-soft);border:1px solid var(--color-border-subtle);transition:all .2s ease}.card:hover .pill{background:var(--color-border-subtle);border-color:var(--color-border-soft);color:var(--color-heading)}.skill-card{min-height:9rem}.section-header{display:flex;flex-direction:column;gap:1.5rem;align-items:flex-start;margin-bottom:2rem}@media(min-width:768px){.section-header{flex-direction:row;justify-content:space-between;align-items:center}}.filters{display:flex;flex-wrap:wrap;gap:.5rem;padding:.3rem;background:var(--color-surface-soft);border-radius:999px;border:1px solid var(--color-border-subtle)}.pill-button{border-radius:999px;border:none;padding:.5rem 1.2rem;background:transparent;font-size:.9rem;color:var(--color-text-muted);cursor:pointer;transition:all .2s ease}.pill-button:hover{color:var(--color-heading)}.pill-button-active{background:var(--color-surface-soft);color:var(--color-heading);font-weight:600;box-shadow:0 2px 10px #0003}.project-link-button{position:relative;z-index:5}.projects-grid{display:grid;gap:2rem}@media(min-width:640px){.projects-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(min-width:1024px){.projects-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}.project-card{display:flex;flex-direction:column;gap:1rem;align-self:stretch;position:relative;z-index:1}.project-card-expanded{grid-row:span 2}.project-header{display:flex;flex-direction:row;gap:1rem;align-items:flex-start}.project-logo-container{flex-shrink:0;width:3.5rem;height:3.5rem;border-radius:12px;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:1.1rem;letter-spacing:.05em;background:var(--color-surface-soft);color:var(--color-heading);border:1px solid var(--color-border-subtle);overflow:hidden;position:relative;z-index:2}.project-logo-image{width:100%;height:100%;object-fit:cover}.project-logo-text{width:100%;height:100%;display:flex;align-items:center;justify-content:center}.logo-frontend{background:linear-gradient(135deg,#3b82f61a,#9333ea1a);color:#60a5fa;border-color:#60a5fa33}.logo-backend{background:linear-gradient(135deg,#10b9811a,#0596691a);color:#34d399;border-color:#34d39933}.logo-fullstack{background:linear-gradient(135deg,#f973161a,#ec48991a);color:#fb923c;border-color:#fb923c33}.project-header-content{flex:1;display:flex;flex-direction:column;gap:.25rem}.project-role{font-size:.85rem;color:var(--color-text-soft);font-weight:500;text-transform:uppercase;letter-spacing:.05em}.project-description{margin:0;color:var(--color-text-muted);line-height:1.6}.project-details{margin-top:.5rem;font-size:.95rem;color:var(--color-text-soft)}.button{border-radius:999px;border:1px solid transparent;padding:.75rem 1.75rem;font-size:1rem;font-weight:600;font-family:inherit;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:.5rem;transition:all .3s cubic-bezier(.4,0,.2,1)}.button.primary{background:linear-gradient(135deg,var(--color-primary),var(--color-secondary));border-color:transparent;color:var(--color-body-bg);box-shadow:0 10px 25px -5px var(--shadow-glow)}.button.primary:hover{transform:translateY(-3px) scale(1.02);box-shadow:0 20px 40px -10px #000c;filter:brightness(1.1)}.button.ghost{background:var(--color-surface-soft);border-color:var(--color-border-subtle);color:var(--color-text)}.button.ghost:hover{background:var(--color-border-subtle);border-color:var(--color-text-soft);transform:translateY(-2px)}.button.small{padding:.5rem 1.1rem;font-size:.85rem}.button.full-width{width:100%}.process-grid{margin-top:2.5rem;display:grid;gap:1.5rem}@media(min-width:550px){.process-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(min-width:900px){.process-grid{grid-template-columns:repeat(4,minmax(0,1fr))}}.process-step{position:relative}.process-step-title{font-size:1.1rem;font-weight:700;color:var(--color-heading);margin-bottom:.75rem}.process-step p{margin:0;color:var(--color-text-muted);font-size:.95rem;line-height:1.6}.footer{padding-block:3rem;padding-bottom:calc(3rem + env(safe-area-inset-bottom,0px));border-top:1px solid var(--color-border-subtle);background:var(--color-surface-soft)}.footer-content{display:flex;flex-direction:column;gap:1rem;font-size:.9rem;color:var(--color-text-muted)}@media(min-width:768px){.footer-content{flex-direction:row;justify-content:space-between;align-items:center}}@keyframes hero-float{0%{transform:translateY(0) rotateY(0)}50%{transform:translateY(-15px) rotate3d(.5,1,0,5deg)}to{transform:translateY(-5px) rotateY(-5deg)}}.skip-link{position:absolute;left:1rem;top:1rem;transform:translateY(-150%);padding:.75rem 1.25rem;border-radius:999px;background:var(--color-primary);color:var(--color-body-bg);font-weight:600;text-decoration:none;box-shadow:0 10px 30px #00000080;z-index:100;transition:transform .2s ease}.skip-link:focus-visible{transform:translateY(0)}.form-group{display:flex;flex-direction:column;gap:.5rem;width:100%}.form-label{font-size:.95rem;font-weight:500;color:var(--color-text-soft)}.form-input,.field input,.field textarea{width:100%;border-radius:.85rem;border:1px solid var(--color-border-subtle);background:var(--color-surface-soft);padding:.85rem 1rem;font:inherit;color:var(--color-text);transition:all .2s ease;box-sizing:border-box}.form-input:focus,.field input:focus,.field textarea:focus{outline:none;border-color:var(--color-primary);background:var(--color-surface-strong);box-shadow:0 0 0 4px var(--color-border-subtle)}.form-feedback{margin-top:.5rem;font-size:.9rem}.form-feedback.error{color:var(--color-error)}.form-feedback.success{color:var(--color-success)}.badge{display:inline-flex;align-items:center;justify-content:center;font-size:.7rem;letter-spacing:.05em;text-transform:uppercase;padding:.25rem .6rem;border-radius:6px;border:1px solid var(--color-border-soft);color:var(--color-text-soft);background:var(--color-surface-soft)}.about-profile-wrapper{margin-top:2rem;border-radius:1.5rem;overflow:hidden;box-shadow:0 20px 40px -10px #0006,inset 0 1px #ffffff1a;border:1px solid var(--color-border-subtle);max-width:280px;transform:rotate(-3deg);transition:transform .3s ease;background-color:var(--color-surface-soft)}@media(max-width:767px){.about-profile-wrapper{margin-inline:auto;margin-bottom:1rem;transform:rotate(0)}}.about-profile-wrapper:hover{transform:rotate(0) scale(1.02)}.about-profile-image{width:100%;height:auto;display:block;object-fit:cover;aspect-ratio:3/4}.project-header-grid{display:flex;flex-direction:column;gap:2rem}@media(min-width:768px){.project-header-grid{display:grid;grid-template-columns:1fr 280px;gap:3rem;align-items:start}}.project-meta-row{display:flex;flex-wrap:wrap;gap:1.5rem;margin-bottom:1.5rem;font-family:monospace}.project-meta-item{display:flex;align-items:center;gap:.5rem;font-size:.95rem;color:var(--color-text-soft);background:var(--color-surface-soft);padding:.4rem .8rem;border-radius:8px;border:1px solid var(--color-border-subtle)}.meta-icon{font-size:1.1rem}.meta-label{font-weight:500;letter-spacing:.02em}.project-meta-container{display:flex;flex-wrap:wrap;gap:1rem;margin:0;font-family:monospace}@media(min-width:768px){.project-meta-container{flex-direction:column;align-items:flex-start}}.project-title-large{font-size:clamp(2.5rem,5vw,3.5rem);line-height:1.1;margin:0 0 1.5rem;color:var(--color-heading);font-weight:800;letter-spacing:-.02em;background:linear-gradient(to bottom right,var(--color-heading),var(--color-text-soft));-webkit-background-clip:text;-webkit-text-fill-color:transparent}.project-description-lead{font-size:1.25rem;color:var(--color-text-muted);max-width:65ch;line-height:1.6;margin-bottom:2.5rem}.project-actions{display:flex;flex-wrap:wrap;gap:1rem;margin-top:2rem}.button.large{padding:1rem 2rem;font-size:1.1rem;border-radius:12px}.button svg{transition:transform .2s ease}.button:hover svg{transform:translateY(-1px)}.project-body{display:grid;gap:3rem;margin-top:3rem}@media(min-width:900px){.project-body{grid-template-columns:2fr 1fr;gap:4rem;align-items:start}}.project-info h2{margin-bottom:1.5rem;color:var(--color-heading)}.project-info p{margin-bottom:2rem;line-height:1.8;color:var(--color-text-muted)}.project-features h3{font-size:1.2rem;margin-bottom:1rem;color:var(--color-heading)}.project-features ul{padding-left:1.5rem;display:grid;gap:.8rem;color:var(--color-text-muted)}.project-features li::marker{color:var(--color-primary)}.link-arrow{display:inline-flex;align-items:center;gap:.5rem;color:var(--color-primary);font-weight:600;text-decoration:none;margin-top:auto;transition:gap .2s ease}.link-arrow:hover{gap:.75rem}