*,*:before,*:after{margin:0;padding:0;box-sizing:border-box}:root{--color-black:#000;--color-white:#fff;--color-emerald:#10b981;--color-gray-light:#f9fafb;--color-gray-border:#e5e7eb;--font-family:"Inter",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;--spacing-md:1.5rem;--spacing-lg:2rem;--spacing-xl:3rem;--spacing-2xl:4rem;--spacing-3xl:6rem}body{font-family:var(--font-family);color:var(--color-black);background-color:var(--color-white);line-height:1.6}.container{max-width:1200px;margin:0 auto;padding:0 var(--spacing-lg)}.hero{background-color:var(--color-black);color:var(--color-white);padding:var(--spacing-3xl) 0;text-align:center}.hero-title{font-size:3.5rem;font-weight:700;margin-bottom:var(--spacing-md);letter-spacing:-.02em}.hero-tagline{font-size:1.5rem;font-weight:600;color:var(--color-emerald);margin-bottom:var(--spacing-lg)}.hero-description{font-size:1.125rem;max-width:700px;margin:0 auto;line-height:1.8;opacity:.9}.main-content{padding:var(--spacing-3xl) 0}.section-title{font-size:2.5rem;font-weight:700;text-align:center;margin-bottom:var(--spacing-2xl)}.tools-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:var(--spacing-lg)}.tool-card{background-color:var(--color-white);border:1px solid var(--color-gray-border);border-radius:12px;padding:var(--spacing-xl);transition:all .3s ease;display:flex;flex-direction:column}.tool-card:hover{transform:translateY(-4px);box-shadow:0 12px 24px #0000001a;border-color:var(--color-emerald)}.tool-image-wrapper{width:100%;height:200px;overflow:hidden;border-radius:12px;margin-bottom:var(--spacing-md);background-color:var(--color-gray-light)}.tool-image{width:100%;height:100%;object-fit:cover;display:block}.tool-name{font-size:1.375rem;font-weight:700;margin-bottom:1rem;color:var(--color-black)}.tool-description{font-size:1rem;color:#4b5563;margin-bottom:var(--spacing-lg);flex-grow:1;line-height:1.7}.tool-button{background-color:var(--color-emerald);color:var(--color-white);border:none;padding:.875rem 1.5rem;font-size:1rem;font-weight:600;border-radius:8px;cursor:pointer;transition:all .2s ease;font-family:var(--font-family);text-decoration:none;display:inline-block;text-align:center}.tool-button:hover{background-color:#059669;transform:translateY(-1px);box-shadow:0 4px 12px #10b9814d}.tool-button:active{transform:translateY(0)}.footer{background-color:var(--color-black);color:var(--color-white);padding:var(--spacing-xl) 0}.footer-content{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:var(--spacing-lg)}.footer-copyright{font-size:.9375rem;opacity:.9}.social-icons{display:flex;gap:var(--spacing-md)}.social-icon{color:var(--color-white);width:40px;height:40px;display:flex;align-items:center;justify-content:center;border-radius:50%;background-color:#ffffff1a;transition:all .3s ease;text-decoration:none}.social-icon:hover{background-color:var(--color-emerald);transform:translateY(-2px)}.social-icon svg{width:20px;height:20px}.modal{display:none;position:fixed;z-index:1000;left:0;top:0;width:100%;height:100%;background-color:#000000f2;align-items:center;justify-content:center;animation:fadeIn .3s ease}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.modal-content{max-width:90%;max-height:90vh;object-fit:contain;border-radius:8px;animation:zoomIn .3s ease}@keyframes zoomIn{0%{transform:scale(.8);opacity:0}to{transform:scale(1);opacity:1}}.modal-close{position:absolute;top:20px;right:40px;color:var(--color-white);font-size:48px;font-weight:300;cursor:pointer;transition:all .3s ease;line-height:1;user-select:none}.modal-close:hover{color:var(--color-emerald);transform:rotate(90deg)}.clickable-image{cursor:pointer;transition:transform .3s ease,opacity .3s ease}.clickable-image:hover{transform:scale(1.05);opacity:.9}@media(max-width:1024px){.tools-grid{grid-template-columns:repeat(2,1fr)}.hero-title{font-size:2.75rem}.section-title{font-size:2rem}}@media(max-width:768px){.tools-grid{grid-template-columns:1fr}.hero{padding:var(--spacing-2xl) 0}.hero-title{font-size:2.25rem}.hero-tagline{font-size:1.25rem}.hero-description{font-size:1rem}.main-content{padding:var(--spacing-2xl) 0}.section-title{font-size:1.75rem;margin-bottom:var(--spacing-xl)}.footer-content{flex-direction:column;text-align:center}.container{padding:0 var(--spacing-md)}.modal-close{top:10px;right:20px;font-size:36px}.modal-content{max-width:95%;max-height:85vh}}@media(max-width:480px){.hero-title{font-size:1.875rem}.tool-card{padding:var(--spacing-lg)}.tool-image-wrapper{height:180px}.tool-name{font-size:1.25rem}}
