*{margin:0;padding:0;box-sizing:border-box}body{font-family:'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;line-height:1.6;color:#333;background-color:#f8f9fa}.container{width:90%;max-width:1200px;margin:0 auto;padding:0 20px}a{text-decoration:none;color:#3498db;transition:all 0.3s ease}a:hover{color:#e74c3c}h1,h2,h3,h4,h5,h6{margin-bottom:1rem;color:#2c3e50;font-weight:600}p{margin-bottom:1.5rem}ul{list-style:none}.btn{display:inline-block;padding:10px 20px;border-radius:5px;transition:all 0.3s ease;font-weight:500;cursor:pointer;text-align:center}.primary{background-color:#3498db;color:white}.primary:hover{background-color:#217dbb;color:white}.secondary{background-color:transparent;border:2px solid #3498db;color:#3498db}.secondary:hover{background-color:#3498db;color:white}pre,code{font-family:'Courier New', Courier, monospace;background-color:#f5f5f5;border-radius:5px}pre{padding:1rem;overflow-x:auto;margin-bottom:1.5rem}code{padding:0.2rem 0.4rem}blockquote{border-left:4px solid #3498db;padding-left:1.5rem;font-style:italic;color:#555;margin:1.5rem 0}ul.formatted,ol.formatted{padding-left:2rem}ul.formatted li,ol.formatted li{margin-bottom:0.5rem}table{width:100%;border-collapse:collapse;margin-bottom:1.5rem}table th,table td{padding:0.75rem;border:1px solid #ddd}table th{background-color:#ecf0f1;font-weight:600}table tr:nth-child(even){background-color:#f9f9f9}img{max-width:100%;height:auto}header{background-color:#2c3e50;padding:1.5rem 0;position:fixed;width:100%;top:0;z-index:1000;box-shadow:0 4px 6px rgba(0,0,0,0.1)}header h1{color:white;margin-bottom:0.25rem}header .tagline{color:#ecf0f1;opacity:0.8;margin-bottom:1rem;font-size:1.1rem}header nav ul{display:flex;flex-wrap:wrap}header nav ul li{margin-right:1.5rem}header nav ul li:last-child{margin-right:0}header nav ul li a{color:#ecf0f1;font-weight:500;padding:0.5rem 0;position:relative}header nav ul li a::after{content:'';position:absolute;width:0;height:2px;bottom:0;left:0;background-color:#3498db;transition:all 0.3s ease}header nav ul li a:hover,header nav ul li a.active{color:white}header nav ul li a:hover::after,header nav ul li a.active::after{width:100%}#hero{height:100vh;display:flex;align-items:center;background:linear-gradient(rgba(44,62,80,0.9), rgba(44,62,80,0.7)),url("../images/hero-bg.jpg");background-size:cover;background-position:center;color:white;text-align:center;padding-top:80px}#hero .hero-content{max-width:800px;margin:0 auto}#hero .hero-content h2{font-size:2.5rem;margin-bottom:1.5rem;color:white}#hero .hero-content p{font-size:1.25rem;margin-bottom:2rem;opacity:0.9}#hero .hero-content .cta-buttons{display:flex;justify-content:center;gap:1rem;flex-wrap:wrap}#about{padding:5rem 0;background-color:white}#about .about-content{display:flex;flex-wrap:wrap;gap:2rem}#about .about-content .about-text{flex:1;min-width:300px}#about .skills{display:flex;flex-wrap:wrap;gap:2rem;margin-top:2rem}#about .skills .skill-category{flex:1;min-width:200px}#about .skills .skill-category h3{margin-bottom:1rem;font-size:1.2rem;color:#3498db}#about .skills .skill-category ul li{margin-bottom:0.5rem;position:relative;padding-left:1.2rem}#about .skills .skill-category ul li::before{content:'•';position:absolute;left:0;color:#3498db}#project-header{background-color:#2c3e50;color:white;padding:10rem 0 5rem;text-align:center}#project-header .project-header-content{max-width:800px;margin:0 auto}#project-header .project-header-content h1{color:white;font-size:2.5rem;margin-bottom:1.5rem}#project-header .project-header-content .project-tags{display:flex;justify-content:center;flex-wrap:wrap;gap:0.5rem}#project-header .project-header-content .project-tags span{background-color:rgba(255,255,255,0.2);color:white;padding:0.25rem 0.75rem;border-radius:20px;font-size:0.9rem}#project-content{padding:4rem 0}#project-content .project-details{max-width:800px;margin:0 auto}#project-content .project-details .project-image{margin-bottom:2rem}#project-content .project-details .project-image img{width:100%;border-radius:5px;box-shadow:0 4px 6px rgba(0,0,0,0.1)}#project-content .project-details .project-description{line-height:1.8}#project-content .project-details .project-links{margin-top:2rem;display:flex;gap:1rem;flex-wrap:wrap}#projects{padding:5rem 0;background-color:#ecf0f1}#projects .projects-grid{display:grid;grid-template-columns:repeat(auto-fill, minmax(300px, 1fr));gap:2rem;margin-bottom:2rem}#projects .project-card{background-color:white;border-radius:5px;overflow:hidden;box-shadow:0 4px 6px rgba(0,0,0,0.1);transition:all 0.3s ease}#projects .project-card:hover{transform:translateY(-5px);box-shadow:0 10px 20px rgba(0,0,0,0.1)}#projects .project-card .project-image{height:200px;background-color:#3498db;overflow:hidden}#projects .project-card .project-image img{width:100%;height:100%;object-fit:cover}#projects .project-card .placeholder{display:flex;align-items:center;justify-content:center;color:white;font-size:3rem}#projects .project-card .placeholder::after{content:'📊'}#projects .project-card h3{padding:1rem 1rem 0.5rem}#projects .project-card p{padding:0 1rem;font-size:0.95rem}#projects .project-card .project-tags{padding:0 1rem 1rem;display:flex;flex-wrap:wrap;gap:0.5rem}#projects .project-card .project-tags span{font-size:0.8rem;background-color:#ecf0f1;padding:0.25rem 0.75rem;border-radius:20px;color:#2c3e50}#projects .project-card .btn{margin:0 1rem 1rem}#projects .more-projects{text-align:center;margin-top:2rem}.projects-index{padding:10rem 0 5rem;text-align:center;background-color:#2c3e50;color:white}.projects-index h1{color:white;font-size:2.5rem;margin-bottom:1rem}.projects-index p{max-width:700px;margin:0 auto;font-size:1.2rem;opacity:0.9}#experience{padding:5rem 0;background-color:white}#experience .experience-timeline{position:relative;max-width:800px;margin:0 auto}#experience .experience-timeline::before{content:'';position:absolute;width:2px;background-color:#ecf0f1;top:0;bottom:0;left:120px}#experience .experience-item{display:flex;margin-bottom:3rem;position:relative}#experience .experience-item:last-child{margin-bottom:0}#experience .experience-item .experience-date{width:120px;text-align:right;padding-right:25px;font-weight:600;color:#3498db}#experience .experience-item .experience-content{background-color:#ecf0f1;padding:1.5rem;border-radius:5px;box-shadow:0 4px 6px rgba(0,0,0,0.1);flex:1;position:relative}#experience .experience-item .experience-content::before{content:'';position:absolute;width:16px;height:16px;background-color:#3498db;border-radius:50%;top:24px;left:-33px;border:4px solid white;z-index:1}#experience .experience-item .experience-content h3{margin-bottom:0.25rem;color:#2c3e50}#experience .experience-item .experience-content h4{color:#3498db;font-weight:500;margin-bottom:1rem;font-size:1rem}#experience .experience-item .experience-content ul li{margin-bottom:0.5rem;position:relative;padding-left:1.2rem}#experience .experience-item .experience-content ul li::before{content:'•';position:absolute;left:0;color:#3498db}#experience .resume-link{text-align:center;margin-top:3rem}#blog-hero{background-color:#2c3e50;color:white;padding:15rem 0 5rem;text-align:center}#blog-hero h2{color:white;font-size:2.5rem;margin-bottom:1rem}#blog-hero p{font-size:1.2rem;opacity:0.9;max-width:700px;margin:0 auto}#blog-content{padding:4rem 0}#blog-content .blog-grid{display:grid;grid-template-columns:repeat(auto-fill, minmax(350px, 1fr));gap:2rem}#blog-content .blog-post{background-color:white;border-radius:5px;box-shadow:0 4px 6px rgba(0,0,0,0.1);padding:1.5rem;transition:all 0.3s ease}#blog-content .blog-post:hover{transform:translateY(-5px);box-shadow:0 10px 20px rgba(0,0,0,0.1)}#blog-content .blog-post .blog-date{font-size:0.9rem;color:#3498db;margin-bottom:0.5rem;font-weight:500}#blog-content .blog-post h3{margin-bottom:1rem}#blog-content .blog-post h3 a{color:#2c3e50;transition:all 0.3s ease}#blog-content .blog-post h3 a:hover{color:#3498db}#blog-content .blog-post p{margin-bottom:1.5rem;color:#666}#blog-content .blog-post .blog-tags{display:flex;flex-wrap:wrap;gap:0.5rem;margin-bottom:1.5rem}#blog-content .blog-post .blog-tags span{font-size:0.8rem;background-color:#ecf0f1;padding:0.25rem 0.75rem;border-radius:20px;color:#2c3e50}#blog-content .blog-post .read-more{font-weight:500;display:inline-flex;align-items:center}#blog-content .blog-post .read-more:after{content:'→';margin-left:0.5rem;transition:all 0.3s ease}#blog-content .blog-post .read-more:hover:after{margin-left:0.75rem}.blog-post-header{text-align:center;max-width:800px;margin:0 auto 3rem}.blog-post-header .blog-date{margin-bottom:1rem;color:rgba(255,255,255,0.8)}.blog-post-header h1{font-size:2.5rem;margin-bottom:1.5rem;color:white}.blog-post-header .blog-tags{justify-content:center;display:flex;flex-wrap:wrap;gap:0.5rem}.blog-post-header .blog-tags span{background-color:rgba(255,255,255,0.2);color:white;padding:0.25rem 0.75rem;border-radius:20px;font-size:0.9rem}.blog-post-content{max-width:800px;margin:0 auto;line-height:1.8}.blog-post-content h2{margin-top:2.5rem;margin-bottom:1rem}.blog-post-content h3{margin-top:2rem;margin-bottom:1rem}.blog-post-content ul,.blog-post-content ol{padding-left:2rem;margin-bottom:1.5rem}.blog-post-content ul li,.blog-post-content ol li{margin-bottom:0.5rem}#contact{padding:5rem 0;background-color:#ecf0f1}#contact .contact-content{max-width:600px;margin:0 auto}#contact .contact-info{background-color:white;padding:2rem;border-radius:5px;box-shadow:0 4px 6px rgba(0,0,0,0.1)}#contact .contact-info .contact-item{display:flex;align-items:center;margin-bottom:1.5rem}#contact .contact-info .contact-item:last-child{margin-bottom:0}#contact .contact-info .contact-item i{width:40px;height:40px;background-color:#3498db;color:white;border-radius:50%;display:flex;align-items:center;justify-content:center;margin-right:1rem}footer{background-color:#2c3e50;color:#ecf0f1;padding:2rem 0;text-align:center}footer .footer-links{margin-top:1rem}footer .footer-links a{color:#ecf0f1;margin:0 0.5rem}footer .footer-links a:hover{color:#3498db}@media (max-width: 768px){.experience-timeline::before{left:80px}.experience-date{width:80px}.experience-content::before{left:-28px}header nav ul{justify-content:center}header nav ul li{margin:0 0.75rem}.blog-grid{grid-template-columns:repeat(auto-fill, minmax(300px, 1fr))}}@media (max-width: 576px){.hero-content h2{font-size:2rem}.experience-timeline::before{display:none}.experience-item{flex-direction:column}.experience-item .experience-date{width:100%;text-align:left;padding-right:0;margin-bottom:0.5rem}.experience-item .experience-content::before{display:none}.blog-grid{grid-template-columns:1fr}.blog-post-header h1{font-size:2rem}.project-header-content h1{font-size:2rem}#blog-hero,#project-header{padding:8rem 0 3rem}}
