*{box-sizing:border-box;scroll-behavior:smooth;transition:all ease 1s}.skies{background:#024;background-color:#012;background-color:#1b264f;background-color:#036;background-color:#f60;color:#fff;color:#fc0;color:#d0e1f9;color:#00a2e8}body{font-family:Arial,sans-serif;margin:0;padding:0}section{padding:3rem 1rem;background-color:#f9f9f9}h1,h2,h3,h4,h5,h6{margin:0;color:#333}h3{font-size:1.8rem}p{font-size:1rem;color:#555;line-height:1.6}strong{font-weight:700}header{background:#333;padding:1rem;display:flex;justify-content:space-between;align-items:center}.logo-container{display:flex;align-items:center}.logo{width:40px;height:auto;margin-right:1rem}.name{font-size:1.5rem;color:#fff}nav{display:flex;justify-content:space-between;align-items:center;width:100%}nav ul{display:flex;justify-content:center;list-style:none;padding:0;margin:0}nav ul li{margin-right:2rem}nav ul li:last-child{margin-right:0}a{color:#fff;text-decoration:none;font-size:1.1rem;transition:color .3s ease}nav a:hover{color:#00d1b2;text-decoration:underline}.nav-links{display:none}.nav-links.active{display:flex;flex-direction:column;align-items:center;justify-content:center;position:absolute;height:100vh;top:0;left:0;right:0;background-color:#333;padding:1rem 0;z-index:900}.nav-links.active li{margin-right:0;margin-bottom:4rem}.nav-links li:last-child{margin-bottom:0}.nav-links.active a{font-size:2rem}.hamburger{display:flex;flex-direction:column;justify-content:space-between;align-items:center;height:25px;width:30px;cursor:pointer;z-index:999}.hamburger .line{width:100%;height:4px;background-color:#fff;transition:all .3s ease}.hamburger.active .line:nth-child(1){transform:rotate(45deg);position:relative;top:9px}.hamburger.active .line:nth-child(2){opacity:0}.hamburger.active .line:nth-child(3){transform:rotate(-45deg);position:relative;top:-12px}.footer{background-color:#333;color:#fff;padding:2rem 1rem;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2rem;text-align:center}.site-map ul{list-style:none;display:flex;flex-direction:row;gap:1rem;padding:0;margin:auto}.site-map li{margin:auto}.social-links{display:flex;gap:2rem}.social-icon{font-size:2rem;color:#fff}.copyright{font-size:.875rem}#hero{background:url(/assets/images/flo-bodysurfing-maui.jpg) no-repeat center center/cover;background-position:95% center;height:100vh;display:flex;justify-content:center;align-items:center;color:#fff;text-align:center;padding:0 2rem;overflow:hidden;position:relative}#hero:after{content:"";background:#0006;top:0;left:0;height:100%;width:100%;position:absolute;z-index:1}.hero-content{max-width:90%;padding:0;border-radius:8px;z-index:2;text-align:left}.hero-content h1{color:#fff;margin-bottom:1rem}.hero-content p{color:#fff;margin-bottom:1.5rem}.cta-btn{display:inline-block;background-color:#00d1b2;padding:.8rem 1.5rem;margin-top:1rem;color:#fff;text-decoration:none;border-radius:4px;font-size:1.1rem;font-weight:bolder;transition:background-color .2s}.cta-btn:hover{background-color:#fff;color:#00d1b2}section{display:flex;justify-content:center;align-items:center}.section-container{width:100%}.section-container a:has(.cta-btn),.section-container .cta-btn{width:100%}.about-container ul{margin-bottom:1.5rem}.about-container ul li{font-size:1.1rem;color:#555;margin-bottom:.5rem}.projects-container{display:flex;flex-direction:column;align-items:center;width:100%}.projects-container h2{margin-bottom:1.5rem;width:100%;text-align:left}.projects-container .cta-btn{text-align:center}.projects-container .cta-btn:hover{color:#fff;background-color:#1aab9e}.projects-container .project-cards{display:flex;flex-direction:row;flex-wrap:wrap;justify-content:center;gap:20px;margin-bottom:1.5rem;width:100%}.projects-container .project-card{width:300px;gap:20px;transition:border .3s ease;transition:transform .3s ease}#break-1{background:url(/assets/images/sandy-beach-panorama.jpg);background-position:center;background-size:cover;background-repeat:no-repeat;height:200px;position:relative;text-align:center;padding:0}#break-1 div{display:flex;align-items:center;justify-content:center;height:100%;width:100%;background-color:#0009}#break-1 h2{font-size:1.5rem;color:#fff}#skills,#collaboration{background-color:#fff}.about-page{padding:0;background-color:#f9f9f9;margin-bottom:2rem;max-width:1200px;margin:0 auto}.about-page h1{margin-bottom:1.5rem;text-align:center}.about-page h2{font-size:2.5rem;color:#333;margin-bottom:1rem;text-align:center}.about-page p{margin-bottom:1.5rem}.about-page strong{font-weight:700;color:#00d1b2}.about-page p+p{border-top:1px solid #ddd;padding-top:1.5rem}.about-page p:last-child{margin-bottom:0}.about-page img{display:block;width:100%;max-width:600px;margin:auto;margin-bottom:1.5rem;border-radius:4px}.projects h1{margin-bottom:1.5rem}.projects-page-project-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:20px;width:100%}.project-card{background:#fff;border-radius:8px;box-shadow:0 4px 10px #0000001a;padding:1rem;transition:box-shadow .3s ease;transition:transform .3s ease;height:100%;width:100%!important;max-width:500px;margin:auto}.project-card:hover{transform:translateY(-10px);box-shadow:0 0 10px #1aab9e}.project-card img{width:100%;max-width:500px;border-radius:8px;margin:auto}.project-card h2{font-size:1.5rem;color:#333;margin:.5rem auto}.project-card p{font-size:.8rem;color:#666;margin:.5rem auto}.project-card a{color:#00d1b2;text-decoration:none;font-weight:700}.project-details{max-width:1200px;margin:0 auto;background-color:#fff;border-radius:8px;flex-direction:column}.project-details h1{margin-bottom:1.5rem;text-align:center}.project-details h3{margin-bottom:1.2rem;text-align:center}.project-details .main-image{width:100%;height:auto;border-radius:8px;box-shadow:0 4px 10px #0000001a;margin-top:2rem}.project-details p{line-height:1.7;margin-bottom:1.5rem}.project-details .tech-stack{background:#f9f9f9;padding:1rem;border-radius:8px;box-shadow:0 4px 10px #0000001a;margin-bottom:2rem}.project-details .tech-stack p{color:#16a085;font-weight:700;text-align:center;margin:0}.project-details .features h3,.project-details .features{color:#fff}.project-details .features{background:#16a085;padding:1rem;border-radius:8px;box-shadow:0 4px 10px #0000001a;display:flex;flex-direction:column;margin-bottom:2rem}.project-details .features ul{font-size:.9rem;list-style:none;line-height:1.4rem;margin:0 auto;text-align:left;padding:0;display:flex;flex-direction:column;gap:.75rem}.project-details .features li{padding:0;display:flex;align-items:center;justify-content:flex-start;text-align:left;word-break:break-word}.project-details .project-links{display:flex;flex-direction:row;flex-wrap:wrap;justify-content:space-around;margin-bottom:2rem;gap:1rem}.project-details .project-links a{padding:1rem 2rem;background-color:#00d1b2;color:#fff;text-decoration:none;font-size:1.2rem;border-radius:5px;text-align:center;transition:background-color .3s ease}.project-details .project-links a:hover{background-color:#1aab9e}.project-details .screenshots{display:grid;gap:1.5rem;margin-top:3rem;justify-content:center}.project-details .screenshots:has(img:only-child){display:flex;justify-content:center}.project-details .screenshots img{width:100%;height:auto;border-radius:8px;box-shadow:0 4px 10px #0000001a}.contact-section{max-width:1200px;margin:0 auto;padding:50px 20px;text-align:center;background-color:#f8f8f8;border-radius:8px;box-shadow:0 4px 10px #0000001a;margin-bottom:2rem;transition:all .3s ease}.contact-section h1{font-size:2.5erm;margin-bottom:1.5rem;font-weight:700}.contact-section p{font-weight:500}form{box-sizing:border-box;display:flex;flex-direction:column;max-width:800px;margin:0 auto;background-color:#fff;padding:3rem;border-radius:8px;box-shadow:0 4px 10px #0000001a}.contact-info{box-sizing:border-box;display:flex;text-align:left;margin-bottom:2rem;gap:2rem}.contact-info_logo{border-radius:20%;margin:auto;height:auto;width:300px}.form-group{width:100%;display:flex;flex-direction:column;align-items:flex-start}label{font-weight:700;margin-bottom:5px;font-size:1rem;color:#333}form input,form textarea{box-sizing:border-box;width:100%;padding:1rem;margin-bottom:1.5rem;border:1px solid #ccc;border-radius:4px;font-size:1rem;transition:border-color .3s ease}textarea{height:200px;resize:vertical}form input:focus,form textarea:focus{border-color:#00d1b2;outline:none}form button{background-color:#00d1b2;padding:1rem 2rem;border:none;color:#fff;font-size:1.1rem;border-radius:4px;cursor:pointer;transition:background-color .3s ease;font-weight:700}form button:hover{background-color:#1aab9e}form textarea{font-family:Arial,sans-serif}.thank-you-message{font-size:1.2rem;font-weight:500;color:#333}@media (max-width: 768px){.contact-section{padding:30px 15px}form{width:100%;padding:1.5rem}.contact-info{flex-direction:column}.contact-info_logo{display:none}form input,form textarea{width:100%}form button{width:100%;font-size:1.1rem}}@media (min-width: 769px){section{padding:3rem 1rem}h1{font-size:3rem}h2{font-size:2rem}p,li{font-size:1.2rem}header{padding:1rem 3rem}.logo{width:50px}nav ul{display:flex}.nav-links{display:flex;gap:2rem}.name{font-size:1.8rem}.hamburger{display:none}.footer{padding:3rem}.site-map ul{gap:3rem}#hero{height:80vh;background-position:right}.hero-content{max-width:600px;padding:2rem}.cta-btn{padding:.8rem 2rem}.section-container{max-width:1200px}.projects-container .project-cards{flex-direction:row}#break-1{height:300px}#break-1 h2{font-size:3rem}.about-page{padding:4rem 2rem}.projects{display:block;width:100%}.project-card{margin-bottom:2rem;padding:1.5rem;max-width:350px}.project-card h2{margin:1rem auto}.project-card p{font-size:1.1rem;margin:1rem auto}.project-details .screenshots:not(:has(img:only-child)){grid-template-columns:repeat(auto-fit,minmax(350px,1fr));margin-left:auto;margin-right:auto}.project-details .features{padding:1rem 2rem 2rem}.project-details .features ul{font-size:1.2rem;line-height:1.6rem}}