:root {
  --color-background: #ffffff;
  --color-surface: #fefefe;
  --color-text: #424242;
  --color-text-secondary: #757575;
  --color-primary: #bbdefb;
  --color-primary-hover: #90caf9;
  --color-primary-active: #64b5f6;
  --color-secondary: #f5f5f5;
  --color-secondary-hover: #eeeeee;
  --color-secondary-active: #e0e0e0;
  --color-accent: #e1bee7;
  --color-accent-light: #f3e5f5;
  --color-border: #e8eaf6;
  --color-btn-primary-text: #424242;
  --color-card-border: #f0f0f0;
  --color-gradient-primary: linear-gradient(135deg, #e3f2fd 0%, #bbdefb 100%);
  --color-gradient-accent: linear-gradient(135deg, #f3e5f5 0%, #e1bee7 100%);
  --shadow-light: 0 2px 8px rgba(187, 222, 251, 0.3);
  --shadow-medium: 0 4px 16px rgba(187, 222, 251, 0.4);
  --shadow-strong: 0 8px 24px rgba(187, 222, 251, 0.5);
  --font-family-base: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  --font-size-xs: 11px; --font-size-sm: 12px; --font-size-base: 14px; --font-size-lg: 16px; --font-size-xl: 18px; --font-size-2xl: 20px; --font-size-3xl: 24px; --font-size-4xl: 30px;
  --font-weight-normal: 400; --font-weight-medium: 500; --font-weight-semibold: 550; --font-weight-bold: 600;
  --line-height-tight: 1.2; --line-height-normal: 1.5; --letter-spacing-tight: -0.01em;
  --space-4: 4px; --space-8: 8px; --space-12: 12px; --space-16: 16px; --space-20: 20px; --space-24: 24px; --space-32: 32px;
  --radius-sm: 6px; --radius-base: 8px; --radius-lg: 12px; --radius-full: 9999px;
  --duration-fast: 150ms; --duration-normal: 250ms; --ease-standard: cubic-bezier(0.16, 1, 0.3, 1);
}
html { font-size: var(--font-size-base); font-family: var(--font-family-base); line-height: var(--line-height-normal); color: var(--color-text); background: var(--color-background); -webkit-font-smoothing: antialiased; box-sizing: border-box; }
body { margin:0; padding:0; line-height:1.6; overflow-x:hidden; }
*,*::before,*::after{ box-sizing:inherit; }
h1,h2,h3,h4,h5,h6{ margin:0; font-weight:var(--font-weight-semibold); line-height:var(--line-height-tight); color:var(--color-text); letter-spacing:var(--letter-spacing-tight); }
h1{font-size:var(--font-size-4xl);} h2{font-size:var(--font-size-3xl);} h3{font-size:var(--font-size-2xl);} h4{font-size:var(--font-size-xl);} h5{font-size:var(--font-size-lg);} h6{font-size:var(--font-size-base);} 
p{ margin:0 0 var(--space-16) 0; }
a{ color:var(--color-primary-hover); text-decoration:none; transition:color var(--duration-fast) var(--ease-standard);} a:hover{ color:var(--color-primary-active);} 
.container{ width:100%; max-width:1200px; margin:0 auto; padding:0 var(--space-16);} 
.section-title{ font-size:2.5rem; font-weight:600; text-align:center; margin-bottom:3rem; color:var(--color-text); opacity:0; transform:translateY(30px); transition:all .6s ease; }
.section-title.animate{ opacity:1; transform:translateY(0);} 
.btn{ display:inline-flex; align-items:center; justify-content:center; padding:12px 30px; border-radius:30px; font-size:1rem; font-weight:500; line-height:1.5; cursor:pointer; transition:all var(--duration-normal) var(--ease-standard); border:none; text-decoration:none; position:relative; }
.btn--primary{ background:var(--color-primary); color:var(--color-btn-primary-text); box-shadow:var(--shadow-light);} .btn--primary:hover{ background:var(--color-primary-hover); box-shadow:var(--shadow-medium); transform:translateY(-2px);} 
.btn--outline{ background:transparent; color:var(--color-text); border:2px solid var(--color-primary);} .btn--outline:hover{ background:var(--color-primary); color:var(--color-btn-primary-text); transform:translateY(-2px);} 
.navbar{ position:fixed; top:0; width:100%; background:rgba(255,255,255,.95); backdrop-filter:blur(10px); border-bottom:1px solid var(--color-border); z-index:1000; padding:1rem 0; transition:all .3s ease; }
.navbar .container{ display:flex; justify-content:space-between; align-items:center; }
.nav-brand h2{ color:var(--color-text); font-weight:600; margin:0; }
.nav-brand a{ color:var(--color-text); text-decoration:none; }
.nav-menu{ display:flex; list-style:none; gap:2rem; margin:0; padding:0; }
.nav-link{ color:var(--color-text-secondary); text-decoration:none; font-weight:500; transition:color .3s ease; position:relative; }
.nav-link:hover{ color:var(--color-primary-hover);} .nav-link.active{ color:var(--color-primary-hover); font-weight:600; }
.nav-link::after{ content:''; position:absolute; bottom:-5px; left:0; width:0; height:2px; background:var(--color-primary); transition:width .3s ease; }
.nav-link:hover::after,.nav-link.active::after{ width:100%; }
.mobile-menu-btn{ display:none; flex-direction:column; cursor:pointer; padding:8px; }
.mobile-menu-btn span{ width:25px; height:3px; background:var(--color-text); margin:2px 0; transition:.3s; }
.hero{ min-height:100vh; display:flex; align-items:center; position:relative; background:var(--color-gradient-primary); overflow:hidden; padding-top:80px; }
.hero-background{ position:absolute; inset:0; overflow:hidden; }
.geometric-shape{ position:absolute; opacity:.3; animation:float 6s ease-in-out infinite; }
.shape-1{ top:20%; right:10%; width:100px; height:100px; background:var(--color-accent); border-radius:50%; animation-delay:0s; }
.shape-2{ top:60%; left:5%; width:80px; height:80px; background:var(--color-primary-hover); transform:rotate(45deg); animation-delay:2s; }
.shape-3{ top:40%; right:25%; width:60px; height:60px; background:var(--color-accent-light); clip-path:polygon(50% 0%, 0% 100%, 100% 100%); animation-delay:4s; }
@keyframes float{ 0%,100%{ transform:translateY(0);} 50%{ transform:translateY(-20px);} }
.hero-content{ text-align:center; z-index:2; position:relative; }
.hero-title{ font-size:4rem; font-weight:700; margin-bottom:1rem; opacity:0; transform:translateY(30px); animation:fadeInUp .8s ease forwards; }
.hero-subtitle{ font-size:1.3rem; color:var(--color-text-secondary); margin-bottom:1rem; opacity:0; transform:translateY(30px); animation:fadeInUp .8s ease .2s forwards; }
.hero-description{ font-size:1.1rem; color:var(--color-text-secondary); margin-bottom:.5rem; max-width:600px; margin-left:auto; margin-right:auto; opacity:0; transform:translateY(30px); animation:fadeInUp .8s ease .3s forwards; }
.hero-location{ font-size:1.1rem; color:var(--color-text-secondary); margin-bottom:2rem; opacity:0; transform:translateY(30px); animation:fadeInUp .8s ease .4s forwards; }
.hero-buttons{ display:flex; gap:1rem; justify-content:center; opacity:0; transform:translateY(30px); animation:fadeInUp .8s ease .6s forwards; }
@keyframes fadeInUp{ to{ opacity:1; transform:translateY(0);} }
.about{ padding:5rem 0; background:var(--color-surface);} .about-content{ display:flex; flex-direction:column; align-items:center; text-align:center; gap:1.5rem; max-width:800px; margin:0 auto; }
.profile-photo{ width:180px; height:180px; border-radius:50%; object-fit:cover; box-shadow:var(--shadow-light);} .about-text{ font-size:1.2rem; line-height:1.8; color:var(--color-text-secondary); max-width:600px; }
.experience{ padding:5rem 0; background:var(--color-gradient-accent);} .timeline{ max-width:800px; margin:0 auto; position:relative; }
.timeline::before{ content:''; position:absolute; left:50%; top:0; bottom:0; width:2px; background:var(--color-primary); transform:translateX(-50%);} 
.timeline-item{ margin-bottom:3rem; position:relative; }
.timeline-item::before{ content:''; position:absolute; left:50%; top:20px; width:12px; height:12px; background:var(--color-primary); border-radius:50%; transform:translateX(-50%); z-index:2; }
.timeline-content{ background:#fff; padding:2rem; border-radius:15px; box-shadow:var(--shadow-light); width:45%; margin-left:0; }
.timeline-item:nth-child(even) .timeline-content{ margin-left:55%; }
.timeline-content h3{ color:var(--color-text); font-size:1.3rem; margin-bottom:.5rem; }
.timeline-content h4{ color:var(--color-primary-hover); font-size:1.1rem; margin-bottom:.5rem; }
.timeline-duration{ color:var(--color-text-secondary); font-size:.9rem; font-weight:500; margin-bottom:.3rem; }
.timeline-location{ color:var(--color-text-secondary); font-size:.9rem; margin-bottom:1rem; }
.education{ padding:5rem 0; background:var(--color-surface);} .education-grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(300px,1fr)); gap:2rem; max-width:1000px; margin:0 auto; }
.education-card{ background:#fff; padding:2rem; border-radius:15px; box-shadow:var(--shadow-light); text-align:center; transition:all .3s ease; }
.education-card:hover{ box-shadow:var(--shadow-medium); transform:translateY(-5px);} 
.education-card h3{ color:var(--color-text); margin-bottom:.5rem; font-size:1.2rem; }
.education-card h4{ color:var(--color-primary-hover); margin-bottom:1rem; font-size:1.1rem; }
.skills{ padding:5rem 0; background:var(--color-gradient-primary);} .skills-grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(300px,1fr)); gap:3rem; margin-bottom:3rem; }
.skills-category h3{ color:var(--color-text); margin-bottom:1.5rem; font-size:1.5rem; text-align:center; }
.skills-list{ display:flex; flex-direction:column; gap:1rem; }
.skill-item{ background:#fff; padding:1rem 1.5rem; border-radius:25px; text-align:center; box-shadow:var(--shadow-light); transition:all .3s ease; }
.skill-item:hover{ box-shadow:var(--shadow-medium); transform:translateY(-2px);} 
.language-item{ display:flex; justify-content:space-between; align-items:center; background:#fff; padding:1rem 1.5rem; border-radius:15px; margin-bottom:1rem; box-shadow:var(--shadow-light); transition:all .3s ease; }
.language-item:hover{ box-shadow:var(--shadow-medium); transform:translateY(-2px);} 
.language-name{ font-weight:500; color:var(--color-text);} .language-level{ font-size:.9rem; color:var(--color-text-secondary);} 
.certifications{ max-width:800px; margin:0 auto; }
.certifications h3{ color:var(--color-text); margin-bottom:1.5rem; font-size:1.5rem; text-align:center; }
.cert-grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(250px,1fr)); gap:1rem; }
.cert-item{ background:#fff; padding:1rem; border-radius:10px; text-align:center; font-size:.9rem; box-shadow:var(--shadow-light); transition:all .3s ease; }
.cert-item:hover{ box-shadow:var(--shadow-medium); transform:translateY(-2px);} 
.contact{ padding:5rem 0; background:var(--color-surface);} .contact-content{ max-width:600px; margin:0 auto; }
.contact-info{ display:grid; grid-template-columns:repeat(auto-fit,minmax(200px,1fr)); gap:2rem; }
.contact-item{ text-align:center; background:#fff; padding:2rem; border-radius:15px; box-shadow:var(--shadow-light); transition:all .3s ease; }
.contact-item:hover{ box-shadow:var(--shadow-medium); transform:translateY(-5px);} 
.contact-item h4{ color:var(--color-text); margin-bottom:1rem; font-size:1.2rem; }
.contact-item a{ color:var(--color-primary-hover); text-decoration:none; transition:color .3s ease; display:block; margin-bottom:.5rem; }
.contact-item a:hover{ color:var(--color-primary-active);} 
.blog-page{ padding:5rem 0; padding-top:8rem; background:var(--color-background);} 
.blog-header{ text-align:center; margin-bottom:4rem; }
.blog-description{ font-size:var(--font-size-lg); color:var(--color-text-secondary); max-width:600px; margin:0 auto 2rem; line-height:1.6; }
.blog-posts-grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(350px,1fr)); gap:2rem; margin-bottom:3rem; }
.blog-post-card{ background:var(--color-surface); border-radius:15px; box-shadow:var(--shadow-light); transition:all .3s ease; overflow:hidden; }
.blog-post-card:hover{ box-shadow:var(--shadow-medium); transform:translateY(-5px);} 
.post-card-content{ padding:1.5rem; }
.post-card-title{ margin-bottom:1rem; font-size:var(--font-size-xl);} 
.post-card-title a{ color:var(--color-text);} 
.post-card-excerpt{ color:var(--color-text-secondary); line-height:1.6; margin-bottom:1.5rem; }
.post-card-meta{ display:flex; justify-content:space-between; align-items:center; margin-bottom:1rem; font-size:var(--font-size-sm); color:var(--color-text-secondary);} 
.read-more{ color:var(--color-primary-hover); font-weight:500; transition:color var(--duration-fast) ease; }
.read-more:hover{ color:var(--color-primary-active);} 
.quick-links{ padding:5rem 0; background:var(--color-surface);} 
.links-grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(300px,1fr)); gap:2rem; max-width:1000px; margin:0 auto; }
.link-card{ background:#fff; padding:2rem; border-radius:15px; box-shadow:var(--shadow-light); text-align:center; transition:all .3s ease; }
.link-card:hover{ box-shadow:var(--shadow-medium); transform:translateY(-5px);} 
.link-icon{ font-size:3rem; margin-bottom:1rem; }
.link-card h3{ color:var(--color-text); margin-bottom:1rem; }
.link-card p{ color:var(--color-text-secondary); margin-bottom:1.5rem; line-height:1.6; }
.link-btn{ color:var(--color-primary-hover); text-decoration:none; font-weight:500; transition:color .3s ease; }
.link-btn:hover{ color:var(--color-primary-active);} 
.contact-cta{ padding:5rem 0; background:var(--color-gradient-primary); text-align:center; }
.cta-content h2{ margin-bottom:1rem; color:var(--color-text);} .cta-content p{ color:var(--color-text-secondary); margin-bottom:2rem; font-size:1.1rem; }
.cta-buttons{ display:flex; justify-content:center; gap:1rem; }
.site-footer{ background:var(--color-surface); padding:3rem 0 1rem; border-top:1px solid var(--color-border); margin-top:3rem; }
.footer-content{ display:grid; grid-template-columns:2fr 1fr; gap:2rem; margin-bottom:2rem; }
.footer-info h3{ color:var(--color-text); margin-bottom:1rem; }
.footer-info p{ color:var(--color-text-secondary); line-height:1.6; }
.footer-links{ display:grid; grid-template-columns:1fr 1fr; gap:2rem; }
.footer-section h4{ color:var(--color-text); margin-bottom:1rem; font-size:1rem; }
.footer-section ul{ list-style:none; padding:0; margin:0; }
.footer-section li{ margin-bottom:.5rem; }
.footer-section a{ color:var(--color-text-secondary); text-decoration:none; transition:color .3s ease; font-size:.9rem; }
.footer-section a:hover{ color:var(--color-primary-hover);} 
.footer-bottom{ padding-top:2rem; border-top:1px solid var(--color-border); text-align:center; }
.footer-bottom p{ color:var(--color-text-secondary); font-size:.9rem; margin:.25rem 0; }
.footer-note{ font-size:.8rem; opacity:.7; }
.related-reading{ font-size:.9rem; color:var(--color-text-secondary); margin-top:1rem; }
.related-reading a{ color:var(--color-primary-hover);} .related-reading a:hover{ color:var(--color-primary-active);} 
@media (max-width:768px){ .nav-menu{ display:none;} .mobile-menu-btn{ display:flex;} .hero-title{ font-size:2.5rem;} .hero-subtitle{ font-size:1.1rem;} .timeline::before,.timeline-item::before{ left:20px;} .timeline-content{ width:calc(100% - 60px); margin-left:60px;} .timeline-item:nth-child(even) .timeline-content{ margin-left:60px;} .hero-buttons{ flex-direction:column; align-items:center;} .section-title{ font-size:2rem;} .footer-content{ grid-template-columns:1fr; gap:1.5rem;} .footer-links{ grid-template-columns:1fr; gap:1.5rem;} .cta-buttons{ flex-direction:column; align-items:center;} }
@media (max-width:480px){ .container{ padding:0 var(--space-8);} .hero-title{ font-size:2rem;} .btn{ padding:10px 20px; font-size:.9rem;} }
