 {} *{} {} #IE-warning { display: none; position: fixed; width: 100%; height: 100%; z-index: 9999; background: white; } .IE-warning-message { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); text-align: center; } /* ================================ CRITICAL CSS - ABOVE THE FOLD ================================ */ *,*::before,*::after{margin:0;padding:0;box-sizing:border-box}:root{--primary:#2B7A78;--secondary:#FF6B6B;--accent:#FFD93D;--dark:#2D3142;--light:#F4F4F9;--success:#6BCF7F;--warning:#FFA726;--grad-primary:linear-gradient(135deg,#2B7A78,#1f5f5d);--grad-secondary:linear-gradient(135deg,#FF6B6B,#ff5252);--grad-accent:linear-gradient(135deg,#FFD93D,#ffc107);--font-primary:'Poppins',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;--font-secondary:'Open Sans',Arial,sans-serif;--space-xs:.5rem;--space-sm:1rem;--space-md:1.5rem;--space-lg:2.5rem;--space-xl:4rem;--shadow-sm:0 2px 8px rgba(0,0,0,.08);--shadow-md:0 4px 16px rgba(0,0,0,.12);--shadow-lg:0 8px 32px rgba(0,0,0,.16);--shadow-glow:0 0 30px rgba(255,217,61,.3);--radius-sm:8px;--radius-md:12px;--radius-lg:20px;--radius-full:50px;--transition-fast:.2s ease;--transition-base:.3s ease;--transition-slow:.5s ease}html{font-size:16px;scroll-behavior:smooth;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}body{font-family:var(--font-secondary);font-size:1rem;line-height:1.6;color:var(--dark);background:#fff;overflow-x:hidden;margin:0}h1,h2,h3,h4,h5,h6{font-family:var(--font-primary);font-weight:700;line-height:1.2;margin-bottom:var(--space-sm);color:var(--dark)}h1{font-size:clamp(2.25rem,5vw,4rem)}h2{font-size:clamp(1.875rem,4vw,3rem)}h3{font-size:clamp(1.5rem,3vw,2.25rem)}h4{font-size:clamp(1.25rem,2.5vw,1.75rem)}h5{font-size:1.125rem}h6{font-size:1rem}p{margin-bottom:var(--space-sm);font-size:clamp(1rem,2vw,1.125rem);line-height:1.7}em{font-style:italic;color:var(--primary);font-weight:600}strong{font-weight:700;color:var(--dark)}.container{width:100%;max-width:1200px;margin:0 auto;padding:0 var(--space-sm)}.row{display:flex;flex-wrap:wrap;margin:0 calc(var(--space-sm)*-.5);align-items:center}.col{flex:1;padding:0 calc(var(--space-sm)*.5)}.col-12{flex:0 0 100%;max-width:100%}.col-6{flex:0 0 50%;max-width:50%}.col-4{flex:0 0 33.333%;max-width:33.333%} /* ================================ BUTTON SYSTEM - OPTIMIZED ================================ */ .btn{display:inline-flex;flex-direction:column;align-items:center;justify-content:center;font-family:var(--font-primary);font-weight:600;text-align:center;text-decoration:none;cursor:pointer;border:2px solid transparent;padding:1.125rem 2.5rem;border-radius:var(--radius-full);transition:all var(--transition-base);min-height:60px;position:relative;overflow:hidden;box-shadow:var(--shadow-md)}.btn::before{content:'';position:absolute;top:50%;left:50%;width:0;height:0;border-radius:50%;background:rgba(255,255,255,.3);transform:translate(-50%,-50%);transition:width .6s,height .6s}.btn:hover::before{width:400px;height:400px}.btn:hover{transform:translateY(-3px);box-shadow:var(--shadow-lg)}.btn-text{font-size:1.25rem;line-height:1.3;position:relative;z-index:2}.btn-subtext{font-size:.875rem;font-weight:500;margin-top:.25rem;opacity:.95;position:relative;z-index:2}.btn-primary{background:var(--grad-primary);color:#fff}.btn-primary:hover{box-shadow:var(--shadow-lg),var(--shadow-glow)}.btn-secondary{background:var(--grad-secondary);color:#fff}.btn-secondary:hover{box-shadow:var(--shadow-lg),0 0 30px rgba(255,107,107,.4)}.btn-accent{background:var(--grad-accent);color:var(--dark);box-shadow:var(--shadow-md)}.btn-block{display:flex;width:100%} /* ================================ NAVIGATION - MINIMAL ================================ */ .navbar{background:#fff;box-shadow:var(--shadow-sm);position:sticky;top:0;z-index:1000;transition:all var(--transition-base)}.navbar.scrolled{box-shadow:var(--shadow-md)}.navbar-container{display:flex;justify-content:space-between;align-items:center;padding:var(--space-sm) 0}.navbar-brand{font-family:var(--font-primary);font-size:1.25rem;font-weight:700;color:var(--primary);text-decoration:none;display:flex;align-items:center;gap:.5rem}.navbar-brand img{height:36px;width:auto}.navbar-cta{display:flex;align-items:center;gap:var(--space-sm)} /* ================================ HERO SECTION - CRITICAL PATH ================================ */ .hero{background:linear-gradient(135deg,#e8f5f4 0%,#fff 50%,#fff9e6 100%);padding:var(--space-xl) 0 calc(var(--space-xl) + 40px);position:relative;overflow:hidden;text-align:center}.hero::before{content:'';position:absolute;top:-50%;right:-10%;width:700px;height:700px;background:radial-gradient(circle,rgba(43,122,120,.1) 0%,transparent 70%);border-radius:50%;animation:float 20s infinite ease-in-out}.hero::after{content:'';position:absolute;bottom:-50%;left:-10%;width:600px;height:600px;background:radial-gradient(circle,rgba(255,217,61,.12) 0%,transparent 70%);border-radius:50%;animation:float 25s infinite ease-in-out reverse}@keyframes float{0%,100%{transform:translate(0,0) rotate(0)}50%{transform:translate(30px,30px) rotate(10deg)}}.hero-badge{display:inline-block;background:#fff;color:var(--primary);padding:.5rem 1.5rem;border-radius:var(--radius-full);font-weight:600;font-size:.9375rem;box-shadow:var(--shadow-md);margin-bottom:var(--space-md);position:relative;z-index:2;animation:slideInDown .6s ease-out}@keyframes slideInDown{from{opacity:0;transform:translateY(-30px)}to{opacity:1;transform:translateY(0)}}.hero h1{max-width:900px;margin:0 auto var(--space-md);position:relative;z-index:2;animation:fadeInUp .8s ease-out .2s backwards}.highlight-text{background:linear-gradient(135deg,var(--primary),#3d9b98);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;position:relative;display:inline-block}.highlight-text::after{content:'';position:absolute;bottom:-4px;left:0;right:0;height:12px;background:var(--accent);opacity:.4;z-index:-1;border-radius:4px}.logo-container{margin:var(--space-lg) auto;position:relative;z-index:2;animation:fadeIn 1s ease-out .4s backwards}.hero-logo{max-width:500px;width:90vw;height:auto;display:block;margin:0 auto;filter:drop-shadow(var(--shadow-md));transition:transform var(--transition-base)}.hero-logo:hover{transform:scale(1.05)}.hero-subtitle{font-size:clamp(1.125rem,2.5vw,1.5rem);line-height:1.6;color:#555;max-width:800px;margin:0 auto var(--space-lg);position:relative;z-index:2;animation:fadeInUp .8s ease-out .6s backwards}.hero .btn{margin:var(--space-lg) auto;animation:fadeInUp .8s ease-out .8s backwards}.trust-indicators{display:flex;justify-content:center;gap:var(--space-lg);flex-wrap:wrap;margin-top:var(--space-lg);position:relative;z-index:2;animation:fadeInUp .8s ease-out 1s backwards}.trust-item{display:flex;flex-direction:column;align-items:center;gap:.5rem}.trust-icon{font-size:2.5rem;line-height:1}.trust-text{font-weight:600;font-size:.9375rem;color:var(--dark)}.hero-wave{position:absolute;bottom:0;left:0;width:100%;height:40px;background:#fff;clip-path:polygon(0 50%,100% 0,100% 100%,0 100%)}@keyframes fadeInUp{from{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}@keyframes fadeIn{from{opacity:0}to{opacity:1}} /* ================================ DEFERRED CSS - BELOW THE FOLD ================================ */ .vision{padding:var(--space-xl) 0;background:#fff}.vision-content{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-xl);align-items:center}.section-label{display:inline-block;background:linear-gradient(135deg,var(--accent),#ffc107);color:var(--dark);padding:.375rem 1rem;border-radius:var(--radius-full);font-weight:600;font-size:.875rem;text-transform:uppercase;letter-spacing:.5px;margin-bottom:var(--space-md)}.vision-text h2{margin-bottom:var(--space-md)}.lead-text{font-size:1.25rem;color:#555;margin-bottom:var(--space-md);line-height:1.7}.highlight-box{background:linear-gradient(135deg,#e8f5f4,#f0f9ff);border-left:4px solid var(--primary);padding:var(--space-md);border-radius:var(--radius-md);margin:var(--space-md) 0}.highlight-quote{font-size:1.375rem;font-style:italic;font-weight:600;color:var(--primary);margin:0;line-height:1.5}.check-list{list-style:none;padding:0;margin:var(--space-md) 0}.check-list li{padding:.75rem 0;font-size:1.125rem;color:var(--dark);display:flex;align-items:center;gap:.75rem}.check-list li::before{content:'✓';color:var(--success);font-size:1.5rem;font-weight:700}.vision-image{position:relative}.image-frame{position:relative;border-radius:var(--radius-lg);overflow:hidden;box-shadow:var(--shadow-lg);transition:transform var(--transition-base)}.image-frame:hover{transform:translateY(-8px);box-shadow:0 12px 40px rgba(0,0,0,.2)}.image-frame img{width:100%;height:auto;display:block;-webkit-user-select:none;-moz-user-select:none;user-select:none}.image-badge{position:absolute;top:20px;right:20px;background:#fff;color:var(--primary);padding:.5rem 1.25rem;border-radius:var(--radius-full);font-weight:700;font-size:.9375rem;box-shadow:var(--shadow-md)}.features{padding:var(--space-xl) 0;background:var(--light)}.section-header{text-align:center;max-width:800px;margin:0 auto var(--space-lg)}.section-subtitle{font-size:1.25rem;color:#666;margin-top:var(--space-sm)}.features-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:var(--space-lg);margin-top:var(--space-lg)}.feature-card{background:#fff;border-radius:var(--radius-md);padding:var(--space-lg);box-shadow:var(--shadow-sm);transition:all var(--transition-base);text-align:center;position:relative}.feature-card:hover{transform:translateY(-8px);box-shadow:var(--shadow-lg)}.feature-card.featured{border:2px solid var(--primary);background:linear-gradient(135deg,#fff,#e8f5f4)}.featured-badge{position:absolute;top:-12px;left:50%;transform:translateX(-50%);background:var(--grad-secondary);color:#fff;padding:.375rem 1.25rem;border-radius:var(--radius-full);font-weight:700;font-size:.8125rem;text-transform:uppercase;letter-spacing:.5px;box-shadow:var(--shadow-md)}.feature-icon{font-size:4rem;line-height:1;margin-bottom:var(--space-md)}.feature-card h3{margin-bottom:var(--space-sm);color:var(--dark)}.feature-card p{color:#666;line-height:1.7;margin-bottom:var(--space-md)}.feature-stat{display:inline-block;background:var(--primary);color:#fff;padding:.5rem 1.25rem;border-radius:var(--radius-full);font-weight:600;font-size:.875rem;margin-top:var(--space-sm)}.stats-bar{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:var(--space-md);margin-top:var(--space-xl);padding:var(--space-lg);background:#fff;border-radius:var(--radius-md);box-shadow:var(--shadow-md)}.stat-item{text-align:center;padding:var(--space-sm)}.stat-number{font-size:3rem;font-weight:700;color:var(--primary);font-family:var(--font-primary);line-height:1;display:block}.stat-label{font-size:.9375rem;color:#666;margin-top:.5rem;font-weight:500}.testimonials{padding:var(--space-xl) 0;background:#fff}.testimonials-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:var(--space-lg);margin-top:var(--space-lg)}.testimonial-card{background:#fff;border-radius:var(--radius-md);padding:var(--space-lg);box-shadow:var(--shadow-md);position:relative;transition:all var(--transition-base)}.testimonial-card::before{content:'"';position:absolute;top:-20px;left:20px;font-size:6rem;color:var(--accent);opacity:.2;font-family:Georgia,serif;line-height:1}.testimonial-card:hover{transform:translateY(-5px);box-shadow:var(--shadow-lg)}.testimonial-stars{color:var(--accent);font-size:1.25rem;margin-bottom:var(--space-sm);position:relative;z-index:2}.testimonial-text{font-size:1.0625rem;line-height:1.7;color:#555;font-style:italic;margin-bottom:var(--space-md);position:relative;z-index:2}.testimonial-author{font-size:.9375rem;color:#888;position:relative;z-index:2}.testimonial-author strong{color:var(--dark);font-weight:700}.offer{padding:var(--space-xl) 0;background:linear-gradient(135deg,var(--primary),#1f5f5d);color:#fff;position:relative;overflow:hidden}.offer::before{content:'';position:absolute;top:0;left:0;right:0;bottom:0;background:url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cg fill='%23ffffff' fill-opacity='0.05'%3E%3Cpath d='M36 34v-4h-2v4h-4v2h4v4h2v-4h4v-2h-4zm0-30V0h-2v4h-4v2h4v4h2V6h4V4h-4zM6 34v-4H4v4H0v2h4v4h2v-4h4v-2H6zM6 4V0H4v4H0v2h4v4h2V6h4V4H6z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");opacity:.4}.offer .container{position:relative;z-index:2}.offer-box{background:rgba(255,255,255,.1);backdrop-filter:blur(10px);border-radius:var(--radius-lg);padding:var(--space-lg);text-align:center;margin-bottom:var(--space-lg);border:2px solid rgba(255,255,255,.2)}.offer-badge{display:inline-block;background:var(--grad-accent);color:var(--dark);padding:.5rem 1.5rem;border-radius:var(--radius-full);font-weight:700;font-size:.875rem;text-transform:uppercase;letter-spacing:1px;margin-bottom:var(--space-md);animation:pulse 2s infinite}@keyframes pulse{0%,100%{transform:scale(1)}50%{transform:scale(1.05)}}.offer-highlight{font-size:clamp(1.75rem,4vw,2.5rem);font-weight:700;line-height:1.3;margin-bottom:var(--space-md)}.strikethrough{text-decoration:line-through;opacity:.6;margin-right:.5rem}.free-text{color:var(--accent);font-size:1.2em;text-shadow:0 2px 10px rgba(255,217,61,.5)}.offer-timer{margin-top:var(--space-md)}.timer-label{font-size:1rem;margin-bottom:var(--space-sm);opacity:.9}.timer-display{display:flex;justify-content:center;align-items:center;gap:var(--space-sm);font-family:var(--font-primary)}.timer-segment{display:flex;flex-direction:column;align-items:center}.timer-number{font-size:2.5rem;font-weight:700;line-height:1;color:var(--accent)}.timer-unit{font-size:.75rem;text-transform:uppercase;margin-top:.25rem;opacity:.8}.timer-separator{font-size:2rem;font-weight:700;color:#fff}.offer h2{color:#fff;text-align:center;margin-top:var(--space-lg);margin-bottom:var(--space-sm)}.offer-subtitle{text-align:center;font-size:1.25rem;margin-bottom:var(--space-lg);opacity:.95}.offer-benefits{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:var(--space-sm);margin:var(--space-lg) 0}.benefit-item{background:rgba(255,255,255,.1);padding:var(--space-sm) var(--space-md);border-radius:var(--radius-md);font-weight:600;display:flex;align-items:center;gap:.5rem}.offer .btn{display:flex;margin:var(--space-lg) auto;max-width:500px}.offer-guarantee{background:rgba(255,255,255,.15);border-radius:var(--radius-md);padding:var(--space-md);margin-top:var(--space-lg);display:flex;align-items:center;gap:var(--space-md);max-width:700px;margin-left:auto;margin-right:auto}.guarantee-icon{font-size:3rem;line-height:1;flex-shrink:0}.guarantee-text{text-align:left;line-height:1.6}.guarantee-text strong{color:var(--accent)}.faq{padding:var(--space-xl) 0;background:var(--light)}.faq-grid{max-width:900px;margin:var(--space-lg) auto 0}.faq-item{background:#fff;border-radius:var(--radius-md);margin-bottom:var(--space-sm);box-shadow:var(--shadow-sm);overflow:hidden;transition:all var(--transition-base)}.faq-item:hover{box-shadow:var(--shadow-md)}.faq-question{width:100%;padding:var(--space-md);background:#fff;border:none;text-align:left;font-family:var(--font-primary);font-size:1.125rem;font-weight:600;color:var(--dark);cursor:pointer;display:flex;justify-content:space-between;align-items:center;transition:background var(--transition-fast);position:relative}.faq-question::after{content:'+';font-size:1.5rem;color:var(--primary);font-weight:700;transition:transform var(--transition-base)}.faq-item[open] .faq-question::after{content:'−';transform:rotate(180deg)}.faq-question:hover{background:var(--light)}.faq-answer{padding:0 var(--space-md) var(--space-md);color:#666;line-height:1.8;font-size:1.0625rem}.faq-answer strong{color:var(--primary)}footer{background:var(--dark);color:#fff;padding:var(--space-xl) 0 var(--space-md)}.footer-content{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:var(--space-lg);margin-bottom:var(--space-lg)}.footer-section h4{color:#fff;margin-bottom:var(--space-sm);font-size:1.25rem}.footer-section p{color:rgba(255,255,255,.8);line-height:1.7}.footer-divider{height:1px;background:rgba(255,255,255,.1);margin:var(--space-lg) 0}.footer-bottom{text-align:center;color:rgba(255,255,255,.6);font-size:.9375rem}.footer-bottom p{margin-bottom:.5rem}.footer-links{display:flex;justify-content:center;align-items:center;flex-wrap:wrap;gap:var(--space-sm)}.footer-links a{color:rgba(255,255,255,.7);text-decoration:none;transition:color var(--transition-fast)}.footer-links a:hover{color:var(--accent)}.separator{color:rgba(255,255,255,.4)}.floating-cta{position:fixed;bottom:-100px;left:0;right:0;background:#fff;box-shadow:0 -4px 20px rgba(0,0,0,.15);padding:var(--space-sm);z-index:999;transition:bottom var(--transition-base)}.floating-cta.visible{bottom:0}.floating-cta-content{display:flex;justify-content:space-between;align-items:center;gap:var(--space-sm);max-width:1200px;margin:0 auto}.floating-cta-text strong{display:block;color:var(--dark);font-family:var(--font-primary);margin-bottom:.25rem;font-size:1.125rem}.floating-cta-text span{font-size:.9375rem;color:#666}.floating-cta .btn{min-height:48px;padding:.75rem 2rem}.back-to-top{position:fixed;bottom:30px;right:30px;width:50px;height:50px;background:var(--primary);color:#fff;border:none;border-radius:50%;font-size:1.25rem;cursor:pointer;opacity:0;visibility:hidden;transition:all var(--transition-base);box-shadow:var(--shadow-md);z-index:998}.back-to-top.visible{opacity:1;visibility:visible}.back-to-top:hover{background:#1f5f5d;transform:translateY(-5px);box-shadow:var(--shadow-lg)}.text-center{text-align:center}.mt-lg{margin-top:var(--space-lg)}.mb-lg{margin-bottom:var(--space-lg)} /* ================================ RESPONSIVE - MOBILE FIRST ================================ */ @media(max-width:768px){:root{--space-xl:3rem;--space-lg:2rem}.vision-content{grid-template-columns:1fr;gap:var(--space-lg)}.features-grid,.testimonials-grid{grid-template-columns:1fr}.stats-bar{grid-template-columns:repeat(2,1fr)}.navbar-cta{flex-direction:column;width:100%}.floating-cta-content{flex-direction:column;text-align:center}.col-12,.col-6,.col-4{flex:0 0 100%;max-width:100%}}@media(max-width:576px){:root{font-size:14px;--space-xl:2.5rem;--space-lg:1.5rem}.trust-indicators{flex-direction:column;gap:var(--space-sm)}.offer-benefits,.stats-bar{grid-template-columns:1fr}.timer-display{flex-wrap:wrap}.offer-guarantee{flex-direction:column;text-align:center}}@media(min-width:1200px){.container{max-width:1140px}}@media print{.navbar,.floating-cta,.back-to-top{display:none!important}} /* Add to your CSS */ .feature-card { opacity: 1 !important; transform: translateY(0) !important; } /* Only hide if JavaScript has loaded */ .js-loaded .feature-card { opacity: 0; transform: translateY(30px); transition: opacity 0.6s ease, transform 0.6s ease; } .js-loaded .feature-card.visible { opacity: 1; transform: translateY(0); }
