.hero{text-align:center;padding:5rem 0 4rem;background:linear-gradient(180deg,#f8faff,#fff);border-bottom:1px solid var(--border)}.hero-label{display:inline-flex;align-items:center;gap:.4rem;padding:.3rem .75rem;border-radius:100px;background:var(--primary-l);color:var(--primary);font-size:.78rem;font-weight:600;letter-spacing:.02em;margin-bottom:1.25rem}.hero-label svg{width:12px;height:12px}.hero h1{font-size:clamp(2rem,5vw,3rem);font-weight:800;color:var(--text);line-height:1.15;letter-spacing:-.02em;margin-bottom:.875rem}.hero h1 em{color:var(--primary);font-style:normal}.hero-sub{font-size:1.05rem;color:var(--text-m);max-width:460px;margin:0 auto 2.25rem;line-height:1.6}.hero-search-wrap{max-width:520px;margin:0 auto;position:relative}.hero-search{width:100%;padding:.85rem 1.1rem .85rem 2.9rem;border:1.5px solid var(--border);border-radius:var(--radius);font-size:.95rem;color:var(--text);font-family:var(--font);background:var(--bg);box-shadow:var(--shadow);transition:border-color .2s,box-shadow .2s;outline:none}.hero-search:focus{border-color:var(--primary);box-shadow:0 0 0 3px #4f46e51f}.hero-search::placeholder{color:var(--text-l)}.hero-search-icon{position:absolute;left:.9rem;top:50%;transform:translateY(-50%);color:var(--text-l);pointer-events:none}.hero-search-icon svg{width:16px;height:16px}.search-results{display:none;position:absolute;top:calc(100% + .5rem);left:0;right:0;background:var(--bg);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow-m);z-index:50;overflow:hidden}.search-results.visible{display:block}.search-result-item{display:flex;align-items:center;gap:.75rem;padding:.75rem 1rem;font-size:.875rem;color:var(--text);transition:background .1s}.search-result-item:hover{background:var(--bg-soft)}.search-result-cat{font-size:.72rem;color:var(--text-l)}.search-empty{padding:1.5rem;text-align:center;font-size:.875rem;color:var(--text-l)}.categories-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem}.cat-card{display:flex;align-items:flex-start;gap:.9rem;background:var(--bg);border:1px solid var(--border);border-radius:var(--radius);padding:1.1rem 1.15rem;transition:box-shadow .2s,transform .2s,border-color .2s;cursor:pointer}.cat-card:hover{box-shadow:var(--shadow-m);transform:translateY(-2px);border-color:#d1d5db}.cat-icon{width:40px;height:40px;border-radius:9px;display:flex;align-items:center;justify-content:center;font-size:.95rem;font-weight:700;flex-shrink:0;letter-spacing:-.02em}.cat-info{min-width:0}.cat-name{font-size:.92rem;font-weight:700;color:var(--text);margin-bottom:.2rem}.cat-desc{font-size:.78rem;color:var(--text-m);line-height:1.45}.cat-count{font-size:.72rem;color:var(--text-l);margin-top:.3rem}.tools-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:.875rem}.tool-card{display:flex;flex-direction:column;background:var(--bg);border:1px solid var(--border);border-radius:var(--radius);padding:1.2rem;transition:box-shadow .2s,transform .2s,border-color .2s}.tool-card:hover{box-shadow:var(--shadow-m);transform:translateY(-2px);border-color:#d1d5db}.tool-card-top{display:flex;align-items:flex-start;justify-content:space-between;gap:.5rem;margin-bottom:.6rem}.tool-name{font-size:.95rem;font-weight:700;color:var(--text)}.tool-desc{font-size:.845rem;color:var(--text-m);line-height:1.55;flex:1;margin-bottom:.875rem}.tool-card-footer{display:flex;align-items:center;justify-content:space-between;margin-top:auto}.tool-cat-tag{display:inline-block;padding:.18rem .55rem;border-radius:100px;font-size:.7rem;font-weight:600;letter-spacing:.01em}.use-tool{font-size:.82rem;font-weight:600;color:var(--primary);display:flex;align-items:center;gap:.2rem;transition:gap .15s}.use-tool:hover{gap:.4rem}.use-tool svg{width:13px;height:13px}.seo-section{background:var(--bg-soft);border-top:1px solid var(--border);padding:3rem 0}.seo-section p{font-size:.9rem;color:var(--text-m);line-height:1.8;max-width:100%}.seo-section strong{color:var(--text)}@media(max-width:900px){.categories-grid{grid-template-columns:repeat(2,1fr)}}@media(max-width:600px){.categories-grid,.tools-grid{grid-template-columns:1fr}.hero{padding:3.5rem 0 3rem}}