@import"https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap";@import"https://fonts.googleapis.com/css2?family=Montserrat:wght@400;500;600;700&display=swap";*{margin:0;padding:0;box-sizing:border-box;font-family:Montserrat,Inter,sans-serif;color:var(--white)}:root{--red: #8f75ff;--background: #080f0f;--accent: #0c1616;--white: #e5e9ec;--navy-blue-color: #1a237e}body{background-color:var(--background)}.red{color:var(--red)}ul{display:flex;align-items:center}.btn{background-color:var(--red);color:var(--white);padding:.5rem 1rem;border-radius:.5rem;cursor:pointer;border:none;font-size:1rem;font-weight:600;transition:background-color .3s}.flip{display:inline-block;text-align:right;margin:0;-moz-transform:scaleX(-1);-o-transform:scaleX(-1);-webkit-transform:scaleX(-1);transform:scaleX(-1);filter:FlipH;-ms-filter:“FlipH”}.mb-1{margin-bottom:1rem}.fade{font-size:20rem;color:#0c1616;font-weight:100}.shift-up{margin-top:-12rem}.inner-page{display:flex;flex-direction:column;align-items:center;text-align:center;padding:0 1rem;height:calc(100vh - 80px);position:relative;gap:6rem}.flex{display:flex;width:100%;gap:20px}::selection{background-color:var(--red);color:var(--white)}@media only screen and (max-width: 768px){.fade{font-size:4.5rem}.shift-up{margin-top:-4rem}.shift-up>h2{font-size:3rem;margin-top:-1rem}}.home{display:flex;align-items:center;justify-content:space-around;height:calc(100vh - 80px);width:80%;margin:0 auto}.home-left{display:flex;flex-direction:column;align-items:center;justify-content:center;width:50%;font-size:1.5rem}.home-right{display:flex;flex-direction:column;justify-content:center;width:50%}.home-right h1{font-size:5rem;font-weight:600}.home-right h3{font-size:1.3rem;font-weight:400}.home-right h2{font-size:2rem;font-weight:500;margin-bottom:2rem}.gradient{background:-webkit-linear-gradient(180deg,#c45d5d,#e02424);background-clip:border-box;-webkit-background-clip:text;-webkit-text-fill-color:transparent}.home-socials{display:flex;gap:1rem;font-size:1.5rem;margin-top:2rem}.home-right-btn{margin-top:2rem;background-color:var(--red);color:var(--white);padding:.5rem 1rem;border-radius:.5rem;width:fit-content;cursor:pointer;border:none;font-size:1rem;font-weight:600;transition:background-color .3s;text-decoration:none}.side-effect{font-size:8rem;color:#0c1616}.mt{margin-top:50px}@media only screen and (max-width: 768px){.home{flex-direction:column;height:calc(100vh - 80px)}.home-left{width:100%;text-align:center;position:absolute;opacity:.5}.home-right{width:100%;text-align:center;z-index:1}.home-right h1{font-size:3rem}.home-right h3{font-size:1rem}.home-right h2{font-size:1.5rem}.home-socials{font-size:1rem}.home-right-btn{font-size:.8rem}}.about{display:flex;flex-direction:column;align-items:center;text-align:center;padding:0 1rem;height:calc(100vh - 80px);position:relative;gap:6rem}.shift-up>h4{font-weight:100;margin-bottom:1rem;text-transform:uppercase}.shift-up>h2{font-weight:500;margin-bottom:2rem;font-size:4rem}.about-bottom{width:75%;line-height:2.5rem;font-size:1.3rem;font-weight:500;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:4rem}.stack{width:100%}@media only screen and (max-width: 768px){.about{gap:3rem}.shift-up>h2{font-size:3rem}.about-bottom{font-size:1rem;line-height:1.3rem;font-weight:400}.about-bottom{width:80%}}.tech-stack-marquee{width:100%;overflow:hidden}.tech-stack-container{display:inline-flex;animation:scroll 20s linear infinite}.tech-stack-item{flex:0 0 auto;margin-right:20px;display:flex;flex-direction:column;align-items:center}.tech-name{margin-top:8px;font-size:.9rem;color:#333}@keyframes scroll{0%{transform:translate(0)}to{transform:translate(-50%)}}@media only screen and (max-width: 768px){.tech-stack-marquee{width:100%;overflow:hidden}.tech-stack-container{display:inline-flex;animation:scroll 20s linear infinite}.tech-stack-item{flex:0 0 auto;margin-right:20px;display:flex;flex-direction:column;align-items:center;height:3.5rem}}.footer-problem{display:flex;flex-direction:column;min-height:100vh}.slide-in{position:fixed;top:0;left:0;width:100%;height:100vh;background:var(--red);transform-origin:bottom}.slide-out{position:fixed;top:0;left:0;width:100%;height:100vh;background:var(--red);transform-origin:top}.transition-text{position:fixed;top:0;left:0;width:100%;height:100vh;transform-origin:top;transform:translate(-50%,-50%);color:var(--accent);font-size:10rem;text-align:center;line-height:1}nav{display:flex;justify-content:space-between;align-items:center;padding:2rem 8rem;font-size:1.2rem;height:80px}nav a{text-decoration:none}.nav-logo{font-size:2rem;font-weight:700}.nav-center>ul{display:flex}.nav-center>ul>li{list-style:none;margin-right:2rem;text-decoration:none}.nav-center>ul>li>a{color:var(--white);text-decoration:none}.hamburger{display:none;flex-direction:column;cursor:pointer;gap:5px;padding:.5rem;z-index:1001}.hamburger span{height:3px;width:25px;background:var(--white);border-radius:2px}@media only screen and (max-width: 768px){nav{padding:2rem;flex-direction:row;justify-content:space-between}.hamburger{display:flex}.nav-center{position:absolute;top:80px;left:0;width:100%;background-color:var(--background);display:none;flex-direction:column;align-items:center;padding:1rem 0;box-shadow:0 4px 8px #0000001a;z-index:1000;transition:all .3s ease-in-out;height:100vh}.nav-center.open{display:flex}.nav-center ul{flex-direction:column;gap:1rem}.nav-center ul li{margin:0}.btn{margin-top:1rem}}.contact-bottom{display:flex;justify-content:space-between;margin-top:20px;width:60%;gap:50px;padding:10px}.contact-bottom-left{width:30%;display:flex;flex-direction:column;justify-content:space-between}.contact-bottom-right{flex:1}.contact-box{text-align:left;padding:10px 20px;border:none;border-radius:8px;background-color:var(--accent)}.contact-box:hover{background-color:var(--red)}.contact-box h3{margin-bottom:10px;font-size:1.2rem}.contact-box p{font-size:1rem;color:var(--white)}.contact-form{display:flex;align-items:center;justify-content:space-between;flex-direction:column;gap:20px}input,textarea{width:100%;padding:10px;border:none;border-radius:8px;color:var(--white);font-weight:600;font-size:1.2rem;background-color:var(--accent);outline:none}input::placeholder,textarea::placeholder{color:var(--white);font-weight:600;font-size:1.2rem}.contact-form textarea{resize:vertical}.submit-btn{padding:10px 20px;border:none;border-radius:8px;background-color:var(--red);color:var(--white);font-size:1.2rem;font-weight:600;cursor:pointer;width:100%}.contact-bottom-left a{text-decoration:none;color:var(--white)}@media only screen and (max-width: 768px){.inner-page{gap:10px}.contact-bottom{flex-direction:column;width:100%}.contact-bottom-left{gap:10px;width:100%}.contact-bottom-right{width:100%}}.services-bottom{display:flex;flex-direction:column;justify-content:space-around;align-items:flex-start;margin-top:2rem}.main-services-top{display:flex;gap:20px}.main-service{cursor:pointer;padding:1rem;margin-bottom:1rem;transition:background-color .3s ease}.main-service:hover{background-color:var(--red)}.main-service.active{background-color:var(--red);color:var(--white)}.sub-services{background-color:var(--accent);width:100%;padding:20px;text-align:left}.sub-services-list{border-left:2px solid var(--red);padding-left:1rem}.sub-service{margin-bottom:1rem}.sub-service h4{margin-bottom:.5rem;color:var(--red)}.sub-service p{color:var(--white)}.bottom-drawer{position:fixed;bottom:0;left:0;width:100%;background:var(--accent);box-shadow:0 -4px 10px #0000001a;border-radius:12px 12px 0 0;padding:20px;max-height:60vh;overflow-y:auto}.drawer-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px}.drawer-header button{background:#ff4d4d;border:none;padding:5px 10px;color:#fff;border-radius:5px;cursor:pointer}@media only screen and (max-width: 768px){.services-bottom{align-items:center;margin-top:-5rem}.main-services-top{flex-direction:column;gap:0rem}.main-service{font-size:.8rem;width:100%;margin-bottom:.5rem}}.portfolio-bottom{display:flex;justify-content:center;align-items:flex-start;margin-top:2rem}.portfolio-items{display:flex;gap:2rem;width:80%}.portfolio-item{flex:1;background-color:var(--accent);border-radius:8px;overflow:hidden;box-shadow:0 4px 8px #0000001a;transition:transform .3s ease}.portfolio-item:hover{transform:translateY(-5px)}.portfolio-item img{width:100%;object-fit:cover}.portfolio-item-content{padding:1rem}.portfolio-item-content h3{margin-top:0;margin-bottom:2rem;height:3rem}.portfolio-item-content p{color:#666;margin-bottom:1rem}.portfolio-item-content a{display:inline-block;background-color:var(--background);color:#fff;padding:.5rem 1rem;text-decoration:none;border-radius:4px;transition:background-color .3s ease}.portfolio-item-content a:hover{background-color:var(--red)}.more-works{flex:1;padding:1rem;display:flex;align-items:center;justify-content:center;background-color:var(--accent);border-radius:8px;transition:transform .3s ease}.more-works:hover{transform:translateY(-5px)}@media only screen and (max-width: 768px){.portfolio-items{flex-direction:column;gap:1rem}.portfolio-item{width:100%}.more-works{width:100%;margin-bottom:20px}}.footer{margin-top:auto;text-align:center}.copyleft{display:inline-block;text-align:right;margin:0;-moz-transform:scaleX(-1);-o-transform:scaleX(-1);-webkit-transform:scaleX(-1);transform:scaleX(-1);filter:FlipH;-ms-filter:“FlipH”}.hire-me-page{padding:2rem 5%;max-width:800px;margin:0 auto;text-align:center}.hire-me-page h1{font-size:2.5rem;margin-bottom:.5rem}.hire-me-page p{margin-bottom:2rem}.btn{background-color:var(--red);color:#fff;padding:.75rem 1.5rem;border:none;border-radius:6px;cursor:pointer;font-size:1rem;margin-top:1rem;transition:background .3s;text-decoration:none}.btn:hover{background-color:var(--accent)}.skills-list{display:flex;flex-wrap:wrap;justify-content:center;gap:1rem;list-style:none;padding:0;margin-top:1rem}.skills-list li{background:var(--red);padding:.5rem 1rem;border-radius:5px}.contact-form{display:flex;flex-direction:column;gap:1rem;margin-top:2rem}.contact-form input,.contact-form textarea{width:100%;padding:.75rem;border:1px solid #ccc;border-radius:5px}.direct-contact{margin-top:2rem;font-size:.95rem}.direct-contact a{color:#07c;text-decoration:none}.direct-contact a:hover{text-decoration:underline}