@import"https://fonts.googleapis.com/css2?family=Inter:wght@400;700&display=swap";:root{--bg-color: #1d1a1a;--primary-color: #332c2c;--secondary-color: #da7272;--text-color: #e4e4e4;--hover-text-color: #ffffff}body{margin:0;font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background-color:var(--bg-color);color:var(--text-color);scroll-behavior:smooth}.container{display:flex}.sidebar-space{width:3.5rem}.content{width:100%;flex:1;transition:margin-left .4s ease-in-out}.content section{display:flex;flex-direction:column;justify-content:center;align-items:center;min-height:100vh;padding:0 2rem;text-align:center;border-bottom:1px solid var(--primary-color)}.home-section img{height:100px;width:100px;padding:0 1rem}.home-section h1{font-size:clamp(2.5rem,10vw,6rem);font-weight:700;color:var(--hover-text-color);margin:0}h2{font-size:clamp(2rem,8vw,3.5rem);color:var(--secondary-color);margin-bottom:1.5rem}.content p{max-width:700px;line-height:1.7;font-size:1.1rem}.social-icon{font-size:10rem;color:var(--text-color);padding:1rem;transition:color .3s ease,transform .3s ease}.social-icon:hover{color:var(--hover-text-color)}.footer{width:px;background-color:var(--primary-color);color:var(--text-color);padding:2rem 0;text-align:center}.footer-sections,.footer-social{margin-bottom:1rem}.footer a{color:var(--text-color);text-decoration:none;margin:0 .75rem;transition:color .3s ease}.footer a:hover{color:var(--secondary-color)}.footer-copy{font-size:.9rem;opacity:.6}.sidebar{position:fixed;top:0;left:0;height:100vh;z-index:100;background-color:var(--primary-color);transition:width .4s ease-in-out;overflow:hidden;border-right:1px solid var(--bg-color)}.sidebar-closed{width:3.5rem}.sidebar-open{width:10rem}.collapse-button{border-bottom:1px solid var(--bg-color)}.sidebar ul{list-style:none;padding:0;margin:0}.sidebar li a{display:flex;padding:1rem;transition:background-color .3s ease,color .3s ease}.sidebar li a:hover{background-color:var(--secondary-color);color:var(--hover-text-color)}.icon{color:var(--text-color);font-size:1.5rem}.text{color:var(--text-color);white-space:nowrap;margin-left:12px;font-size:1rem}.sidebar a{text-decoration:none}.sidebar-flex{display:flex;flex-direction:column}.sidebar-footer{margin-top:auto;border-top:1px solid var(--bg-color)}.sidebar-footer a{padding:1rem}.sidebar ul{display:flex;flex-direction:column}.skills-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:1.5rem;width:100%;max-width:900px;padding:1rem}.skill-panel{position:relative;aspect-ratio:1 / 1;border-radius:12px;overflow:hidden;cursor:pointer;background-color:var(--primary-color);box-shadow:0 4px 12px #0006;transition:transform .3s ease,box-shadow .3s ease}.skill-panel:hover{transform:translateY(-8px);box-shadow:0 8px 20px #0009}.skill-logo{width:100%;height:100%;object-fit:cover;transition:transform .4s ease-in-out}.skill-panel:hover .skill-logo{transform:scale(1.1)}.skill-overlay{position:absolute;top:0;left:0;width:100%;height:100%;background:linear-gradient(to top,#000000e6,#0000001a);display:flex;justify-content:center;align-items:flex-end;opacity:0;transition:opacity .4s ease-in-out}.skill-panel:hover .skill-overlay{opacity:1}.skill-overlay h3{margin:0;padding:1rem;color:var(--hover-text-color);font-size:1.25rem;font-weight:700;text-align:center;transform:translateY(20px);transition:transform .3s ease .1s}.skill-panel:hover .skill-overlay h3{transform:translateY(0)}
