/* Homepage layout aligned to the supplied ToolHub reference. */
body{font-family:Inter,"Segoe UI",Arial,sans-serif;background:#fff;color:#101b39}
.site-header{height:54px;border-bottom:1px solid #e7edf5;background:rgba(255,255,255,.94)}
.header-inner{max-width:1120px;padding:0 2px;gap:28px}
.wordmark{display:inline-flex;align-items:center;gap:0;white-space:nowrap;font:800 20px/1 Inter,"Segoe UI",Arial,sans-serif;letter-spacing:-1.1px;color:#101b39}
.wordmark strong{color:#2861ee;font-weight:800}
.primary-nav{gap:27px;margin:0 auto}
.primary-nav a{font-size:11px;font-weight:500;color:#24314d}
.theme-toggle{height:31px;min-width:91px;padding:0 9px;gap:6px;border:1px solid #dbe3ef;border-radius:999px;background:#f9fbff;color:#24314d;font-size:10px;font-weight:500;box-shadow:none}
.theme-icon{width:14px;height:14px;object-fit:contain}
.theme-caret{width:12px;height:12px;object-fit:contain;margin-left:auto}
.menu-toggle{display:none}
.hero{position:relative;display:grid;grid-template-columns:minmax(0,1.02fr) minmax(0,.98fr);gap:8px;align-items:center;max-width:none;min-height:255px;margin:0;padding:17px max(32px,calc((100vw - 1120px)/2));text-align:left;overflow:hidden;background:radial-gradient(ellipse 36% 75% at 100% 48%,#cfe1ff70 0%,#e7f0ff70 48%,transparent 78%),radial-gradient(ellipse 40% 65% at 0% 87%,#def2ffb5 0%,#edf7ff8c 52%,transparent 83%),linear-gradient(105deg,#f8fcff 0%,#fff 43%,#f5f9ff 100%)}
.hero:before,.hero:after{display:none}
.hero-content{position:relative;z-index:1;max-width:550px;margin:0}
.hero h1{margin:0;color:#101a38;font:800 clamp(37px,4.25vw,54px)/1.035 Inter,"Segoe UI",Arial,sans-serif;letter-spacing:-2.8px}
.hero-highlight{display:block;color:#155eef}
.hero>.hero-content>p{max-width:500px;margin:11px 0 16px;color:#53617d;font-size:14px;line-height:1.45}
.search-form{height:43px;max-width:430px;margin:0;border:1px solid #dce5f3;border-radius:999px;padding:0 7px 0 13px;gap:10px;box-shadow:0 6px 20px #193c7b0b;background:#fff}
.search-icon{width:16px;height:16px;object-fit:contain;flex:none}
.search-form input{font-size:11px;color:#1e2d4a}
.search-form input::placeholder{color:#75839d;opacity:1}
.search-submit{width:37px;height:35px;border-radius:999px;background:#2460f2;box-shadow:none}
.search-submit:hover{transform:translateY(-1px);box-shadow:0 5px 13px #2460f22b}
.search-submit img{display:block;width:15px;height:15px;filter:brightness(0) invert(1)}
.hero-art{position:relative;isolation:isolate;display:grid;place-items:center;width:100%;max-width:505px;height:250px;aspect-ratio:auto;margin:0;justify-self:end}
.hero-art:before{content:"";position:absolute;z-index:-1;inset:8% 4%;border-radius:50%;background:radial-gradient(ellipse,#d8e5ffb8 0%,#edf3ff80 48%,transparent 75%);filter:blur(12px)}
.hero-art img{display:block;width:100%;height:100%;max-width:none;max-height:250px;object-fit:contain;filter:drop-shadow(0 16px 18px #24498716);animation:none}
.popular{max-width:1120px;padding:17px 0 25px}
.section-heading{display:flex;align-items:center;justify-content:space-between;margin:0 0 10px}
.section-heading h2{margin:0;color:#111c3b;font:750 22px/1.2 Inter,"Segoe UI",Arial,sans-serif;letter-spacing:-.7px}
.view-all{display:inline-flex;align-items:center;gap:5px;color:#1559ec;font-size:10px;font-weight:600}
.view-all img{width:13px;height:13px;object-fit:contain}
.tool-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:9px}
.tool-card{display:flex;align-items:center;min-width:0;min-height:70px;gap:10px;padding:9px;border:1px solid #e4eaf4;border-radius:10px;background:#fff;box-shadow:0 4px 12px #1f3d7508;transition:transform .18s,border-color .18s,box-shadow .18s}
.tool-card:hover,.tool-card:focus-visible{transform:translateY(-2px);border-color:#cbd8ef;box-shadow:0 8px 18px #1c3b730f;outline:none}
.tool-icon{display:grid;place-items:center;flex:none;width:36px;height:36px;border-radius:11px}
.tool-icon img{display:block;width:19px;height:19px;object-fit:contain}
.tone-rose{background:#fff0f1}.tone-blue{background:#eaf2ff}.tone-purple{background:#f3eaff}.tone-green{background:#e7f8ef}
.tool-card-copy{flex:1;min-width:0}
.tool-card strong{display:block;overflow:hidden;color:#172342;font-size:10.5px;font-weight:700;line-height:1.25;text-overflow:ellipsis;white-space:nowrap}
.tool-card small{display:-webkit-box;overflow:hidden;margin-top:4px;color:#64718b;font-size:9px;font-weight:400;line-height:1.28;-webkit-box-orient:vertical;-webkit-line-clamp:2}
.tool-arrow{display:block;flex:none;width:13px;height:13px;object-fit:contain}
.empty-state{padding:22px;border:1px dashed #d9e2ee;border-radius:10px;color:#64718b;text-align:center;font-size:12px}
.categories{max-width:1120px;padding:0 0 13px;border:0;background:#fff}
.categories .section-heading{margin:0 0 10px}
.categories .section-heading h2{font-size:20px}
.category-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
.category-link{display:flex;align-items:center;min-width:0;min-height:59px;gap:10px;padding:8px 10px;border:1px solid #e4eaf4;border-radius:10px;background:#fff;box-shadow:0 4px 12px #1f3d7507;transition:transform .18s,border-color .18s,box-shadow .18s}
.category-link:hover,.category-link:focus-visible{transform:translateY(-1px);border-color:#cbd8ef;box-shadow:0 7px 16px #1c3b730d;outline:none}
.category-icon{display:grid;place-items:center;flex:none;width:36px;height:36px;border-radius:11px}
.category-icon img{width:20px;height:20px;object-fit:contain}
.category-link>span:nth-child(2){flex:1;min-width:0}
.category-link strong{display:block;color:#172342;font-size:11px;font-weight:700;line-height:1.25}
.category-link small{display:block;overflow:hidden;margin-top:4px;color:#64718b;font-size:8.5px;line-height:1.25;text-overflow:ellipsis;white-space:nowrap}
.category-arrow{width:13px;height:13px;flex:none;object-fit:contain}
.privacy-note{border:0;background:linear-gradient(105deg,#eff5ff,#e8f1ff)}
.privacy-inner{position:relative;max-width:1120px;min-height:48px;margin:auto;padding:7px 10px;gap:12px;overflow:hidden}
.privacy-lock{z-index:1;width:21px;height:21px;object-fit:contain;flex:none}
.privacy-inner p{z-index:1;display:grid;gap:3px;flex:1;margin:0;color:#54627d;font-size:9px;line-height:1.2}
.privacy-inner p strong{color:#152447;font-size:10px;font-weight:700}
.privacy-inner p small{font-size:8.5px;color:#5b6984}
.privacy-shield{position:absolute;right:18px;bottom:-10px;width:55px;height:55px;object-fit:contain;opacity:.16}
.site-footer{max-width:1120px;margin:0 auto;padding:10px 0 8px}
.footer-main{display:flex;align-items:center;gap:24px;min-height:32px}
.footer-brand{font-size:15px}
.footer-main nav{display:flex;align-items:center;gap:18px;margin:0 auto}
.footer-main nav a{color:#58657f;font-size:8px}
.footer-main nav a:hover{color:#2460f2}
.footer-main>p{margin:0;color:#73809a;font-size:8px;white-space:nowrap}
.footer-bottom{display:none}
@keyframes reference-float{0%,100%{transform:translateY(0)}50%{transform:translateY(-7px)}}
html[data-theme="2"] .hero-art img{animation:reference-float 6s ease-in-out infinite}
@media(max-width:1100px){.header-inner,.popular,.categories,.privacy-inner,.site-footer{padding-left:26px;padding-right:26px}.hero{padding-left:26px;padding-right:26px}.tool-grid{grid-template-columns:repeat(5,minmax(0,1fr))}.tool-card{gap:8px;padding:8px}.tool-icon{width:33px;height:33px}.tool-card strong{font-size:9.5px}.tool-card small{font-size:8px}}
@media(max-width:900px){.primary-nav{gap:15px}.hero{grid-template-columns:minmax(0,1fr) minmax(270px,.85fr)}.hero h1{font-size:clamp(35px,5vw,46px);letter-spacing:-2.2px}.tool-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.category-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:640px){.site-header{height:56px}.header-inner{padding:0 16px;gap:10px}.wordmark{font-size:18px}.menu-toggle{display:flex;margin-left:auto}.primary-nav{position:absolute;top:55px;left:0;right:0;display:none;align-items:stretch;gap:0;padding:10px 18px 15px;background:#fff;border-bottom:1px solid #e7edf5}.primary-nav.is-open{display:flex}.primary-nav a{padding:10px 3px;font-size:12px}.theme-toggle{min-width:34px;width:36px;height:34px;padding:0;justify-content:center}.theme-toggle-label,.theme-caret{display:none}.hero{display:flex;flex-direction:column;align-items:stretch;min-height:0;padding:33px 18px 13px;gap:0}.hero-content{width:100%}.hero h1{font-size:40px;line-height:1.04;letter-spacing:-2px}.hero>.hero-content>p{margin:10px 0 14px;font-size:13px}.search-form{height:42px;max-width:none}.search-submit{width:34px;height:34px}.hero-art{align-self:center;width:min(100%,390px);height:205px;margin:5px auto -2px}.hero-art img{max-height:205px}.popular{padding:15px 16px 23px}.section-heading h2{font-size:19px}.view-all{font-size:9px}.tool-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.tool-card{min-height:66px;gap:7px;padding:7px}.tool-icon{width:30px;height:30px;border-radius:9px}.tool-icon img{width:16px;height:16px}.tool-card strong{font-size:9px}.tool-card small{font-size:7.5px}.tool-arrow{width:11px;height:11px}.categories{padding:0 16px 13px}.categories .section-heading h2{font-size:18px}.category-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.category-link{min-height:56px;gap:7px;padding:7px}.category-icon{width:30px;height:30px}.category-icon img{width:16px;height:16px}.category-link strong{font-size:9px}.category-link small{font-size:7px}.category-arrow{width:11px;height:11px}.privacy-inner{min-height:48px;padding:7px 16px}.privacy-shield{right:12px;width:48px;height:48px}.site-footer{padding:9px 16px}.footer-main{flex-wrap:wrap;gap:9px}.footer-brand{font-size:14px}.footer-main nav{order:3;width:100%;justify-content:space-between;gap:8px;margin:3px 0 0}.footer-main nav a{font-size:8px}.footer-main>p{margin-left:auto;font-size:7px}}
@media(max-width:420px){.hero h1{font-size:35px}.tool-grid,.category-grid{grid-template-columns:1fr}.tool-card{min-height:62px}.tool-card strong{font-size:10px}.tool-card small{font-size:8px}.category-link{min-height:52px}.footer-main>p{display:none}}
@media(prefers-reduced-motion:reduce){html[data-theme="2"] .hero-art img{animation:none}.tool-card,.category-link,.search-submit{transition:none}}
