/* Theme Name: Mohamed Sabbah - Project Controls Professional Theme URI: https://mohamedsabbah.com Author: Mohamed Sabbah Author URI: https://mohamedsabbah.com Description: A luxury monochrome resume website for Mohamed Sabbah, Project Controls Professional with 16+ years of experience. Features expandable timeline, blog system, and professional portfolio showcase. Version: 1.0.7 License: GNU General Public License v2 or later License URI: http://www.gnu.org/licenses/gpl-2.0.html Text Domain: mohamed-sabbah Tags: resume, portfolio, professional, monochrome, luxury, blog */ :root{--color-background:#FAF9F6;--color-foreground:#2B2B2B;--color-muted:#E8E6E3;--color-border:#D4D2CF;--color-primary:#1A1A1A;--color-accent:#4A4A4A;--font-serif:'Playfair Display',Georgia,serif;--font-sans:'Inter',-apple-system,sans-serif;--shadow-sm:0 2px 8px rgba(43,43,43,0.08);--shadow-md:0 4px 16px rgba(43,43,43,0.12);--shadow-lg:0 8px 32px rgba(43,43,43,0.16)}*{margin:0;padding:0;box-sizing:border-box}body{font-family:var(--font-sans);background-color:var(--color-background);color:var(--color-foreground);line-height:1.6;font-size:16px;-webkit-font-smoothing:antialiased}h1,h2,h3,h4,h5,h6{font-family:var(--font-serif);font-weight:700;line-height:1.2;color:var(--color-foreground)}h1{font-size:4rem}h2{font-size:2.5rem}h3{font-size:1.75rem}h4{font-size:1.25rem}a{color:var(--color-primary);text-decoration:none;transition:all .3s ease}a:hover{color:var(--color-accent)}img{max-width:100%;height:auto;display:block}.container{max-width:1200px;margin:0 auto;padding:0 1.5rem}.site-header{position:fixed;top:0;left:0;right:0;z-index:1000;background:rgba(250,249,246,0.8);backdrop-filter:blur(12px);border-bottom:1px solid var(--color-border);padding:1rem 0}.site-header .container{display:flex;justify-content:space-between;align-items:center}.site-logo{font-size:1.5rem;font-weight:700;font-family:var(--font-serif);color:var(--color-foreground)}.main-navigation ul{display:flex;gap:2rem;list-style:none}.main-navigation a{font-size:.875rem;font-weight:500;color:var(--color-foreground);transition:color .3s ease}.main-navigation a:hover{color:var(--color-primary)}.header-buttons{display:flex;gap:.75rem;align-items:center}.cta-button{padding:.5rem 1.5rem;border:1px solid var(--color-border);border-radius:.375rem;font-size:.875rem;font-weight:500;transition:all .3s ease;display:inline-block}.cta-button:hover{background:var(--color-foreground);color:var(--color-background);border-color:var(--color-foreground)}.btn-download{background:var(--color-foreground);color:var(--color-background);border-color:var(--color-foreground)}.btn-download:hover{background:var(--color-primary);border-color:var(--color-primary)}.btn-primary{display:inline-block;padding:1rem 2rem;background:var(--color-foreground);color:var(--color-background);border:2px solid var(--color-foreground);border-radius:.5rem;font-weight:600;font-size:1rem;transition:all .3s ease}.btn-primary:hover{background:var(--color-primary);border-color:var(--color-primary);transform:translateY(-2px);box-shadow:var(--shadow-md)}.btn-secondary{display:inline-block;padding:1rem 2rem;background:transparent;color:var(--color-foreground);border:2px solid var(--color-border);border-radius:.5rem;font-weight:600;font-size:1rem;transition:all .3s ease}.btn-secondary:hover{background:var(--color-foreground);color:var(--color-background);border-color:var(--color-foreground);transform:translateY(-2px)}.hero-section{min-height:100vh;display:flex;align-items:center;padding-top:5rem;position:relative;overflow:hidden}.floating-circle{position:absolute;border:2px solid rgba(43,43,43,0.1);border-radius:50%;animation:float 6s ease-in-out infinite}.floating-circle-1{width:8rem;height:8rem;top:5rem;right:3rem}.floating-circle-2{width:6rem;height:6rem;bottom:10rem;left:5rem;animation-delay:2s}.hero-content{display:grid;grid-template-columns:1fr 1fr;gap:4rem;align-items:center}.hero-label{font-size:.875rem;font-weight:600;text-transform:uppercase;letter-spacing:.1em;color:var(--color-accent);margin-bottom:1rem;animation:fadeInUp .8s ease}.hero-text h1{margin-bottom:1rem;animation:fadeInUp .8s ease .1s both}.hero-subtitle{font-size:1.25rem;color:var(--color-accent);margin-bottom:1.5rem;font-family:var(--font-sans);font-weight:500;animation:fadeInUp .8s ease .2s both}.hero-description{font-size:1.125rem;line-height:1.8;margin-bottom:2rem;color:var(--color-accent);animation:fadeInUp .8s ease .3s both}.hero-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:2rem;margin:2rem 0;animation:fadeInUp .8s ease .4s both}.stat-item{text-align:center}.stat-number{font-size:2.5rem;font-weight:700;font-family:var(--font-serif);display:block;margin-bottom:.5rem}.stat-label{font-size:.875rem;color:var(--color-accent)}.hero-buttons{display:flex;gap:1rem;margin-top:2rem;animation:fadeInUp .8s ease .5s both}.hero-image{position:relative;animation:fadeInUp .8s ease .3s both}.image-frame{position:absolute;top:-20px;right:-20px;width:90%;height:90%;background:rgba(255,255,255,0.5);border:2px solid var(--color-border);border-radius:.5rem;z-index:-1;transition:all .5s ease}.profile-img{width:100%;max-width:500px;margin-left:auto;border-radius:.5rem;box-shadow:var(--shadow-lg);transition:transform .5s ease;position:relative;z-index:1}.profile-img:hover{transform:translateY(-10px)}.hero-image:hover .image-frame{transform:translate(10px,10px)}.content-section{padding:5rem 0}.section-header{text-align:center;margin-bottom:4rem}.section-title{margin-bottom:1rem}.section-subtitle{font-size:1.125rem;color:var(--color-accent);max-width:600px;margin:0 auto}.card-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:2rem}.card{background:var(--color-background);border:1px solid var(--color-border);border-radius:.5rem;padding:2rem;transition:all .4s ease;box-shadow:var(--shadow-sm)}.card:hover{transform:translateY(-8px);box-shadow:var(--shadow-lg);border-color:var(--color-foreground)}.card-icon{width:3rem;height:3rem;margin-bottom:1.5rem;color:var(--color-foreground);transition:all .3s ease}.card:hover .card-icon{color:var(--color-primary);transform:scale(1.1)}.card-title{font-size:1.25rem;margin-bottom:.75rem}.card-description{color:var(--color-accent);font-size:.9375rem;line-height:1.6}.highlights-section{background:var(--color-muted)}.highlights-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:2rem;max-width:1000px;margin:0 auto}.highlight-item{background:var(--color-background);padding:1.5rem;border-radius:.5rem;border-left:4px solid var(--color-foreground);transition:all .3s ease;display:flex;gap:1rem;align-items:flex-start}.highlight-item:hover{transform:translateX(8px);box-shadow:var(--shadow-md)}.highlight-icon{flex-shrink:0;color:var(--color-foreground);margin-top:0.25rem}.highlight-item p{margin:0;line-height:1.6}.timeline{max-width:900px;margin:0 auto;position:relative}.timeline-item{background:var(--color-background);border:1px solid var(--color-border);border-radius:.5rem;padding:2rem;margin-bottom:2rem;transition:all .3s ease}.timeline-item:hover{transform:translateX(8px);box-shadow:var(--shadow-lg);border-color:var(--color-foreground)}.timeline-header{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:1rem;gap:1rem;flex-wrap:wrap}.timeline-header h3{margin-bottom:.5rem}.company{color:var(--color-accent);font-weight:500;margin-bottom:.25rem}.project-name{font-weight:600;margin-bottom:.25rem}.location{color:var(--color-accent);font-size:.875rem}.period{color:var(--color-accent);font-size:.875rem;white-space:nowrap}.timeline-details{list-style:none;padding-left:0}.timeline-details li{padding-left:1.5rem;position:relative;margin-bottom:.5rem;color:var(--color-accent)}.timeline-details li:before{content:"→";position:absolute;left:0;color:var(--color-foreground)}.projects-section{background:var(--color-muted)}.projects-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:2rem}.project-card{background:var(--color-background);border:1px solid var(--color-border);border-radius:.5rem;padding:2rem;transition:all .3s ease}.project-card:hover{transform:translateY(-8px);box-shadow:var(--shadow-lg)}.project-value{font-size:2rem;font-weight:700;font-family:var(--font-serif);margin-bottom:1rem;color:var(--color-foreground)}.project-card h3{font-size:1.25rem;margin-bottom:.75rem}.project-location{color:var(--color-accent);margin-bottom:1rem}.project-role{font-weight:600;margin-bottom:.25rem}.project-company{color:var(--color-accent);font-size:.875rem}.certs-section{background:var(--color-background)}.certs-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:2rem}.cert-card{background:var(--color-background);border:1px solid var(--color-border);border-radius:.5rem;padding:2rem;text-align:center;transition:all .3s ease}.cert-card:hover{transform:translateY(-8px);box-shadow:var(--shadow-lg);border-color:var(--color-foreground)}.cert-icon{width:48px;height:48px;margin:0 auto 1rem;color:var(--color-foreground);transition:all .3s ease}.cert-card:hover .cert-icon{transform:scale(1.1);color:var(--color-primary)}.cert-card h4{margin-bottom:.5rem}.cert-card p{color:var(--color-accent);font-size:.875rem}.tech-section{background:var(--color-foreground);color:var(--color-background)}.tech-title{color:var(--color-background)}.tech-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:3rem;max-width:900px;margin:0 auto}.tech-category h4{color:var(--color-background);margin-bottom:1rem}.tech-category ul{list-style:none;padding:0}.tech-category li{padding:.5rem 0;opacity:.9;border-bottom:1px solid rgba(250,249,246,0.1)}.blog-section{background:var(--color-background)}.blog-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(350px,1fr));gap:2rem}.blog-card{background:var(--color-background);border:1px solid var(--color-border);border-radius:.5rem;overflow:hidden;transition:all .3s ease;box-shadow:var(--shadow-sm)}.blog-card:hover{transform:translateY(-8px);box-shadow:var(--shadow-lg)}.blog-card-image{width:100%;height:250px;object-fit:cover}.blog-card-content{padding:1.5rem}.blog-card-title{font-size:1.5rem;margin-bottom:.75rem;line-height:1.3}.blog-card-excerpt{color:var(--color-accent);margin-bottom:1rem;line-height:1.6}.blog-card-meta{display:flex;justify-content:space-between;align-items:center;padding-top:1rem;border-top:1px solid var(--color-border);font-size:.875rem;color:var(--color-accent)}.read-more{color:var(--color-primary);font-weight:500}.contact-section{background:var(--color-muted)}.contact-content{max-width:900px;margin:0 auto}.contact-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:2rem;margin-bottom:3rem}.contact-card{background:var(--color-background);border:1px solid var(--color-border);border-radius:.5rem;padding:2rem;text-align:center;transition:all .3s ease}.contact-card:hover{transform:translateY(-8px);box-shadow:var(--shadow-lg);border-color:var(--color-foreground)}.contact-icon{font-size:2rem;margin-bottom:1rem}.contact-card h4{margin-bottom:.5rem}.contact-card a{color:var(--color-accent);word-break:break-word}.contact-buttons{display:flex;gap:1rem;justify-content:center;flex-wrap:wrap}.site-footer{background:var(--color-foreground);color:var(--color-background);padding:3rem 0 1.5rem}.footer-content{text-align:center}.footer-text{font-size:.875rem;opacity:.8}@keyframes fadeInUp{from{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}@keyframes float{0%,100%{transform:translateY(0)}50%{transform:translateY(-20px)}}@keyframes bounce{0%,100%{transform:translateX(-50%) translateY(0)}50%{transform:translateX(-50%) translateY(-10px)}}.fade-in-card{opacity:0;animation:fadeInUp .6s ease forwards}.fade-in-card:nth-child(1){animation-delay:.1s}.fade-in-card:nth-child(2){animation-delay:.2s}.fade-in-card:nth-child(3){animation-delay:.3s}.fade-in-card:nth-child(4){animation-delay:.4s}.fade-in-card:nth-child(5){animation-delay:.5s}.fade-in-card:nth-child(6){animation-delay:.6s}.text-center{text-align:center} /* Mobile Menu Styles */ .mobile-menu-toggle{display:none;flex-direction:column;gap:4px;background:none;border:none;cursor:pointer;padding:8px;z-index:1001;position:relative} .mobile-menu-toggle .hamburger-line{width:24px;height:2px;background-color:var(--color-foreground);transition:all 0.3s ease;display:block} .mobile-menu-toggle.active .hamburger-line:nth-child(1){transform:rotate(45deg) translate(5px, 5px)} .mobile-menu-toggle.active .hamburger-line:nth-child(2){opacity:0} .mobile-menu-toggle.active .hamburger-line:nth-child(3){transform:rotate(-45deg) translate(7px, -6px)} body.menu-open{overflow:hidden} @media (max-width:768px){ h1{font-size:2.5rem} h2{font-size:2rem} .site-header{padding:.75rem 0} .site-header .container{flex-direction:row;justify-content:space-between;align-items:center;flex-wrap:wrap} /* Show mobile menu toggle button */ .mobile-menu-toggle{display:flex !important} /* Hide navigation by default on mobile */ .main-navigation{display:none;width:100%;order:3;position:fixed;top:0;left:0;right:0;bottom:0;background:var(--color-background);z-index:1000;padding:5rem 2rem 2rem;overflow-y:auto} /* Show navigation when active */ .main-navigation.active{display:block !important} .main-navigation ul{flex-direction:column;gap:1.5rem;justify-content:flex-start;align-items:flex-start;font-size:1.2rem} .main-navigation ul li{width:100%;border-bottom:1px solid var(--color-border)} .main-navigation ul li a{display:block;padding:1rem 0;width:100%} .header-buttons{width:auto;order:2;flex-direction:row;gap:.5rem;display:none} .header-buttons .cta-button{flex:1;text-align:center;padding:.5rem 1rem;font-size:.8rem} .hero-content{grid-template-columns:1fr;text-align:center;gap:2rem} /* MOBILE FIX: Hide decorative frame completely */ .image-frame{display:none !important;visibility:hidden !important;opacity:0 !important} .hero-image{order:-1;margin-bottom:1rem;margin-top:1rem;position:relative} .hero-image img,.profile-img{margin:0 auto !important;max-width:200px !important;width:200px !important;height:200px !important;border-radius:50% !important;object-fit:cover !important;object-position:center top !important;display:block !important;box-shadow:0 8px 32px rgba(43,43,43,0.16) !important} /* Remove hover effects on mobile */ .hero-image:hover .image-frame{display:none !important} .profile-img:hover{transform:none !important} .hero-stats{grid-template-columns:repeat(3,1fr);gap:1rem} .stat-number{font-size:1.75rem} .hero-buttons{flex-direction:column;width:100%} .hero-buttons .btn-primary,.hero-buttons .btn-secondary{width:100%} .card-grid,.blog-grid,.projects-grid,.certs-grid{grid-template-columns:1fr} .timeline-header{flex-direction:column} .hero-section{min-height:auto;padding:16rem 0 3rem} h1{font-size:2rem;line-height:1.2} .hero-subtitle{font-size:1rem} .hero-description{font-size:1rem} }.alignleft{float:left;margin-right:1.5rem;margin-bottom:1rem}.alignright{float:right;margin-left:1.5rem;margin-bottom:1rem}.aligncenter{display:block;margin-left:auto;margin-right:auto}.wp-caption{max-width:100%}.wp-caption-text{font-size:.875rem;color:var(--color-accent);padding:.5rem 0;text-align:center} /* Comments Section Styling */ .comments-area{max-width:800px;margin:4rem auto;padding:2rem;background:var(--color-background);border:1px solid var(--color-border);border-radius:.5rem}.comments-title{font-size:2rem;margin-bottom:2rem;font-family:var(--font-serif);color:var(--color-foreground)}.comment-list{list-style:none;padding:0;margin:0 0 3rem}.comment-list .comment{margin-bottom:2rem;padding:1.5rem;background:var(--color-muted);border-radius:.5rem;border-left:4px solid var(--color-foreground)}.comment-author{font-weight:600;margin-bottom:.5rem;display:flex;align-items:center;gap:.5rem}.comment-author .avatar{border-radius:50%;width:40px;height:40px}.comment-metadata{font-size:.875rem;color:var(--color-accent);margin-bottom:1rem}.comment-metadata a{color:var(--color-accent)}.comment-content p{margin-bottom:1rem;line-height:1.6}.reply{margin-top:1rem}.reply a{color:var(--color-primary);font-weight:500;font-size:.875rem;text-decoration:none;padding:.5rem 1rem;border:1px solid var(--color-border);border-radius:.375rem;display:inline-block;transition:all .3s ease}.reply a:hover{background:var(--color-foreground);color:var(--color-background);border-color:var(--color-foreground)}.comment-respond{margin-top:3rem;padding:2rem;background:var(--color-muted);border-radius:.5rem}.comment-reply-title{font-size:1.75rem;margin-bottom:1.5rem;font-family:var(--font-serif);color:var(--color-foreground)}.comment-form{display:flex;flex-direction:column;gap:1.5rem}.comment-form-comment{display:flex;flex-direction:column}.comment-form-comment label{font-weight:500;margin-bottom:.5rem;color:var(--color-foreground)}.comment-form-comment textarea{width:100%;min-height:150px;padding:1rem;border:1px solid var(--color-border);border-radius:.375rem;font-family:var(--font-sans);font-size:1rem;background:var(--color-background);color:var(--color-foreground);resize:vertical;transition:border-color .3s ease}.comment-form-comment textarea:focus{outline:none;border-color:var(--color-foreground)}.comment-form-author,.comment-form-email,.comment-form-url{display:flex;flex-direction:column}.comment-form-author label,.comment-form-email label,.comment-form-url label{font-weight:500;margin-bottom:.5rem;color:var(--color-foreground)}.comment-form-author input,.comment-form-email input,.comment-form-url input{padding:.75rem 1rem;border:1px solid var(--color-border);border-radius:.375rem;font-family:var(--font-sans);font-size:1rem;background:var(--color-background);color:var(--color-foreground);transition:border-color .3s ease}.comment-form-author input:focus,.comment-form-email input:focus,.comment-form-url input:focus{outline:none;border-color:var(--color-foreground)}.comment-form-cookies-consent{display:flex;align-items:center;gap:.5rem}.comment-form-cookies-consent input[type="checkbox"]{width:18px;height:18px;cursor:pointer}.comment-form-cookies-consent label{margin:0;cursor:pointer;font-size:.9375rem}.form-submit{margin-top:1rem}.form-submit input[type="submit"]{padding:1rem 2rem;background:var(--color-foreground);color:var(--color-background);border:2px solid var(--color-foreground);border-radius:.5rem;font-weight:600;font-size:1rem;cursor:pointer;transition:all .3s ease;font-family:var(--font-sans)}.form-submit input[type="submit"]:hover{background:var(--color-primary);border-color:var(--color-primary);transform:translateY(-2px);box-shadow:var(--shadow-md)}.comment-notes{font-size:.875rem;color:var(--color-accent);margin-bottom:1.5rem}.required{color:#c41e3a}@media (max-width:768px){.comments-area{padding:1.5rem;margin:2rem 1rem}.comments-title{font-size:1.5rem}.comment-reply-title{font-size:1.5rem}.form-submit input[type="submit"]{width:100%}} /* Expandable Timeline Experience Section */ .experience-timeline-section{background:var(--color-background)}.timeline-wrapper{max-width:900px;margin:0 auto;position:relative;padding-left:40px}.timeline-line{position:absolute;left:20px;top:0;bottom:0;width:2px;background:linear-gradient(to bottom,var(--color-border) 0%,var(--color-foreground) 50%,var(--color-border) 100%)}.timeline-experience-item{position:relative;margin-bottom:2rem}.timeline-dot{position:absolute;left:-30px;top:20px;width:12px;height:12px;background:var(--color-foreground);border:3px solid var(--color-background);border-radius:50%;box-shadow:0 0 0 3px var(--color-border);z-index:2;transition:all .3s ease}.timeline-experience-item:hover .timeline-dot{background:var(--color-primary);transform:scale(1.3);box-shadow:0 0 0 5px var(--color-border)}.timeline-card{background:var(--color-background);border:1px solid var(--color-border);border-radius:.5rem;padding:0;cursor:pointer;transition:all .3s ease;overflow:hidden}.timeline-card:hover{box-shadow:var(--shadow-lg);border-color:var(--color-foreground)}.timeline-card-header{padding:1.5rem 2rem;display:flex;justify-content:space-between;align-items:flex-start;gap:1rem;background:var(--color-muted);transition:background .3s ease}.timeline-card:hover .timeline-card-header{background:var(--color-background)}.timeline-header-content{flex:1}.timeline-card-header h3{font-size:1.25rem;margin-bottom:.5rem;color:var(--color-foreground)}.company-info{display:flex;gap:1.5rem;margin-bottom:.5rem;flex-wrap:wrap}.company-info .company{color:var(--color-accent);font-weight:600;font-size:.9375rem}.company-info .period{color:var(--color-accent);font-size:.875rem;font-weight:500}.project-brief{color:var(--color-accent);font-size:.875rem;margin-top:.5rem}.project-brief strong{color:var(--color-foreground);font-weight:600}.expand-icon{flex-shrink:0;color:var(--color-foreground);transition:transform .3s ease;margin-top:.25rem}.timeline-card-content{max-height:0;overflow:hidden;transition:max-height .4s ease;background:var(--color-background)}.timeline-card.expanded .timeline-card-content{padding:0 2rem 1.5rem}.timeline-card.expanded .expand-icon{transform:rotate(180deg)}.timeline-details{list-style:none;padding:1rem 0 0;margin:0}.timeline-details li{padding-left:1.5rem;position:relative;margin-bottom:.75rem;color:var(--color-accent);line-height:1.6}.timeline-details li:before{content:"→";position:absolute;left:0;color:var(--color-foreground);font-weight:bold}@media (max-width:768px){.timeline-wrapper{padding-left:30px}.timeline-line{left:15px}.timeline-dot{left:-25px}.timeline-card-header{padding:1rem 1.5rem;flex-direction:column}.company-info{flex-direction:column;gap:.25rem}.timeline-card.expanded .timeline-card-content{padding:0 1.5rem 1rem}.timeline-details li{font-size:.875rem}} /* Blog Page Styling */ .blog-page-wrapper{padding:8rem 0 4rem;background:var(--color-background);min-height:100vh}.blog-page-header{text-align:center;margin-bottom:3rem}.blog-page-title{font-size:3rem;margin-bottom:1rem;font-family:var(--font-serif);color:var(--color-foreground)}.blog-page-subtitle{font-size:1.125rem;color:var(--color-accent)}.blog-filters{background:var(--color-muted);border:1px solid var(--color-border);border-radius:.5rem;padding:2rem;margin-bottom:3rem;display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:1.5rem;align-items:end}.blog-search{grid-column:span 1}.search-wrapper{position:relative;display:flex;gap:.5rem}.search-wrapper .search-icon{position:absolute;left:1rem;top:50%;transform:translateY(-50%);color:var(--color-accent);pointer-events:none}.search-wrapper input[type="search"]{flex:1;padding:.75rem 1rem .75rem 3rem;border:1px solid var(--color-border);border-radius:.375rem;font-size:1rem;background:var(--color-background);color:var(--color-foreground);transition:border-color .3s ease}.search-wrapper input[type="search"]:focus{outline:none;border-color:var(--color-foreground)}.search-wrapper button{padding:.75rem 1.5rem;background:var(--color-foreground);color:var(--color-background);border:none;border-radius:.375rem;font-weight:600;cursor:pointer;transition:all .3s ease}.search-wrapper button:hover{background:var(--color-primary);transform:translateY(-2px)}.blog-filter-group{display:flex;flex-direction:column;gap:.5rem}.blog-filter-group label{font-size:.875rem;font-weight:600;color:var(--color-foreground);display:flex;align-items:center;gap:.5rem}.blog-filter-group label svg{color:var(--color-accent)}.blog-filter-group select{padding:.75rem 1rem;border:1px solid var(--color-border);border-radius:.375rem;font-size:.9375rem;background:var(--color-background);color:var(--color-foreground);cursor:pointer;transition:border-color .3s ease}.blog-filter-group select:focus{outline:none;border-color:var(--color-foreground)}.blog-card-categories{display:flex;gap:.5rem;margin-bottom:.75rem;flex-wrap:wrap}.blog-category-badge{display:inline-block;padding:.25rem .75rem;background:var(--color-foreground);color:var(--color-background);border-radius:.25rem;font-size:.75rem;font-weight:600;text-transform:uppercase;letter-spacing:.05em}.blog-card-placeholder{background:var(--color-muted);display:flex;align-items:center;justify-content:center;color:var(--color-accent)}.no-posts-message{grid-column:1/-1;text-align:center;padding:4rem 2rem;color:var(--color-accent)}.no-posts-message svg{margin:0 auto 1.5rem;color:var(--color-accent)}.no-posts-message h3{font-size:1.5rem;margin-bottom:.5rem;color:var(--color-foreground)}.blog-pagination{margin-top:3rem;text-align:center}.blog-pagination ul{display:flex;justify-content:center;gap:.5rem;list-style:none;padding:0}.blog-pagination li{display:inline-block}.blog-pagination a,.blog-pagination span{display:block;padding:.75rem 1.25rem;border:1px solid var(--color-border);border-radius:.375rem;color:var(--color-foreground);font-weight:500;transition:all .3s ease}.blog-pagination a:hover{background:var(--color-foreground);color:var(--color-background);border-color:var(--color-foreground)}.blog-pagination .current{background:var(--color-foreground);color:var(--color-background);border-color:var(--color-foreground)}@media (max-width:1024px){.blog-filters{grid-template-columns:1fr 1fr;gap:1rem}.blog-search{grid-column:span 2}}@media (max-width:768px){.blog-page-title{font-size:2rem}.blog-filters{grid-template-columns:1fr;padding:1.5rem}.blog-search{grid-column:span 1}.search-wrapper{flex-direction:column}.search-wrapper input[type="search"]{padding:.75rem 1rem}.search-wrapper .search-icon{display:none}.blog-pagination ul{flex-wrap:wrap}} /* Hamburger Mobile Menu */ .mobile-menu-toggle{display:none;background:none;border:none;cursor:pointer;padding:.5rem;z-index:1001;position:relative}.hamburger-line{display:block;width:24px;height:2px;background:var(--color-foreground);margin:5px 0;transition:all .3s ease}.mobile-menu-toggle.active .hamburger-line:nth-child(1){transform:rotate(45deg) translate(7px,7px)}.mobile-menu-toggle.active .hamburger-line:nth-child(2){opacity:0}.mobile-menu-toggle.active .hamburger-line:nth-child(3){transform:rotate(-45deg) translate(7px,-7px)}@media (max-width:768px){.mobile-menu-toggle{display:block}.site-header .container{position:relative}.main-navigation{position:fixed;top:0;right:-100%;width:280px;height:100vh;background:var(--color-background);box-shadow:var(--shadow-lg);transition:right .3s ease;z-index:1000;padding-top:5rem;border-left:1px solid var(--color-border)}.main-navigation.active{right:0}.main-navigation ul{flex-direction:column;gap:0;padding:1rem 0}.main-navigation li{width:100%;border-bottom:1px solid var(--color-border)}.main-navigation a{display:block;padding:1rem 1.5rem;font-size:1rem;transition:all .3s ease}.main-navigation a:hover{background:var(--color-muted);padding-left:2rem}.header-buttons{position:relative;z-index:1001}body.menu-open{overflow:hidden}body.menu-open::before{content:'';position:fixed;top:0;left:0;right:0;bottom:0;background:rgba(0,0,0,0.5);z-index:999;animation:fadeIn .3s ease}}@keyframes fadeIn{from{opacity:0}to{opacity:1}} /* Experience Timeline Section */ .experience-timeline-section{background:var(--color-muted);padding:6rem 0}.timeline-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:3rem}.timeline-wrapper{position:relative;max-width:900px;margin:0 auto;padding-left:3rem}.timeline-line{position:absolute;left:1rem;top:0;bottom:0;width:2px;background:linear-gradient(180deg,var(--color-foreground) 0%,var(--color-accent) 100%)}.timeline-card{position:relative;background:var(--color-background);border:1px solid var(--color-border);border-radius:.5rem;padding:2rem;margin-bottom:2rem;cursor:pointer;transition:all .3s ease}.timeline-card:hover{transform:translateX(8px);box-shadow:var(--shadow-lg);border-color:var(--color-foreground)}.timeline-dot{position:absolute;left:-2.5rem;top:2rem;width:1rem;height:1rem;background:var(--color-foreground);border:3px solid var(--color-background);border-radius:50%;z-index:2;transition:all .3s ease}.timeline-card:hover .timeline-dot{transform:scale(1.3);background:var(--color-primary)}.timeline-card-header{display:flex;justify-content:space-between;align-items:flex-start;gap:1rem;margin-bottom:1rem}.timeline-card-title h3{font-size:1.5rem;margin-bottom:.25rem;color:var(--color-foreground)}.timeline-card-company{color:var(--color-accent);font-size:1rem;margin-bottom:.5rem}.timeline-card-project{font-size:.875rem;color:var(--color-accent);font-style:italic}.timeline-card-date{font-size:.875rem;color:var(--color-accent);white-space:nowrap;font-weight:600}.expand-icon{width:24px;height:24px;color:var(--color-foreground);transition:transform .3s ease;flex-shrink:0}.timeline-card-content{max-height:0;overflow:hidden;transition:max-height .4s ease}.timeline-card.expanded .timeline-card-content{max-height:1000px}.timeline-card-responsibilities{margin-top:1.5rem;padding-top:1.5rem;border-top:1px solid var(--color-border)}.timeline-card-responsibilities h4{font-size:1.125rem;margin-bottom:1rem;color:var(--color-foreground)}.timeline-card-responsibilities ul{list-style:none;padding:0}.timeline-card-responsibilities li{padding:.75rem 0;padding-left:1.5rem;position:relative;line-height:1.6;color:var(--color-accent)}.timeline-card-responsibilities li:before{content:'→';position:absolute;left:0;color:var(--color-foreground);font-weight:bold}@media (max-width:768px){.timeline-wrapper{padding-left:2rem}.timeline-line{left:.5rem}.timeline-dot{left:-1.75rem;width:.75rem;height:.75rem}.timeline-card-header{flex-direction:column}.timeline-card-date{align-self:flex-start}}