:root{--bg-light:#010109dd;--color-secondary:#f5f5f5a9;--text-color:#f5f5f5a9;--name-color:#bbad62c2;--shadow:4px -2px 20px 9px #8080802a}.fira-code-namefont{font-optical-sizing:auto;font-family:Fira Code,monospace;font-style:italic;font-weight:bolder}html{scroll-behavior:smooth}*{box-sizing:border-box}body{max-width:100%;margin:0;overflow-x:hidden}a{color:inherit;text-decoration:none}.title{color:var(--name-color);text-align:center;-webkit-text-decoration:underline var(--text-color);text-decoration:underline var(--text-color);text-underline-offset:10px;font-size:3rem}.wrapper{background:var(--bg-light);min-height:100vh}nav{box-shadow:var(--shadow);color:var(--text-color);z-index:9999;background:var(--bg-light);-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);padding:1rem 0;position:sticky;top:0}.navbar{justify-content:space-between;align-items:center;padding:.5px 0}.brazz{font-family:"Jersey 20",sans-serif;font-size:2rem;font-style:normal;font-weight:400}.navigation{gap:2rem;font-weight:700;list-style:none}.navigation li:hover{color:var(--name-color);transition:all .5s;transform:scale(1.3)}.hero{margin-top:20px;padding:3rem}.info{animation:2s ease-in-out appear}@keyframes appear{0%{opacity:0}to{opacity:1}}.greet{color:var(--name-color);font-size:3rem;line-height:1.2}.full-name{color:var(--name-color);font-size:3.5rem;line-height:1.2}.job-title{color:var(--text-color);letter-spacing:3px;margin-bottom:15px;font-size:20px;font-weight:bolder}.typing{white-space:nowrap;width:0;animation:2.5s ease-out infinite typing;display:inline-block;overflow:hidden}@keyframes typing{0%,10%{width:0}45%,50%{width:100%}90%,to{width:0%}}.desc{color:var(--text-color);letter-spacing:2px;word-spacing:5px;margin-top:10px;font-size:26px;line-height:1.5}.btn-section{gap:3rem;display:flex}.btn-section a{color:var(--text-color);border:1px solid var(--text-color);box-shadow:var(--shadow);border-radius:20px 1px;padding:19px;font-size:1.5rem}.btn-section a:hover{animation:.3s ease-in-out shake}@keyframes shake{0%,to{transform:translateY(0)}25%{transform:translateY(-4px)}75%{transform:translateY(4px)}}.image-div{border:4px solid var(--text-color);border-radius:12px;flex:none;width:350px;height:399px;position:relative;overflow:visible}.top-img{object-fit:cover;object-position:center top;width:100%;height:131%;margin:0 auto;animation:.8s ease-in-out riseup;display:block;position:relative;top:-60px}@keyframes riseup{0%{opacity:0;top:60px}to{opacity:1;top:-60px}}.banner-box{color:var(--text-color);border-right:2px solid var(--text-color);text-align:center;flex:1;padding:32px 16px;line-height:1.4;transition:background .3s;position:relative;overflow:hidden}.banner-box:first-child{border-left:2px solid var(--text-color)}.banner-box:after{content:"";background:var(--text-color);width:0;height:3px;transition:width .4s cubic-bezier(.16,1,.3,1);position:absolute;bottom:0;left:0}.banner-box:hover{background:#0000000f}.banner-box:hover:after{width:100%}.banner-top{letter-spacing:1px;font-size:3rem;font-weight:700;display:block}.banner-mid{letter-spacing:1px;font-size:1.1rem;font-weight:700;display:block}.banner-last{opacity:.6;font-size:.85rem;font-weight:400;display:block}.skill-title{color:var(--name-color);padding:10px;font-size:2rem;font-style:italic;display:inline-block}.skill-items{color:var(--text-color);border-radius:15px;flex:1;padding:20px 10px}.skill-item{border:1px solid var(--text-color);letter-spacing:4px;border-radius:15px;padding:10px;font-size:1.1rem;animation:7s infinite scaleup}.skill-item:first-child{animation-delay:0s}.skill-item:nth-child(2){animation-delay:1s}.skill-item:nth-child(3){animation-delay:2s}.skill-item:nth-child(4){animation-delay:3s}.skill-item:nth-child(5){animation-delay:4s}@keyframes scaleup{0%,to{box-shadow:none;background:0 0;transform:scale(1)}10%{background:gray;transform:scale(1.1);box-shadow:0 0 20px #ffffff4d}20%{transform:scale(1)}}.terminal{box-shadow:var(--shadow)}.terminal-bar{box-shadow:var(--shadow);justify-content:space-between;display:flex}.icon{gap:.5rem;padding:10px;display:flex}.file-name{color:#ffffff9d;padding:10px}.dot{width:20px;height:20px;padding:10px, 14px;border-radius:50%}.r{background:red}.y{background:#ff0}.g{background:green}.code{padding:20px}.code-line{gap:2rem;margin:10px;padding:8px;display:flex}.v-name{color:#87ceeb}.value{color:#9e5006}.t-cursor{vertical-align:middle;background:#fff;width:9px;height:16px;margin-left:10px;animation:1s infinite blink;display:inline-block}.project-card{border:1px solid #0000001a;border-radius:16px;grid-template-columns:1fr 1fr;margin-bottom:32px;transition:transform .3s,box-shadow .3s;display:grid;overflow:hidden}.project-card:hover{transform:translateY(-4px);box-shadow:0 20px 60px #0000001f}.card-image{min-height:360px;overflow:hidden}.card-image img{object-fit:center;object-position:top;width:100%;height:100%;transition:transform .6s}.project-card:hover .card-image img{transform:scale(1.04)}.card-info{background:#fff;flex-direction:column;justify-content:center;gap:20px;padding:48px 40px;display:flex}.card-index{color:#aaa;letter-spacing:.2em;text-transform:uppercase;font-size:11px}.card-title{color:#0a0a0a;margin:0;font-size:32px;font-weight:800;line-height:1.05}.card-desc{color:#555;margin:0;font-size:14px;line-height:1.75}.card-tags{flex-wrap:wrap;gap:8px;display:flex}.card-tag{color:#555;letter-spacing:.08em;text-transform:uppercase;border:1px solid #ddd;border-radius:100px;padding:4px 12px;font-size:10px}.card-links{gap:16px;display:flex}.card-link{letter-spacing:.1em;text-transform:uppercase;border-radius:100px;padding:10px 20px;font-size:11px;text-decoration:none;transition:all .2s}.card-link.live{color:#fff;background:#0a0a0a}.card-link.live:hover{background:#333}.card-link.github{color:#0a0a0a;border:1px solid #ddd}.card-link.github:hover{background:#f5f5f5}.card-edit{background:var(--color-dark);color:#b1a6a6}.tools{color:#979494;border:2px solid var(--color-secondary);background:#0122222f;border-radius:20%;padding:10px;font-style:italic}.card-links:hover{color:#7fffd4;border-radius:20%;font-style:italic;transition:all .5s;transform:scale(1.3)}.about-name{color:#7fffd4;font-size:3rem}.bio p{color:var(--text-color);letter-spacing:3px;font-size:1.1rem;line-height:2.2}.hobbies-icon{color:var(--text-color);border:solid 1px var(--color-secondary);border-radius:10px;padding:5px}.hobbies-icon:hover{color:var(--color-secondary);transition:all .5s;transform:scale(1.3)}.contact-container{border:1px solid var(--text-color);border-radius:20px}.firstline{color:var(--color-secondary);font-size:4rem}.secondline{color:var(--name-color);font-size:5rem}.contact-in{color:var(--color-secondary);font-size:2rem}.contact{color:var(--color-secondary);gap:2rem;font-size:50px}.contact-me span{color:var(--text-color);font-size:1.5rem}.contact a{transition:all .5s ease-in-out}.contact a:hover{transform:scale(1.2)}footer{color:var(--text-color);border-top:1px solid var(--color-secondary);box-shadow:var(--shadow)}.goup{color:var(--name-color);width:60px;height:60px;box-shadow:var(--shadow);border-radius:50%;font-size:50px;position:fixed;bottom:50px;right:50px}.goup :hover{transition:all .2s ease-out;transform:scale(1.3)}#hamburger .hide-box{display:none!important}.hamburger-icon,[for=hamburger]{display:none}@keyframes blink{0%,50%{opacity:1}51%,to{opacity:0}}#hamburger,[for=hamburger]{display:none}@media (width<=768px){.title{font-size:2rem}[for=hamburger]{cursor:pointer;display:block}.menu{width:250px;height:100vh;box-shadow:var(--shadow);z-index:9999;background:#121212;transition:all .5s;position:fixed;top:5rem;left:100vw}.navigation{flex-direction:column;font-size:1.3rem}.navigation li{padding-left:2rem;line-height:2.5rem}.slide{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);left:calc(100vw - 250px)}.main-hero{flex-direction:column-reverse}.full-name{font-size:2.5rem}.desc{font-size:20px}.btn-section{flex-wrap:wrap;gap:1rem}.btn-section a{padding:12px;font-size:1rem}.banner-boxes{flex-direction:column!important}.banner-box{border-left:none;border-right:none;border-bottom:2px solid var(--text-color);padding:20px 16px}.banner-box:first-child{border-left:none}.banner-box:last-child{border-bottom:none}.banner-top{font-size:2rem}.banner-mid{font-size:1rem}.banner-last{font-size:.8rem}.skill-items{flex-wrap:wrap}.skill-item{font-size:.75rem}.terminal{display:none}.project-card{grid-template-columns:1fr}.about-name{color:#7fffd4;font-size:2rem}.bio p{color:var(--text-color);letter-spacing:3px;font-size:.9rem;line-height:2.2}.image-box img{max-width:200px;height:auto}.firstline{color:var(--color-secondary);font-size:2rem}.secondline{color:var(--name-color);font-size:2.5rem}.contact-in{color:var(--color-secondary);font-size:1.5rem}.contact{color:var(--color-secondary);gap:1rem;font-size:25px}}