:root{--glass-bg:rgba(255, 255, 255, 0.05);--glass-border:rgba(255, 255, 255, 0.1);--glass-shadow:0 4px 30px rgba(0, 0, 0, 0.1);--primary-gradient:linear-gradient(135deg, #667eea 0%, #764ba2 100%);--text-gradient:linear-gradient(to right, #667eea, #764ba2)}@media(prefers-color-scheme:dark){:root{--glass-bg:rgba(0, 0, 0, 0.2);--glass-border:rgba(255, 255, 255, 0.05)}}.gradient-text{background:var(--text-gradient);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;font-weight:800;display:inline-block}.glass-card{background:var(--glass-bg);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border:1px solid var(--glass-border);box-shadow:var(--glass-shadow);border-radius:16px;padding:2rem;transition:transform .3s ease,box-shadow .3s ease;max-width:900px;margin:0 auto 3rem}.glass-card:hover{transform:translateY(-5px);box-shadow:0 10px 40px rgba(0,0,0,.2);border-color:rgba(255,255,255,.2)}.frontend-showcase{text-align:center;margin:4rem auto}.skill-grid{display:flex;flex-wrap:wrap;gap:1.5rem;justify-content:center;margin-top:2rem}.skill-item{background:var(--glass-bg);border:1px solid var(--glass-border);padding:.8rem 1.5rem;border-radius:50px;font-weight:600;display:flex;align-items:center;gap:.5rem;transition:all .3s ease;cursor:default;color:inherit}.skill-item:hover{background:rgba(255,255,255,.1);transform:scale(1.05);border-color:#764ba2}.skill-item i{color:#764ba2}.social-icons ul{list-style:none!important;padding:0!important;margin:2rem 0 0!important;display:flex;justify-content:center;gap:1.5rem}.social-icons li{display:inline-block;margin:0!important}.social-icons a{border:none!important;text-decoration:none!important}.timeline-wrapper{width:100%;height:100%;color:inherit;padding:50px 20px;box-sizing:border-box;overflow:hidden}.timeline-block{z-index:1;position:relative;max-width:900px;margin:0 auto}.timeline-block:before{content:"";position:absolute;height:100%;width:2px;background-color:rgba(255,255,255,.1);left:50%;top:0;transform:translateX(-50%)}.each-year{position:relative;margin-bottom:2rem}.timeline-block .title{font-weight:800;font-size:2.5rem;text-align:center;padding:20px;transition:all .8s ease-in-out;background:var(--text-gradient);-webkit-background-clip:text;-webkit-text-fill-color:transparent;opacity:1}.each-event{background:var(--glass-bg);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border:1px solid var(--glass-border);color:inherit;padding:1.5rem;margin:2rem 0;width:45%;max-width:400px;position:relative;border-radius:12px;box-sizing:border-box;transition:all .5s ease-in-out;opacity:1}.each-event:before{content:"";position:absolute;top:2rem;width:16px;height:16px;border-radius:50%;background-color:#3b82f6;box-shadow:0 0 0 4px rgba(59,130,246,.2);transition:all .5s ease}.each-year:nth-child(odd) .each-event{margin-left:55%;text-align:left}.each-year:nth-child(odd) .each-event:before{left:-11.1%;left:calc(-11.1% - 9px)}.each-year:nth-child(even) .each-event{margin-left:0;margin-right:55%;text-align:right}.each-year:nth-child(even) .each-event:before{right:-11.1%;right:calc(-11.1% - 9px);left:auto}.title.non-focus{font-size:1.5rem;opacity:.3}.each-event.non-focus{opacity:.3;transform:scale(.95);filter:blur(2px)}.each-event.non-focus:before{background-color:#555;box-shadow:none}.event-year{font-size:1.1rem;color:#3b82f6;margin-bottom:.5rem;font-weight:700}.event-title{font-size:1.5rem;font-weight:700;margin-bottom:.5rem}.event-description{font-size:1.1rem;opacity:.9;line-height:1.6}@media(max-width:768px){.timeline-block:before{left:20px;transform:none}.timeline-block .title{text-align:left;padding-left:50px;font-size:2rem}.each-event,.each-year:nth-child(odd) .each-event,.each-year:nth-child(even) .each-event{width:calc(100% - 50px);margin-left:50px!important;margin-right:0!important;text-align:left!important}.each-event:before,.each-year:nth-child(odd) .each-event:before,.each-year:nth-child(even) .each-event:before{left:-38px!important;right:auto!important}}.hero-section{text-align:center;margin-bottom:4rem;margin-top:2rem}.hero-section h1{margin-bottom:-.3rem!important;line-height:1.1!important}.hero-subtitle{font-size:1.3rem;opacity:.9;max-width:700px;margin:0 auto .5rem!important;line-height:1.6!important}