:root,[data-theme=cream]{--bg-primary: #f5ebe0;--bg-secondary: #faf6f0;--bg-card: #f5ebe0;--text-primary: #1e3a5f;--text-secondary: #5a7a9a;--text-accent: #2d5a7b;--accent-gold: #c9a75c;--accent-green: #4caf50;--accent-blue: #3b82f6;--btn-primary-bg: #1e3a5f;--btn-primary-text: #ffffff;--shadow-outset: 8px 8px 16px #d9d0c5, -8px -8px 16px #ffffff;--shadow-outset-sm: 4px 4px 8px #d9d0c5, -4px -4px 8px #ffffff;--shadow-inset: inset 4px 4px 8px #d9d0c5, inset -4px -4px 8px #ffffff;--shadow-hover: 12px 12px 24px #d9d0c5, -12px -12px 24px #ffffff;--font-primary: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;--font-display: "Outfit", "Inter", sans-serif;--spacing-xs: .5rem;--spacing-sm: 1rem;--spacing-md: 1.5rem;--spacing-lg: 2rem;--spacing-xl: 3rem;--spacing-2xl: 4rem;--radius-sm: 8px;--radius-md: 16px;--radius-lg: 24px;--radius-xl: 32px;--radius-full: 50%;--transition-fast: .2s ease;--transition-normal: .3s ease;--transition-slow: .5s ease}[data-theme=light]{--bg-primary: #e8e8ed;--bg-secondary: #f0f0f5;--bg-card: #e8e8ed;--shadow-outset: 8px 8px 16px #c8c8cd, -8px -8px 16px #ffffff;--shadow-outset-sm: 4px 4px 8px #c8c8cd, -4px -4px 8px #ffffff;--shadow-inset: inset 4px 4px 8px #c8c8cd, inset -4px -4px 8px #ffffff;--shadow-hover: 12px 12px 24px #c8c8cd, -12px -12px 24px #ffffff}[data-theme=dark]{--bg-primary: #1a1a2e;--bg-secondary: #16162a;--bg-card: #1a1a2e;--text-primary: #e8e8ed;--text-secondary: #a0a0b0;--accent-gold: #e0b85c;--btn-primary-bg: #e0b85c;--btn-primary-text: #1a1a2e;--shadow-outset: 8px 8px 16px #121225, -8px -8px 16px #222237;--shadow-outset-sm: 4px 4px 8px #121225, -4px -4px 8px #222237;--shadow-inset: inset 4px 4px 8px #121225, inset -4px -4px 8px #222237;--shadow-hover: 12px 12px 24px #121225, -12px -12px 24px #222237}[data-theme=ocean]{--bg-primary: #0a192f;--bg-secondary: #0d1d35;--bg-card: #0a192f;--text-primary: #ccd6f6;--text-secondary: #8892b0;--accent-gold: #64ffda;--accent-blue: #64ffda;--btn-primary-bg: #64ffda;--btn-primary-text: #0a192f;--shadow-outset: 8px 8px 16px #071220, -8px -8px 16px #0d203e;--shadow-outset-sm: 4px 4px 8px #071220, -4px -4px 8px #0d203e;--shadow-inset: inset 4px 4px 8px #071220, inset -4px -4px 8px #0d203e;--shadow-hover: 12px 12px 24px #071220, -12px -12px 24px #0d203e}*{margin:0;padding:0;box-sizing:border-box}html{scroll-behavior:smooth}body{font-family:var(--font-primary);background-color:var(--bg-primary);color:var(--text-primary);line-height:1.6;min-height:100vh;overflow-x:hidden}#root{min-height:100vh}h1,h2,h3,h4,h5,h6{font-family:var(--font-display);font-weight:700;line-height:1.2}h1{font-size:clamp(2.5rem,6vw,4rem)}h2{font-size:clamp(1.75rem,4vw,2.5rem)}h3{font-size:clamp(1.25rem,3vw,1.75rem)}p{color:var(--text-secondary);font-size:1rem}a{color:inherit;text-decoration:none;transition:var(--transition-fast)}.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--spacing-xs);padding:var(--spacing-sm) var(--spacing-lg);border:none;border-radius:var(--radius-md);font-family:var(--font-primary);font-size:.95rem;font-weight:500;cursor:pointer;transition:var(--transition-normal);background:var(--bg-card);color:var(--text-primary);box-shadow:var(--shadow-outset-sm)}.btn:hover{box-shadow:var(--shadow-hover);transform:translateY(-2px)}.btn:active{box-shadow:var(--shadow-inset);transform:translateY(0)}.btn-primary{background:var(--btn-primary-bg);color:var(--btn-primary-text)}.btn-outline{background:transparent;border:2px solid var(--text-primary);box-shadow:none}.btn-outline:hover{background:var(--text-primary);color:#fff}.card{background:var(--bg-card);border-radius:var(--radius-lg);padding:var(--spacing-lg);box-shadow:var(--shadow-outset);transition:var(--transition-normal)}.card:hover{box-shadow:var(--shadow-hover);transform:translateY(-4px)}.card-inset{box-shadow:var(--shadow-inset)}.card-inset:hover{box-shadow:var(--shadow-inset);transform:none}.container{width:100%;max-width:1200px;margin:0 auto;padding:0 var(--spacing-md)}.section{padding:var(--spacing-2xl) 0;min-height:100vh;display:flex;align-items:center}.section-title{margin-bottom:var(--spacing-xl);position:relative;display:inline-block}.section-title:after{content:"";position:absolute;bottom:-8px;left:0;width:60px;height:4px;background:var(--accent-gold);border-radius:var(--radius-sm)}.grid{display:grid;gap:var(--spacing-lg)}.grid-2{grid-template-columns:repeat(2,1fr)}.grid-3{grid-template-columns:repeat(3,1fr)}.grid-4{grid-template-columns:repeat(4,1fr)}@media(max-width:1024px){.grid-4,.grid-3{grid-template-columns:repeat(2,1fr)}}@media(max-width:768px){.grid-2,.grid-3,.grid-4{grid-template-columns:1fr}.section{padding:var(--spacing-xl) 0;min-height:auto}}.text-center{text-align:center}.text-accent{color:var(--accent-gold)}.text-primary{color:var(--text-primary)}.text-secondary{color:var(--text-secondary)}.flex{display:flex}.flex-center{display:flex;align-items:center;justify-content:center}.flex-between{display:flex;align-items:center;justify-content:space-between}.flex-col{flex-direction:column}.flex-wrap{flex-wrap:wrap}.gap-sm{gap:var(--spacing-sm)}.gap-md{gap:var(--spacing-md)}.gap-lg{gap:var(--spacing-lg)}@keyframes float{0%,to{transform:translateY(0)}50%{transform:translateY(-10px)}}@keyframes fadeIn{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.animate-float{animation:float 3s ease-in-out infinite}.animate-fade-in{animation:fadeIn .6s ease-out forwards}::-webkit-scrollbar{width:8px}::-webkit-scrollbar-track{background:var(--bg-primary)}::-webkit-scrollbar-thumb{background:var(--text-secondary);border-radius:var(--radius-sm)}::-webkit-scrollbar-thumb:hover{background:var(--text-primary)}.header{position:fixed;top:0;left:0;right:0;z-index:999;padding:var(--spacing-md) 0;background:var(--bg-primary)}.logo{font-family:var(--font-display);font-size:1.5rem;font-weight:700;color:var(--text-primary);letter-spacing:-.5px}.header-social{display:flex;gap:var(--spacing-sm)}.social-link{display:flex;align-items:center;justify-content:center;width:40px;height:40px;border-radius:var(--radius-md);background:var(--bg-card);color:var(--text-primary);box-shadow:var(--shadow-outset-sm);transition:var(--transition-normal)}.social-link:hover{transform:translateY(-2px);box-shadow:var(--shadow-outset);color:var(--accent-blue)}@media(max-width:768px){.header{padding:var(--spacing-sm) 0}.logo{font-size:1.25rem}.social-link{width:36px;height:36px}.social-link svg{width:18px;height:18px}}.navbar{position:fixed;bottom:var(--spacing-lg);left:50%;transform:translate(-50%);z-index:1000;padding:var(--spacing-xs)}.navbar-container{display:flex;align-items:center;gap:var(--spacing-xs);background:var(--bg-card);padding:var(--spacing-xs) var(--spacing-sm);border-radius:var(--radius-xl);box-shadow:var(--shadow-outset)}.nav-item{display:flex;align-items:center;gap:var(--spacing-xs);padding:var(--spacing-sm) var(--spacing-md);border:none;border-radius:var(--radius-lg);background:transparent;color:var(--text-secondary);font-family:var(--font-primary);font-size:.875rem;font-weight:500;cursor:pointer;transition:var(--transition-normal);white-space:nowrap}.nav-item:hover{color:var(--text-primary);background:var(--bg-secondary)}.nav-item.active{background:var(--btn-primary-bg);color:var(--btn-primary-text);box-shadow:var(--shadow-outset-sm)}.nav-icon{font-size:1.1rem}.nav-label{display:none}.nav-item.active .nav-label{display:inline}@media(max-width:768px){.navbar{bottom:var(--spacing-sm);left:50%;right:auto;transform:translate(-50%)}.navbar-container{gap:2px;padding:6px 10px}.nav-item{padding:8px 10px;flex-direction:column;gap:2px}.nav-icon{font-size:1.1rem}.nav-label{display:block;font-size:.6rem}.nav-item.active .nav-label{display:block}}@media(max-width:480px){.navbar{bottom:10px}.navbar-container{gap:0;padding:4px 8px;border-radius:var(--radius-lg)}.nav-item{padding:6px 8px;border-radius:var(--radius-md)}.nav-icon{font-size:1rem}.nav-label,.nav-item.active .nav-label{display:none}}.hero{min-height:100vh;padding-top:100px;padding-bottom:120px}.hero-content{display:grid;grid-template-columns:1fr 1fr;gap:var(--spacing-2xl);align-items:center}.hero-greeting{display:flex;align-items:center;gap:var(--spacing-sm);font-size:.875rem;font-weight:500;letter-spacing:2px;color:var(--text-secondary);margin-bottom:var(--spacing-md)}.greeting-line{display:inline-block;width:40px;height:2px;background:var(--text-secondary)}.hero-name{font-size:clamp(3rem,7vw,5rem);font-weight:800;line-height:1.1;margin-bottom:var(--spacing-md);color:var(--text-primary)}.name-highlight{color:var(--accent-gold)}.hero-title{font-size:1.125rem;font-weight:500;color:var(--text-secondary);margin-bottom:var(--spacing-md)}.hero-description{font-size:1rem;line-height:1.7;color:var(--text-secondary);margin-bottom:var(--spacing-lg);max-width:500px}.hero-cta{display:flex;gap:var(--spacing-md);flex-wrap:wrap}.btn-arrow{transition:transform var(--transition-fast)}.btn:hover .btn-arrow{transform:translate(4px)}.status-dot{width:8px;height:8px;background:var(--accent-green);border-radius:var(--radius-full);animation:pulse 2s ease-in-out infinite}@keyframes pulse{0%,to{opacity:1;transform:scale(1)}50%{opacity:.7;transform:scale(1.2)}}.hero-visual{display:flex;justify-content:center;align-items:center}.hero-image-container{position:relative;width:350px;height:350px}.hero-image-wrapper{width:100%;height:100%;border-radius:var(--radius-full);background:#000;box-shadow:var(--shadow-outset);overflow:hidden;display:flex;align-items:center;justify-content:center}.hero-image{width:100%;height:126%;object-fit:contain;object-position:center center;transform:scale(.85)}.placeholder-icon{font-size:8rem}.floating-badge{position:absolute;display:flex;align-items:center;gap:var(--spacing-xs);padding:var(--spacing-xs) var(--spacing-sm);background:var(--bg-card);border-radius:var(--radius-lg);box-shadow:var(--shadow-outset-sm);font-size:.875rem;font-weight:500;color:var(--text-primary);animation:float 3s ease-in-out infinite}.badge-react{top:10%;right:-10%;animation-delay:0s}.badge-fullstack{bottom:30%;right:-15%;background:var(--btn-primary-bg);color:var(--btn-primary-text);animation-delay:.5s}.badge-available{bottom:10%;left:0;animation-delay:1s}.badge-dot{width:8px;height:8px;background:var(--accent-blue);border-radius:var(--radius-full)}.badge-icon{font-size:1rem}.available-dot{width:8px;height:8px;background:var(--accent-green);border-radius:var(--radius-full)}@media(max-width:1024px){.hero-content{grid-template-columns:1fr;text-align:center}.hero-greeting{justify-content:center}.hero-description{margin-left:auto;margin-right:auto}.hero-cta{justify-content:center}.hero-visual{order:-1}.hero-image-container{width:280px;height:280px}.badge-react,.badge-fullstack{right:0}}@media(max-width:480px){.hero{padding-top:80px}.hero-name{font-size:2.5rem}.hero-image-container{width:200px;height:200px}.placeholder-icon{font-size:5rem}.floating-badge{font-size:.7rem;padding:4px 8px}.badge-react{top:15%;right:-5%}.badge-fullstack{inset:auto -25% 7% auto}.badge-available{bottom:28px;left:-7%}.hero-cta{flex-direction:column;align-items:center}.btn{width:100%;justify-content:center}}.skills{background:var(--bg-secondary)}.skills-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--spacing-lg)}.skill-card{background:var(--bg-card)}.skill-card-header{display:flex;align-items:center;gap:var(--spacing-sm);margin-bottom:var(--spacing-md)}.skill-icon{font-size:1.5rem;width:48px;height:48px;display:flex;align-items:center;justify-content:center;background:var(--bg-secondary);border-radius:var(--radius-md);box-shadow:var(--shadow-inset)}.skill-category-title{font-size:1.125rem;font-weight:600;color:var(--text-primary)}.skill-tags{display:flex;flex-wrap:wrap;gap:var(--spacing-xs)}.skill-tag{padding:var(--spacing-xs) var(--spacing-sm);background:var(--bg-secondary);border-radius:var(--radius-md);font-size:.875rem;font-weight:500;color:var(--text-secondary);box-shadow:var(--shadow-inset);transition:var(--transition-fast)}.skill-tag:hover{color:var(--text-primary);background:var(--bg-card);box-shadow:var(--shadow-outset-sm)}@media(max-width:768px){.skills-grid{grid-template-columns:1fr}.skill-icon{width:40px;height:40px;font-size:1.25rem}}.projects-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--spacing-lg)}.project-card{position:relative;display:flex;flex-direction:column}.project-featured{border:2px solid var(--accent-gold)}.project-icon-wrapper{width:60px;height:60px;display:flex;align-items:center;justify-content:center;background:var(--bg-secondary);border-radius:var(--radius-md);box-shadow:var(--shadow-inset);margin-bottom:var(--spacing-md)}.project-icon{font-size:1.75rem}.project-title{font-size:1.25rem;font-weight:600;color:var(--text-primary);margin-bottom:var(--spacing-sm)}.project-description{font-size:.9rem;color:var(--text-secondary);line-height:1.6;margin-bottom:var(--spacing-md);flex-grow:1}.project-tags{display:flex;flex-wrap:wrap;gap:var(--spacing-xs)}.project-tag{padding:4px 10px;background:var(--bg-secondary);border-radius:var(--radius-sm);font-size:.75rem;font-weight:500;color:var(--text-secondary)}.project-link{display:inline-flex;align-items:center;gap:6px;margin-top:var(--spacing-md);padding:var(--spacing-xs) var(--spacing-sm);background:var(--btn-primary-bg);color:var(--btn-primary-text);border-radius:var(--radius-sm);font-size:.8rem;font-weight:500;transition:var(--transition-fast)}.project-link:hover{opacity:.9;transform:translateY(-2px)}.project-badge{position:absolute;top:var(--spacing-md);right:var(--spacing-md);display:flex;align-items:center;gap:4px;padding:4px 10px;background:var(--accent-gold);color:#fff;border-radius:var(--radius-md);font-size:.75rem;font-weight:600}.project-badge.badge-gold{background:#d4af37;box-shadow:0 2px 8px #d4af3766}.badge-star{font-size:.875rem}@media(max-width:1024px){.projects-grid{grid-template-columns:repeat(2,1fr)}}@media(max-width:768px){.projects-grid{grid-template-columns:1fr}.project-icon-wrapper{width:50px;height:50px}.project-icon{font-size:1.5rem}}.achievements-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--spacing-lg)}.achievement-card{text-align:center;padding:var(--spacing-xl)}.achievement-highlight{border:2px solid var(--accent-gold);position:relative}.achievement-highlight:before{content:"🥇";position:absolute;top:10px;right:10px;font-size:1.5rem}.achievement-icon-wrapper{width:64px;height:64px;margin:0 auto var(--spacing-md);display:flex;align-items:center;justify-content:center;background:var(--bg-secondary);border-radius:var(--radius-full);box-shadow:var(--shadow-inset);color:var(--accent-gold)}.achievement-title{font-size:1.1rem;font-weight:600;color:var(--text-primary);margin-bottom:var(--spacing-xs)}.achievement-position{display:inline-block;padding:4px 12px;background:var(--accent-gold);color:#fff;border-radius:var(--radius-md);font-size:.75rem;font-weight:600;margin-bottom:var(--spacing-sm)}.achievement-org{font-size:.9rem;color:var(--text-secondary);margin-bottom:4px}.achievement-team{font-size:.8rem;color:var(--text-secondary);font-style:italic}.achievement-date{font-size:.75rem;color:var(--text-secondary);margin-top:var(--spacing-xs);display:block}@media(max-width:1024px){.achievements-grid{grid-template-columns:repeat(2,1fr)}}@media(max-width:768px){.achievements-grid{grid-template-columns:1fr}.achievement-card{padding:var(--spacing-lg)}}.education{background:var(--bg-secondary)}.education-timeline{display:flex;flex-direction:column;gap:var(--spacing-lg)}.education-item{display:flex;gap:var(--spacing-lg);background:var(--bg-card)}.education-icon-wrapper{width:64px;height:64px;min-width:64px;display:flex;align-items:center;justify-content:center;background:var(--bg-secondary);border-radius:var(--radius-md);box-shadow:var(--shadow-inset)}.education-icon{font-size:1.75rem}.education-content{flex:1}.education-header{display:flex;justify-content:space-between;align-items:flex-start;gap:var(--spacing-md);margin-bottom:var(--spacing-xs);flex-wrap:wrap}.education-institution{font-size:1.25rem;font-weight:600;color:var(--text-primary)}.education-period{padding:4px 12px;background:var(--accent-gold);color:#fff;border-radius:var(--radius-md);font-size:.75rem;font-weight:600;white-space:nowrap}.education-degree{font-size:1rem;font-weight:500;color:var(--accent-blue);margin-bottom:var(--spacing-sm)}.education-description{font-size:.9rem;color:var(--text-secondary);margin-bottom:var(--spacing-sm)}.education-achievements{list-style:none;padding:0;display:flex;flex-direction:column;gap:4px}.achievement-item{display:flex;align-items:center;gap:var(--spacing-xs);font-size:.875rem;color:var(--text-secondary)}.achievement-bullet{color:var(--accent-gold);font-weight:700}@media(max-width:768px){.education-item{flex-direction:column;gap:var(--spacing-md)}.education-icon-wrapper{width:50px;height:50px;min-width:50px}.education-icon{font-size:1.5rem}.education-header{flex-direction:column;gap:var(--spacing-xs)}.education-institution{font-size:1.1rem}}.contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:var(--spacing-2xl);align-items:start}.contact-intro{font-size:1.1rem;line-height:1.7;color:var(--text-secondary);margin-bottom:var(--spacing-lg)}.contact-details{display:flex;flex-direction:column;gap:var(--spacing-md)}.contact-item{display:flex;align-items:center;gap:var(--spacing-md);padding:var(--spacing-md);background:var(--bg-card);border-radius:var(--radius-md);box-shadow:var(--shadow-inset)}.contact-icon{font-size:1.5rem;width:48px;height:48px;display:flex;align-items:center;justify-content:center;background:var(--bg-secondary);border-radius:var(--radius-md)}.contact-text{display:flex;flex-direction:column}.contact-label{font-size:.75rem;font-weight:600;text-transform:uppercase;letter-spacing:1px;color:var(--text-secondary);margin-bottom:2px}.contact-value{font-size:.95rem;font-weight:500;color:var(--text-primary)}a.contact-value:hover{color:var(--accent-blue)}.contact-form{background:var(--bg-card)}.form-group{margin-bottom:var(--spacing-md)}.form-label{display:block;font-size:.875rem;font-weight:600;color:var(--text-primary);margin-bottom:var(--spacing-xs)}.form-input{width:100%;padding:var(--spacing-sm) var(--spacing-md);background:var(--bg-secondary);border:none;border-radius:var(--radius-md);font-family:var(--font-primary);font-size:.95rem;color:var(--text-primary);box-shadow:var(--shadow-inset);transition:var(--transition-fast)}.form-input:focus{outline:none;box-shadow:var(--shadow-inset),0 0 0 2px var(--accent-blue)}.form-input::placeholder{color:var(--text-secondary)}.form-textarea{resize:vertical;min-height:120px}.btn-submit{width:100%;margin-top:var(--spacing-sm)}.btn-icon{transition:transform var(--transition-fast)}.btn-submit:hover .btn-icon{transform:translate(4px)}@media(max-width:1024px){.contact-grid{grid-template-columns:1fr;gap:var(--spacing-xl)}}@media(max-width:768px){.contact-item{padding:var(--spacing-sm)}.contact-icon{width:40px;height:40px;font-size:1.25rem}}.theme-toggle-wrapper{position:fixed;bottom:var(--spacing-lg);right:var(--spacing-lg);z-index:1000}.theme-toggle{width:48px;height:48px;border:none;border-radius:var(--radius-full);background:var(--bg-card);color:var(--text-primary);box-shadow:var(--shadow-outset);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:var(--transition-normal)}.theme-toggle:hover{transform:scale(1.1);box-shadow:var(--shadow-hover)}.theme-toggle:active{transform:scale(.95);box-shadow:var(--shadow-inset)}.theme-menu{position:absolute;bottom:60px;right:0;background:var(--bg-card);border-radius:var(--radius-md);box-shadow:var(--shadow-outset);padding:var(--spacing-xs);min-width:140px;animation:slideUp .2s ease}@keyframes slideUp{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.theme-option{display:flex;align-items:center;gap:var(--spacing-sm);width:100%;padding:var(--spacing-sm);border:none;border-radius:var(--radius-sm);background:transparent;color:var(--text-primary);font-family:var(--font-primary);font-size:.875rem;cursor:pointer;transition:var(--transition-fast)}.theme-option:hover{background:var(--bg-secondary)}.theme-option.active{background:var(--bg-secondary);font-weight:600}.theme-color{width:20px;height:20px;border-radius:var(--radius-full);border:2px solid var(--text-secondary);flex-shrink:0}.theme-label{flex:1;text-align:left}.theme-check{color:var(--accent-green)}@media(max-width:768px){.theme-toggle-wrapper{bottom:100px;right:var(--spacing-sm)}.theme-toggle{width:42px;height:42px}.theme-menu{bottom:54px}}