* {margin: 0;box-sizing: border-box;}html {scroll-behavior: smooth;}#about, #skills, #services, #projects, #contact {scroll-margin-top: 80px;}header {width: 100%;height: min(100dvh, 100svh);position: relative;z-index: 1;}header::before {content: "";position: absolute;top: 0;left: 0;width: 100%;height: 100svh;background-image: url("/assets/banner_jt_compressed.webp");background-size: cover;background-repeat: no-repeat;background-position: center;filter: brightness(0.7);z-index: 0;}header>* {position: relative;z-index: 2;}header nav {font-family: "Raleway";font-size: 20px;font-weight: 600;display: flex;justify-content: space-between;align-items: center;padding: 30px 60px;}header nav>img {height: 30px;width: auto;}header nav>ul {display: flex;gap: 80px;}header nav>ul>li {list-style: none;}header nav>ul>li>a {text-decoration: none;color: #ffffff;text-shadow: 0 3px 6px rgba(0, 0, 0, 0.4), 0 0 10px rgba(0, 0, 0, 0.2);}header nav .burger-menu {display: none;background-color: transparent;border: none;}header nav .burger-menu>img {height: 30px;width: auto;cursor: pointer;}header .mobile-nav {position: fixed;top: 0;right: -100%;width: 60%;height: 100dvh;background-color: #ffffff;backdrop-filter: blur(6px);transition: right 0.3s ease;z-index: 3000;display: flex;flex-direction: column;gap: 60px;padding: 20px 0 0 40px;}header .mobile-nav .burger-menu {background-color: transparent;border: none;width: fit-content;}header .mobile-nav .burger-menu>img {height: 30px;width: auto;cursor: pointer;}header .mobile-nav .nav-group {display: flex;flex-direction: column;gap: 30px;}header .mobile-nav .nav-group a {color: #333333;text-decoration: none;font-size: 24px;font-family: "Raleway";font-weight: 600;}header .mobile-nav .nav-links {display: flex;gap: 60px;}header .mobile-nav .nav-links a img {height: 40px;width: auto;}header .mobile-nav>a>img {height: 40px;width: auto;}header .mobile-nav.open {right: 0;}header .header-content {position: absolute;top: 50%;left: 50%;transform: translate(-50%, -50%);text-align: center;display: flex;flex-direction: column;align-items: center;gap: clamp(40px, 10vh, 100px);padding: 0 20px;width: 100%;}header .header-content h1 {font-family: "Monda";font-weight: bold;font-size: clamp(32px, 10vw, 72px);color: #ffffff;margin: 0;}header .header-content h2 {font-family: "Raleway";font-weight: 600;font-size: clamp(24px, 6vw, 48px);color: #ffffff;margin: 0;}header .header-content h2>span {color: #8860d0;}header .header-content p {font-family: "Raleway";font-size: clamp(16px, 5vw, 28px);color: #ffffff;font-weight: 600;margin: 0;}header .header-content h1, header .header-content h2, header .header-content p {text-shadow: 0 3px 6px rgba(0, 0, 0, 0.4), 0 0 10px rgba(0, 0, 0, 0.2);}h1, h2, h3, h4, p, label, button {margin: 0;}h2, h3 {font-family: "Monda";color: #333333;text-align: center;}p, label, button {font-family: "Raleway";}.main-home {display: flex;flex-direction: column;align-items: center;}.main-home section {max-width: 1440px;width: 100%;}.main-home section h2 {font-weight: bold;font-size: 48px;margin-top: 60px;margin-bottom: 40px;}.main-home section>h3 {font-size: 28px;margin: 0 0 40px 0;}.about-section {display: flex;flex-direction: column;width: 100%;align-items: center;justify-content: space-between;padding: 0 20px;}.about-content {display: flex;justify-content: space-evenly;width: 100%;gap: 30px;}.picture-btn {display: flex;flex-direction: column;align-items: center;gap: 20px;}.picture-btn>img {max-width: 280px;width: 100%;height: auto;border-radius: 10px;}.picture-btn input {background-color: #8860D0;border: none;width: 100%;height: 50px;color: #fff;border-radius: 10px;font-family: "Inter";font-size: 18px;cursor: pointer;}.about-content p {font-size: 17px;max-width: 620px;}.about-content p span {font-weight: 600;}.about-section blockquote {font-family: "Monda";font-size: 32px;margin: 60px;}.about-section blockquote>p {font-family: "Monda";font-weight: 700;font-size: 28px;margin-bottom: 0;margin-top: 28px;}.skills-section {background-color: #F7F7F7;display: flex;flex-direction: column;justify-content: space-between;width: 100%;}.skills-section h2 {margin-bottom: 0;}.skills-section h3 {font-size: 28px;margin-bottom: 40px;}.skills-section h3 span {color: #8860D0;}.skills {display: flex;flex-direction: column;}.skills-block {display: flex;flex-wrap: wrap;justify-content: center;gap: 60px;padding: 0 10px;margin-bottom: 60px;}.skills-block .group {display: flex;flex-direction: column;align-items: center;}.skills-block .group>img {width: auto;max-width: 60px;height: 60px;}.skills-block .group>p {font-size: 18px;margin: 18px 0 18px 0;}.projects-section {width: 100%;display: flex;flex-direction: column;align-items: center;margin-bottom: 100px;padding: 0 20px;}.projects-section .project-section-title {margin: 40px 0 40px 0;}.cards-grid {display: grid;grid-template-columns: repeat(2, 1fr);gap: 60px;align-items: center;justify-content: center;width: fit-content;}.card {background-color: #F5F5F5;max-width: 600px;width: 100%;max-height: 305px;height: auto;box-shadow: 0 -4px 4px rgba(0, 0, 0, 0.05), -4px 0 4px rgba(0, 0, 0, 0.05), 4px 0 4px rgba(0, 0, 0, 0.05), 0 4px 4px rgba(0, 0, 0, 0.05);position: relative;overflow: hidden;transition: transform 0.3s ease;border-radius: 6px;cursor: pointer;border: none;padding: 0;}.card .cover {display: block;object-fit: cover;width: 100%;height: 100%;}.card::after {content: "";position: absolute;top: 0;left: 0;width: 100%;height: 100%;background-color: rgba(0, 0, 0, 0);transition: background-color 0.3s ease;pointer-events: none;}.card:hover::after {background-color: rgba(0, 0, 0, 0.2);}body.modal-open {overflow: hidden;}body.modal-open .scroll-top-btn {z-index: 0;}.modal-overlay {position: fixed;top: 0;left: 0;width: 100vw;height: 100dvh;background-color: rgba(0, 0, 0, 0.5);display: flex;justify-content: flex-end;align-items: center;z-index: 1000;opacity: 0;animation: fadeIn 0.3s forwards;}@keyframes fadeIn {to {opacity: 1;}}.modal-content {background-color: #FAFAFA;width: 80vw;max-width: 800px;height: 100dvh;padding: 30px;box-shadow: -5px 0 20px rgba(0, 0, 0, 0.2);position: relative;transform: translateX(100%);animation: slideIn 0.3s forwards;overflow-y: auto;}.modal-content .modal-close {position: absolute;top: 15px;right: 20px;font-size: 42px;background: none;border: none;cursor: pointer;color: #8860D0;}.modal-content .title-link {display: flex;justify-content: space-between;align-items: center;margin: 40px 0;}.modal-content .title-link .project-title {font-family: "Raleway";font-size: 28px;font-weight: 700;}.modal-content .title-link>p {font-family: "Raleway";font-size: 16px;gap: 5px;}.modal-content .title-link>p>a {color: #252525;text-decoration-line: underline;}.modal-content .technology-list {margin: 20px 0 0 0;padding: 0;display: flex;gap: 10px;flex-wrap: wrap;}.modal-content .technology-list>li {list-style: none;font-family: "Raleway";font-size: 16px;font-weight: 600;margin-bottom: 5px;margin-top: 0;border-style: solid;border-width: 1px;border-color: #8860D0;color: #8860D0;width: fit-content;padding: 5px 10px;border-radius: 10px;cursor: default;}.modal-content .technology-list>li:hover {background-color: #8860D0;color: #FFFFFF;border-color: #8860D0;}.modal-content .description-title {font-family: "Raleway";font-size: 24px;font-weight: 700;width: 100%;height: 45px;color: #333333;display: flex;align-items: center;margin: 24px 0 0 0;}.modal-content .text {font-family: "Raleway";color: #333333;font-size: 18px;margin-top: 0;}.modal-content .second-title {font-family: "Raleway";font-size: 24px;font-weight: 700;margin-top: 50px;}.modal-content .formation {display: flex;gap: 10px;width: fit-content;justify-content: flex-end;align-items: center;margin-top: 24px;}.modal-content .formation p {font-family: "Raleway";font-size: 14px;}.modal-content .formation img {width: 24px;height: 24px;}@keyframes slideIn {to {transform: translateX(0);}}.carrousel {width: 100%;max-width: 700px;max-height: 300px;height: auto;border-radius: 25px;position: relative;display: flex;justify-content: center;align-items: center;flex-direction: row;overflow: hidden;border-style: solid;border-width: 1px;margin: auto;}.carrousel .slide {object-fit: contain;width: 100%;height: 100%;transition: transform 0.2s ease-in-out;}.carrousel button img {height: 40px;width: 27px;}.carrousel .image-counter {position: absolute;bottom: 10px;left: 50%;transform: translateX(-50%);color: white;font-size: 34px;font-weight: 500;text-shadow: 0px 0px 5px rgba(0, 0, 0, 0.7);padding: 5px 10px;border-radius: 5px;}.carrousel .previous, .carrousel .next {position: absolute;background-color: transparent;height: 80px;border: none;cursor: pointer;}.carrousel .previous {left: 10px;}.carrousel .next {right: 10px;}.services-section {background-color: #F7F7F7;display: flex;flex-direction: column;justify-content: space-evenly;width: 100%;padding: 0 20px;}.services-cards {display: grid;grid-template-columns: repeat(3, 1fr);gap: 60px;justify-content: space-evenly;align-items: center;margin: auto;}.services-section>p {font-size: 24px;text-align: center;margin: 60px;}.services-section p span {color: #8860D0;font-weight: 700;}.services-section>p img {vertical-align: -10px;}.service-card {max-width: 304px;height: 325px;display: flex;flex-direction: column;align-items: center;padding: 20px;border-radius: 6px;border-style: solid;border-width: thin;box-shadow: 6px 6px 0 rgba(0, 0, 0, 0.20), 0 4px 10px rgba(0, 0, 0, 0.08);background-color: #FFFFFF;transition: all 0.45s ease;}.service-card:hover {background-color: #8860D0;color: #FFFFFF;border-color: #8860D0;}.service-card:hover h3 {filter: brightness(0) invert(1);}.service-card:hover>img {filter: brightness(0) invert(1);}.service-card>img {height: 80px;width: auto;}.service-card>h3 {font-family: "Monda";font-size: 28px;text-align: center;margin: 28px 0 0 0;line-height: 30px;color: #333333;}.service-card>p {font-family: "Raleway";font-size: 18px;font-weight: 500;text-align: center;margin-top: 20px;margin-bottom: 0;}.contact-section {display: flex;flex-direction: column;align-items: center;padding: 0 20px;}.contact-section>p {font-size: 24px;text-align: center;}.contact-section p span {color: #8860D0;font-weight: 700;}.contact-container {display: flex;flex-direction: column;justify-content: center;align-items: center;gap: 60px;width: 100%;margin-top: 50px;}.contact-container form {display: flex;flex-direction: column;max-width: 470px;width: 100%;background-color: #F7F7F7;padding: 20px;border-radius: 10px;}.contact-container form label {font-size: 18px;font-weight: 600;}.contact-container form input, .contact-container form textarea {margin-bottom: 30px;background-color: transparent;border: none;border-bottom: 1px solid #333;font-size: 17px;font-family: "Raleway" }.contact-container form input {height: 40px;}.contact-container form textarea {height: 200px;}.contact-container form button {font-size: 20px;font-weight: 700;height: 45px;background-color: #8860D0;color: #fff;display: flex;align-items: center;justify-content: center;border-radius: 5px;cursor: pointer;border: none;}.contact-container form>p {font-size: 14px;color: #333;margin-top: 10px;}.contact-container p {font-size: 24px;}.scroll-top-btn {border: 2px solid #333;border-radius: 100%;background-color: transparent;position: fixed;bottom: 30px;right: 30px;cursor: pointer;z-index: 1000;}.scroll-top-btn img {width: 20px;height: 25px;filter: invert(0%);transition: filter 0.3s ease;padding-top: 3px;}.scroll-top-btn.over-footer {border: 0.5px solid white;}.scroll-top-btn.over-footer img {filter: invert(100%);}.scroll-btn.hidden {display: none;}footer {width: 100%;height: auto;background-color: #252525;padding: 40px;display: flex;flex-direction: column;align-items: center;gap: 20px;margin-top: 60px;}footer .links-organization {display: flex;align-items: center;justify-content: center;gap: 100px;}footer .links-organization .links {display: flex;gap: 30px;}footer .links-organization .links>a>img {width: 40px;height: 40px;}footer .links-organization .organization {display: flex;flex-direction: column;gap: 5px;}footer .links-organization .organization>p {font-family: "Raleway";color: #FAFAFA;margin: 0;}footer .links-organization .organization .footer-info {display: flex;justify-content: flex-start;align-items: center;gap: 20px;}footer .links-organization .organization .footer-info>img {width: 20px;height: 20px;}footer .links-organization .organization .footer-info>p {color: #FAFAFA;font-family: "Raleway";margin: 0;font-size: 14px;}footer .privacy-btn {background: none;border: none;color: #FAFAFA;cursor: pointer;text-decoration: underline;font-size: 0.95rem;padding: 0;}footer>p {font-family: "Raleway";color: #FAFAFA;margin: 0;font-size: 12px;text-align: center;}footer .privacy-modal-overlay {position: fixed;top: 0;left: 0;width: 100%;height: 100%;background-color: rgba(0, 0, 0, 0.6);display: flex;justify-content: center;align-items: center;z-index: 1000;}footer .privacy-modal-overlay .privacy-modal-content {background-color: #FAFAFA;color: #333333;padding: 2rem;max-width: 50vw;width: 100%;max-height: 80vh;overflow-y: auto;border-radius: 12px;box-shadow: 0 8px 24px rgba(0, 0, 0, 0.3);position: relative;font-family: "Raleway";line-height: 1.5;}footer .privacy-modal-overlay .privacy-modal-content .modal-close {position: absolute;top: 1rem;right: 1rem;background: transparent;border: none;font-size: 2rem;cursor: pointer;color: #333333;font-family: "Raleway";}footer .privacy-modal-overlay .privacy-modal-content h2 {margin-top: 0;margin-bottom: 1rem;font-size: 1.5rem;text-align: left;font-family: "Raleway" }footer .privacy-modal-overlay .privacy-modal-content h3 {margin-top: 1rem;margin-bottom: 0.5rem;font-size: 1.1rem;text-align: left;font-family: "Raleway" }footer .privacy-modal-overlay .privacy-modal-content p {margin-bottom: 1rem;font-size: 0.95rem;text-align: left;font-family: "Raleway" }footer .privacy-modal-overlay .privacy-modal-content a {color: #8860D0;font-weight: 700;}footer .copyright {color: #FAFAFA;font-family: "Raleway";font-weight: 300;font-style: italic;font-size: 12px;margin: 0;}.scroll-top-btn {border-width: 2px;border-radius: 100%;border-color: #333333;border-style: solid;background-color: transparent;position: fixed;bottom: 30px;right: 30px;cursor: pointer;z-index: 1000;}.scroll-top-btn img {width: 20px;height: 25px;filter: invert(0%);transition: filter 0.3s ease;padding-top: 3px;}.scroll-top-btn.over-footer {border: 0.5px solid white;}.scroll-top-btn.over-footer img {filter: invert(100%);}@media (max-width: 1024px) {header nav {padding: 10px 30px;}header nav>ul {gap: 50px;}section h2 {font-size: 32px;}section h3, .skills-section h3 {font-size: 24px;}.skills-block .group>img {max-height: 60px;}.services-cards {gap: 30px;}.service-card>img {height: 60px;}.contact-container {gap: 60px;}footer .privacy-modal-overlay .privacy-modal-content {max-width: 80vw;}}@media (max-width: 768px) {header nav {font-size: 17px;padding: 20px;}header nav>ul {display: none;}header nav .burger-menu {display: flex;}header .header-content {width: 80%;}header .mobile-nav {display: flex;}.main-home section h2 {font-weight: bold;font-size: 32px;margin-top: 60px;margin-bottom: 40px;}.about-content {flex-direction: column;}.picture-btn>input {max-width: 280px;}.about-content>p {max-width: 100%;}.about-section blockquote {margin: 30px 0 60px 0;font-size: 26px }.about-section blockquote>p {font-size: 26px }.skills-block {gap: 40px;}.cards-grid {grid-template-columns: 1fr;gap: 40px;}.services-cards {grid-template-columns: 1fr;}.service-card {height: 250px;max-width: 400px;}.service-card h3 {font-size: 24px;}.modal-overlay .modal-content {width: 90%;}footer .links-organization {flex-direction: column;gap: 30px;}footer .links-organization .organization {align-items: center;}footer>p {max-width: 500px;}}@media (max-width: 425px) {header .header-content {width: 100%;gap: 60px;}header .mobile-nav {width: 100%;}.main-home section h2 {font-weight: bold;font-size: 32px;margin: 30px 0;}.about-section blockquote {font-size: 24px;margin: 30px 0;}.about-section blockquote>p {font-size: 24px }.skills-section h3 {margin-bottom: 30px }.skills-block {gap: 20px;margin-bottom: 30px }.skills-block .group>img {max-width: 40px;height: 40px;}.cards-grid {margin-bottom: 30px;}.projects-section {margin-bottom: 30px;}.projects-section .project-section-title {margin: 30px 0;}.services-section>p {margin: 30px;}.service-card>img {height: 50px;}.contact-section>p {margin: 0 }.contact-container {gap: 30px;margin-top: 30px }.modal-overlay .modal-content {width: 100%;padding: 20px;}.modal-overlay .modal-content .title-link {margin: 50px 0;}footer {margin-top: 30px;}footer .privacy-modal-overlay .privacy-modal-content {max-width: 100vw;max-height: 100dvh;}}@media (max-width: 375px) {.service-card {height: 280px;}}