:root{--bg:#F7F9FC;--surface:#fff;--primary:#2563EB;--primary-hover:#1D4ED8;--accent:#14B8A6;--text:#111827;--muted:#667085;--border:#E5E7EB;--soft:#F1F5F9;--success:#16A34A;--warning:#F59E0B;--error:#DC2626;--shadow:0 10px 30px rgba(17,24,39,.08)}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:Inter,Arial,Helvetica,sans-serif;background:var(--bg);color:var(--text);font-size:16px;line-height:1.65}a{color:inherit}img,svg{max-width:100%}.container{width:min(1240px,calc(100% - 32px));margin:auto}.skip-link{position:absolute;left:-9999px;top:8px;background:#111827;color:#fff;padding:10px 14px;border-radius:8px;z-index:999}.skip-link:focus{left:8px}.site-header{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.96);border-bottom:1px solid var(--border);backdrop-filter:blur(10px)}.header-inner{min-height:72px;display:flex;align-items:center;gap:22px}.brand{display:flex;align-items:center;gap:10px;text-decoration:none;font-weight:800;font-size:18px;white-space:nowrap}.brand-mark{display:grid;place-items:center;width:36px;height:36px;border-radius:10px;background:var(--primary);color:white}.brand-mark svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:2}.main-nav{margin-left:auto;display:flex;align-items:center;gap:4px;flex-wrap:wrap}.main-nav a{text-decoration:none;color:#374151;padding:9px 10px;border-radius:8px;font-size:14px;font-weight:650}.main-nav a:hover,.main-nav a:focus-visible{background:var(--soft);color:var(--primary)}.menu-toggle{display:none;margin-left:auto;border:1px solid var(--border);background:white;border-radius:10px;min-width:44px;min-height:44px;font-size:22px}.hero{padding:78px 0 44px;background:radial-gradient(circle at 80% 0,rgba(37,99,235,.09),transparent 34%),var(--bg)}.eyebrow{color:var(--primary);font-weight:800;letter-spacing:.06em;text-transform:uppercase;font-size:13px}.hero h1{font-size:clamp(40px,6vw,66px);line-height:1.05;letter-spacing:-.04em;max-width:830px;margin:12px 0 18px}.hero p{font-size:clamp(18px,2vw,21px);max-width:760px;color:var(--muted)}.cta-row{display:flex;gap:12px;flex-wrap:wrap;margin:26px 0}.btn{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:11px 18px;border-radius:11px;text-decoration:none;font-weight:750;border:1px solid transparent}.btn-primary{background:var(--primary);color:white}.btn-primary:hover{background:var(--primary-hover)}.btn-secondary{background:white;border-color:var(--border);color:var(--text)}.search-panel{background:white;border:1px solid var(--border);border-radius:18px;padding:18px;box-shadow:var(--shadow);max-width:900px}.search-label{display:block;font-weight:800;margin-bottom:8px}.tool-search{width:100%;min-height:54px;border:1px solid #CBD5E1;border-radius:12px;padding:0 16px;font:inherit;font-size:17px}.tool-search:focus{outline:3px solid rgba(37,99,235,.2);border-color:var(--primary)}.search-status{margin-top:8px;color:var(--muted);font-size:14px}.value-row{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:30px;max-width:900px}.value-pill{background:rgba(255,255,255,.75);border:1px solid var(--border);border-radius:12px;padding:14px;font-weight:650}.section{padding:62px 0}.section.white{background:white}.section-head{display:flex;align-items:end;justify-content:space-between;gap:20px;margin-bottom:24px}.section-head h2,.category-head h2{font-size:clamp(28px,4vw,40px);line-height:1.15;margin:0 0 8px;letter-spacing:-.025em}.section-head p,.category-head p{color:var(--muted);margin:0;max-width:720px}.category{margin:46px 0}.category-head{display:flex;align-items:end;justify-content:space-between;gap:20px;margin-bottom:16px}.category-link{font-weight:750;color:var(--primary);white-space:nowrap}.tool-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.tool-card{position:relative;display:block;text-decoration:none;background:var(--surface);border:1px solid var(--border);border-radius:16px;padding:20px;min-height:164px;transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease}.tool-card:hover{transform:translateY(-3px);box-shadow:var(--shadow);border-color:#BFDBFE}.tool-card:focus-visible{outline:3px solid rgba(37,99,235,.28);outline-offset:2px}.tool-icon{width:44px;height:44px;display:grid;place-items:center;background:#EFF6FF;color:var(--primary);border-radius:12px;margin-bottom:16px}.tool-icon svg{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:1.8}.tool-card h3{margin:0 0 6px;font-size:20px}.tool-card p{margin:0;color:var(--muted);font-size:15px}.tool-card[hidden],.category[hidden]{display:none!important}.quick-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}.quick-grid .tool-card{min-height:145px}.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.step{background:var(--soft);border-radius:16px;padding:24px}.step-num{width:36px;height:36px;border-radius:50%;display:grid;place-items:center;background:var(--primary);color:white;font-weight:800}.privacy-band{background:#0F172A;color:#F8FAFC}.privacy-band p{color:#CBD5E1}.privacy-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:34px;align-items:center}.privacy-points{display:grid;gap:12px}.privacy-point{border:1px solid #334155;border-radius:14px;padding:16px;background:#111C31}.content-grid{display:grid;grid-template-columns:1fr 1fr;gap:32px}.content-grid h2{font-size:30px;line-height:1.2}.faq{max-width:920px}.faq details{background:white;border:1px solid var(--border);border-radius:12px;margin:10px 0;padding:0 18px}.faq summary{cursor:pointer;font-weight:750;padding:16px 0}.faq p{color:var(--muted)}.filter-row{display:flex;gap:8px;flex-wrap:wrap;margin:18px 0 26px}.filter-btn{border:1px solid var(--border);background:white;border-radius:999px;padding:9px 14px;font:inherit;font-weight:700;cursor:pointer}.filter-btn[aria-pressed=true]{background:var(--primary);color:white;border-color:var(--primary)}.breadcrumb{padding:18px 0;color:var(--muted);font-size:14px}.breadcrumb a{color:var(--primary)}.page-hero{padding:42px 0}.page-hero h1{font-size:clamp(34px,5vw,52px);line-height:1.1;margin:8px 0 12px}.page-hero p{color:var(--muted);max-width:780px;font-size:18px}.prose{max-width:900px}.prose h2{font-size:30px;line-height:1.2;margin-top:38px}.prose h3{font-size:22px}.prose p,.prose li{color:#475569}.notice{padding:16px;border-left:4px solid var(--warning);background:#FFFBEB;border-radius:8px}.blog-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:16px}.blog-card{display:block;text-decoration:none;background:white;border:1px solid var(--border);padding:22px;border-radius:15px}.ad-slot{display:grid;place-items:center;min-height:90px;border:1px dashed #CBD5E1;background:#F8FAFC;color:#94A3B8;border-radius:10px;margin:20px auto;font-size:13px}.site-footer{background:#0B1220;color:#CBD5E1;padding:46px 0 20px}.footer-grid{display:grid;grid-template-columns:1.4fr repeat(3,1fr);gap:28px}.site-footer h3{color:white;font-size:16px}.site-footer a{display:block;color:#CBD5E1;text-decoration:none;margin:7px 0}.site-footer a:hover{color:white}.footer-bottom{border-top:1px solid #263247;margin-top:32px;padding-top:18px;font-size:14px}.empty-state{display:none;padding:32px;background:white;border:1px solid var(--border);border-radius:14px;text-align:center;color:var(--muted)}.empty-state.show{display:block}
@media(max-width:1040px){.main-nav{display:none;position:absolute;left:16px;right:16px;top:72px;background:white;border:1px solid var(--border);border-radius:14px;padding:10px;box-shadow:var(--shadow)}.main-nav.open{display:grid}.main-nav a{font-size:15px}.menu-toggle{display:block}.tool-grid{grid-template-columns:repeat(2,1fr)}.quick-grid{grid-template-columns:repeat(2,1fr)}.footer-grid{grid-template-columns:1fr 1fr}.privacy-grid{grid-template-columns:1fr}}
@media(max-width:700px){.container{width:min(100% - 24px,1240px)}.hero{padding-top:52px}.tool-grid,.quick-grid,.steps,.content-grid,.blog-grid,.value-row{grid-template-columns:1fr}.category-head,.section-head{align-items:flex-start;flex-direction:column}.section{padding:44px 0}.footer-grid{grid-template-columns:1fr}.tool-card{min-height:auto}.main-nav{left:12px;right:12px}.hero h1{font-size:clamp(38px,12vw,54px)}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}