:root{--primary-color:#1976D2;--secondary-color:#4FC3F7;--text-color:#333;--white:#fff}*{margin:0;padding:0;box-sizing:border-box}body{font-family:'Arial',sans-serif;color:var(--white);line-height:1.6;overflow-x:hidden;background:linear-gradient(135deg,var(--primary-color),var(--secondary-color));animation:animateBackground 10s infinite alternate}@keyframes animateBackground{0%{background-position:0% 50%}100%{background-position:100% 50%}}.section{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:20px;width:100%}.container{width:90%;max-width:1200px;margin:0 auto;overflow:hidden}.hero{background:#fff0}.hero-content{display:flex;align-items:center;justify-content:space-between;gap:40px;width:100%}.mockup-container{max-width:400px;width:100%}.mockup{width:100%;height:auto;border-radius:10px}.app-info{max-width:500px;text-align:center;width:100%}.app-logo{width:80px;height:auto;margin-bottom:20px}.app-name{width:100%;max-width:300px;height:auto;margin-bottom:20px}.hero p{font-size:1.1rem;margin-bottom:20px}.cta-buttons{display:flex;gap:20px;justify-content:center;width:100%}.cta-buttons .btn{background:#fff0;border:none;padding:0;cursor:pointer;transition:transform 0.3s ease}.cta-buttons .btn img{width:180px;height:auto}.cta-buttons .btn:hover{transform:translateY(-5px)}.feature{background:#fff0}.feature .container{display:flex;align-items:center;justify-content:space-between;gap:40px;width:100%}.feature-info{max-width:500px;width:100%}.feature h2{font-size:2rem;margin-bottom:20px}.feature p{font-size:1.1rem;color:var(--white)}header{background:var(--primary-color);padding:20px 0;position:sticky;top:0;z-index:1000}header .container{display:flex;justify-content:space-between;align-items:center}header .logo img{width:50px;height:auto}header .nav-links{list-style:none;display:flex;gap:20px;margin:0;padding:0}header .nav-links a{color:var(--white);text-decoration:none;font-size:1rem;transition:opacity 0.3s ease}header .nav-links a:hover{opacity:.8}@media (min-width:769px){.feature:nth-child(odd) .container{flex-direction:row-reverse}}@media (max-width:768px){.hero-content{flex-direction:column;text-align:center}.mockup-container{order:2;margin-top:40px}.app-info{order:1}.cta-buttons{flex-direction:column;align-items:center}.feature .container{flex-direction:column;text-align:center}.mockup-container{max-width:100%}.app-name{max-width:250px}header .nav-links{gap:15px}header .logo img{width:40px}}@media (max-width:480px){.app-name{max-width:200px}.cta-buttons .btn img{width:150px}header .nav-links{gap:10px}header .nav-links a{font-size:.9rem}}