*{box-sizing:border-box;padding:0;margin:0}:root{--bg-color: #0D1117;--card-bg: #161B22;--text-primary: #E6EDF3;--text-secondary: #8B949E;--accent-purple: #A855F7;--accent-purple-hover: #9333EA;--border-color: #30363D}body.light-mode{--bg-color: #ffffff;--card-bg: #f8f8f8;--text-primary: #1a1a1a;--text-secondary: #555555;--border-color: #eeeeee}body{background:var(--bg-color);color:var(--text-primary);font-size:1.1rem;font-family:Arial,sans-serif}section{width:100%;height:auto;padding:40px;text-align:center;border-bottom:1px solid var(--accent-purple)}.about-text{width:35%;border:1px solid var(--accent-purple);border-radius:25px;margin:65px auto 40px;padding:12px;color:var(--text-secondary)}#about h2:first-child,#skills h2:first-child,#contact h2:first-child,#projects h2:first-child{width:fit-content;font-size:15px;color:var(--accent-purple);display:flex;align-items:center;gap:10px}#skills h1,#about h1,#contact h1,#projects h1{width:fit-content;margin:0 auto;display:flex;align-items:center;justify-content:center;padding:15px;gap:10px;color:var(--text-primary);font-size:2rem;border-bottom:2px solid var(--accent-purple)}.nav-bar{width:100%;border-bottom:1px solid var(--accent-purple);padding:25px 20px;display:flex;justify-content:space-between;align-items:center;position:fixed;flex-wrap:wrap;gap:20px;top:0;background:var(--bg-color);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);z-index:1}.nav-links{display:flex;gap:20px}.nav-bar .hamburger-icon{display:none;font-size:28px;cursor:pointer}.nav-bar .dark-mode-icon{cursor:pointer;font-size:20px}.nav-bar .dark-mode-icon:hover{color:var(--accent-purple-hover)}.nav-bar p,.footer p:nth-child(1){color:var(--text-primary);padding:2px;font-size:24px;cursor:pointer;transform:translate(20px);transition:all .3s ease-in-out;display:flex;align-items:center;gap:5px}.nav-bar p:hover,.footer p:nth-child(1):hover{color:var(--accent-purple)}ul{display:flex;gap:30px;flex-wrap:wrap;justify-content:space-around}ul li{list-style:none}ul li a{text-decoration:none;color:inherit;display:flex;gap:5px;align-items:center;justify-content:center;padding:3px}ul li a:hover{border-bottom:2px solid var(--accent-purple)}#home{width:100%;padding:60px 10px;display:flex;justify-content:space-around;flex-wrap:wrap}#home .right,#home .left{width:50%;margin-top:110px;padding:10px}#home .right h1{text-align:start;font-size:55px;color:var(--text-primary)}#home .right p{margin:25px 0;text-align:start}#home .right p:nth-of-type(1){color:var(--accent-purple);font-size:50px}#home .right p:nth-of-type(2){font-size:22px;color:var(--text-secondary)}#home .buttons{display:flex;flex-wrap:wrap;margin-top:70px;gap:20px}#home .buttons button{width:fit-content;padding:10px;height:60px;display:flex;align-items:center;justify-content:center;gap:10px;background:var(--accent-purple);color:#fff;font-size:15px;border-radius:8px;border:none;cursor:pointer;transform:translate(20px);transition:all .3s ease-in-out}#home .left .image{border:1px solid var(--accent-purple);width:50%;height:280px;margin:15px auto;border-radius:12px;background:var(--card-bg);transform:translate(20px);transition:all .3s ease-in-out;padding:0}#home .left .image img{width:100%;height:100%;object-fit:cover;border-radius:12px}#home .left .text{margin-top:10px;margin-right:140px;width:50%;display:flex;align-items:center;justify-content:center;gap:10px}.dot{width:10px;height:10px;border-radius:50%;background-color:var(--accent-purple);animation:blink 1s infinite}@keyframes blink{0%,to{opacity:1}50%{opacity:0}}.about-container{width:100%;display:flex;justify-content:space-between;flex-wrap:wrap;margin-top:25px;padding:15px}.about-container .left{width:45%;padding:15px}.about-container .left p{text-align:start;font-size:20px;color:var(--text-secondary)}.about-container .right{width:45%;padding:15px;display:flex;flex-wrap:wrap;justify-content:space-around;gap:25px}.right .container{background:var(--card-bg);border:1px solid var(--border-color);width:40%;border-radius:12px;padding:12px;transform:translate(20px);transition:all .3s ease-in-out}#about .right .container h2,#about .right .container p{text-align:start;margin-top:18px!important}#about .right .container p{font-size:15px;color:var(--text-secondary)}#about .right .container h2{color:var(--accent-purple);text-align:start!important}.technologies{padding:10px;display:flex;justify-content:space-around;flex-wrap:wrap;gap:20px;margin:110px 0}.tech{background:var(--card-bg);border:1px solid var(--accent-purple);border-radius:25px;padding:10px 15px;display:flex;align-items:center;gap:5px;transform:translate(20px);transition:all .3s ease-in-out}.tech:hover,.contact-cards .contact-card:first-child:hover,.container:hover,.social-icons:hover,#home .left .image:hover,#home .buttons button:hover,button:hover{transform:translate(20px) scale(1.05);box-shadow:0 4px 15px #a855f766}#skills .about-text{margin-top:70px;margin-bottom:70px;display:flex;align-items:center;justify-content:center;gap:10px}.project-cards{display:flex;justify-content:space-around;flex-wrap:wrap;padding:50px;margin-top:20px;gap:30px}.project-cards .project-card{border:2px solid var(--border-color);background-color:var(--card-bg);width:40%;padding:10px;border-radius:10px;display:flex;flex-direction:column}.project-cards .project-card:hover{border:2px solid var(--accent-purple-hover)}.project-cards .project-card img{width:100%;height:200px;border-radius:8px;object-fit:contain;border:1px solid var(--border-color)}.project-cards .project-card img:hover{object-fit:cover;border:1px solid var(--accent-purple)}.project-cards .project-card p:first-of-type{font-size:20px;color:var(--accent-purple)}.project-cards .project-card p{font-size:18px;text-align:start;margin:15px;color:var(--text-secondary)}.project-cards .project-card button{width:fit-content;padding:10px;height:40px;display:flex;align-items:center;justify-content:center;gap:10px;background:var(--accent-purple);color:#fff;font-size:15px;border-radius:8px;border:none;cursor:pointer;transform:translate(20px);transition:all .3s ease-in-out;margin:0 auto}#home .buttons button:hover{background:var(--accent-purple-hover)}#contact .head-text{font-size:20px;margin:-15px 0 20px}#contact .contactcard{display:flex;flex-wrap:wrap;justify-content:space-around}#contact .left{width:48%;padding:10px}#contact .left h1:nth-of-type(1){text-align:start;padding-left:30px}#contact .left h2{margin:0 auto;font-size:20px;color:var(--text-primary)}#contact .left .socials{padding-right:300px}.contact-cards{display:flex;flex-direction:column;flex-wrap:wrap;margin-top:10px}.contact-cards .contact-card{background:var(--card-bg);border:1px solid var(--border-color);border-radius:10px;margin:10px;padding:10px;width:500px;text-align:start;display:flex;align-items:center;flex-wrap:wrap;gap:20px;transform:translate(20px);transition:all .3s ease-in-out}.contact-cards .contact-card .card-detail{display:flex;flex-direction:column;gap:5px;color:var(--accent-purple)}.contact-cards .contact-card:hover,.right .container:hover,form:hover{border:1px solid var(--accent-purple)}a{text-decoration:none;color:var(--text-primary)}.contact-info{display:flex;flex-direction:row;flex-wrap:wrap;gap:20px}.contact-info-group{display:flex;flex-direction:column;gap:5px;flex:1}.contact-info label{display:flex;flex-direction:column;gap:5px;flex:1;color:var(--accent-purple);margin-bottom:8px}.footer{width:100%;padding:50px;text-align:center;background:var(--card-bg);border-top:1px solid var(--border-color)}.footer p:nth-child(1){width:fit-content;margin:0 auto}.socials{display:flex;justify-content:center;gap:20px;margin:20px}.social-icons{border:1px solid var(--accent-purple);border-radius:30%;padding:5px;display:flex;align-items:center;transform:translate(20px);transition:all .3s ease-in-out}.footer p:nth-of-type(2){width:fit-content;margin:0 auto;display:flex;align-items:center;justify-content:center;gap:5px}@media(max-width:1024px){.about-text{width:55%}#home .right,#home .left{width:48%;margin-top:80px}#home .right h1{font-size:40px}#home .right p:nth-of-type(1){font-size:36px}#home .right p:nth-of-type(2){font-size:18px}.about-container .left,.about-container .right{width:48%}.right .container,.project-cards .project-card{width:45%}#contact .left,#contact .right{width:48%}.contact-cards .contact-card{width:100%}#contact .left .socials{padding-right:50px}}@media(max-width:768px){section{padding:20px 10px}.about-text{width:80%;margin:40px auto 25px;font-size:14px}#skills h1,#about h1,#contact h1,#projects h1{font-size:1.5rem}#about h2,#contact h2{font-size:1.5rem;margin-top:60px}.nav-bar{padding:10px;justify-content:center;gap:15px;justify-content:space-around}.nav-bar .hamburger-icon{cursor:pointer;display:block}.nav-bar .hamburger-icon:hover{color:var(--accent-purple)}.nav-links{position:absolute;top:55px;right:0;width:70%;padding:10px;height:100vh;flex-direction:column;background:var(--bg-color);text-align:center;transform:translate(100%);transition:transform .5s ease-in-out;border-radius:5px 0 10px}.nav-links.active{display:flex;transform:translate(0)}.nav-bar p{transform:translate(0);font-size:20px;width:100%;justify-content:center}ul{gap:12px;justify-content:center;width:100%}ul li a{font-size:20px}ul li a:hover{color:var(--accent-purple-hover)}#home{flex-direction:column-reverse;align-items:center;padding:20px 15px}#home .right,#home .left{width:100%;margin-top:80px}#home .right{order:1;margin-top:-5px}#home .left{order:2}#home .left .image{margin-top:-30px}#home .right h1{font-size:32px;text-align:center}#home .right p{text-align:center}#home .right p:nth-of-type(1){font-size:28px;text-align:center}#home .right p:nth-of-type(2){font-size:16px;text-align:center}#home .buttons{justify-content:center;margin:0 auto;width:100%;padding:10px}#home .buttons button{transform:translate(0);width:150px;font-size:16px}#home .left .image{width:70%;transform:translate(0)}#home .left .image img{width:100%;height:100%;object-fit:cover;border-radius:8px}#home .left .text{width:100%;justify-content:center}#about h1{margin-top:-20px}#about p:first-of-type{margin-top:-25px}.about-container{flex-direction:column;align-items:center;padding:5px}.about-container .left,.about-container .right{width:100%}.about-container .left p{font-size:16px;text-align:center}.right .container{width:45%;transform:translate(0)}#skills h2:first-of-type{margin-top:60px}#skills h1{margin-top:-45px}.technologies{margin:30px 0;gap:15px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:20px}.tech{transform:translate(0);font-size:14px;width:200px;display:flex;align-items:center;justify-content:center}#skills .about-text:nth-of-type(2){width:100%;margin-top:30px;margin-bottom:55px;font-size:14px}#projects h2:first-of-type{margin-top:60px;margin-bottom:0}.project-cards{padding:20px;gap:20px;margin-top:0}.project-cards .project-card{width:100%}#contact .contactcard{flex-direction:column;align-items:center;margin-top:-25px}#contact .left{width:100%;padding-bottom:20px}#contact .left h1:nth-of-type(1){text-align:center;padding-left:0}#contact .left h2{margin:10px auto 0;font-size:20px;color:var(--text-primary)}#contact .left .socials{padding-right:0;justify-content:center}.contact-cards{padding:5px}.contact-cards .contact-card{width:100%;transform:translate(0);margin:10px auto;gap:10px}.footer{padding:30px 15px}.footer p:nth-child(1){transform:translate(0);font-size:18px}.social-icons{transform:translate(0)}.tech:hover,.contact-cards .contact-card:first-child:hover,.container:hover,.social-icons:hover,#home .left .image:hover,#home .buttons button:hover,button:hover{transform:translate(0) scale(1.05)}}
