:root{--bg-body:#f8f9fa;--text-main:#2d3436;--text-light:#636e72;--white:#ffffff;--border-light:rgba(0, 0, 0, 0.05);--code-color:rgba(45, 52, 54, 0.05);--accent-gradient:linear-gradient(135deg, #6c5ce7 0%, #a29bfe 100%);--glass-border:rgba(255, 255, 255, 0.6)}*{box-sizing:border-box;margin:0;padding:0;outline:none}body{background-color:var(--bg-body);color:var(--text-main);min-height:100vh;font-weight:400;overflow-x:hidden;position:relative;display:flex;padding-top:100px;flex-direction:column}.background-elements{position:fixed;top:0;left:0;width:100vw;height:100vh;z-index:-1;overflow:hidden;pointer-events:none}.background-elements::before{content:"";position:absolute;top:0;left:0;width:100%;height:100%;background-image:radial-gradient(#cbd5e1 1.5px,transparent 1.5px);background-size:32px 32px;opacity:.5}.code-symbol{position:absolute;color:var(--text-main);opacity:.04;font-family:"Courier New",monospace;font-weight:900;user-select:none;z-index:-1}.symbol-1{top:10%;left:5%;font-size:15rem;transform:rotate(-15deg);animation:floatCode1 18s infinite alternate ease-in-out}.symbol-2{bottom:5%;right:-2%;font-size:20rem;transform:rotate(10deg);animation:floatCode2 22s infinite alternate-reverse ease-in-out}.symbol-3{top:40%;right:10%;font-size:8rem;transform:rotate(25deg);opacity:.03;animation:floatCode3 20s infinite alternate ease-in-out}.symbol-svg{position:absolute;fill:var(--text-main);opacity:.03;z-index:-1}.svg-1{bottom:20%;left:10%;width:200px;height:200px;animation:floatCode3 25s infinite alternate ease-in-out}@keyframes floatCode1{0%{transform:translateY(0) rotate(-15deg)}100%{transform:translateY(40px) rotate(-10deg)}}@keyframes floatCode2{0%{transform:translateY(0) rotate(10deg)}100%{transform:translateY(-40px) rotate(5deg)}}@keyframes floatCode3{0%{transform:translate(0,0) rotate(25deg)}100%{transform:translate(-20px,30px) rotate(35deg)}}@keyframes fadeInUp{from{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}header{padding:120px 20px 80px;max-width:1000px;margin:0 auto;text-align:center;animation:fadeInUp 0.8s ease-out;position:relative}h1.brand-hero{font-size:5rem;font-weight:900;letter-spacing:-3px;line-height:1;margin-bottom:20px;background:linear-gradient(to right,#2d3436 20%,#636e72 100%);background-clip:text;-webkit-text-fill-color:#fff0;text-transform:uppercase;position:relative;display:inline-block}h2.hero-slogan{font-size:1.8rem;font-weight:700;color:var(--text-main);margin-bottom:20px}p.hero-desc{font-size:1.1rem;color:var(--text-light);max-width:600px;margin:0 auto 40px;line-height:1.8;background:rgb(255 255 255 / .7);backdrop-filter:blur(15px);padding:25px;border-radius:20px;border:1px solid rgb(255 255 255 / .8);box-shadow:0 10px 30px rgb(0 0 0 / .05)}.cta-btn{display:inline-block;padding:16px 40px;background:var(--text-main);color:#fff;text-decoration:none;border-radius:50px;font-weight:700;transition:all 0.3s cubic-bezier(.25,.46,.45,.94);box-shadow:0 10px 20px rgb(45 52 54 / .2);position:relative;z-index:2}.cta-btn:hover{transform:translateY(-5px);background:#000;box-shadow:0 15px 30px rgb(0 0 0 / .3)}.portfolio-container{max-width:1300px;margin:0 auto;padding:0 40px 80px;display:flex;flex-wrap:wrap;justify-content:center;gap:60px;position:relative;z-index:2}.section-title{width:100%;text-align:center;margin-bottom:40px;font-size:.9rem;color:var(--text-light);text-transform:uppercase;letter-spacing:2px;opacity:.7}.project-item{cursor:pointer;width:100%;max-width:380px;flex:1 1 320px;opacity:0;animation:fadeInUp 0.8s ease-out forwards;position:relative;--theme-color:#000;text-decoration:none;display:block}.project-item:nth-child(1){animation-delay:0.2s}.project-item:nth-child(2){animation-delay:0.3s}.project-item:nth-child(3){animation-delay:0.4s}.img-container{width:100%;aspect-ratio:4/3;background:var(--white);border-radius:24px;overflow:hidden;margin-bottom:25px;position:relative;box-shadow:0 20px 40px rgb(0 0 0 / .06);transition:all 0.5s cubic-bezier(.34,1.56,.64,1);border:6px solid var(--white)}.cover-img{width:100%;height:100%;object-fit:cover;transition:transform 0.7s ease}.project-item:hover .img-container{transform:translateY(-15px) scale(1.02);box-shadow:0 30px 60px -15px var(--theme-color);border-color:#fff}.project-item:hover .cover-img{transform:scale(1.1)}.meta-info{text-align:center;padding:0 10px}h3.project-title{font-size:1.5rem;font-weight:800;margin-bottom:8px;color:var(--text-main);transition:color 0.3s}.project-cat{font-size:.9rem;color:var(--text-light);font-weight:500;display:inline-block;padding:6px 16px;border-radius:20px;background:rgb(255 255 255 / .8);backdrop-filter:blur(5px);transition:all 0.3s;border:1px solid rgb(0 0 0 / .03)}.project-item:hover h3.project-title{color:var(--theme-color)}.project-item:hover .project-cat{background:var(--white);color:var(--theme-color);box-shadow:0 8px 20px -8px var(--theme-color);border-color:#fff0}.seo-features-section{width:100%;margin:80px 0 100px;padding:40px 20px;position:relative;z-index:2}.seo-container{max-width:1200px;margin:0 auto;display:grid;grid-template-columns:1fr 1fr;gap:80px;align-items:flex-start}.seo-text{position:sticky;top:100px}.seo-text h2{font-size:3rem;font-weight:900;margin-bottom:20px;line-height:1.1;color:var(--text-main)}.highlight-text{background:linear-gradient(135deg,#6c5ce7 0%,#a29bfe 100%);background-clip:text;-webkit-text-fill-color:#fff0}.seo-text p{font-size:1.15rem;line-height:1.8;color:var(--text-light);margin-bottom:40px}.features-grid{display:grid;grid-template-columns:1fr;gap:30px}.feature-box{background:rgb(255 255 255 / .6);backdrop-filter:blur(15px);border:1px solid rgb(255 255 255 / .8);padding:35px;border-radius:24px;box-shadow:0 10px 30px -5px rgb(0 0 0 / .05);transition:all 0.4s cubic-bezier(.175,.885,.32,1.275);display:flex;align-items:flex-start;gap:20px}.feature-box:hover{transform:translateY(-10px) scale(1.02);background:rgb(255 255 255 / .95);box-shadow:0 20px 50px -10px rgb(108 92 231 / .15);border-color:#fff}.feature-icon{width:60px;height:60px;background:#fff;border-radius:16px;display:flex;align-items:center;justify-content:center;font-size:1.5rem;box-shadow:0 8px 20px rgb(0 0 0 / .06);color:#6c5ce7;flex-shrink:0}.feature-content h4{font-size:1.3rem;font-weight:800;margin-bottom:10px;color:var(--text-main)}.feature-content p{font-size:.95rem;color:var(--text-light);line-height:1.6;margin:0}@media (max-width:900px){.seo-container{grid-template-columns:1fr;gap:40px}.seo-text{position:static;text-align:center}.seo-text h2{font-size:2.5rem}}.connect-box-container{padding:0 20px 80px;position:relative;z-index:2;width:100%;display:flex;justify-content:center;margin-top:auto}.connect-box{background:rgb(255 255 255 / .85);backdrop-filter:blur(40px) saturate(180%);border:2px solid #fff0;background-clip:padding-box;border-radius:40px;padding:70px 50px;width:100%;max-width:950px;box-shadow:0 40px 100px -20px rgb(108 92 231 / .25),0 20px 40px -10px rgb(0 0 0 / .05);text-align:center;position:relative;overflow:hidden;display:flex;flex-direction:column;align-items:center;gap:30px;transition:transform 0.5s ease,box-shadow 0.5s ease}.connect-box::after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;border-radius:40px;border:1px solid rgb(255 255 255 / .8);pointer-events:none}.connect-box:hover{transform:translateY(-8px);box-shadow:0 50px 120px -20px rgb(108 92 231 / .35)}.box-decoration{position:absolute;top:-50%;left:-50%;width:200%;height:200%;background:radial-gradient(circle at 50% 50%,rgb(108 92 231 / .08),transparent 60%),radial-gradient(circle at 80% 20%,rgb(0 206 201 / .08),transparent 50%);animation:rotateBg 20s linear infinite;z-index:-1}@keyframes rotateBg{from{transform:rotate(0deg)}to{transform:rotate(360deg)}}.connect-title{font-size:3rem;font-weight:900;margin:0;line-height:1.2;letter-spacing:-1px;background:linear-gradient(135deg,#2d3436 0%,#000 100%);background-clip:text;-webkit-text-fill-color:#fff0}.connect-desc{font-size:1.2rem;color:var(--text-light);max-width:600px;line-height:1.8}.consult-btn{position:relative;display:inline-flex;align-items:center;justify-content:center;gap:15px;background:linear-gradient(135deg,#2d3436 0%,#000000 100%);color:#fff;text-decoration:none;padding:22px 50px;border-radius:60px;font-size:1.3rem;font-weight:800;overflow:hidden;transition:all 0.4s cubic-bezier(.25,.46,.45,.94);box-shadow:0 20px 40px rgb(0 0 0 / .2);border:1px solid rgb(255 255 255 / .1)}.consult-btn::before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgb(255 255 255 / .2),transparent);transition:left 0.6s ease}.consult-btn:hover::before{left:100%}.consult-btn:hover{transform:scale(1.05);background:linear-gradient(135deg,#6c5ce7 0%,#a29bfe 100%);box-shadow:0 25px 60px rgb(108 92 231 / .4)}.consult-btn svg{width:28px;height:28px;transition:transform 0.3s}.consult-btn:hover svg{transform:translateX(-5px) rotate(-45deg)}.copyright-text{font-size:.95rem;color:var(--text-light);opacity:.6;margin-top:30px;font-weight:500;border-top:1px solid rgb(0 0 0 / .05);padding-top:20px;width:80%}.modal-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background:rgb(255 255 255 / .6);backdrop-filter:blur(25px) saturate(180%);z-index:1000;display:flex;align-items:center;justify-content:center;opacity:0;visibility:hidden;transition:all 0.4s ease}.modal-overlay.open{opacity:1;visibility:visible}.modal-card{background:#fff;width:90%;max-width:950px;height:85vh;border-radius:32px;box-shadow:0 40px 80px rgb(0 0 0 / .15);transform:scale(.9) translateY(40px);transition:all 0.6s cubic-bezier(.19,1,.22,1);overflow:hidden;display:flex;flex-direction:column;border:1px solid rgb(0 0 0 / .04)}.modal-overlay.open .modal-card{transform:scale(1) translateY(0)}.modal-header{padding:30px 40px;display:flex;justify-content:space-between;align-items:center;background:rgb(255 255 255 / .95);border-bottom:1px solid var(--border-light);z-index:10}.modal-header h2{font-size:1.8rem;font-weight:800;color:#2d3436}.close-btn{background:#f1f2f6;border:none;width:48px;height:48px;border-radius:16px;cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:1.4rem;color:#2d3436;transition:all 0.3s}.close-btn:hover{background:#ff7675;color:#fff;transform:rotate(90deg)}.modal-body{flex:1;overflow-y:auto;padding:0;scroll-behavior:smooth}.modal-body::-webkit-scrollbar{width:0;background:#fff0}.gallery-wrapper{padding:40px;display:flex;flex-direction:column;gap:30px;align-items:center}.modal-img{width:100%;border-radius:20px;box-shadow:0 15px 40px rgb(0 0 0 / .08);transition:transform 0.3s}.modal-footer{padding:25px 40px;background:#fff;border-top:1px solid var(--border-light);display:flex;justify-content:flex-end}.visit-btn{display:inline-flex;align-items:center;gap:12px;background:#2d3436;color:#fff;text-decoration:none;padding:16px 35px;border-radius:18px;font-weight:700;transition:all 0.3s ease;box-shadow:0 10px 25px rgb(0 0 0 / .1)}.visit-btn:hover{transform:translateY(-3px);box-shadow:0 20px 40px rgb(0 0 0 / .2)}@media (max-width:768px){h1.brand-hero{font-size:3.5rem}h2.hero-slogan{font-size:1.4rem}.portfolio-container{gap:40px;padding:0 20px 60px}.modal-card{width:95%;height:92vh}.modal-header{padding:20px}.gallery-wrapper{padding:20px}.code-symbol{font-size:10rem;opacity:.03}.connect-box{padding:50px 25px}.connect-title{font-size:2rem}.consult-btn{padding:18px 30px;font-size:1.1rem;width:100%}.seo-container{grid-template-columns:1fr}.seo-features-section{padding:60px 20px}}