@import"https://fonts.googleapis.com/css2?family=Poppins:wght@100;200;300;400;500;600;700;800&display=swap";:root{--bg-color: #131313;--text-color: #EEE9C8;--accent-color: #b74b4b}*{margin:0;padding:0;box-sizing:border-box;text-decoration:none;border:none;outline:none;font-family:Poppins,sans-serif}html{font-size:62.5%;scroll-behavior:smooth;overflow-x:hidden}body{background-color:var(--bg-color);color:var(--text-color)}.reveal{opacity:0;transform:translateY(30px);transition:all 1s ease}.reveal.active{opacity:1;transform:translateY(0)}header{position:fixed;top:0;left:0;width:100%;padding:2rem 9%;background:#000000e6;display:flex;justify-content:space-between;align-items:center;z-index:1000;transition:top .3s}.logo{font-size:3rem;color:var(--accent-color);font-weight:800;transition:.3s}.logo:hover{transform:scale(1.1)}nav a{font-size:1.8rem;color:var(--text-color);margin-left:4rem;font-weight:500;transition:.3s;border-bottom:2px solid transparent;cursor:pointer}nav a:hover,nav a.active{color:var(--accent-color);border-bottom:2px solid var(--accent-color)}.menu-toggle{display:none;font-size:2.5rem;color:var(--text-color);cursor:pointer}nav.active{right:0}section{min-height:100vh;padding:10rem 9% 5rem;display:flex;flex-direction:column;justify-content:center}.section-title{text-align:center;font-size:5rem;margin-bottom:5rem;font-weight:700}.section-title span{color:var(--accent-color)}.btn{display:inline-block;padding:1rem 2.8rem;background:transparent;border-radius:4rem;font-size:1.6rem;color:var(--accent-color);border:2px solid var(--accent-color);transition:.3s ease;cursor:pointer;margin-top:2rem}.btn:hover{background:var(--accent-color);color:var(--bg-color);box-shadow:0 0 20px var(--accent-color);transform:scale(1.05)}.home{display:flex;flex-direction:row;align-items:center;justify-content:center;gap:5rem}.home-img img{width:32vw;border-radius:50%;cursor:pointer;transition:.4s ease;animation:floatImage 4s ease-in-out infinite}.home-img img:hover{box-shadow:0 0 60px var(--accent-color),0 0 10px #5d0000}.home-content h1{font-size:6rem;font-weight:700;opacity:0;animation:slideRight 1s ease forwards;animation-delay:.2s}.home-content h3{font-size:3rem;margin:1rem 0;font-weight:700;opacity:0;animation:slideRight 1s ease forwards;animation-delay:.5s}.home-content span{color:var(--accent-color)}.home-content p{font-size:1.6rem;margin-bottom:2rem;opacity:0;animation:slideLeft 1s ease forwards;animation-delay:.8s}.social-icons{opacity:0;animation:slideTop 1s ease forwards;animation-delay:1s}.home-content .btn{opacity:0;animation:slideTop 1s ease forwards;animation-delay:1.2s}.home.scrolled-out .home-img img{transform:translate(-100px) scale(.9);opacity:0;transition:all .5s cubic-bezier(.25,1,.5,1)}.home.scrolled-out .home-content{transform:translate(100px);opacity:0;transition:all 1.5s cubic-bezier(.25,1,.5,1);transition-delay:.1s}.home.scrolled-out .home-content h1,.home.scrolled-out .home-content h3,.home.scrolled-out .home-content p,.home.scrolled-out .social-icons,.home.scrolled-out .btn{opacity:0;transition:opacity 1s ease-out}.home .home-img img,.home .home-content{transition:all 1.2s ease-out}@keyframes floatImage{0%{transform:translateY(0)}50%{transform:translateY(-2.4rem)}to{transform:translateY(0)}}@keyframes slideRight{0%{transform:translate(-100px);opacity:0}to{transform:translate(0);opacity:1}}@keyframes slideLeft{0%{transform:translate(100px);opacity:0}to{transform:translate(0);opacity:1}}@keyframes slideTop{0%{transform:translateY(100px);opacity:0}to{transform:translateY(0);opacity:1}}.social-icons a{display:inline-flex;justify-content:center;align-items:center;width:4rem;height:4rem;border:.2rem solid var(--accent-color);border-radius:50%;font-size:2rem;color:var(--text-color);margin:0 1.5rem 2rem 0;transition:.3s}.social-icons a:hover{background:var(--accent-color);color:#000;box-shadow:0 0 15px var(--accent-color)}.section-bg{position:relative;overflow:hidden}.section-bg:before{content:"";position:absolute;top:0;left:0;width:100%;height:100%;z-index:-1;background-size:cover;background-position:center;background-attachment:fixed}#about:before{background-image:url(/aboutme.jpg);filter:brightness(.2)}#services:before{background-image:url(/webexpbg.jpg);filter:brightness(.3)}#contact:before{background-image:url(/contact.jpg);filter:brightness(.2)}.skills-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:2rem}.skill-card{background:#eee9c8;padding:2.5rem;border-radius:1rem;text-align:center;transition:.3s;border:2px solid transparent;display:block}.skill-card:hover{transform:translateY(-5px);border-color:var(--accent-color);box-shadow:0 5px 15px #b74b4b66}.skill-card i{font-size:4rem;color:var(--accent-color);margin-bottom:1rem}.skill-card h4{font-size:2rem;color:#333;margin-bottom:1rem}.skill-card p{font-size:1.4rem;color:#555}.timeline{position:relative;max-width:800px;margin:0 auto}.timeline:before{content:"";position:absolute;left:0;top:0;width:2px;height:100%;background:#eee9c833}.timeline-item{position:relative;margin-bottom:4rem;padding-left:3rem}.timeline-item:last-child{margin-bottom:0}.timeline-dot{position:absolute;left:-6px;top:5px;width:14px;height:14px;border-radius:50%;background:var(--accent-color);box-shadow:0 0 10px var(--accent-color);transition:.3s ease}.timeline-item:hover .timeline-dot{transform:scale(1.3);box-shadow:0 0 20px var(--accent-color)}.timeline-date{font-size:1.4rem;color:var(--accent-color);font-weight:600;margin-bottom:.5rem}.timeline-content{background:#ffffff0d;padding:2rem;border-radius:8px;border-left:4px solid var(--accent-color);transition:.3s ease}.timeline-item:hover .timeline-content{background:#ffffff1a;transform:translate(5px)}.timeline-content h3{font-size:2rem;color:var(--text-color);margin-bottom:.5rem}.timeline-content .company{display:block;font-size:1.4rem;color:#aaa;font-style:italic;margin-bottom:1.5rem}.timeline-content p{font-size:1.5rem;line-height:1.6;color:#ddd}@media(max-width:600px){.timeline{padding-left:1rem}}.contact-container{display:flex;justify-content:space-between;gap:4rem;flex-wrap:wrap}.contact-info h3{font-size:2.5rem;margin-bottom:1.5rem}.contact-info p{font-size:1.6rem;margin-bottom:1.5rem}.contact-details i{color:var(--accent-color);margin-right:1rem}.contact-form{flex:1;min-width:300px;display:flex;flex-direction:column;gap:1.5rem}.contact-form input,.contact-form textarea{width:100%;padding:1.5rem;background:#222;border:1px solid #444;color:#fff;font-size:1.6rem;border-radius:5px}.contact-form input:focus,.contact-form textarea:focus{border-color:var(--accent-color)}@media(max-width:995px){header{padding:2rem}.menu-toggle{display:block;z-index:1001}nav{position:fixed;top:0;right:-100%;width:70%;height:100%;background:#111;display:flex;flex-direction:column;justify-content:center;align-items:center;transition:.4s ease;z-index:1000}nav a{margin:2rem 0;font-size:2.5rem}.home{flex-direction:column;text-align:center}.home-img img{width:70vw}.contact-container{flex-direction:column}}.dj-wrapper{background-color:#0a0a0a;min-height:100vh}.dj-hero{height:60vh;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;background:radial-gradient(circle,#b74b4b33,#0a0a0a 70%);padding-top:8rem}.dj-hero i{font-size:8rem;color:var(--accent-color);margin-bottom:2rem;animation:pulse 2s infinite}.dj-hero h1{font-size:6rem;text-transform:uppercase;letter-spacing:5px;color:#fff;text-shadow:0 0 20px var(--accent-color)}.dj-hero p{font-size:1.8rem;color:#ccc;max-width:600px;margin-top:1rem}.gallery-section{padding:5rem 9%}.gallery-title{text-align:center;font-size:3rem;margin-bottom:4rem;color:var(--accent-color)}.gallery-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:2rem}.gallery-item{position:relative;overflow:hidden;border-radius:15px;border:1px solid #333;height:350px;cursor:pointer}.gallery-item img{width:100%;height:100%;object-fit:cover;transition:transform .5s ease}.gallery-item:hover img{transform:scale(1.1) rotate(2deg)}.gallery-overlay{position:absolute;bottom:0;left:0;width:100%;padding:2rem;background:linear-gradient(transparent,#000);opacity:0;transition:.3s}.gallery-item:hover .gallery-overlay{opacity:1}.music-player-container{position:fixed;bottom:30px;right:30px;z-index:1000;display:flex;align-items:center;gap:15px;background:#000c;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);padding:10px 20px 10px 10px;border-radius:50px;border:1px solid var(--accent-color);box-shadow:0 0 20px #b74b4b4d;transition:transform .3s ease}.music-player-container:hover{transform:scale(1.05)}.vinyl-disc{width:50px;height:50px;border-radius:50%;background:url(/icon.png);background-size:cover;border:2px solid var(--accent-color);animation:spin 3s linear infinite;animation-play-state:paused}.vinyl-disc.playing{animation-play-state:running;box-shadow:0 0 15px var(--accent-color)}.controls{display:flex;flex-direction:column;justify-content:center}.track-name{font-size:1.2rem;font-weight:600;color:#fff;margin-bottom:2px}.player-btns{display:flex;gap:10px}.control-btn{background:none;border:none;color:var(--accent-color);font-size:1.4rem;cursor:pointer;transition:.2s}.control-btn:hover{color:#fff}@keyframes pulse{0%{transform:scale(1);opacity:.8}50%{transform:scale(1.1);opacity:1}to{transform:scale(1);opacity:.8}}@keyframes spin{to{transform:rotate(360deg)}}@media(max-width:768px){.music-player-container{bottom:20px;right:20px;padding:10px}.track-name{display:none}}.qa-hero{height:90vh;display:flex;align-items:center;justify-content:center;text-align:center;background:linear-gradient(#131313cc,#131313e6),url(/qa-bg-placeholder.jpg);background-size:cover;background-position:center;background-attachment:fixed}.qa-hero-content h1{font-size:6rem;font-weight:700;margin-bottom:2rem;line-height:1.1}.qa-hero-content .accent{color:var(--accent-color)}.qa-hero-content p{font-size:1.8rem;max-width:700px;margin:0 auto 4rem;color:#ccc}.qa-stats{display:flex;justify-content:center;gap:6rem;margin-top:3rem;flex-wrap:wrap}.stat-item h3{font-size:4rem;color:var(--accent-color);font-weight:800}.stat-item span{font-size:1.4rem;text-transform:uppercase;letter-spacing:1px;color:var(--text-color)}.qa-tools{background:var(--bg-color)}.tools-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:3rem}.tool-category{background:#eee9c80d;padding:3rem;border-radius:12px;border:1px solid rgba(238,233,200,.1);transition:.3s}.tool-category:hover{border-color:var(--accent-color);transform:translateY(-5px)}.tool-category h3{font-size:2.2rem;margin-bottom:2rem;color:var(--text-color);display:flex;align-items:center;gap:1rem}.tool-category h3 i{color:var(--accent-color)}.badge-container{display:flex;flex-wrap:wrap;gap:1rem}.badge{background:transparent;border:1px solid var(--accent-color);color:var(--text-color);padding:.5rem 1.5rem;border-radius:20px;font-size:1.3rem;transition:.3s}.badge:hover{background:var(--accent-color);color:var(--bg-color)}.project-card{display:flex;background:#1a1a1a;border-radius:15px;overflow:hidden;margin-bottom:4rem;border:1px solid #333;transition:.3s}.project-card:hover{box-shadow:0 0 20px #b74b4b33;border-color:var(--accent-color)}.project-img{flex:1;min-width:300px}.project-img img{width:100%;height:100%;object-fit:cover;opacity:.8;transition:.3s}.project-card:hover .project-img img{opacity:1;transform:scale(1.02)}.project-info{flex:1.5;padding:4rem;display:flex;flex-direction:column;justify-content:center}.project-info h3{font-size:2.5rem;color:var(--text-color);margin-bottom:.5rem}.project-info .role{color:var(--accent-color);font-size:1.4rem;text-transform:uppercase;font-weight:600;margin-bottom:2rem;letter-spacing:1px}.project-info p{font-size:1.5rem;color:#ccc;margin-bottom:2rem}.project-info ul{list-style:none}.project-info ul li{font-size:1.4rem;margin-bottom:1rem;color:#ddd;display:flex;align-items:start;gap:1rem}.project-info ul li i{color:var(--accent-color);margin-top:4px}.qa-process{text-align:center}.process-steps{display:flex;justify-content:center;align-items:center;gap:2rem;flex-wrap:wrap;margin-top:3rem}.step{text-align:center;max-width:200px}.step-icon{width:8rem;height:8rem;background:#222;border:2px solid var(--accent-color);border-radius:50%;display:flex;justify-content:center;align-items:center;margin:0 auto 2rem;font-size:3rem;color:var(--text-color);transition:.3s}.step:hover .step-icon{background:var(--accent-color);box-shadow:0 0 15px var(--accent-color)}.step h4{font-size:2rem;margin-bottom:1rem}.step p{font-size:1.4rem;color:#aaa}.line{width:100px;height:2px;background:#eee9c833;margin-top:-4rem}.qa-cta{padding:8rem 9%;text-align:center;background:#0f0f0f}.qa-cta h2{font-size:3.5rem;margin-bottom:1rem}.qa-cta p{font-size:1.6rem;color:#ccc;margin-bottom:3rem}footer{padding:2rem 9%;background:#000;text-align:center;font-size:1.4rem}@media(max-width:995px){.project-card{flex-direction:column}.project-img{height:250px}.qa-hero-content h1{font-size:4rem}.line{display:none}.process-steps{flex-direction:column;gap:4rem}}.web-hero{height:90vh;display:flex;align-items:center;justify-content:center;text-align:center;background:linear-gradient(#131313cc,#131313e6),url(/web-bg-placeholder.jpg);background-size:cover;background-position:center;background-attachment:fixed}.web-hero .qa-hero-content h1{font-size:6rem;font-weight:700;margin-bottom:2rem;line-height:1.1}.web-hero .qa-hero-content .accent{color:var(--accent-color)}.web-hero .qa-hero-content p{font-size:1.8rem;max-width:700px;margin:0 auto 4rem;color:#ccc}.construction-section{height:100vh;display:flex;align-items:center;justify-content:center;text-align:center;background:radial-gradient(circle at center,#1f1f1f 0%,var(--bg-color) 70%);padding:0 2rem}.construction-content h1{font-size:5rem;margin-bottom:2rem;font-weight:700}.construction-content .accent{color:var(--accent-color)}.construction-content p{font-size:1.8rem;color:#ccc;max-width:600px;margin:0 auto 1rem;line-height:1.6}.construction-icon{font-size:8rem;color:var(--accent-color);margin-bottom:3rem;animation:hammerSwing 2s ease-in-out infinite;transform-origin:bottom right}@keyframes hammerSwing{0%{transform:rotate(0)}20%{transform:rotate(-30deg)}40%{transform:rotate(0)}60%{transform:rotate(-15deg)}to{transform:rotate(0)}}@media(max-width:600px){.construction-content h1{font-size:3.5rem}.construction-icon{font-size:6rem}}