@font-face{font-family:'Inter';font-style:normal;font-weight:400;font-display:swap;src:url('/assets/fonts/inter-regular.woff2') format('woff2'),url('/assets/fonts/inter-regular.woff') format('woff')} @font-face{font-family:'Inter';font-style:normal;font-weight:500;font-display:swap;src:url('/assets/fonts/inter-medium.woff2') format('woff2'),url('/assets/fonts/inter-medium.woff') format('woff')} @font-face{font-family:'Inter';font-style:normal;font-weight:600;font-display:swap;src:url('/assets/fonts/inter-semibold.woff2') format('woff2'),url('/assets/fonts/inter-semibold.woff') format('woff')} @font-face{font-family:'Inter';font-style:normal;font-weight:700;font-display:swap;src:url('/assets/fonts/inter-bold.woff2') format('woff2'),url('/assets/fonts/inter-bold.woff') format('woff')}:root{--primary:#FF6D00;--primary-dark:#E65100;--primary-darker:#CC4700;--primary-light:rgba(255,109,0,0.1);--primary-extra-light:rgba(255,109,0,0.05);--secondary:#455A64;--light:#F8FAFC;--dark:#1E293B;--gray:#94A3B8;--white:#FFFFFF;--border:#E2E8F0;--text:#1E293B;--text-medium:#475569;--text-light:#64748B;--bg:#F8FAFC;--bg-secondary:#F1F5F9;--border-light:#E2E8F0;--font-sans:'Inter',-apple-system,BlinkMacSystemFont,sans-serif;--shadow-sm:0 1px 3px rgba(0,0,0,0.05);--shadow-md:0 4px 6px rgba(0,0,0,0.08);--shadow-lg:0 10px 25px rgba(0,0,0,0.1);--radius-sm:6px;--radius-md:10px;--radius-lg:14px;--transition:all 0.2s ease;--max-width:1250px;--padding-vertical:0;--padding-horizontal:20px;--color-purple:linear-gradient(135deg,#667eea 0%,#764ba2 100%);--color-pink:linear-gradient(135deg,#f093fb 0%,#f5576c 100%);--color-blue:linear-gradient(135deg,#4facfe 0%,#00f2fe 100%);--color-green:linear-gradient(135deg,#43e97b 0%,#38f9d7 100%);--color-orange:linear-gradient(135deg,#fa709a 0%,#fee140 100%);--color-red:linear-gradient(135deg,#f83600 0%,#f9d423 100%);--color-teal:linear-gradient(135deg,#00cdac 0%,#8ddad5 100%);--color-indigo:linear-gradient(135deg,#6a11cb 0%,#2575fc 100%);--color-cyan:linear-gradient(135deg,#0891b2 0%,#06b6d4 100%);--color-lime:linear-gradient(135deg,#a3e635 0%,#65a30d 100%);--color-amber:linear-gradient(135deg,#f59e0b 0%,#d97706 100%);--color-rose:linear-gradient(135deg,#f43f5e 0%,#fb7185 100%);--color-violet:linear-gradient(135deg,#8b5cf6 0%,#a855f7 100%);--color-emerald:linear-gradient(135deg,#10b981 0%,#059669 100%);--color-sky:linear-gradient(135deg,#0ea5e9 0%,#38bdf8 100%);--color-fuchsia:linear-gradient(135deg,#d946ef 0%,#c026d3 100%);--color-gold:linear-gradient(135deg,#fbbf24 0%,#d97706 100%);--color-coral:linear-gradient(135deg,#fb923c 0%,#ea580c 100%);--color-mint:linear-gradient(135deg,#34d399 0%,#10b981 100%);--color-lavender:linear-gradient(135deg,#c084fc 0%,#a855f7 100%);--color-sunset:linear-gradient(135deg,#f97316 0%,#eab308 100%);--color-ocean:linear-gradient(135deg,#0ea5e9 0%,#1d4ed8 100%);--important-bg:#FEF3E2;--warning-bg:#FEF2F2;--success-bg:#F0F9F4} .dark-mode{--primary:#FF8A65;--primary-dark:#FF7043;--primary-darker:#F05A2D;--light:#37474F;--dark:#ECEFF1;--gray:#78909C;--white:#263238;--border:#455A64;--text:#ECEFF1;--text-medium:#CFD8DC;--text-light:#90A4AE;--bg:#263238;--bg-secondary:#1E272C;--border-light:#37474F;--shadow-sm:0 1px 3px rgba(0,0,0,0.2);--shadow-md:0 4px 6px rgba(0,0,0,0.3);--shadow-lg:0 10px 25px rgba(0,0,0,0.35);--important-bg:rgba(254,243,226,0.1);--warning-bg:rgba(254,242,242,0.1);--success-bg:rgba(240,249,244,0.1)} *{margin:0;padding:0;box-sizing:border-box;font-family:var(--font-sans);transition:background-color 0.3s,color 0.3s} html{scroll-behavior:smooth} html,body{overflow-x:hidden;max-width:100%} body{position:relative;background-color:var(--white);color:var(--text);line-height:1.6;padding-top:64px;-webkit-font-smoothing:antialiased} .site-header,header[role="banner"]{background-color:var(--white);padding:15px 0;border-bottom:1px solid var(--border);position:fixed;top:0;left:0;right:0;z-index:1000;width:100%;height:64px;box-shadow:var(--shadow-sm)} .container{width:100%;max-width:var(--max-width);margin:0 auto;padding:var(--padding-vertical) var(--padding-horizontal)} .nav-container{display:flex;align-items:center;justify-content:space-between;position:relative} .nav-left{display:flex;align-items:center;gap:15px} .hamburger-menu{position:relative;display:inline-block;z-index:1000;cursor:pointer;color:var(--dark)} .icon-arrow{display:flex;flex-direction:column;gap:5px} .icon-arrow span{height:2px;background:var(--dark);transition:all 0.3s ease;position:relative} .icon-arrow span:nth-child(1){width:20px} .icon-arrow span:nth-child(2){width:25px} .icon-arrow span:nth-child(3){width:20px} .icon-arrow:hover span:nth-child(1){transform:translateX(5px)} .icon-arrow:hover span:nth-child(2){transform:translateX(2px)} .icon-arrow:hover span:nth-child(3){transform:translateX(5px)} .dropdown-content{position:fixed;top:0;left:-100%;width:300px;height:100vh;background-color:var(--white);box-shadow:5px 0 15px rgba(0,0,0,0.1);transition:all 0.4s cubic-bezier(0.4,0,0.2,1);overflow-y:auto;z-index:1002} .dropdown-content.show{left:0} .dropdown-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background-color:rgba(0,0,0,0.5);z-index:1001;opacity:0;visibility:hidden;transition:all 0.3s;pointer-events:none;backdrop-filter:blur(2px)} .dropdown-overlay.show{opacity:1;visibility:visible} .dropdown-header{display:flex;justify-content:space-between;align-items:center;padding:20px;background-color:var(--primary);color:var(--white);font-weight:600;font-size:1.2rem} .close-dropdown{background:none;border:none;color:var(--white);font-size:1.0rem;cursor:pointer;padding:5px;transition:transform 0.3s} .close-dropdown:hover{transform:rotate(90deg)} .dropdown-links{padding:20px 0} .dropdown-links a{display:flex;align-items:center;padding:15px 25px;color:var(--dark);text-decoration:none;transition:all 0.2s;font-size:1.2em;font-weight:500} .dropdown-links a .svg-icon{width:24px;height:24px;margin-right:15px;color:var(--primary);transition:color 0.3s ease} .dropdown-links a:hover{background-color:var(--primary-extra-light);color:var(--primary);padding-left:30px} .dropdown-footer{display:flex;align-items:center;padding:20px;border-top:1px solid var(--border);margin-top:auto} .dropdown-footer .dark-mode-toggle{margin-right:15px} .dropdown-footer span{font-size:0.9rem;color:var(--text-medium)} .hamburger-menu .svg-icon,.logo .svg-icon,.nav-right .svg-icon{width:22px;height:22px;transition:color 0.3s ease} .logo .svg-icon{width:24px;height:24px;color:var(--primary);display:flex;margin-right:8px} .logo{font-size:24px;font-weight:700;color:var(--primary);text-decoration:none;display:flex;align-items:center} .center-nav{position:absolute;left:50%;transform:translateX(-50%)} .center-nav ul{display:flex;align-items:center;gap:32px;margin:0;padding:0;list-style:none} .center-nav a{color:var(--dark);text-decoration:none;font-weight:500;font-size:1.02rem;letter-spacing:0.10px;transition:all 0.3s ease;white-space:nowrap;padding:8px 0;position:relative} .center-nav a:hover{color:var(--primary)} .center-nav a::after{content:'';position:absolute;bottom:0;left:0;width:0;height:2px;background-color:var(--primary);transition:width 0.3s ease} .center-nav a:hover::after{width:100%} .center-nav a.active{color:var(--primary);font-weight:700} .center-nav a.active::after{width:100%} .nav-right{display:flex;align-items:center;gap:15px} .search-icon{font-size:1.25rem;cursor:pointer;color:var(--text);transition:color 0.3s} .search-icon:hover{color:var(--primary)} .dark-mode-toggle{width:50px;height:26px;background-color:var(--light);border-radius:30px;position:relative;cursor:pointer;border:none;appearance:none;-webkit-appearance:none;outline:none} .dark-mode-toggle::before{content:'';position:absolute;width:20px;height:20px;border-radius:50%;background-color:var(--primary);top:3px;left:3px;transition:transform 0.3s} .dark-mode .dark-mode-toggle::before{transform:translateX(24px)} .hero-container{position:relative;background:linear-gradient(135deg,var(--primary),var(--primary-dark));color:var(--white)} .hero{padding:70px 0 40px;position:relative;overflow:hidden;text-align:center} .hero-content{position:relative;z-index:2;max-width:800px;margin:0 auto} .hero h1{font-size:clamp(29px,5vw,48px);margin-bottom:1.5rem;color:var(--white);font-weight:700;line-height:1.2;letter-spacing:-0.5px} .hero p{font-size:1.25rem;color:rgba(255,255,255,0.9);margin-bottom:40px;opacity:0.9;max-width:700px;margin-left:auto;margin-right:auto} .hero-cta{display:flex;gap:15px;justify-content:center;margin-bottom:40px} .btn{display:inline-flex;align-items:center;justify-content:center;padding:14px 28px;border-radius:50px;text-decoration:none;font-weight:600;font-size:16px;transition:all 0.3s cubic-bezier(0.25,0.8,0.25,1);border:none;cursor:pointer;gap:8px;position:relative;overflow:hidden} .btn-primary{background:var(--white);color:var(--primary-dark)} .btn-primary:hover{background:var(--light);color:var(--primary-dark);transform:translateY(-2px);box-shadow:var(--shadow-lg)} .btn-outline{background:transparent;color:var(--white);border:2px solid var(--white)} .btn-outline:hover{background:var(--white);color:var(--primary-dark)} .tools-section{padding:60px 0 80px 0;max-width:1200px;margin:0 auto} .section-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:40px} .section-header h2{font-size:1.8rem;color:var(--text)} .section-header a{color:var(--primary);text-decoration:none;font-weight:500;font-size:0.9rem} .tools-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:30px} .tool-wrapper{background-color:var(--bg);width:100%;max-width:100%;margin:0;padding:0;overflow:hidden;display:flow-root} .tool-card{background:var(--white);border-radius:var(--radius-lg);padding:1.9rem 1.5rem;box-shadow:var(--shadow-md);transition:var(--transition);border:1px solid var(--border-light);position:relative;overflow:hidden;display:flex;flex-direction:column;align-items:center;text-align:center} .tool-card:hover{transform:translateY(-5px);box-shadow:var(--shadow-md);border-color:var(--primary-light)} .tool-card::before{content:'';position:absolute;width:100%;height:100%;top:0;left:0;background:linear-gradient(135deg,var(--primary-extra-light) 0%,rgba(255,255,255,0) 100%);opacity:0;transition:opacity 0.3s ease;z-index:-1} .tool-card:hover::before{opacity:1} .tool-icon{width:60px;height:60px;border-radius:20px;background:var(--primary-light);display:flex;align-items:center;justify-content:center;margin:0 auto 20px;transition:all 0.3s ease} .tool-icon .svg-icon{width:35px;height:35px;color:var(--primary);transition:all 0.3s ease} .tool-card:hover .tool-icon{background:var(--primary);transform:scale(1.1)} .tool-card:hover .tool-icon .svg-icon{color:white} .tool-card h3{font-size:1.4rem;margin-bottom:1rem;color:var(--text);font-weight:700;line-height:1.3;width:100%} .tool-card p{color:var(--text-light);font-size:0.95rem;margin-bottom:1rem;line-height:1.6} .tool-tags{display:flex;flex-wrap:wrap;gap:0.5rem;margin-top:1rem;justify-content:center} .tool-tag{background:var(--primary-extra-light);color:var(--primary-dark);padding:0.4rem 0.8rem;border-radius:12px;font-size:0.8rem;font-weight:600;transition:var(--transition);border:1px solid var(--primary-light)} .tool-card-link{text-decoration:none;color:inherit;display:block;height:100%} .tool-card-link:hover h3{color:var(--primary-dark)} .view-all-tools-cta{text-align:center;margin-top:1.5rem;padding-top:2rem} .view-all-tools-cta .btn{display:inline-flex;align-items:center;gap:0.5rem} .btn-explore{background:transparent;color:var(--primary-dark);border:2px solid var(--primary-dark)} .btn-explore:hover{background:var(--primary);color:var(--white);transform:translateY(-2px)} .text-link{color:var(--primary);text-decoration:underline;font-weight:500;transition:var(--transition)} .text-link:hover{color:var(--primary-dark)} .view-all-tools-cta .svg-icon{width:24px;height:24px} .hero-cta .svg-icon{width:24px;height:24px} footer{background-color:var(--dark);color:var(--white);padding:60px 0 25px} .footer-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:40px;margin-bottom:30px} .footer-about{max-width:300px} .footer-logo{display:flex;align-items:center;margin-bottom:20px;font-size:22px;font-weight:700;color:var(--white)} .footer-logo .svg-icon{width:28px;height:28px;color:var(--primary);margin-right:8px} .footer-about p{color:var(--gray);margin-bottom:25px;font-size:15px} .footer-column h3{font-size:18px;margin-bottom:25px;color:var(--white);position:relative;padding-bottom:10px} .footer-column h3::after{content:'';position:absolute;left:0;bottom:0;width:40px;height:2px;background-color:var(--primary)} .footer-links{list-style:none} .footer-links li{margin-bottom:12px} .footer-links a{color:var(--gray);text-decoration:none;transition:color 0.3s;font-size:15px} .footer-links a:hover{color:var(--white)} .copyright{text-align:center;padding-top:25px;border-top:1px solid rgba(255,255,255,0.1);color:var(--gray);font-size:14px} .dark-mode .copyright{border-top-color:#D6DFE6} .footer-social{margin-top:1.5rem} .footer-social h3{font-size:1rem;margin-bottom:0.5rem} .social-links{display:flex;gap:1rem;list-style:none;padding:0;margin:0} .social-links a{color:inherit;font-size:1.5rem;transition:color 0.2s ease} .social-links a:hover{color:var(--primary)} .social-links .svg-icon{width:26px;height:26px;color:inherit} @media (max-width:1024px){.footer-grid{grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:30px} } @media (max-width:768px){footer{padding:40px 0 20px} .footer-grid{grid-template-columns:repeat(2,1fr);gap:30px 20px;justify-items:center} .footer-about{grid-column:1 / -1;max-width:100%;text-align:center} .footer-column{text-align:center;width:100%} .footer-column h3::after{left:50%;transform:translateX(-50%)} .footer-logo{justify-content:center} .footer-social{display:flex;flex-direction:column;align-items:center} .social-links{justify-content:center} } @media (max-width:480px){footer{padding:30px 0 15px} .footer-grid{grid-template-columns:1fr;gap:25px;justify-items:center} .footer-column{text-align:center;max-width:280px} .footer-links{padding:0} .social-links{gap:0.8rem} .social-links .svg-icon{width:24px;height:24px} .copyright{padding-top:20px;font-size:13px} } @media (max-width:768px){.footer-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));justify-content:center} .footer-column:nth-last-child(2):first-child,.footer-column:nth-last-child(2):first-child ~ .footer-column{grid-column:1 / -1;text-align:center;max-width:200px;margin:0 auto} .cookie-settings-link{text-align:center !important} } @media (max-width:360px){.footer-grid{gap:20px} .footer-column{max-width:250px} .footer-column h3{font-size:16px;margin-bottom:15px} .footer-links a{font-size:14px} .footer-about p{font-size:14px} } @media (max-width:1200px){.tools-section{padding:40px 20px} .center-nav{gap:20px} } @media (max-width:992px){.tools-section{padding:40px 20px} .hero p{font-size:1.1rem} .center-nav{display:none} } @media (max-width:768px){.container{padding:0 15px} .tools-section{padding:60px 20px} .hero{padding:50px 15px 20px} .hero p{font-size:1rem} .hero-cta{flex-direction:column;align-items:center} .btn{width:100%;max-width:250px} .contact-btn span{display:none} } @media (max-width:480px){.dropdown-content{width:280px} .logo span{font-size:1.25rem} } .divider{position:relative;width:100%;overflow:hidden;line-height:0;z-index:1} .divider svg{position:relative;display:block;width:calc(100% + 1.3px);height:60px} .divider-wave--primary .divider-svg{fill:var(--bg)} .divider-wave--white .divider-svg{fill:var(--white)} @media (max-width:768px){.divider svg{height:40px} } @media (max-width:480px){.divider svg{height:30px} } .info-section{padding:80px 0;position:relative} .section-container{width:100%;max-width:var(--max-width);margin:0 auto;padding:var(--padding-vertical) var(--padding-horizontal);position:relative;z-index:2} .section-title-container{text-align:center;margin-bottom:60px} .section-title-container h2{font-size:2.5rem;margin-bottom:15px;color:var(--primary-dark);display:inherit !important;align-items:center;justify-content:center;gap:15px} .section-title-container h2 .svg-icon{width:32px;height:32px;color:var(--primary)} .section-subtitle{font-size:1.2rem;color:var(--text-light);max-width:700px;margin:0 auto;line-height:1.6} @media (max-width:768px){.info-section{padding:60px 15px} .section-container{padding:var(--padding-vertical) 5px} .section-title-container h2{font-size:2rem} .section-subtitle{font-size:1.1rem;padding:0 10px} } @media (max-width:480px){.info-section{padding:50px 10px} .section-container{padding:var(--padding-vertical) 5px} .section-title-container h2{font-size:1.8rem} .section-title-container h2 .svg-icon{width:32px;height:32px} .section-subtitle{font-size:1rem} } .process-section-container{position:relative;background:var(--bg-secondary)} .process-section{border-top:1px solid var(--border-light);border-bottom:0px solid var(--border-light)} .process-steps{display:flex;justify-content:center;align-items:flex-start;gap:0;position:relative} .process-step{flex:1;max-width:300px;display:flex;flex-direction:column;align-items:center;text-align:center;position:relative;padding:0 20px} .step-visual{position:relative;margin-bottom:25px} .step-visual .svg-icon{width:110px;height:110px;color:#4178d4} .step-number{position:absolute;top:-15px;left:50%;transform:translateX(-50%);width:50px;height:50px;border-radius:50%;background:var(--primary);color:white;display:flex;align-items:center;justify-content:center;font-size:1.5rem;font-weight:bold;z-index:2;box-shadow:0 5px 15px rgba(65,120,212,0.3)} .step-content h3{font-size:1.3rem;color:var(--text);margin-bottom:15px} .step-content p{color:var(--text-light);line-height:1.6} .step-connector{padding-top:80px;min-width:80px;display:flex;align-items:center} .step-connector .svg-icon{width:60px;height:60px;color:#4178d4;opacity:0.3} @media (max-width:1024px){.process-steps{flex-direction:column;align-items:center;gap:40px} .step-connector{display:none} .process-step{display:block;max-width:100%;padding:0;flex-direction:row;text-align:left;gap:25px;margin-bottom:25px} .step-visual{margin-bottom:0;flex-shrink:0} .process-step{flex-direction:column;text-align:center} .step-number{left:50%;transform:translateX(-50%)} } @media (max-width:900px){.process-steps{flex-direction:column;align-items:center;gap:40px} .step-connector{display:none} .process-step{display:block;max-width:100%;padding:0;flex-direction:row;text-align:left;gap:25px} .step-visual{margin-bottom:0;flex-shrink:0} .process-step{flex-direction:column;text-align:center} .step-number{left:50%;transform:translateX(-50%)} } @media (max-width:768px){.process-steps{flex-direction:column;align-items:center;gap:40px} .step-connector{display:none} .process-step{display:block;max-width:100%;padding:0;flex-direction:row;text-align:left;gap:25px} .step-visual{margin-bottom:0;flex-shrink:0} .process-step{flex-direction:column;text-align:center} .step-number{left:50%;transform:translateX(-50%)} } .features-section-container{position:relative;background:var(--white)} .features-section{position:relative;overflow:hidden} .features-section::before{content:'';position:absolute;width:600px;height:600px;border-radius:50%;background:radial-gradient(circle,var(--primary-light) 0%,rgba(255,255,255,0) 70%);opacity:0.05;top:-200px;left:-200px;z-index:1} .features-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:30px;position:relative;z-index:2} .feature-card{background:var(--white);border-radius:12px;padding:30px;box-shadow:var(--shadow-sm);transition:all 0.3s ease;border:1px solid var(--border-light);text-align:center} .feature-card:hover{transform:translateY(-5px);box-shadow:var(--shadow-md);border-color:var(--primary-light)} .feature-icon{width:70px;height:70px;border-radius:50%;background:var(--primary-light);display:flex;align-items:center;justify-content:center;margin:0 auto 20px;color:var(--primary);font-size:1.8rem;transition:all 0.3s ease} .svg-icon{display:inline-block;vertical-align:-0.125em} .section-title-container h2 .svg-icon{width:1em;height:1em;vertical-align:-0.125em;margin-right:0.5rem} .feature-icon .svg-icon{width:1.75rem;height:1.75rem} .features-section .svg-icon{width:32px;height:32px;display:inline-block;vertical-align:middle} .feature-card:hover .feature-icon{background:var(--primary);color:white;transform:scale(1.1)} .feature-card h3{margin:0 0 15px;color:var(--text);font-size:1.2rem} .feature-card p{color:var(--text-light);line-height:1.6;margin:0;font-size:0.95rem} @media (max-width:768px){.features-grid{grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:20px;margin:0 auto} } @media (max-width:480px){.use-cases-grid{grid-template-columns:1fr;margin:0 auto} } .use-cases-section-container{position:relative;background:var(--bg)} .use-cases-section{position:relative;overflow:hidden} .use-cases-section::before{content:'';position:absolute;width:600px;height:600px;background:radial-gradient(circle,var(--primary-light) 0%,rgba(255,255,255,0) 70%);top:0px;right:-300px;opacity:0.3} .use-cases-section::after{content:'';position:absolute;width:400px;height:400px;background:radial-gradient(circle,var(--primary-light) 0%,rgba(255,255,255,0) 70%);bottom:0px;left:-200px;opacity:0.2} .use-cases-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:30px} .use-case-card{background:var(--white);border-radius:12px;padding:40px 30px;position:relative;overflow:hidden;box-shadow:var(--shadow-sm);transition:all 0.4s cubic-bezier(0.175,0.885,0.32,1.275);z-index:1;border:1px solid var(--border-light);text-align:center;display:flex;flex-direction:column;align-items:center} .use-case-card:hover{transform:translateY(-10px);box-shadow:var(--shadow-md)} .icon-bg{width:70px;height:70px;border-radius:18px;display:flex;align-items:center;justify-content:center;margin-bottom:25px;font-size:28px;color:white;position:relative} .icon-bg .svg-icon{width:32px;height:32px} .use-case-card h3{font-size:1.4rem;color:var(--text);margin-bottom:15px;font-weight:600} .use-case-card p{color:var(--text-light);line-height:1.6;margin:0;font-size:1.05rem} .hover-effect{position:absolute;width:100%;height:100%;top:0;left:0;background:linear-gradient(135deg,var(--primary-extra-light) 0%,rgba(255,255,255,0) 100%);opacity:0;transition:opacity 0.3s ease;z-index:-1} .use-case-card:hover .hover-effect{opacity:1} .privacy-section{background-color:var(--bg-secondary)} .privacy-content{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:30px;max-width:1000px;margin:0 auto} .privacy-point{text-align:center} .privacy-point .svg-icon{width:48px;height:48px;color:var(--primary);margin-bottom:15px} .privacy-point h3{margin-bottom:10px;color:var(--text)} .privacy-point p{color:var(--text-light);margin:0} .about-section-container{position:relative;background:var(--bg)} .about-section{position:relative;overflow:hidden} .about-section::before{content:'';position:absolute;width:400px;height:400px;border-radius:50%;background:radial-gradient(circle,var(--primary-light) 0%,rgba(255,255,255,0) 70%);opacity:0.1;top:-100px;right:-100px;z-index:1} .about-content{display:flex;align-items:center;gap:40px;position:relative;z-index:2} .about-text{flex:1} .about-visual{flex:1;display:flex;justify-content:center;align-items:center} .about-card{background:var(--white);border-radius:16px;padding:40px;box-shadow:var(--shadow-sm);border:1px solid var(--border-light)} .about-card p{color:var(--text-light);line-height:1.8;margin-bottom:20px;font-size:1.05rem} .about-card strong{color:var(--text);font-weight:600} .about-benefits{margin-top:30px} .benefit-item{display:flex;align-items:flex-start;gap:12px;margin-bottom:15px} .benefit-item .svg-icon{width:24px;height:24px;color:var(--primary);flex-shrink:0} .benefit-item span{color:var(--text);line-height:1.6} .qr-visual-container{position:relative;width:300px;height:300px;display:flex;align-items:center;justify-content:center} .qr-visual-container .svg-icon{width:250px;height:250px;color:var(--primary-light);z-index:2} .qr-scan-animation{position:absolute;width:100%;height:100%;border:5px dashed var(--primary);border-radius:16px;animation:scan 4s infinite linear;opacity:0.3} @keyframes scan{0%{transform:scale(0.9);opacity:0.3} 50%{transform:scale(1.1);opacity:0.6} 100%{transform:scale(0.9);opacity:0.3} } @media (max-width:1024px){.about-content{flex-direction:column;gap:30px} .about-visual{order:-1;margin-bottom:20px} .qr-visual-container{width:250px;height:250px} } @media (max-width:768px){.about-card{padding:30px} .qr-visual-container{width:200px;height:200px} .qr-visual-container i{font-size:8rem} } @media (max-width:480px){.about-card{padding:25px 20px} .about-card p{font-size:1rem} .benefit-item{margin-bottom:12px} .qr-visual-container{width:180px;height:180px} .qr-visual-container i{font-size:6rem} } .faq-section-container{position:relative;background-color:var(--bg-secondary)} .faq-section{} .faq-grid{display:grid;grid-template-columns:1fr;gap:20px;max-width:800px;margin:0 auto} .faq-card{background:var(--white);border-radius:16px;padding:0;overflow:hidden;box-shadow:var(--shadow-sm);transition:all 0.3s ease;border:1px solid var(--border-light)} .faq-card:hover{transform:translateY(-5px);box-shadow:var(--shadow-md)} .faq-header{padding:20px;display:flex;align-items:center;gap:15px;cursor:pointer;background:linear-gradient(135deg,var(--primary-extra-light) 0%,rgba(255,255,255,0) 100%)} .faq-icon{width:40px;height:40px;border-radius:50%;background:var(--primary-light);display:flex;align-items:center;justify-content:center;flex-shrink:0} .faq-icon .svg-icon{width:20px;height:20px;color:var(--primary)} .faq-header h3{margin:0;flex:1;font-size:1.1rem;color:var(--text)} .faq-header .chevron{width:20px;height:20px;color:var(--primary);transition:transform 0.3s ease} .faq-card.active .chevron{transform:rotate(180deg)} .faq-content{padding:0 20px;max-height:0;overflow:hidden;transition:max-height 0.3s ease,padding 0.3s ease} .faq-card.active .faq-content{padding:20px 20px 25px;max-height:500px} .faq-content p{margin-top:0;margin-bottom:15px;color:var(--text-light)} .faq-content ul{padding-left:0;list-style:none} .faq-content li{margin-bottom:10px;display:flex;align-items:center;gap:8px;color:var(--text-light)} .faq-content li .svg-icon{width:18px;height:18px;color:var(--primary);flex-shrink:0} .faq-content .svg-icon{width:18px;height:18px;color:var(--primary);flex-shrink:0} .faq-content p .svg-icon{color:var(--primary);margin-right:4px} .tips-section-container{position:relative;background:var(--bg)} .tips-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:30px} .tip-card{background:var(--white);border-radius:12px;padding:40px 30px;position:relative;overflow:hidden;box-shadow:var(--shadow-sm);transition:all 0.4s cubic-bezier(0.175,0.885,0.32,1.275);z-index:1;border:1px solid var(--border-light);text-align:center;display:flex;flex-direction:column;align-items:center} .tip-card:hover{transform:translateY(-10px);box-shadow:var(--shadow-md)} .tip-icon-bg{width:70px;height:70px;border-radius:18px;display:flex;align-items:center;justify-content:center;margin-bottom:25px;font-size:28px;color:white;position:relative} .tip-icon-bg .svg-icon{width:32px;height:32px} .tip-card h3{font-size:1.4rem;color:var(--text);margin-bottom:15px;font-weight:600} .tip-card p{color:var(--text-light);line-height:1.6;margin:0;font-size:1.05rem} .tip-hover-effect{position:absolute;width:100%;height:100%;top:0;left:0;background:linear-gradient(135deg,var(--primary-extra-light) 0%,rgba(255,255,255,0) 100%);opacity:0;transition:opacity 0.3s ease;z-index:-1} .tip-card:hover .tip-hover-effect{opacity:1} .tip-color-1 .tip-icon-bg{background:linear-gradient(135deg,#4facfe 0%,#00f2fe 100%)} .tip-color-2 .tip-icon-bg{background:linear-gradient(135deg,#ff758c 0%,#ff7eb3 100%)} .tip-color-3 .tip-icon-bg{background:linear-gradient(135deg,#6a11cb 0%,#2575fc 100%)} .tip-color-4 .tip-icon-bg{background:linear-gradient(135deg,#f83600 0%,#f9d423 100%)} .tip-color-5 .tip-icon-bg{background:linear-gradient(135deg,#43e97b 0%,#38f9d7 100%)} .tip-color-6 .tip-icon-bg{background:linear-gradient(135deg,#fa709a 0%,#fee140 100%)} .tip-color-7 .tip-icon-bg{background:linear-gradient(135deg,#667eea 0%,#764ba2 100%)} .tip-color-8 .tip-icon-bg{background:linear-gradient(135deg,#f093fb 0%,#f5576c 100%)} .tips-footer{background:var(--primary-extra-light);border:1px solid var(--primary-light);border-radius:var(--radius-lg);padding:25px;text-align:center;margin-top:50px;position:relative;overflow:hidden} .tips-footer p{color:var(--text-medium);font-size:1.1rem;line-height:1.6;margin:0} .tips-footer a{display:inline-flex;align-items:center;gap:10px;background:var(--primary);color:var(--white);font-weight:600;text-decoration:none;transition:var(--transition);margin-top:15px;padding:14px 28px;border-radius:50px;border:2px solid var(--primary)} .tips-footer a:hover{background:var(--primary-dark);border-color:var(--primary-dark);transform:translateY(-2px);box-shadow:var(--shadow-md)} .tips-footer a .svg-icon{width:18px;height:18px} @media (max-width:1024px){.tips-grid{grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:25px} } @media (max-width:768px){.tips-section .section-container{padding:60px 20px} .tips-section .section-title-container h2{font-size:1.8rem;flex-direction:column;gap:8px} .tips-grid{grid-template-columns:1fr;gap:20px} .tip-card{padding:30px 25px} .tip-icon-bg{width:60px;height:60px;margin-bottom:20px} .tip-icon-bg .svg-icon{width:28px;height:28px} .tip-card h3{font-size:1.3rem} .tips-footer{padding:30px 25px;margin-top:40px} .tips-footer p{font-size:1.1rem} } @media (max-width:480px){.tips-section .section-container{padding:50px 15px} .tips-section .section-title-container h2{font-size:1.6rem} .tips-section .section-subtitle{font-size:1.1rem} .tip-card{padding:25px 20px} .tips-footer{padding:25px 20px} } .dark-mode .tips-section{background:var(--bg)} .dark-mode .tip-card{background:var(--white);border-color:var(--border)} .dark-mode .tips-footer{background:var(--white);border-color:var(--border)} .dark-mode .tip-card h3{color:var(--text)} .dark-mode .tip-card p{color:var(--text-light)} .dark-mode .tips-footer p{color:var(--text)} .related-tools-container{position:relative;background-color:var(--primary-light)} .related-tools{padding:80px 0;position:relative} .related-tools .section-container{max-width:var(--max-width);margin:0 auto;position:relative;z-index:2} .related-tools .section-title-container{text-align:center;margin-bottom:60px} .related-tools .section-title-container h2{font-size:2.5rem;margin-bottom:15px;color:var(--primary-dark);display:flex;align-items:center;justify-content:center;gap:15px} .related-tools .section-title-container h2 i{color:var(--primary);font-size:2.2rem} .related-tools .section-subtitle{font-size:1.2rem;color:var(--text-light);max-width:700px;margin:0 auto;line-height:1.6} .related-tools-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:30px;margin-top:40px} .related-tool-card{background:var(--white);border-radius:16px;padding:35px 30px;text-align:center;transition:all 0.4s cubic-bezier(0.175,0.885,0.32,1.275);border:1px solid var(--border-light);box-shadow:var(--shadow-sm);position:relative;overflow:hidden;display:flex;flex-direction:column;align-items:center;text-decoration:none;color:inherit} .related-tool-card::before{content:'';position:absolute;top:0;left:0;width:100%;height:100%;background:linear-gradient(135deg,rgba(65,120,212,0.03) 0%,rgba(255,255,255,0) 100%);opacity:0;transition:opacity 0.3s ease;z-index:1} .related-tool-card:hover{transform:translateY(-5px);box-shadow:var(--shadow-md)} .related-tool-card:hover::before{opacity:1} .related-tool-card::after{content:'';position:absolute;top:-1px;left:-1px;right:-1px;bottom:-1px;border-radius:17px;border:2px solid transparent;background:linear-gradient(135deg,var(--primary-light),var(--primary)) border-box;-webkit-mask:linear-gradient(#fff 0 0) padding-box,linear-gradient(#fff 0 0);-webkit-mask-composite:destination-out;mask-composite:exclude;opacity:0;transition:opacity 0.3s ease} .related-tool-card:hover::after{opacity:1} .related-tool-card .svg-icon{font-size:2.5rem;margin-bottom:20px;color:var(--primary);transition:all 0.3s ease;background:var(--primary-extra-light);width:70px;height:70px;border-radius:50%;display:flex;align-items:center;justify-content:center;position:relative;z-index:2;padding:15px} .related-tool-card:hover .svg-icon{transform:scale(1.1);color:var(--white);background:linear-gradient(135deg,var(--primary),var(--primary-dark));box-shadow:0 5px 15px rgba(65,120,212,0.3)} .related-tool-card h3{font-size:1.4rem;margin:0 0 15px;color:var(--text);font-weight:600;position:relative;z-index:2} .related-tool-card p{color:var(--text-light);line-height:1.6;margin:0;font-size:1.05rem;position:relative;z-index:2} .related-tool-card:nth-child(1) .svg-icon{color:#E91E63;background-color:rgba(233,30,99,0.1)} .related-tool-card:nth-child(2) .svg-icon{color:#2196F3;background-color:rgba(33,150,243,0.1)} .related-tool-card:nth-child(3) .svg-icon{color:#4CAF50;background-color:rgba(76,175,80,0.1)} .related-tool-card:nth-child(4) .svg-icon{color:#FF9800;background-color:rgba(255,152,0,0.1)} .related-tool-card:nth-child(1):hover .svg-icon{background:linear-gradient(135deg,#E91E63,#AD1457)} .related-tool-card:nth-child(2):hover .svg-icon{background:linear-gradient(135deg,#2196F3,#1565C0)} .related-tool-card:nth-child(3):hover .svg-icon{background:linear-gradient(135deg,#4CAF50,#2E7D32)} .related-tool-card:nth-child(4):hover .svg-icon{background:linear-gradient(135deg,#FF9800,#EF6C00)} .related-tool-card .svg-icon svg{width:30px;height:30px} @media (max-width:768px){.related-tools{padding:60px 15px} .related-tools .section-title-container h2{font-size:2rem} .related-tools .section-subtitle{font-size:1.1rem} .related-tools-grid{grid-template-columns:1fr;gap:20px;max-width:500px;margin:0 auto;margin-top:30px} .related-tool-card{padding:25px 20px} .related-tool-card h3{font-size:1.2rem} .related-tool-card p{font-size:1rem} } @media (max-width:480px){.related-tools{padding:50px 10px} .related-tools .section-title-container h2{font-size:1.8rem} .related-tools .section-subtitle{font-size:1rem} .related-tool-card{padding:20px 15px} .related-tool-card h3{font-size:1.1rem} .related-tool-card p{font-size:0.95rem} } .section-divider{position:relative;width:100%;overflow:hidden;line-height:0;z-index:1} .section-divider svg{position:relative;display:block;width:calc(100% + 1.3px);height:60px} .divider-svg{fill:currentColor} .divider-wave--bg-secondary .divider-svg{fill:var(--bg-secondary)} .divider-wave--white .divider-svg{fill:var(--white)} .divider-wave--bg .divider-svg{fill:var(--bg)} .wave--primary-extra-light .divider-svg{fill:var(--bg-secondary)} .divider-wave .divider-svg{fill:var(--bg)} .divider-wave--primary-light .divider-svg{fill:var(--primary-light)} .wave .divider-svg{fill:var(--bg-secondary)} .wave--bg-secondary .divider-svg{fill:var(--bg-secondary)} .wave--bg .divider-svg{fill:var(--bg)} .divider-wave--primary-light .divider-svg{fill:var(--primary-light)} .flip-top-to-bottom{transform:rotateX(180deg)} @media (max-width:768px){.section-divider svg{height:40px} .features-divider,.use-cases-divider,.about-divider,.faq-divider{height:50px} } @media (max-width:480px){.section-divider svg{height:30px} .features-divider,.use-cases-divider,.about-divider,.faq-divider{height:40px} } .wifi .icon-bg{background:linear-gradient(135deg,#4facfe 0%,#00f2fe 100%)} .events .icon-bg{background:linear-gradient(135deg,#ff758c 0%,#ff7eb3 100%)} .business .icon-bg{background:linear-gradient(135deg,#6a11cb 0%,#2575fc 100%)} .coupons .icon-bg{background:linear-gradient(135deg,#f83600 0%,#f9d423 100%)} .products .icon-bg{background:linear-gradient(135deg,#43e97b 0%,#38f9d7 100%)} .restaurant .icon-bg{background:linear-gradient(135deg,#fa709a 0%,#fee140 100%)} .designers .icon-bg{background:linear-gradient(135deg,#00cdac 0%,#8ddad5 100%)} .legal .icon-bg{background:linear-gradient(135deg,#4facfe 0%,#00f2fe 100%)} .realestate .icon-bg{background:linear-gradient(135deg,#43e97b 0%,#38f9d7 100%)} .healthcare .icon-bg{background:linear-gradient(135deg,#fa709a 0%,#fee140 100%)} .writers .icon-bg{background:linear-gradient(135deg,#667eea 0%,#764ba2 100%)} .students .icon-bg{background:linear-gradient(135deg,#f093fb 0%,#f5576c 100%)} .content .icon-bg{background:linear-gradient(135deg,#4facfe 0%,#00f2fe 100%)} .translators .icon-bg{background:linear-gradient(135deg,#fa709a 0%,#fee140 100%)} .researchers .icon-bg{background:linear-gradient(135deg,#a8edea 0%,#fed6e3 100%)} .bg-purple{background:var(--color-purple)} .bg-pink{background:var(--color-pink)} .bg-blue{background:var(--color-blue)} .bg-green{background:var(--color-green)} .bg-orange{background:var(--color-orange)} .bg-red{background:var(--color-red)} .bg-teal{background:var(--color-teal)} .bg-indigo{background:var(--color-indigo)} .bg-cyan{background:var(--color-cyan)} .bg-lime{background:var(--color-lime)} .bg-amber{background:var(--color-amber)} .bg-rose{background:var(--color-rose)} .bg-violet{background:var(--color-violet)} .bg-emerald{background:var(--color-emerald)} .bg-sky{background:var(--color-sky)} .bg-fuchsia{background:var(--color-fuchsia)} .bg-gold{background:var(--color-gold)} .bg-coral{background:var(--color-coral)} .bg-mint{background:var(--color-mint)} .bg-lavender{background:var(--color-lavender)} .bg-sunset{background:var(--color-sunset)} .bg-ocean{background:var(--color-ocean)} .back-to-top{position:fixed;bottom:30px;right:30px;width:50px;height:50px;background:var(--primary);color:white;border:none;border-radius:50%;cursor:pointer;display:none;align-items:center;justify-content:center;box-shadow:0 4px 20px rgba(0,0,0,0.15);transition:all 0.3s ease;z-index:1000;opacity:0;transform:translateY(20px)} .back-to-top.visible{display:flex;opacity:1;transform:translateY(0)} .back-to-top:hover{background:var(--primary-dark);transform:translateY(-2px);box-shadow:0 6px 25px rgba(0,0,0,0.2)} .back-to-top:active{transform:translateY(0)} .back-to-top .svg-icon{width:20px;height:20px} @media (max-width:768px){.back-to-top{bottom:20px;right:20px;width:45px;height:45px} } .back-to-top:focus{outline:2px solid var(--primary);outline-offset:2px} .back-to-top{position:fixed;bottom:20px;right:20px;width:50px;height:50px;background:var(--primary);color:white;border:none;border-radius:50%;cursor:pointer;display:none;align-items:center;justify-content:center;box-shadow:0 4px 20px rgba(0,0,0,0.15);transition:all 0.3s ease;z-index:1000;opacity:0;transform:translateY(20px);margin:0;padding:0;box-sizing:border-box} .back-to-top.visible{display:flex;opacity:1;transform:translateY(0)} .back-to-top:hover{background:var(--primary-dark);transform:translateY(-2px);box-shadow:0 6px 25px rgba(0,0,0,0.2)} .back-to-top:active{transform:translateY(0)} .back-to-top .svg-icon{width:20px;height:20px} @media (max-width:768px){.back-to-top{bottom:80px;right:15px;width:44px;height:44px;bottom:max(20px,env(safe-area-inset-bottom,20px));right:max(15px,env(safe-area-inset-right,15px))} .back-to-top .svg-icon{width:18px;height:18px} .tool-container{margin:40px auto !important;padding:var(--padding-vertical) 10px} } @media (max-width:480px){.back-to-top{bottom:70px;right:12px;width:42px;height:42px} } .tool-container{position:relative;width:100%;max-width:var(--max-width);margin:60px auto;margin-bottom:50px !important;padding:var(--padding-vertical) var(--padding-horizontal)} .tool-header{position:relative;text-align:center;margin-bottom:40px} .tool-header h1{font-size:2.4rem;margin-bottom:8px;color:var(--primary);font-weight:700;letter-spacing:-0.5px} .tool-subtitle{font-size:1.1rem;color:var(--text-light);max-width:600px;margin:0 auto;font-weight:400} @media (max-width:1024px){.tool-header h1{font-size:2.1rem} } @media (max-width:768px){.tool-header{margin-bottom:30px} .tool-header h1{font-size:1.8rem} .tool-subtitle{font-size:1.1rem} } .logo{display:flex;align-items:center;text-decoration:none} .svg-logo{width:120px;height:auto;display:block} .logo:hover .svg-logo{opacity:0.8;transition:opacity 0.2s ease} @media (max-width:768px){.svg-logo{width:120px} } @media (max-width:480px){.svg-logo{width:120px} } .main-header h2{font-size:1.9rem;margin-bottom:15px;color:var(--dark);display:inherit !important;align-items:center;justify-content:center;gap:15px} .main-header h2 .svg-icon{width:32px;height:32px;color:var(--primary)} .coming-soon-card{position:relative;background:linear-gradient(135deg,var(--dark) 0%,var(--secondary) 100%);border:1px solid var(--border);color:var(--white)} .coming-soon-card::before{content:'';position:absolute;top:0;left:0;right:0;bottom:0;background:linear-gradient(135deg,rgba(30,41,59,0.9) 0%,rgba(69,90,100,0.8) 100%);border-radius:12px;z-index:1} .coming-soon-card > *{position:relative;z-index:2} .coming-soon-card .tool-icon{background:rgba(255,255,255,0.1);backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,0.2)} .coming-soon-card .tool-icon .svg-icon{color:var(--white);filter:brightness(0.9)} .coming-soon-card h3{color:#ffffff} .coming-soon-card p{color:rgba(255,255,255,0.8)} .coming-soon-card .tool-tag{background:rgba(255,255,255,0.15);color:rgba(255,255,255,0.9);border:1px solid rgba(255,255,255,0.2)} @keyframes pulse-glow{0%{box-shadow:0 2px 8px rgba(255,109,0,0.4);transform:scale(1)} 50%{box-shadow:0 2px 20px rgba(255,109,0,0.6);transform:scale(1.05)} 100%{box-shadow:0 2px 8px rgba(255,109,0,0.4);transform:scale(1)} } .coming-soon-card .tool-icon{animation:subtle-float 3s ease-in-out infinite} @keyframes subtle-float{0%,100%{transform:translateY(0px)} 50%{transform:translateY(-5px)} } .coming-soon-card:hover{transform:none;cursor:not-allowed} .coming-soon-card:hover .tool-icon{transform:none;animation:subtle-float 3s ease-in-out infinite} .coming-soon-card .tool-card-link{cursor:not-allowed;pointer-events:none} .dark-mode .coming-soon-card{background:linear-gradient(135deg,var(--bg-secondary) 0%,var(--light) 100%);border:1px solid var(--border-light)} .dark-mode .coming-soon-card::before{background:linear-gradient(135deg,rgba(30,41,59,0.7) 0%,rgba(69,90,100,0.6) 100%)} .why-choose-us-section-container{position:relative;background:var(--bg)} .why-choose-us-section{position:relative;overflow:hidden} .why-choose-us-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:30px} .why-choose-us-card{background:var(--white);border-radius:12px;padding:30px 30px;position:relative;overflow:hidden;box-shadow:var(--shadow-sm);transition:all 0.4s cubic-bezier(0.175,0.885,0.32,1.275);z-index:1;border:1px solid var(--border-light);text-align:center;display:flex;flex-direction:column;align-items:center} .why-choose-us-card:hover{transform:translateY(-10px);box-shadow:var(--shadow-md)} .why-choose-us-card .icon-bg{width:70px;height:70px;border-radius:18px;display:flex;align-items:center;justify-content:center;margin-bottom:25px;font-size:28px;color:white;position:relative} .why-choose-us-card .icon-bg .svg-icon{width:32px;height:32px} .why-choose-us-card h3{font-size:1.4rem;color:var(--text);margin-bottom:15px;font-weight:600} .why-choose-us-card p{color:var(--text-light);line-height:1.6;margin:0;font-size:1.05rem} .why-choose-us-card .hover-effect{position:absolute;width:100%;height:100%;top:0;left:0;background:linear-gradient(135deg,var(--primary-extra-light) 0%,rgba(255,255,255,0) 100%);opacity:0;transition:opacity 0.3s ease;z-index:-1} .why-choose-us-card:hover .hover-effect{opacity:1} @media (max-width:768px){.why-choose-us-grid{grid-template-columns:1fr;gap:20px} .why-choose-us-card{padding:30px 25px} } @media (max-width:480px){.why-choose-us-card{padding:25px 20px} .why-choose-us-card h3{font-size:1.2rem} } .dark-mode .why-choose-us-section-container{background:var(--bg)} .dark-mode .why-choose-us-card{background:var(--white);border-color:var(--border)} .dark-mode .why-choose-us-card h3{color:var(--text)} .dark-mode .why-choose-us-card p{color:var(--text-light)} .search-modal{display:none;position:fixed;top:0;left:0;width:100%;height:100%;background:rgba(30,41,59,0.9);z-index:10000;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);animation:modalAppear 0.3s cubic-bezier(0.4,0,0.2,1)} .dark-mode .search-modal{background:rgba(15,23,42,0.95)} .search-modal-content{background:var(--white);margin:50px auto;padding:0;border-radius:var(--radius-lg);max-width:700px;max-height:calc(100vh - 100px);box-shadow:var(--shadow-lg);border:1px solid var(--border-light);animation:contentSlideUp 0.3s cubic-bezier(0.4,0,0.2,1);overflow:hidden;display:flex;flex-direction:column} .dark-mode .search-modal-content{background:var(--bg-secondary);border-color:var(--border)} .search-header{display:flex;justify-content:space-between;align-items:center;padding:1.25rem 2rem;border-bottom:1px solid var(--border-light);background:var(--bg);flex-shrink:0} .dark-mode .search-header{border-bottom-color:var(--border);background:var(--bg)} .search-title-group{display:flex;align-items:center;gap:1rem} .search-icon-title{display:flex;align-items:center;gap:0.75rem} .search-icon-title .svg-icon{width:24px;height:24px;color:var(--primary)} .search-icon-title h3{margin:0;font-size:1.25rem;font-weight:600;color:var(--text);background:var(--color-indigo);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text} .search-shortcut-hint{display:flex;align-items:center;gap:0.25rem;padding:0.25rem 0.5rem;background:var(--primary-extra-light);border-radius:var(--radius-sm);font-size:0.75rem;color:var(--primary)} .search-shortcut-hint kbd{padding:0.125rem 0.375rem;background:var(--white);border:1px solid var(--border-light);border-radius:4px;font-size:0.7rem;font-weight:600;box-shadow:var(--shadow-sm)} .dark-mode .search-shortcut-hint kbd{background:var(--bg);border-color:var(--border)} .close-search{background:var(--primary-extra-light);border:none;cursor:pointer;padding:0.5rem;border-radius:var(--radius-sm);transition:var(--transition);color:var(--primary)} .close-search:hover{background:var(--primary-light);transform:scale(1.05)} .search-input-container{position:relative;padding:1.5rem 2rem;flex-shrink:0} .search-input-icon{position:absolute;left:3rem;top:50%;transform:translateY(-50%);width:20px;height:20px;color:var(--text-light);z-index:2;pointer-events:none;transition:var(--transition)} #searchInput{width:100%;padding:1rem 1rem 1rem 3.5rem;border:2px solid var(--border-light);border-radius:var(--radius-md);font-size:1.1rem;background:var(--white);color:var(--text);transition:var(--transition);box-shadow:var(--shadow-sm)} #searchInput:focus{outline:none;border-color:var(--primary);box-shadow:0 0 0 3px var(--primary-light);transform:translateY(-1px)} .dark-mode #searchInput{background:var(--bg);border-color:var(--border);color:var(--text)} .search-loading{position:absolute;right:3rem;top:50%;transform:translateY(-50%);display:none} .loading-spinner{width:20px;height:20px;border:2px solid var(--primary-light);border-top:2px solid var(--primary);border-radius:50%;animation:spin 1s linear infinite} .search-suggestions{padding:0 2rem 1rem;flex-shrink:0} .suggestion-tags{display:flex;align-items:center;gap:0.75rem;flex-wrap:wrap} .suggestion-label{font-size:0.875rem;color:var(--text-light);font-weight:500} .suggestion-tag{padding:0.375rem 0.75rem;background:var(--primary-extra-light);border:1px solid var(--primary-light);border-radius:20px;font-size:0.875rem;color:var(--primary);cursor:pointer;transition:var(--transition);font-weight:500} .suggestion-tag:hover{background:var(--primary-light);transform:translateY(-1px)} .search-results-container{max-height:calc(100vh - 100px);overflow-y:auto;flex:1} .search-results-container::-webkit-scrollbar{width:10px} .search-results-container::-webkit-scrollbar-track{background:var(--bg-secondary);border-radius:6px;margin:4px} .search-results-container::-webkit-scrollbar-thumb{background:linear-gradient(135deg,var(--primary) 0%,var(--primary-dark) 100%);border-radius:6px;border:2px solid var(--bg-secondary);box-shadow:0 2px 4px rgba(0,0,0,0.1)} .search-results-container::-webkit-scrollbar-thumb:hover{background:linear-gradient(135deg,var(--primary-dark) 0%,var(--primary-darker) 100%);border:1px solid var(--bg-secondary)} .dark-mode .search-results-container::-webkit-scrollbar-thumb{background:linear-gradient(135deg,var(--primary) 0%,var(--primary-dark) 100%);box-shadow:0 2px 4px rgba(0,0,0,0.3)} .search-modal-content{scrollbar-width:thin;scrollbar-color:var(--primary-light) var(--bg-secondary)} .search-modal{overflow:hidden} .search-results-header{display:flex;justify-content:space-between;align-items:center;padding:1rem 2rem;background:var(--bg);border-bottom:1px solid var(--border-light)} .dark-mode .search-results-header{background:var(--bg);border-bottom-color:var(--border)} .results-count{font-size:0.875rem;color:var(--text-light);font-weight:500} .results-filters{display:flex;gap:0.5rem} .filter-btn{padding:0.375rem 0.75rem;background:transparent;border:1px solid var(--border-light);border-radius:20px;font-size:0.75rem;color:var(--text-light);cursor:pointer;transition:var(--transition)} .filter-btn.active,.filter-btn:hover{background:var(--primary);border-color:var(--primary);color:var(--white)} .search-results{padding:1rem} .search-result-item{display:flex;align-items:flex-start;gap:1rem;padding:1.25rem;border-radius:var(--radius-md);cursor:pointer;transition:var(--transition);margin-bottom:0.5rem;border:1px solid var(--border-light)} .search-result-item:hover{background:var(--primary-extra-light);border-color:var(--primary-light);transform:translateX(4px)} .search-result-item:last-child{margin-bottom:0} .search-modal-content .svg-icon{width:20px;height:20px} .search-result-icon{flex-shrink:0;width:40px;height:40px;background:var(--primary-extra-light);border-radius:var(--radius-md);display:flex;align-items:center;justify-content:center;color:var(--primary)} .search-result-content{flex:1} .search-result-content h4{margin:0 0 0.5rem 0;font-size:1.1rem;font-weight:600;color:var(--text)} .search-result-content p{margin:0 0 0.5rem 0;color:var(--text-medium);font-size:0.9rem;line-height:1.4} .search-result-meta{display:flex;gap:1rem;align-items:center} .search-category{background:var(--primary);color:var(--white);padding:0.25rem 0.75rem;border-radius:12px;font-size:0.75rem;font-weight:600} .search-tags{font-size:0.75rem;color:var(--text-light)} .search-footer{padding:1.5rem 2rem;border-top:1px solid var(--border-light);background:var(--bg)} .dark-mode .search-footer{border-top-color:var(--border);background:var(--bg)} .search-tips{display:flex;align-items:center;gap:0.75rem;font-size:0.875rem;color:var(--text-light)} .search-tips .svg-icon{width:16px;height:16px;color:var(--primary)} .search-tips kbd{padding:0.125rem 0.375rem;background:var(--white);border:1px solid var(--border-light);border-radius:4px;font-size:0.7rem;font-weight:600;box-shadow:var(--shadow-sm)} .dark-mode .search-tips kbd{background:var(--bg);border-color:var(--border)} .no-results{text-align:center;padding:1rem 2rem;color:var(--text-light)} .no-results .svg-icon{width:64px;height:64px;margin-bottom:1rem;opacity:0.5} .no-results p{margin:0;font-size:1rem} @keyframes modalAppear{from{opacity:0} to{opacity:1} } @keyframes contentSlideUp{from{opacity:0;transform:translateY(30px) scale(0.95)} to{opacity:1;transform:translateY(0) scale(1)} } @keyframes spin{0%{transform:rotate(0deg)} 100%{transform:rotate(360deg)} } .search-results-container::-webkit-scrollbar{width:6px} .search-results-container::-webkit-scrollbar-track{background:var(--bg-secondary)} .search-results-container::-webkit-scrollbar-thumb{background:var(--primary-light);border-radius:3px} .search-results-container::-webkit-scrollbar-thumb:hover{background:var(--primary)} @media (max-width:768px){.search-modal-content{margin:0;border-radius:0;height:100%;max-width:none} .search-header,.search-input-container,.search-suggestions,.search-results-header,.search-footer{padding-left:1.5rem;padding-right:1.5rem} .search-results{padding:0.75rem} .results-filters{flex-wrap:wrap} } @media (max-width:360px){.search-title-group{flex-direction:column;align-items:flex-start;gap:0.5rem} } @media (max-width:768px){.search-modal-content{overflow-y:auto;-webkit-overflow-scrolling:touch} .search-results-container{overflow-y:visible;flex:none} body.search-modal-open{overflow:hidden} } .cookie-consent-banner{position:fixed;bottom:1rem;left:2rem;right:2rem;background:var(--white);padding:1.5rem;box-shadow:0 8px 40px rgba(0,0,0,0.15);border-radius:20px;z-index:1000;display:none;transform:translateY(100%);opacity:0;transition:all 0.5s cubic-bezier(0.4,0,0.2,1);border:1px solid var(--border);max-width:900px;margin:0 auto} .cookie-consent-banner.active{display:block;transform:translateY(0);opacity:1} .consent-content{display:flex;align-items:center;justify-content:space-between;gap:2rem;max-width:none} .consent-text{flex:1} .cookie-header{display:flex;align-items:flex-start;gap:1rem} .cookie-icon{width:20px;height:20px;color:var(--primary);flex-shrink:0;margin-top:0.125rem} .cookie-title-group{flex:1} .consent-text h4{margin:0 0 0.375rem 0;font-size:1.1rem;font-weight:700;color:var(--text);line-height:1.3} .consent-text p{margin:0;font-size:0.9rem;color:var(--text-medium);line-height:1.4} .consent-actions{display:flex;gap:0.75rem;flex-shrink:0} .primary-action{background:var(--primary);color:var(--white);padding:0.75rem 1.5rem;border-radius:10px;font-weight:600;cursor:pointer;transition:all 0.2s ease;border:none;font-size:0.9rem;white-space:nowrap;box-shadow:0 4px 16px rgba(255,109,0,0.3)} .primary-action:hover{background:var(--primary-dark);transform:translateY(-2px);box-shadow:0 6px 20px rgba(255,109,0,0.4)} .secondary-action{background:transparent;color:var(--primary);padding:0.75rem 1.5rem;border-radius:10px;font-weight:600;cursor:pointer;transition:all 0.2s ease;border:2px solid var(--primary);font-size:0.9rem;white-space:nowrap} .secondary-action:hover{background:rgba(255,109,0,0.1);transform:translateY(-1px)} .cookie-notification{position:fixed;top:2rem;right:2rem;background:#10b981;color:white;padding:1rem 1.5rem;border-radius:12px;display:flex;align-items:center;gap:0.75rem;box-shadow:0 8px 24px rgba(0,0,0,0.15);transform:translateX(100%);transition:all 0.3s cubic-bezier(0.4,0,0.2,1);z-index:1001;border:1px solid rgba(255,255,255,0.1)} .cookie-notification.show{transform:translateX(0)} .cookie-notification .svg-icon{width:20px;height:20px;flex-shrink:0} .cookie-preferences:target{animation:highlight-section 2s ease} @keyframes highlight-section{0%{background-color:rgba(255,109,0,0.1);transform:scale(1.02)} 100%{background-color:transparent;transform:scale(1)} } .cookie-preferences{scroll-margin-top:100px} html{scroll-behavior:smooth} @media (max-width:1024px){.cookie-consent-banner{left:1.5rem;right:1.5rem;bottom:1.5rem;padding:1.25rem;border-radius:16px} .consent-content{gap:1.5rem} } @media (max-width:768px){.cookie-consent-banner{left:1rem;right:1rem;bottom:1rem;padding:1.25rem;border-radius:14px} .consent-content{flex-direction:column;text-align:left;gap:1.25rem;align-items:stretch} .cookie-header{gap:0.75rem} .consent-text h4{font-size:1rem;margin-bottom:0.25rem} .consent-text p{font-size:0.85rem;line-height:1.4} .consent-actions{width:100%;justify-content:center} .primary-action,.secondary-action{flex:1;padding:0.875rem 1rem;font-size:0.875rem} .cookie-notification{left:1rem;right:1rem;top:1rem;transform:translateY(-100%)} .cookie-notification.show{transform:translateY(0)} } @media (max-width:480px){.cookie-consent-banner{left:0.75rem;right:0.75rem;bottom:0.75rem;padding:1.125rem;border-radius:12px} .consent-content{gap:1rem} .cookie-header{gap:0.5rem} .cookie-icon{width:18px;height:18px} .consent-text h4{font-size:0.95rem} .consent-text p{font-size:0.8rem} .consent-actions{flex-direction:column;gap:0.5rem} .primary-action,.secondary-action{width:100%;padding:0.75rem 1rem} } .dark-mode .cookie-consent-banner{background:var(--bg-secondary);border:1px solid var(--border);box-shadow:0 8px 40px rgba(0,0,0,0.4)} .dark-mode .consent-text h4{color:var(--dark)} .dark-mode .consent-text p{color:var(--text-medium)} @media (hover:none) and (pointer:coarse){.primary-action:hover,.secondary-action:hover{transform:none} .primary-action:active,.secondary-action:active{transform:scale(0.98)} } @media (prefers-reduced-motion:reduce){.cookie-consent-banner{transition:opacity 0.3s ease;transform:none} .primary-action,.secondary-action{transition:none} .cookie-preferences:target{animation:none} } .cookie-settings-link{background:none;border:none;color:var(--gray);font:inherit;text-decoration:none;cursor:pointer;padding:0;margin:0;width:100%;text-align:left} .cookie-settings-link:hover{color:var(--white);text-decoration:none} .footer-links .cookie-settings-link{display:block;padding:0.25rem 0;transition:color 0.2s ease} .contact-section{text-align:center;padding:3rem 2rem;background:var(--bg-secondary);border-radius:var(--radius-lg);margin-top:4rem} .contact-section h3{font-size:1.75rem;margin-bottom:1rem;color:var(--text)} .contact-section p{font-size:1.125rem;margin-bottom:2rem;color:var(--text-medium);max-width:600px;margin-left:auto;margin-right:auto} .contact-email{display:inline-flex;align-items:center;gap:0.75rem;padding:1rem 2rem;background:var(--primary);color:var(--white);border-radius:var(--radius-md);text-decoration:none;font-weight:600;transition:var(--transition)} .contact-email:hover{background:var(--primary-dark);transform:translateY(-2px);box-shadow:var(--shadow-md)} .contact-email svg{width:20px;height:20px} // .hero-container{position:relative;margin-bottom:3rem} .all-tools-hero{background:linear-gradient(135deg,var(--primary) 0%,var(--primary-dark) 100%);color:white;padding:4rem 0 3rem;position:relative;overflow:hidden} .all-tools-hero::before{content:'';position:absolute;top:0;left:0;right:0;bottom:0;background-size:cover} .all-tools-hero-content{text-align:center;position:relative;z-index:2} .all-tools-hero h1{font-size:2.75rem;margin-bottom:0.75rem;font-weight:700;text-shadow:0 2px 4px rgba(0,0,0,0.1)} .all-tools-hero p{font-size:1.25rem;opacity:0.95;margin-bottom:2.5rem;font-weight:500} .all-tools-filter{max-width:900px;margin:0 auto;position:relative;margin-bottom:1.5rem} .all-tools-search-container{position:relative;transition:var(--transition)} #allToolsSearch{width:100%;padding:1.25rem 3rem 1.25rem 3rem;font-size:1.1rem;border:none;border-radius:50px;box-shadow:var(--shadow-lg);transition:var(--transition);background:var(--white);color:var(--text);border:2px solid transparent;font-family:inherit;line-height:normal;vertical-align:middle;box-sizing:border-box} #allToolsSearch:focus{outline:none;box-shadow:0 20px 50px rgba(255,109,0,0.25);border-color:var(--primary);transform:none} .all-tools-search-container:focus-within{transform:translateY(-3px)} #allToolsSearch::placeholder{color:var(--text-light);font-family:inherit;line-height:normal;vertical-align:middle} .all-tools-search-icon{position:absolute;left:1.5rem;top:50%;transform:translateY(-50%);color:var(--primary);pointer-events:none;transition:none !important;display:flex;align-items:center;justify-content:center;height:20px;width:20px} .all-tools-clear-search{position:absolute;right:1.5rem;top:50%;transform:translateY(-50%);background:none;border:none;color:var(--text-light);cursor:pointer;padding:0.25rem;border-radius:50%;transition:var(--transition);opacity:0;visibility:hidden;display:flex;align-items:center;justify-content:center;height:24px;width:24px} .all-tools-clear-search:hover{background:var(--primary-extra-light);color:var(--primary)} .all-tools-clear-search.visible{opacity:1;visibility:visible} .all-tools-search-stats{text-align:center;margin-bottom:1.5rem;color:rgba(255,255,255,0.9);font-size:0.95rem} .all-tools-quick-actions{display:flex;justify-content:center;gap:1rem;margin-top:2rem;flex-wrap:wrap} .all-tools-quick-action-btn{padding:0.6rem 1.2rem;background:rgba(255,255,255,0.2);color:white;border:1px solid rgba(255,255,255,0.3);border-radius:20px;cursor:pointer;transition:var(--transition);font-size:0.85rem;backdrop-filter:blur(10px)} .all-tools-quick-action-btn:hover{background:rgba(255,255,255,0.3);transform:translateY(-2px)} .all-tools-highlight{background:linear-gradient(120deg,var(--primary-light) 0%,var(--primary-extra-light) 100%);padding:0.1rem 0.3rem;border-radius:4px;font-weight:600} .all-tools-no-results{grid-column:1 / -1;text-align:center;padding:1rem 2rem 4rem;color:var(--text-light);margin-top:-80px} .all-tools-no-results h3{font-size:1.5rem;margin-bottom:1rem;color:var(--text-medium)} .all-tools-no-results p{font-size:1.1rem;opacity:0.8} .all-tools-show-all-btn{padding:0.6rem 1.2rem;background:var(--primary);color:white;border:1px solid var(--primary);border-radius:20px;cursor:pointer;transition:var(--transition);font-size:0.85rem;font-weight:500} .all-tools-show-all-btn:hover{background:var(--primary-dark);border-color:var(--primary-dark);transform:translateY(-2px);color:white} @media (max-width:768px){.all-tools-hero{padding:3rem 0 2rem} .all-tools-hero h1{font-size:2.25rem} .all-tools-hero p{font-size:1.1rem} #allToolsSearch{padding:1rem 3rem 1rem 3rem} .all-tools-quick-actions{gap:0.5rem} .all-tools-quick-action-btn{padding:0.5rem 1rem;font-size:0.8rem} } .contact-wrapper-section{position:relative;background-color:var(--primary-light)} .contact-container{padding:3rem 1.5rem;position:relative;overflow:hidden} .support-promo{max-width:800px;margin:0 auto;text-align:center;border-radius:12px;padding:2rem 2rem;background:var(--white);box-shadow:var(--shadow-md)} .support-promo .message-svg-icon{width:60px;height:60px;color:var(--primary);margin-bottom:.7rem} .support-promo h3{font-size:1.75rem;margin-bottom:.7rem;color:var(--text)} .support-promo p{font-size:1.125rem;margin-bottom:1.5rem;color:var(--text-medium);max-width:600px;margin-left:auto;margin-right:auto} .support-promo .contact-email{display:inline-flex;align-items:center;gap:0.75rem;padding:1rem 2rem;background:var(--primary);color:var(--white);border-radius:var(--radius-md);text-decoration:none;font-weight:600;transition:var(--transition)} .support-promo .contact-email:hover{opacity:0.9;transform:translateY(-2px);box-shadow:var(--shadow-md)} .support-promo .contact-email svg{width:20px;height:20px} .all-tools-category-filter{position:relative;display:inline-block;margin-left:12px;z-index:1001} .all-tools-category-btn{display:flex;align-items:center;gap:8px;padding:12px 16px;background:var(--white);border:1px solid var(--border);border-radius:var(--radius-md);color:var(--text-medium);font-size:14px;font-weight:500;cursor:pointer;transition:var(--transition);min-width:160px;justify-content:space-between;box-shadow:var(--shadow-sm);position:relative;z-index:1002} .all-tools-category-btn:hover{border-color:var(--primary);box-shadow:var(--shadow-md)} .all-tools-category-btn.active{border-color:var(--primary);color:var(--primary)} .all-tools-category-btn svg{transition:transform 0.2s ease;width:16px;height:16px} .all-tools-category-btn.active svg{transform:rotate(180deg)} .all-tools-category-dropdown{position:absolute;top:100%;left:0;right:0;background:var(--white);border:1px solid var(--border);border-radius:var(--radius-md);box-shadow:var(--shadow-lg);z-index:1003;max-height:400px;overflow-y:auto;margin-top:4px;display:none;visibility:visible !important;opacity:1 !important;transform:none !important} .all-tools-category-dropdown.show{display:block;animation:fadeInDropdown 0.2s ease} @keyframes fadeInDropdown{from{opacity:0;transform:translateY(-8px)} to{opacity:1;transform:translateY(0)} } .all-tools-category-item{padding:12px 16px;cursor:pointer;transition:var(--transition);border-bottom:1px solid var(--border-light);display:flex;align-items:center;justify-content:space-between;color:var(--text-medium);background:var(--white)} .all-tools-category-item:last-child{border-bottom:none} .all-tools-category-item:hover{background:var(--primary-extra-light);color:var(--primary)} .all-tools-category-item.active{background:var(--primary-light);color:var(--primary);font-weight:600} .all-tools-category-count{font-size:12px;color:var(--text-light);background:var(--bg-secondary);padding:2px 6px;border-radius:10px;min-width:24px;text-align:center} .all-tools-category-item.active .all-tools-category-count{background:var(--primary);color:var(--white)} .all-tools-filter{display:flex;align-items:center;gap:12px;flex-wrap:wrap;position:relative;z-index:1000} .all-tools-search-container{flex:1;min-width:300px;position:relative} .all-tools-hero-content,.container,.tools-section{position:relative;overflow:visible !important} main,.hero-container,section{overflow:visible !important} @media (max-width:1024px){.all-tools-filter{gap:10px} .all-tools-search-container{min-width:250px} .all-tools-category-btn{min-width:150px;font-size:13px;padding:10px 14px} .all-tools-category-dropdown{position:absolute;top:100%;left:0;right:0;margin-top:4px} } @media (max-width:768px){.all-tools-filter{flex-direction:row;align-items:center;gap:8px} .all-tools-search-container{min-width:200px;flex:1} .all-tools-category-filter{margin-left:0;flex-shrink:0} .all-tools-category-btn{min-width:140px;font-size:13px;padding:10px 12px;white-space:nowrap} .all-tools-category-dropdown{position:absolute;top:100%;left:0;right:0;margin-top:4px;max-height:300px} .all-tools-category-item{padding:12px 16px;font-size:14px} } @media (max-width:576px){.all-tools-filter{flex-direction:column;align-items:stretch;gap:8px} .all-tools-search-container{min-width:auto;width:100%} .all-tools-category-filter{width:100%} .all-tools-category-btn{width:100%;min-width:auto;justify-content:space-between;font-size:14px;padding:12px 16px} .all-tools-category-dropdown{position:absolute;top:100%;left:0;right:0;margin-top:4px;max-height:300px} .all-tools-category-item{padding:12px 16px;font-size:14px} } @media (max-width:480px){.all-tools-filter{gap:6px} .all-tools-category-dropdown{position:absolute;top:100%;left:0;right:0;margin-top:4px;max-height:280px} .all-tools-category-item{padding:12px 16px;font-size:14px} .all-tools-category-btn,.all-tools-category-item{min-height:44px} } @media (max-width:360px){.all-tools-category-dropdown{max-height:250px} .all-tools-category-item{padding:10px 14px;font-size:13px} .all-tools-category-count{font-size:11px;padding:2px 5px} } .dark-mode .all-tools-category-btn{background:var(--white);border-color:var(--border);color:var(--text-medium)} .dark-mode .all-tools-category-dropdown{background:var(--white);border-color:var(--border)} .dark-mode .all-tools-category-item{background:var(--white);color:var(--text-medium);border-bottom-color:var(--border)} .dark-mode .all-tools-category-item:hover{background:var(--primary-extra-light);color:var(--primary)} .dark-mode .all-tools-category-item.active{background:var(--primary-light);color:var(--primary)} .dark-mode .all-tools-category-count{background:var(--bg-secondary);color:var(--text-light)} .all-tools-category-dropdown{max-width:100vw;box-sizing:border-box} @media (max-width:768px){.all-tools-category-dropdown.upward{top:auto;bottom:100%;margin-top:0;margin-bottom:4px} } .visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}