:root{--bg-1: #292F36;--bg-2: #1A1E23;--brand-1: #12F7D6;--brand-2: #98FAEC;--grey: #43454D;--white: #FFFFFF;--html: #E44D26;--css: #1572B6;--js: #F0DB4F;--react: #61DBFB;--node: #339933;--php: #777BB3;--mysql: #4479A1;--git: #F34F29;--sass: #CC6699;--laravel: #FF2D20;--codeigniter: #EF4223;--blade: #222222;--bg-transparent: rgba(41, 47, 54, 0.8);--font-title: "Raleway", sans-serif;--font-body: "Open Sans", sans-serif;--font-details: "Poppins", sans-serif;--font-size-large: 2.4rem;--font-size-medium: 1.8rem;--font-size-normal: 1.5rem;--font-size-small: 1rem;--font-size-xsmall: 0.8rem;--max-width: 1200px;--min-width: 320px;--transition: all 0.5s ease}*{margin:0;padding:0;box-sizing:border-box;list-style:none;text-decoration:none;font-family:var(--font-body);color:var(--white);font-size:var(--font-size-normal)}html{scroll-behavior:smooth;font-size:62.5%}body{background-color:var(--bg-1)}header{background-color:var(--transparent);padding-left:20px;padding-right:20px}.navbar{display:flex;align-items:center;justify-content:space-between;max-width:var(--max-width);margin:0 auto;position:relative;padding-top:20px;padding-bottom:20px;border-bottom:2px solid var(--grey)}.navbar .logo a{color:var(--brand-1);font-size:1.5rem;text-decoration:none;font-weight:bold}.navbar .logo a .icon{color:var(--brand-1);font-size:var(--font-size-large)}.navbar .nav-links{display:flex;list-style:none}.navbar .nav-links li{margin-left:20px}.navbar .nav-links li .active{color:var(--brand-1)}.navbar .nav-links a{color:var(--white);text-decoration:none;font-size:var(--font-size-medium);position:relative;transition:color .3s}.navbar .nav-links a:hover{color:var(--brand-1)}.navbar .nav-links a::after{content:"";display:block;width:0;height:2px;background:var(--brand-1);transition:width .3s}.navbar .nav-links a:hover::after{width:100%}.navbar .nav-icons a,.navbar i,.navbar span{margin-left:15px;color:var(--brand-1);font-size:var(--font-size-medium);text-decoration:none;transition:color .3s}.navbar .nav-icons a:hover{color:var(--white)}.navbar .nav-icons a:hover i{color:var(--white)}.navbar .hamburger{display:none;flex-direction:column;cursor:pointer}.navbar .hamburger span{background-color:var(--white);height:3px;width:24px;margin:3px;transition:.3s;position:relative}@media(max-width: 768px){.navbar .nav-links{position:absolute;top:100%;right:0;background-color:hsla(0,0%,100%,.6);backdrop-filter:blur(10px);border-radius:0 0 10px 10px;width:100%;height:0;display:flex;flex-direction:column;align-items:center;justify-content:center;overflow:hidden;transition:height .5s ease}.navbar .nav-links.active{height:200px}.navbar .nav-links li{margin:10px 0}.navbar .nav-icons a span{display:none}.navbar .hamburger{display:flex;flex-direction:column;align-items:center;justify-content:center;cursor:pointer;width:30px;height:30px;position:relative}.navbar .hamburger span{background-color:var(--white);height:3px;width:24px;margin:3px;transition:.3s;display:block;position:absolute}.navbar .hamburger span:nth-child(1){top:0}.navbar .hamburger span:nth-child(2){top:10px}.navbar .hamburger span:nth-child(3){top:20px}.navbar .hamburger.active span:nth-child(1){transform:rotate(45deg) translate(4px, 6px);transform-origin:center}.navbar .hamburger.active span:nth-child(2){opacity:0}.navbar .hamburger.active span:nth-child(3){transform:rotate(-45deg) translate(8px, -10px);transform-origin:center}}.sidebar{position:fixed;top:50%;left:20px;transform:translateY(-50%);display:flex;flex-direction:column;gap:20px;z-index:50;background:var(--bg-2);border-radius:24px;border:2px solid var(--white);padding:10px}.sidebar .nav-icon{color:var(--white);text-decoration:none;font-size:24px;transition:color .3s ease}.sidebar .nav-icon i{border-radius:100%;padding:5px;overflow:hidden;transition:color .3s ease}.sidebar .nav-icon.active i{color:var(--bg-2);background:var(--white)}.sidebar .nav-icon:hover i{color:var(--bg-2);background:var(--white)}.sidebar .tooltip{visibility:hidden;width:120px;background-color:var(--white);color:var(--bg-2);font-size:var(--font-size-small);font-weight:bold;text-align:center;border-radius:5px;padding:5px;position:absolute;z-index:50;margin-left:20px;opacity:0;transition:opacity .3s;overflow:hidden}.sidebar .nav-icon:hover .tooltip{visibility:visible;opacity:1}@media(max-width: 768px){.sidebar{display:none}}.presentation-container{display:grid;grid-template-columns:auto auto auto;gap:2rem;align-items:center;max-width:var(--max-width);margin:100px auto}.presentation-container .presentation-card{display:flex;flex-direction:column;align-items:center;justify-content:center;margin:0 auto;padding:60px 0;border:3px solid var(--white);border-radius:170px 0 170px 0;box-shadow:-3px -3px 0 var(--brand-1);width:300px;color:var(--white)}.presentation-container .presentation-card .profile-picture .open-modal-btn{display:block;padding:10px 20px;background-color:#1db954;color:#fff;border:none;border-radius:20px;cursor:pointer;transition:background-color .3s ease}.presentation-container .presentation-card .profile-picture .open-modal-btn:hover{background-color:#1aa34a}.presentation-container .presentation-card .profile-picture .content-text{width:100px;height:40px;background:var(--bg-1);background:linear-gradient(top, #BFF 5%, #DFF 100%);border-radius:100px;position:absolute;margin:-40px auto 0;overflow:hidden;cursor:pointer}.presentation-container .presentation-card .profile-picture .content-text .text{position:absolute;white-space:nowrap;overflow:hidden;animation:scroll-text 5s linear infinite;color:var(--white);font-size:12px;left:100%;padding:15px}@keyframes scroll-text{0%{transform:translateX(0)}100%{transform:translateX(-100%)}}.presentation-container .presentation-card .profile-picture .icon{position:relative;bottom:25px;left:100%;transform:translateX(-50%);font-size:16px;color:var(--white);animation:pulse 1s infinite;z-index:1;cursor:pointer}@keyframes pulse{0%{transform:translateX(-50%) scale(1)}50%{transform:translateX(-50%) scale(1.1)}100%{transform:translateX(-50%) scale(1)}}.presentation-container .presentation-card .profile-picture .modal-overlay{display:none;position:fixed;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,.6);backdrop-filter:blur(5px);justify-content:center;align-items:center;animation:fadeIn .5s ease;z-index:2}@keyframes fadeIn{from{opacity:0}to{opacity:1}}.presentation-container .presentation-card .profile-picture .modal-content{background:linear-gradient(135deg, #1DB954, #1ed760);padding:20px;border-radius:15px;width:90%;max-width:400px;box-shadow:0 4px 8px rgba(0,0,0,.3);transform:scale(0.7);opacity:0;animation:zoomIn .3s forwards}@keyframes zoomIn{to{transform:scale(1);opacity:1}}.presentation-container .presentation-card .profile-picture .close-btn{position:absolute;top:-10px;right:2px;color:#fff;font-size:34px;cursor:pointer}.presentation-container .presentation-card .profile-picture img{width:100px;height:100px;border-radius:50%;border:2px solid var(--brand-1);margin-bottom:1rem;object-fit:cover}.presentation-container .presentation-card .info{width:100%;padding:0 20px}.presentation-container .presentation-card .info h2{font-size:var(--font-size-large);font-weight:bold;font-family:var(--font-family-title);line-height:var(--font-size-large);color:var(--white);text-align:center}.presentation-container .presentation-card .info p{font-size:var(--font-size-normal);color:var(--white);margin:5px 0 15px;text-align:center;line-height:var(--font-size-normal)}.presentation-container .presentation-card .info .contact-info{list-style:none;padding:0;margin:1rem 0}.presentation-container .presentation-card .info .contact-info li{font-size:var(--font-size-normal);color:var(--white);margin-bottom:1rem;display:flex;align-items:center}.presentation-container .presentation-card .info .contact-info li i{margin-right:.8rem;color:var(--brand-1)}.presentation-container .presentation-card .info .contact-info li a{color:var(--white);text-decoration:none}.presentation-container .presentation-card .info .contact-info li a:hover{text-decoration:underline}.presentation-container .presentation-card .info .skills{display:flex;gap:.5rem;margin:1rem 0}.presentation-container .presentation-card .info .skills span{background-color:var(--brand-1);padding:.2rem .5rem;border-radius:5px;font-size:var(--font-size-normal);color:var(--bg-1)}.presentation-container .presentation-card .info .download-cv{display:inline-block;background-color:var(--white);color:var(--bg-1);padding:.5rem 1rem;border-radius:15px;text-decoration:none;margin-top:1rem;transition:background-color .3s ease}.presentation-container .presentation-card .info .download-cv i{margin-left:.5rem;color:var(--bg-1)}.presentation-container .presentation-card .info .download-cv:hover{background-color:var(--brand-1);color:var(--white)}.presentation-container .presentation-card .info .download-cv:hover i{color:var(--white)}.presentation-container .welcome-card{max-width:500px;color:var(--white);margin:0 auto}.presentation-container .welcome-card h1{font-size:4.5rem;font-weight:bold;font-family:var(--font-family-title);line-height:1.2;margin-bottom:4.5rem}.presentation-container .welcome-card h1 span:nth-child(1){margin-left:-1.8rem}.presentation-container .welcome-card h1 span{color:var(--brand-1);font-size:var(--font-size-medium)}.presentation-container .welcome-card h1 .name{font-size:4.5rem;color:var(--brand-1)}.presentation-container .welcome-card p{font-size:var(--font-size-large);font-family:var(--font-family-details);line-height:1.5;font-weight:500;color:var(--white);margin-bottom:2rem}.presentation-container .welcome-card p span{color:var(--brand-1);font-size:var(--font-size-normal);margin-left:-1.5rem}.presentation-container .welcome-card h2{font-size:var(--font-size-large);font-family:var(--font-family-title);line-height:1.2;font-weight:bold;color:var(--brand-1);display:flex;align-items:center;gap:10px}.presentation-container .welcome-card h2 .tooltip{visibility:hidden;width:120px;background-color:var(--white);color:var(--bg-2);font-size:var(--font-size-small);font-weight:bold;text-align:center;border-radius:5px;padding:5px;position:absolute;z-index:50;margin-left:30px;opacity:0;transition:opacity .3s;overflow:hidden}.presentation-container .welcome-card h2 a:hover .tooltip{visibility:visible;opacity:1}.presentation-container .welcome-card h2 i{font-size:1.2rem;color:var(--white);background:var(--grey);padding:5px;border-radius:100%;transition:color .5s ease}.presentation-container .welcome-card h2 i:hover{color:var(--brand-1)}.presentation-container .experience-card{max-width:164px;color:var(--white);background:var(--bg-2);border-radius:50px;padding:2rem;margin:0 auto}.presentation-container .experience-card .experience p{font-size:var(--font-size-normal);font-family:var(--font-family-details);line-height:1.5;font-weight:500;color:var(--white);margin-bottom:2rem;display:flex;align-items:center;gap:10px}.presentation-container .experience-card .experience p span{color:var(--brand-1);font-size:3rem}@media(max-width: 1024px){.presentation-container{grid-template-columns:auto auto;grid-template-rows:auto auto;max-width:550px}.presentation-container .presentation-card{grid-column:1/-1;margin-bottom:7rem;gap:0}.presentation-container .welcome-card{width:350px;grid-column:1/2}.presentation-container .welcome-card h1{font-size:2rem}.presentation-container .welcome-card h1 span{font-size:var(--font-size-medium)}.presentation-container .welcome-card h1 .name{font-size:2rem;color:var(--brand-1)}.presentation-container .welcome-card p{font-size:var(--font-size-large)}.presentation-container .welcome-card p span{font-size:var(--font-size-normal)}.presentation-container .experience-card{grid-column:2/3}}@media(max-width: 768px){.presentation-container{max-width:400px;grid-template-columns:auto auto}.presentation-container .welcome-card{width:300px;grid-column:1/2;margin-bottom:70px}.presentation-container .welcome-card h1{font-size:var(--font-size-medium)}.presentation-container .welcome-card h1 span{font-size:var(--font-size-medium)}.presentation-container .welcome-card h1 .name{font-size:var(--font-size-medium);color:var(--brand-1)}.presentation-container .welcome-card p{font-size:var(--font-size-medium)}.presentation-container .welcome-card p span{font-size:var(--font-size-normal)}.presentation-container .welcome-card h2{display:none}.presentation-container .presentation-card,.presentation-container .welcome-card,.presentation-container .experience-card{grid-column:1/-1}}.about-me-container{width:100%;padding:50px 0;background-image:url("../images/about-me-bg.svg");background-position:center;background-repeat:no-repeat;background-size:cover}.about-me-container .about-me-card{max-width:var(--max-width);margin:0 auto;padding:30px 0;display:flex;justify-content:space-between;align-items:center}.about-me-container .about-me-card .about-me-info{max-width:650px;padding:0 20px}.about-me-container .about-me-card .about-me-info h2{font-size:var(--font-size-large);font-weight:bold;font-family:var(--font-family-title);line-height:var(--font-size-large);color:var(--white);display:inline-block;border:3px solid var(--brand-1);padding:15px 25px;border-radius:30px 0 30px 0;background:var(--bg-2);margin-bottom:35px}.about-me-container .about-me-card .about-me-info .p{font-size:var(--font-size-medium);color:var(--brand-2);line-height:var(--font-size-medium);margin-bottom:35px}.about-me-container .about-me-card .about-me-info p{font-size:var(--font-size-large);color:var(--white);line-height:1.5;font-family:var(--font-family-body);padding:8px 20px}.about-me-container .about-me-card .about-me-info p span{color:var(--brand-1);font-size:var(--font-size-large);line-height:var(--font-size-large);font-family:var(--font-family-details)}.about-me-container .about-me-card figure{width:100%;max-width:400px;margin:0 auto}.about-me-container .about-me-card figure img{width:100%;max-width:100%;border-radius:20px;object-fit:cover}@media(max-width: 768px){.about-me-container .about-me-container{width:100%;height:850px}.about-me-container .about-me-card{flex-direction:column}.about-me-container .about-me-card .about-me-info{max-width:100%}.about-me-container .about-me-card figure{width:280px;max-width:320px;margin-top:50px;height:auto}.about-me-container .about-me-card figure img{width:100%}}.skills-container{position:relative;margin:0;width:100%;padding:100px 0;overflow:hidden}.skills-container::before{content:"";position:absolute;top:0;left:0;right:0;bottom:0;background-image:url("../images/programacion-web-laravel.webp");background-position:center;background-repeat:no-repeat;background-size:cover;filter:blur(5px);z-index:-1;opacity:.7}.skills-container .skills-card{max-width:750px;margin:0 auto;padding:30px 0;display:flex;justify-content:space-evenly;align-items:center}.skills-container .skills-card .skills-info{max-width:450px;background:var(--grey);padding:30px;border-radius:10px;border-left:4px solid var(--brand-1)}.skills-container .skills-card .skills-info h3{font-size:var(--font-size-large);font-weight:bold;font-family:var(--font-family-title);line-height:var(--font-size-large);color:var(--white);text-align:center;align-items:center}.skills-container .skills-card .skills-info ul li{color:var(--white);font-size:var(--font-size-medium);line-height:var(--font-size-medium);margin:15px 0;font-weight:600}.skills-container .skills-card .skills-info ul li i{font-size:var(--font-size-medium);font-weight:600;margin-right:6px}.skills-container .skills-card .skills-info .languages li:nth-child(1) i{color:var(--php)}.skills-container .skills-card .skills-info .languages li:nth-child(2) i{color:var(--js)}.skills-container .skills-card .skills-info .languages li:nth-child(3) i{color:var(--mysql)}.skills-container .skills-card .skills-info .frameworks li:nth-child(1) i{color:var(--laravel)}.skills-container .skills-card .skills-info .frameworks li:nth-child(2) i{color:var(--blade)}.skills-container .skills-card .skills-info .frameworks li:nth-child(3) i{color:var(--codeigniter)}@media(max-width: 768px){.skills-container .skills-card{flex-direction:column;gap:70px}}.projects-container{padding:4rem 1rem;position:relative}.projects-container::before{content:"";position:absolute;inset:0;background:url("../../assets/images/project-bg.jpg") center/cover no-repeat;opacity:.15;z-index:-1}.projects-container .project-details{margin-top:1.5rem;padding-left:1.5rem;list-style:none}.projects-container .project-details li{position:relative;padding-left:2.2rem;margin-bottom:1rem;font-size:1.4rem;line-height:1.6;color:#98faec;transition:transform .3s ease}.projects-container .project-details li::before{content:"⚡";position:absolute;left:0;top:0;color:#12f7d6;font-size:1.6rem;text-shadow:0 0 8px #12f7d6}.projects-container .project-details li strong{color:#12f7d6;font-weight:600;text-shadow:0 0 6px #12f7d6}.projects-container .project-details li:hover{transform:translateX(5px);color:#fff}.projects-grid{display:grid;grid-template-columns:repeat(auto-fit, minmax(300px, 1fr));gap:2rem;max-width:var(--max-width);margin:0 auto}.project-card{background:var(--bg-transparent);border-radius:10px;overflow:hidden;transition:transform .3s ease,box-shadow .3s ease;border:1px solid hsla(0,0%,100%,.08);backdrop-filter:blur(6px);box-shadow:0 0 0 rgba(18,247,214,0)}.project-card:hover{transform:translateY(-8px);box-shadow:0 0 15px rgba(18,247,214,.4)}.project-image{height:200px;overflow:hidden;position:relative}.project-image img{width:100%;height:100%;object-fit:cover;transition:transform .5s ease}.project-image::after{content:"";position:absolute;inset:0;background:linear-gradient(to bottom, transparent 40%, rgba(0, 0, 0, 0.7) 100%)}.project-card:hover .project-image img{transform:scale(1.05)}.project-content{padding:1.6rem}.project-content h3{color:var(--brand-1);margin-bottom:.8rem;font-size:var(--font-size-medium);font-family:var(--font-title);letter-spacing:.5px}.project-content p{color:var(--brand-2);margin-bottom:1.2rem;font-size:var(--font-size-small);line-height:1.6}.project-links{display:flex;gap:1rem;flex-wrap:wrap;margin-top:35px}.project-links a{display:inline-block;padding:.6rem 1.4rem;border-radius:4px;font-size:var(--font-size-small);font-family:var(--font-details);transition:var(--transition)}.project-links a:first-child{background:var(--brand-1);color:var(--bg-2);font-weight:600}.project-links a:first-child:hover{background:rgb(67.3346938776,248.6653061224,222.5346938776);transform:translateY(-2px)}.project-links a:last-child{background:var(--grey);color:var(--white)}.project-links a:last-child:hover{background:hsl(228,6.9444444444%,38.2352941176%);transform:translateY(-2px)}.blog-container{width:90%;max-width:var(--max-width);margin:0 auto;padding:100px 0}.blog-container .blog-card{display:flex;align-items:flex-start;background-color:var(--bg-1);border:1px solid var(--grey);border-right:none;border-left:none;padding:30px 0;max-width:1200px;transition:transform .3s ease-in-out}.blog-container .blog-image img{width:250px;height:150px;margin-right:20px;object-fit:cover}.blog-container .blog-content{margin-left:20px;max-width:800px}.blog-container .blog-title{font-size:var(--font-size-large);font-family:var(--font-title);color:var(--brand-1);margin-bottom:10px}.blog-container .blog-description{font-size:var(--font-size-medium);color:var(--white);margin-bottom:15px}.blog-container .blog-meta{display:flex;gap:15px;font-size:var(--font-size-small);color:var(--grey);font-family:var(--font-details)}.blog-container .blog-meta span{padding:5px 10px;border-radius:5px}.blog-container .blog-tag{background-color:var(--grey);color:var(--white)}@media(max-width: 768px){.blog-container .blog-card{flex-direction:column}.blog-container .blog-card .blog-image{margin:0 auto 30px}.blog-container .blog-card .blog-image img{max-width:100%;height:150px;margin:0}.blog-container .blog-meta{display:flex;gap:5px;color:var(--grey);font-family:var(--font-details)}.blog-container .blog-meta span{padding:5px 4px;border-radius:5px;font-size:1rem}.blog-container .blog-content{margin-left:0;max-width:100%}}.blog-container .btn-container{display:flex;justify-content:center;align-items:center;margin:14px 0;gap:14px}.blog-container .btn-container a{display:contents}.blog-container .btn-container .subscribe-container{margin-top:50px}.blog-container .btn-container .subscribe-container h3{font-size:var(--font-size-medium);font-family:var(--font-title);color:var(--brand-1)}.blog-container .btn-container .subscribe-label{display:flex;justify-content:center;align-items:center;overflow:hidden}.blog-container .btn-container .subscribe-label input{width:200px;padding:12px 40px 12px 20px;border:none;border-radius:24px;background:var(--bg-2);margin-right:-35px;outline:none;color:var(--white);font-size:var(--font-size-normal);font-family:var(--font-body);line-height:var(--font-size-medium)}.read-more{display:inline-block;color:var(--brand-1);font-size:var(--font-size-medium);font-family:var(--font-body);text-decoration:none;margin-bottom:20px}.read-more:hover{text-decoration:underline}.content-post{width:90%;max-width:700px;margin:0 auto;padding:80px 0;font-family:"Inter",sans-serif;color:var(--white)}.content-post h1{font-family:"Poppins",sans-serif;color:var(--brand-1);font-size:clamp(1.8rem,3vw,2.5rem);font-weight:800;text-align:center;padding:15px 0;text-shadow:0 0 10px rgba(0,255,200,.25)}.content-post .post-container{background:rgba(20,20,20,.3);backdrop-filter:blur(8px);border-radius:16px;box-shadow:0 0 15px rgba(0,255,200,.05);padding:20px}.content-post .post-container .post-info{display:flex;justify-content:space-between;align-items:center;border-top:1px solid rgba(0,255,200,.2);border-bottom:1px solid rgba(0,255,200,.2);padding:12px 0;font-size:.9rem}.content-post .post-container .post-info .share{cursor:pointer}.content-post .post-container .post-info .share i{color:var(--brand-1);font-size:1.4rem;transition:transform .3s ease,color .3s ease}.content-post .post-container .post-info .share i:hover{color:var(--white);transform:rotate(10deg) scale(1.3);text-shadow:0 0 8px var(--brand-1)}.content-post .post-container .content-image{width:100%;margin:20px 0;border-radius:10px;overflow:hidden;box-shadow:0 0 15px rgba(0,255,200,.08)}.content-post .post-container .content-image img{width:100%;display:block;object-fit:cover;transition:transform .6s ease}.content-post .post-container .content-image:hover img{transform:scale(1.05)}.content-post .post-container .content-text{padding:15px 0;line-height:1.7}.content-post .post-container .content-text h3{font-family:"Poppins",sans-serif;font-size:2rem;color:var(--brand-1);margin-top:20px;text-shadow:0 0 10px rgba(0,255,200,.15)}.content-post .post-container .content-text p{font-size:1.6rem;font-weight:400;line-height:2.8rem;color:var(--white);opacity:.85;margin-top:10px}.background-color{background-color:var(--bg-2)}.background-color .contact-container{max-width:var(--max-width);margin:0 auto;padding:100px 0}.background-color .contact-container .contact-card h2{text-align:center;color:var(--white);font-size:var(--font-size-large);font-weight:bold;font-family:var(--font-family-title);line-height:2.4rem;padding:15px 35px;border:2px solid var(--brand-1);border-radius:30px 0 30px 0;max-width:240px;margin:50px auto}.background-color .contact-container .contact-card form{max-width:750px;margin:0 auto;padding:30px 0}.background-color .contact-container .contact-card form div{display:flex;justify-content:space-between;gap:25px}.background-color .contact-container .contact-card form div label{width:100%;color:var(--brand-1);font-size:var(--font-size-medium);font-weight:bold;font-family:var(--font-family-title);line-height:1.5rem;margin-bottom:18px;display:flex;flex-direction:column;justify-content:center}.background-color .contact-container .contact-card form div label input{width:100%;height:45px;margin-top:10px;font-size:var(--font-size-medium);color:var(--white);font-weight:bold;outline:none;background:var(--bg-2);border:none;border-bottom:2px solid var(--brand-1)}.background-color .contact-container .contact-card form .message{width:100%;color:var(--brand-1);font-size:var(--font-size-medium);font-weight:bold;font-family:var(--font-title);line-height:1.5rem;display:flex;flex-direction:column;justify-content:center;margin:24px 0}.background-color .contact-container .contact-card form .message textarea{margin-top:8px;width:100%;min-height:120px;font-size:var(--font-size-normal);color:var(--white);font-weight:400;outline:none;background:rgba(0,0,0,0);border:none;border-bottom:2px solid var(--brand-1);padding:8px 0;resize:none;transition:border-color .3s ease}.background-color .contact-container .contact-card form .message textarea::placeholder{color:hsla(0,0%,100%,.6);font-style:italic;font-weight:300;opacity:.8}.background-color .contact-container .contact-card form .message textarea:focus::placeholder{opacity:.5}.background-color .contact-container .contact-card form .message textarea:focus{border-bottom:2px solid var(--brand-2)}@media(max-width: 768px){.background-color .contact-container .contact-card form{flex-direction:column;width:90%;margin:0 auto}.background-color .contact-container .contact-card form div{flex-direction:column}.background-color .contact-container .contact-card form .message textarea{height:40px}}.footer-container{width:100%;padding:15px 0;border-top:2px solid var(--bg-1);background-color:var(--bg-2);color:var(--white);text-align:center;display:flex;justify-content:space-around;align-items:center}.footer-container .nav-icons{display:flex;justify-content:center;gap:15px}.footer-container .nav-icons a i{font-size:var(--font-size-large);color:var(--brand-1);transition:var(--transition)}.footer-container .nav-icons a i:hover{color:var(--white)}.footer-container .footer-text{display:flex;justify-content:space-between;flex-direction:row-reverse;gap:15px}.footer-container .footer-text p{font-size:var(--font-size-normal);color:var(--white);text-align:center;line-height:1.5}.footer-container .footer-text p a{transition:var(--transition)}.footer-container .footer-text p a:hover{color:var(--brand-1)}@media(max-width: 768px){.footer-container{flex-direction:column;gap:20px}.footer-container .footer-text{flex-direction:column;gap:10px;padding:0 8px}}.main-components{width:80%;height:auto;margin:100px auto 0 auto}.main-components .container-component{width:100%;height:auto;padding:24px;margin:24px 0;border-radius:8px;background-color:var(--bg-2)}.main-components .container-component h1{font-family:var(--font-title);font-size:var(--font-size-large);font-weight:600;color:var(--white);margin-bottom:24px}.btn{display:flex;align-items:center;border-radius:24px;border:none;padding:9px 18px;font-family:var(--font-details);font-size:var(--font-size-normal);font-weight:600;cursor:pointer;margin:8px 0;transition:all .5s ease}.btn svg{margin-right:8px}.btn.btn-primary{background-color:var(--brand-1);border:2px solid var(--brand-1);color:var(--bg-1);position:relative;overflow:hidden}.btn.btn-primary:hover{color:var(--dg-1);box-shadow:0 0 5px var(--brand-1),0 0 10px var(--brand-1),0 0 15px var(--brand-2);border:2px solid var(--brand-2)}.btn i{margin-left:4px;color:var(--bg-1);transition:var(--transition)}.btn:hover i{color:var(--white)}.btn.btn-secondary{background-color:var(--bg-1);border:2px solid var(--brand-1);color:var(--brand-1);position:relative;overflow:hidden}.btn.btn-secondary:hover{color:var(--white);background-color:var(--brand-1);box-shadow:0 0 5px var(--brand-1),0 0 10px var(--brand-1),0 0 15px var(--brand-2);border:2px solid var(--brand-2)}.btn.btn-secondary::after{content:"";position:absolute;top:0;left:0;right:0;bottom:0;background:rgba(18,247,214,.3);opacity:0}.btn.btn-secondary:hover::after{opacity:1}.btn.btn-secondary svg{margin-right:8px}.btn.btn-info{background-color:var(--white);border:2px solid var(--bg-1);color:var(--bg-1);position:relative;overflow:hidden}.btn.btn-info:hover{color:var(--white);background-color:var(--grey);box-shadow:0 0 5px var(--brand-2),0 0 10px var(--brand-2),0 0 15px var(--brand-2);border:2px solid var(--brand-2)}.btn.btn-info::after{content:"";position:absolute;top:0;left:0;right:0;bottom:0;background:rgba(18,247,214,.3);opacity:0}.btn.btn-info:hover::after{opacity:1}.btn.btn-info svg{margin-right:8px}.btn-center{margin:0 auto}.section-title{text-align:center;color:var(--white);padding:20px}.section-title .mouse-icon{position:relative;width:24px;height:40px;border:3px solid var(--brand-1);border-radius:12px;margin:0 auto;bottom:15px}.section-title .mouse-icon .scroll-wheel{width:4px;height:6px;background-color:var(--brand-1);border-radius:10px;margin:4px auto;position:relative;top:8px}.section-title .dashed-line{position:relative;left:50%;transform:translateX(-50%);width:2px;height:50px;border-left:2px dashed var(--brand-1)}.section-title .dashed-diamond{position:relative;left:50%;transform:translateX(-50%) rotate(45deg);width:3px;height:3px;border:4px solid var(--brand-1);top:7px}.section-title h2{font-size:2.5rem;font-weight:bold;color:var(--brand-1);margin:15px 0 5px}.section-title .underline-left{display:inline-block;width:7px;height:7px;background-color:var(--brand-1);margin:0 auto 8px;border-radius:100%}.section-title .underline{display:inline-block;width:170px;height:3px;background-color:var(--brand-1);margin:0 auto 10px;border-radius:5px;margin-left:-7px}.section-title .underline-right{display:inline-block;width:7px;height:7px;background-color:var(--brand-1);margin:0 auto 8px;border-radius:100%;margin-left:-7px}.section-title p{font-size:var(--font-size-normal);color:var(--white)}