@font-face{font-family:'Roboto';font-style:normal;font-weight:400 700;font-display:swap;src:url('../fonts/roboto-latin-ext.woff2') format('woff2');unicode-range:U+0100-024F,U+1E00-1EFF} @font-face{font-family:'Roboto';font-style:normal;font-weight:400 700;font-display:swap;src:url('../fonts/roboto-latin.woff2') format('woff2');unicode-range:U+0000-00FF,U+2000-206F}:root{--primary:#428648;--primary-dark:#1D4641;--white:#ffffff;--gray-50:#f9fafb;--gray-100:#f3f4f6;--gray-200:#e5e7eb;--gray-300:#d1d5db;--gray-500:#6b7280;--gray-600:#4b5563;--gray-700:#374151;--gray-800:#1f2937;--gray-900:#111827;--green-50:#f0fdf4;--green-100:#dcfce7;--font-family:"Roboto",-apple-system,BlinkMacSystemFont,"Segoe UI","Helvetica Neue",Arial,sans-serif;--radius:0.5rem;--radius-lg:1rem;--shadow:0 1px 3px rgba(0,0,0,0.1);--shadow-lg:0 10px 15px -3px rgba(0,0,0,0.1);--transition:0.2s ease} *,*::before,*::after{box-sizing:border-box;margin:0;padding:0} html{scroll-behavior:smooth;-webkit-text-size-adjust:100%} body{font-family:var(--font-family);font-size:1rem;line-height:1.6;color:var(--gray-700);background:var(--white);-webkit-font-smoothing:antialiased} img{max-width:100%;height:auto;display:block} a{color:inherit;text-decoration:none} .container{width:100%;max-width:80rem;margin:0 auto;padding:0 1rem} @media(min-width:640px){.container{padding:0 1.5rem}} @media(min-width:1024px){.container{padding:0 2rem}} .header{position:fixed;top:0;left:0;right:0;z-index:1000;background:rgba(255,255,255,0.95);backdrop-filter:blur(8px);transition:box-shadow var(--transition)} .header.scrolled{box-shadow:var(--shadow)} .header-container{display:flex;align-items:center;justify-content:space-between;height:4rem} @media(min-width:768px){.header-container{height:5rem}} .logo{display:flex;align-items:center} .logo-img{height:2.5rem;width:auto} @media(min-width:768px){.logo-img{height:3rem}} .nav-desktop{display:none} @media(min-width:1024px){.nav-desktop{display:flex;align-items:center;gap:2rem}} .nav-link{font-size:0.9375rem;font-weight:500;color:var(--gray-600);transition:color var(--transition)} .nav-link:hover,.nav-link.active{color:var(--primary)} .nav-actions{display:flex;align-items:center;gap:0.75rem} .theme-toggle{width:2.5rem;height:2.5rem;display:flex;align-items:center;justify-content:center;border-radius:var(--radius);color:var(--gray-600);transition:background var(--transition),color var(--transition)} .mobile-menu-btn{display:flex;flex-direction:column;justify-content:center;gap:5px;width:2.5rem;height:2.5rem;padding:0.5rem;border-radius:var(--radius)} @media(min-width:1024px){.mobile-menu-btn{display:none}} .hamburger-line{width:100%;height:2px;background:var(--gray-700);transition:transform var(--transition),opacity var(--transition)} .hero{min-height:100vh;display:flex;align-items:center;padding:6rem 0 4rem;background:linear-gradient(to bottom,var(--green-50),var(--white))} .hero-content{text-align:center;max-width:48rem;margin:0 auto} .hero-badge{display:inline-flex;align-items:center;gap:0.5rem;padding:0.5rem 1rem;background:var(--green-100);color:var(--primary-dark);border-radius:2rem;font-size:0.875rem;font-weight:500;margin-bottom:1.5rem} .hero-title{font-size:clamp(2rem,5vw,3.5rem);font-weight:700;line-height:1.2;color:var(--gray-900);margin-bottom:1rem} .hero-title .highlight{color:var(--primary)} .hero-description{font-size:clamp(1rem,2vw,1.25rem);color:var(--gray-600);margin-bottom:2rem;max-width:36rem;margin-left:auto;margin-right:auto} .btn{display:inline-flex;align-items:center;justify-content:center;gap:0.5rem;padding:0.75rem 1.5rem;font-size:1rem;font-weight:500;border-radius:var(--radius);cursor:pointer;transition:all var(--transition);border:none;position:relative;overflow:hidden} .btn-primary{background:var(--primary);color:var(--white)} .btn-primary:hover{background:var(--primary-dark)} .btn-outline{background:transparent;border:1.5px solid var(--gray-300);color:var(--gray-700)} .btn-lg{padding:1rem 2rem;font-size:1.125rem} .hero-cta{display:flex;flex-direction:column;gap:1rem;justify-content:center} @media(min-width:640px){.hero-cta{flex-direction:row}} [data-theme="dark"]{--white:#0f172a;--gray-50:#1e293b;--gray-100:#334155;--gray-200:#475569;--gray-300:#64748b;--gray-500:#94a3b8;--gray-600:#cbd5e1;--gray-700:#e2e8f0;--gray-800:#f1f5f9;--gray-900:#f8fafc;--green-50:#1e293b;--green-100:#1e3a2f} [data-theme="dark"] .header{background:rgba(15,23,42,0.95)} [data-theme="dark"] .hero{background:linear-gradient(to bottom,#1e293b,#0f172a)}