:root{--primary-bg: linear-gradient(180deg, #005f73 0%, #002c3e 100%);--primary-color: #00b2a9;--secondary-color: #843bc7;--navbar-bg: #003a4d;--text-color: #e0f7fa;--card-bg: rgba(0, 0, 0, .6);--card-hover-bg: rgba(0, 0, 0, .8);--border-color: #843bc7;--link-hover: #9854cb;--lightbox-bg: rgba(0, 0, 0, .85);--box-shadow-default: 0px 3px 8px rgba(0, 100, 128, .3);--box-shadow-hover: 0px 6px 16px rgba(132, 59, 199, .5);--btn-box-shadow: 0px 3px 10px rgba(0, 0, 0, .25);--btn-hover-box-shadow: 0px 6px 14px rgba(132, 59, 199, .6)}html{scroll-behavior:smooth}body{background:var(--primary-bg);color:var(--text-color);font-family:Inter,Arial,sans-serif;margin:0;padding:0;overflow-x:hidden}.header{display:flex;justify-content:space-between;align-items:center;position:fixed;width:100%;top:0;left:0;padding:20px;background-color:var(--navbar-bg);font-size:1.2rem;font-weight:700;z-index:1000;box-shadow:var(--box-shadow-default)}.navbar{display:flex;gap:18px;align-items:center;width:100%}.navbar-link{text-decoration:none!important;font-size:1.1rem;font-weight:600;text-transform:uppercase;letter-spacing:.05rem;color:var(--text-color);transition:color .3s ease}.navbar-link:hover{color:var(--link-hover)}.navbar-logo{width:70px;height:auto;padding:0 20px}.section{padding-top:100px;padding-bottom:80px;min-height:calc(100vh - 100px);display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:20px}.section-title{font-size:2.8rem;font-weight:800;text-transform:uppercase;color:var(--primary-color);letter-spacing:1px;margin:20px}.section-subtitle{margin-top:15px;margin-bottom:15px}.section-text{font-size:1.1rem;font-weight:400;line-height:1.6;max-width:700px;margin:20px}.btn{padding:12px 24px;font-size:1rem;background-color:var(--secondary-color);color:var(--text-color);border:2px solid var(--secondary-color);border-radius:8px;text-transform:uppercase;text-decoration:none!important;display:inline-block;transition:all .2s ease-in-out;box-shadow:var(--btn-box-shadow);margin-left:10px;margin-right:10px}.btn:hover{background-color:var(--link-hover);border-color:var(--link-hover);transform:translateY(-2px);box-shadow:var(--btn-hover-box-shadow)}.projects{text-align:center;padding:60px 20px;scroll-margin-top:90px;display:flex;flex-direction:column;gap:40px}.project{background:var(--card-bg);padding:30px;border-radius:12px;box-shadow:var(--box-shadow-default);width:80%;max-width:800px;margin:0 auto;text-align:center;border:2px solid var(--border-color);transition:background .3s ease-in-out,box-shadow .3s ease-in-out}.project:hover{background:var(--card-hover-bg);box-shadow:var(--box-shadow-hover)}.project+.project{border-top:2px solid var(--border-color);padding-top:40px;margin-top:40px}.project-title{font-size:1.7rem;font-weight:700;color:var(--primary-color);margin-top:10px;margin-bottom:10px}.project-image{max-width:80%;max-height:400px;border-radius:10px;border:3px solid var(--primary-color);transition:transform .2s ease-in-out,box-shadow .2s ease-in-out;cursor:pointer}.project-image:hover{transform:scale(1.05);box-shadow:var(--box-shadow-hover)}.tech-stack{display:flex;flex-wrap:wrap;gap:20px;justify-content:center;max-width:600px;margin-left:20px;margin-right:20px}.tech-icon{width:50px;height:50px;fill:var(--text-color);transition:transform .3s ease-in-out,fill .3s ease-in-out}.tech-icon:hover{fill:var(--primary-color);transform:scale(1.2)}.lightbox{position:fixed;top:0;left:0;width:100%;height:100%;background:var(--lightbox-bg);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);display:flex;align-items:center;justify-content:center;z-index:1000}.lightbox-image{max-width:90%;max-height:90%;border-radius:12px;border:4px solid var(--primary-color);background:var(--primary-bg)}@media (max-width: 768px){.section{padding-top:120px}.section-title{font-size:2.5rem}.btn{font-size:1rem;padding:10px 20px}.project-image{max-width:80%}}@media (max-width: 480px){.navbar-logo{width:40px;padding:0 5px}.navbar-link{font-size:.8rem}.section{padding-top:100px;padding-bottom:60px}.section-title{font-size:2.2rem}.btn{font-size:.9rem;padding:8px 16px}.project-image{max-width:90%}}
