:root{--color-primary: #0a1f3c;--color-secondary: #6cc3c7;--color-secondary-hover: #5baab0;--color-gradient-start: #0a1f3c;--color-gradient-end: #1a475f;--color-text: #333;--color-text-light: #fff;--color-background: #f9f9f9;--color-background-alt: #f1f1f1;--color-card: #fff;--color-positive: #28a745;--color-negative: #dc3545;--color-border: #eee;--shadow-card: 0 2px 10px rgba(0,0,0,.1);--shadow-menu: 0 8px 16px rgba(0,0,0,.2);--space-xs: 5px;--space-sm: 10px;--space-md: 15px;--space-lg: 20px;--space-xl: 30px;--space-xxl: 40px;--space-section: 60px;--space-hero: 80px;--font-size-base: 1rem;--font-size-sm: .9rem;--font-size-md: 1.2rem;--font-size-lg: 1.8rem;--font-size-xl: 2rem;--font-size-xxl: 2.5rem;--radius-sm: 5px;--radius-md: 10px;--container-width: 1100px;--transition-default: .3s ease}*{margin:0;padding:0;box-sizing:border-box;font-family:Inter,sans-serif}body{line-height:1.6;color:var(--color-text);background-color:var(--color-background)}a{text-decoration:none;color:inherit}.container{max-width:var(--container-width);margin:0 auto;padding:0 var(--space-lg)}header{background-color:var(--color-primary);color:var(--color-text-light);padding:var(--space-lg) 0}header .container{display:flex;justify-content:space-between;align-items:center}.header-left{display:flex;align-items:center}footer{background-color:var(--color-primary);color:var(--color-text-light);text-align:center;padding:var(--space-lg) 0}.btn{padding:var(--space-sm) var(--space-lg);border-radius:var(--radius-sm);font-weight:700;transition:background var(--transition-default);display:inline-block}.btn-primary{background-color:var(--color-secondary);color:#000}.btn-primary:hover{background-color:var(--color-secondary-hover)}nav{display:flex;justify-content:flex-end;align-items:center;gap:var(--space-lg)}nav a{color:var(--color-text-light)}header h1{font-size:var(--font-size-lg);margin-right:var(--space-md)}.features-list-content{max-width:var(--container-width);margin:0 auto;padding:var(--space-xl) 0}.features-list-title{font-size:var(--font-size-xl);color:var(--color-primary);margin-bottom:var(--space-lg);text-align:center}.features-list-items{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:var(--space-md);list-style:none;padding:0}.features-list-item{background:var(--color-card);padding:var(--space-md);padding-left:var(--space-xxl);border-radius:var(--radius-md);box-shadow:var(--shadow-card);position:relative}.features-list-item:before{content:"✓";position:absolute;left:var(--space-lg);color:var(--color-positive);width:var(--space-md);text-align:center}.terms-definitions{margin:var(--space-md) 0}.terms-definitions p{margin-bottom:var(--space-sm);padding-left:0}.privacy-content h4{margin:var(--space-lg) 0 var(--space-sm)}.future-features-content{max-width:var(--container-width);margin:0 auto;padding:var(--space-xl) 0}.future-features-title{font-size:var(--font-size-xl);color:var(--color-primary);margin-bottom:var(--space-lg);text-align:center}.future-features-items{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:var(--space-md);list-style:none;padding:0}.future-features-item{background:var(--color-card);padding:var(--space-md);padding-left:var(--space-xxl);border-radius:var(--radius-md);box-shadow:var(--shadow-card);position:relative}.future-features-item:before{content:"🕒";position:absolute;left:var(--space-lg);color:var(--color-primary);font-size:var(--font-size-md);text-align:center}.feature,.testimonial{background-color:var(--color-card);padding:var(--space-xl);border-radius:var(--radius-md);box-shadow:var(--shadow-card);transition:transform var(--transition-default)}.feature:hover{transform:translateY(-5px)}input{width:100%;padding:12px;border:1px solid #ccc;border-radius:var(--radius-sm);font-size:var(--font-size-base)}.table-container{overflow-x:auto;margin:0 auto;max-width:100%}table{width:100%;border-collapse:collapse;margin:0 auto;background-color:var(--color-card);box-shadow:var(--shadow-card);border-radius:var(--radius-md);overflow:hidden}th,td{padding:var(--space-md);text-align:left;border-bottom:1px solid var(--color-border)}th{background-color:var(--color-primary);color:var(--color-text-light);font-weight:700}tr:hover{background-color:#f5f5f5}.positive{color:var(--color-positive);font-weight:700}.negative{color:var(--color-negative);font-weight:700}.footer-links{margin-top:var(--space-sm);font-size:var(--font-size-sm)}.footer-links a{color:#fffc;text-decoration:none;transition:all var(--transition-default);font-weight:500}.footer-links a:hover{color:var(--color-secondary);text-decoration:underline;opacity:1}.menu-toggle{position:relative;display:inline-block;margin-left:var(--space-lg)}#menu-button{background-color:var(--color-secondary);color:#000;border:none;padding:8px 15px;border-radius:var(--radius-sm);cursor:pointer;font-weight:700;transition:background-color var(--transition-default)}#menu-button:hover{background-color:var(--color-secondary-hover)}.optional-menu{display:none;position:absolute;background-color:var(--color-card);min-width:160px;box-shadow:var(--shadow-menu);z-index:1;border-radius:var(--radius-sm);overflow:hidden}.optional-menu a{color:var(--color-text);padding:12px 16px;text-decoration:none;display:block;transition:background-color var(--transition-default)}.optional-menu a:hover{background-color:var(--color-background-alt)}.show{display:block}.hero-login,.hero-reset{background:linear-gradient(to right,var(--color-gradient-start),var(--color-gradient-end));padding:var(--space-xl) 0;color:var(--color-text-light)}.hero-login h2,.hero-reset h2{font-size:var(--font-size-xxl);margin-bottom:var(--space-sm)}.hero-login p,.hero-reset p{font-size:var(--font-size-md);margin-bottom:var(--space-xl)}.hero-registration{background:var(--color-primary);padding:var(--space-xl) 0;color:var(--color-text-light)}.hero-registration h2{font-size:var(--font-size-xxl)}.hero-registration p{font-size:var(--font-size-md)}section{padding:var(--space-section) var(--space-lg);text-align:center}.about-section{background-color:var(--color-background-alt);padding:var(--space-section) var(--space-lg)}.about-content{max-width:var(--container-width);margin:0 auto}.about-title{font-size:var(--font-size-xxl);color:var(--color-primary);margin-bottom:var(--space-xl)}.about-text{max-width:800px;margin:0 auto;text-align:left;line-height:1.6}.about-lead{font-size:var(--font-size-md);margin-bottom:var(--space-md);color:var(--color-text)}.hero{background:linear-gradient(to right,var(--color-gradient-start),var(--color-gradient-end));color:var(--color-text-light)}.hero h2{font-size:var(--font-size-xxl);margin-bottom:var(--space-sm)}.hero p{font-size:var(--font-size-md);margin-bottom:var(--space-xl)}.screenshot-gallery{background-color:var(--color-background-alt);padding:var(--space-section) var(--space-lg)}.gallery-title{font-size:var(--font-size-xl);color:var(--color-primary);margin-bottom:var(--space-sm);text-align:center}.gallery-intro{text-align:center;margin-bottom:var(--space-xl);max-width:600px;margin-left:auto;margin-right:auto}.carousel{position:relative;max-width:500px;margin:0 auto;overflow:hidden}.carousel-inner{display:flex;transition:transform .5s ease}.carousel-item{min-width:100%;padding:0 20px;box-sizing:border-box}.carousel-item img{width:100%;height:auto;max-height:400px;object-fit:contain;cursor:pointer;border-radius:var(--radius-sm);transition:transform .3s ease}.carousel-item img:hover{transform:scale(1.02)}.carousel-controls{position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:none;z-index:10}.carousel-control{position:absolute;top:50%;transform:translateY(-50%);background:#00000080;color:#fff;border:none;padding:10px 15px;cursor:pointer;border-radius:50%;font-size:1.5rem;pointer-events:auto}.carousel-control.prev{left:0;margin-left:10px}.carousel-control.next{right:0;margin-right:10px}.carousel-touch-area{position:absolute;top:0;width:25%;height:100%;z-index:5}.carousel-touch-area.prev{left:0}.carousel-touch-area.next{right:0}.carousel-indicators{display:flex;justify-content:center;margin-top:20px;gap:10px}.carousel-indicators span{width:12px;height:12px;border-radius:50%;background:#ccc;cursor:pointer}.carousel-indicators span.active{background:var(--color-primary)}.lightbox{display:none;position:fixed;top:0;left:0;width:100%;height:100%;background:#000c;z-index:100;justify-content:center;align-items:center}.lightbox-content{max-width:90%;max-height:90%}.close-lightbox{position:absolute;top:20px;right:30px;color:#fff;font-size:35px;font-weight:700;cursor:pointer}.features h3{font-size:var(--font-size-xl);margin-bottom:var(--space-xxl)}.feature-grid{display:flex;flex-wrap:wrap;justify-content:space-between;gap:var(--space-lg)}.feature{flex:1 1 300px;min-height:auto;display:flex;flex-direction:column;padding:var(--space-md);background:var(--color-card);border-radius:var(--radius-md);box-shadow:var(--shadow-card)}.feature p{flex-grow:1}.feature h4{margin-bottom:var(--space-sm);color:var(--color-primary)}.testimonials{background-color:var(--color-background-alt)}.testimonials h3{font-size:var(--font-size-xl);margin-bottom:var(--space-xxl)}.testimonial{margin-bottom:var(--space-lg)}.data{background-color:var(--color-background)}.data h3{font-size:var(--font-size-xl);margin-bottom:var(--space-xxl)}.get-trackself{text-align:center;padding:var(--space-section) var(--space-lg);background-color:var(--color-background-alt)}.get-trackself-title{font-size:var(--font-size-xl);color:var(--color-primary);margin-bottom:var(--space-sm)}.get-trackself-intro{margin-bottom:var(--space-xl)}.store-buttons{display:flex;justify-content:center;align-items:center;gap:var(--space-xl);flex-wrap:wrap}.store-button{display:inline-block;transition:transform var(--transition-default)}.store-button:hover{transform:scale(1.05)}.store-button img{height:60px;width:auto}.cta-section{background:linear-gradient(135deg,var(--color-gradient-start) 0%,var(--color-gradient-end) 100%);color:var(--color-text-light);padding:var(--space-section) var(--space-lg);text-align:center}.cta-box{max-width:var(--container-width);margin:0 auto}.cta-title{font-size:var(--font-size-xxl);margin-bottom:var(--space-lg);font-weight:600}.cta-text{font-size:var(--font-size-md);margin-bottom:var(--space-xl);max-width:700px;margin-left:auto;margin-right:auto}.cta-button{margin-top:var(--space-md)}.pricing-section{background-color:var(--color-background-alt);padding:var(--space-section) var(--space-lg)}.pricing-title{font-size:var(--font-size-xxl);color:var(--color-primary);margin-bottom:var(--space-md);text-align:center}.pricing-intro{font-size:var(--font-size-md);text-align:center;max-width:800px;margin:0 auto var(--space-xl)}.pricing-grid{display:flex;flex-wrap:wrap;justify-content:center;gap:var(--space-lg);margin-bottom:var(--space-xxl)}.pricing-card{flex:0 1 330px;min-width:300px}.pricing-card{background:var(--color-card);padding:var(--space-xl);border-radius:var(--radius-md);box-shadow:var(--shadow-card);position:relative;display:flex;flex-direction:column}.pricing-divider{display:flex;align-items:center;justify-content:center;gap:var(--space-md);margin:var(--space-xl) 0;color:var(--color-primary)}.divider-line{flex:1;height:1px;background-color:var(--color-text);opacity:.2}.divider-text{padding:0 var(--space-md)}.pricing-card.free-tier{padding:var(--space-lg);max-width:450px;margin:0 auto}.pricing-card.free-tier .features-list li{padding-left:var(--space-lg)}.pricing-card.free-tier .ideal-for{margin:var(--space-sm) 0;padding:var(--space-sm) 0;background:none;border-top:1px solid var(--color-border);border-bottom:1px solid var(--color-border)}.pricing-card.featured{border:2px solid var(--color-secondary)}.featured-badge{position:absolute;top:-10px;right:20px;background:var(--color-secondary);color:var(--color-primary);padding:var(--space-xs) var(--space-sm);border-radius:var(--radius-sm);font-weight:700;font-size:var(--font-size-sm)}.pricing-card h3{font-size:var(--font-size-lg);color:var(--color-primary);margin-bottom:var(--space-sm)}.price{font-size:var(--font-size-xxl);font-weight:700;margin:var(--space-md) 0;color:var(--color-primary)}.price span{font-size:var(--font-size-md);font-weight:400}.features-list{margin:var(--space-md) 0;flex-grow:1}.features-list{list-style:none;padding-left:0}.features-list li{margin-bottom:var(--space-sm);position:relative;padding-left:var(--space-xl)}.features-list li:before{content:"✓";position:absolute;left:0;color:var(--color-positive)}.ideal-for{font-size:var(--font-size-sm);margin:var(--space-md) 0;padding:var(--space-sm);background-color:var(--color-background-alt);border-radius:var(--radius-sm)}.why-trackself{background:var(--color-card);padding:var(--space-xl);border-radius:var(--radius-md);margin-bottom:var(--space-xl)}.why-trackself h3{font-size:var(--font-size-lg);color:var(--color-primary);margin-bottom:var(--space-md);text-align:center}.why-list{max-width:800px;margin:0 auto;list-style:none;padding-left:0}.why-list li{margin-bottom:var(--space-sm);position:relative;padding-left:var(--space-xl)}.pricing-footer{text-align:center;background:var(--color-card);padding:var(--space-xl);border-radius:var(--radius-md);margin-top:var(--space-xl)}.pricing-footer h3{font-size:var(--font-size-lg);color:var(--color-primary);margin-bottom:var(--space-md)}a.contact-us{color:var(--color-secondary);font-weight:700;text-decoration:none;border-bottom:2px solid var(--color-secondary);transition:all var(--transition-default)}a.contact-us:hover{color:var(--color-secondary-hover);border-bottom-color:var(--color-secondary-hover)}.contact-section{background:linear-gradient(to right,var(--color-gradient-start),var(--color-gradient-end));padding:var(--space-xl) 0;text-align:center;color:var(--color-text-light)}.contact-section h3{font-size:var(--font-size-lg);color:var(--color-text-light);margin-bottom:var(--space-sm)}.contact-us{color:var(--color-secondary);font-weight:700;text-decoration:none;border-bottom:2px solid var(--color-secondary);transition:all var(--transition-default)}.contact-us:hover{color:var(--color-secondary-hover);border-bottom-color:var(--color-secondary-hover)}.privacy-section{background-color:var(--color-background-alt);padding:var(--space-section) var(--space-lg)}.privacy-title{font-size:var(--font-size-xxl);color:var(--color-primary);margin-bottom:var(--space-xl);text-align:center}.privacy-content{max-width:var(--container-width);margin:0 auto;text-align:left;line-height:1.6}.privacy-content h3{font-size:var(--font-size-lg);color:var(--color-primary);margin:var(--space-xl) 0 var(--space-md)}.error-section{padding:var(--space-section) var(--space-lg);text-align:center}.error-content{max-width:600px;margin:0 auto}.error-logo{width:100px;height:auto;margin-bottom:var(--space-xl)}.error-links{display:flex;gap:var(--space-md);justify-content:center;margin-top:var(--space-xl)}.btn-secondary{background-color:var(--color-primary);color:var(--color-text-light)}.btn-secondary:hover{background-color:var(--color-secondary);color:var(--color-primary)}.signup{background:var(--color-background-alt);padding:var(--space-xxl) var(--space-section);text-align:center}.signup-container{background:var(--color-card);padding:var(--space-xl);border-radius:var(--radius-md);box-shadow:var(--shadow-card);max-width:500px;margin:0 auto}.signup h3{font-size:var(--font-size-xxl);margin-bottom:var(--space-xl);font-weight:600;color:var(--color-primary)}.signup-form{display:flex;flex-direction:column;gap:var(--space-md)}.signup-form .form-group{width:100%}.signup-form input{padding:var(--space-md);border-radius:var(--radius-sm);border:1px solid var(--color-border);width:100%;max-width:400px;margin:0 auto}.signup button{width:100%;max-width:400px;margin:0 auto;padding:var(--space-md) var(--space-xl);font-size:var(--font-size-md);font-weight:600;background-color:var(--color-secondary);color:var(--color-primary);border:none;border-radius:var(--radius-sm);cursor:pointer;transition:var(--transition-default)}.signup button:hover{background-color:var(--color-secondary-hover);transform:translateY(-2px)}.verification-form{margin-top:var(--space-xl)}.signup-container{position:relative;z-index:1}.signup-footer{text-align:center;margin-top:var(--space-md);font-size:var(--font-size-sm)}.login-container,.reset-container{background:var(--color-card);padding:var(--space-xl);border-radius:var(--radius-md);box-shadow:var(--shadow-card);max-width:500px;margin:0 auto;position:relative;z-index:1}.login-footer,.reset-footer{text-align:center;margin-top:var(--space-md);font-size:var(--font-size-sm)}.login-form h3,.reset-form h3{font-size:var(--font-size-xxl);margin-bottom:var(--space-xl);font-weight:600;color:var(--color-primary);text-align:center}.login-form,.reset-form{display:flex;flex-direction:column;gap:var(--space-md)}.login-form .form-group,.reset-form .form-group{width:100%}.login-form input,.reset-form input{padding:var(--space-md);border-radius:var(--radius-sm);border:1px solid var(--color-border);width:100%;max-width:400px;margin:0 auto}.login-form button,.reset-form button{width:100%;max-width:400px;margin:0 auto;padding:var(--space-md) var(--space-xl);font-size:var(--font-size-md);font-weight:600;background-color:var(--color-secondary);color:var(--color-primary);border:none;border-radius:var(--radius-sm);cursor:pointer;transition:var(--transition-default)}.login-form button:hover,.reset-form button:hover{background-color:var(--color-secondary-hover);transform:translateY(-2px)}.login-form,.reset-form,.registration-form,.verification-form{max-width:500px;margin:0 auto}.form-group{margin-bottom:15px}.form-group input{width:100%;padding:10px;border:1px solid #ddd;border-radius:4px}.form-message{margin:15px 0;padding:10px;border-radius:4px}.form-message.error{background-color:#ffebee;color:#c62828}.form-message.success{background-color:#e8f5e9;color:#2e7d32}.form-message.info{background-color:#e3f2fd;color:#1565c0}@media (max-width: 768px){.feature-grid{flex-direction:column;gap:var(--space-md)}.feature{flex:1 1 auto}header .container{flex-direction:column;align-items:center}.hero h2,.about-title,.cta-title,.signup h3{font-size:var(--font-size-xl)}.header-left{margin-bottom:var(--space-md);flex-direction:column;align-items:center}header h1{margin-right:0;margin-bottom:var(--space-md)}nav{margin-top:var(--space-lg);flex-wrap:wrap;justify-content:center}.menu-toggle{margin:var(--space-sm) 0}table{font-size:var(--font-size-sm)}th,td{padding:var(--space-sm)}section{padding:var(--space-xl) var(--space-md)}.about-section,.cta-section,.signup{padding:var(--space-xl) var(--space-md)}.about-title,.cta-title,.signup h3,.about-text,.cta-text,.signup p{margin-bottom:var(--space-lg)}}