
/* Solvory Tools 2026 — Product card library V4: design based on user-supplied layout reference */
:root{--sv5-card-ink:#282936;--sv5-card-sub:#737887;--sv5-line:#dfe0e8;--sv5-violet:#6758e9}
.sv3-directory{background:radial-gradient(ellipse at 91% 10%,#f8edf3 0%,transparent 29%),radial-gradient(ellipse at 3% 43%,#f0eefb 0%,transparent 25%),#f7f7fb}
.sv3-dir-filter{padding:22px 0 28px;gap:12px;align-items:center}
.sv3-dir-filter>span{margin-right:12px;color:#696b7d;font-weight:750;font-size:12px}
.sv3-dir-filter button{appearance:none;background:#fff;border:1px solid #daddE9;border-radius:999px;padding:13px 20px;font-family:"Solvory DM Sans","Solvory Manrope",sans-serif;font-weight:750;font-size:13px;color:#454652;letter-spacing:-.02em;transition:background .22s,color .22s,border-color .22s,transform .22s;box-shadow:0 1px 0 #ffffffbc}
.sv3-dir-filter button:hover{transform:translateY(-2px);border-color:#9e96dc;background:#f9f7ff}
.sv3-dir-filter button.is-active{background:#252630;border-color:#252630;box-shadow:0 8px 20px #292a3324;color:#fff}
.sv3-dir-searchbar{background:#fff;border:1px solid #dedfe9;box-shadow:0 12px 30px #47457209;padding:11px 15px 11px 23px;border-radius:17px}
.sv3-dir-searchbar:focus-within{border-color:#9485e6;box-shadow:0 0 0 4px #7562ff18}
.sv3-dir-input input{font-size:15px}
.sv3-dir-count{color:#5753a8}
.sv3-dir-note{background:#ede9fc;border-color:#e0d8f7}
.sv3-dir-group{margin-bottom:12px}
.sv3-dir-group-heading{margin-bottom:25px}
.sv3-dir-group-heading h2{font-size:32px}
.sv3-dir-group-heading p{font-size:12.3px}
.sv3-dir-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:19px}
.sv3-dir-card{border:1px solid #dadce7;background:#fff;border-radius:22px;padding:31px 28px;min-height:300px;box-shadow:0 6px 18px #1f254008;transition:transform .26s cubic-bezier(.2,.8,.2,1),box-shadow .26s,border-color .26s;overflow:hidden;position:relative}
.sv3-dir-card:before{display:none}
.sv3-dir-card:after{content:"";position:absolute;inset:0 0 auto;height:3px;background:linear-gradient(90deg,var(--tone),transparent);transform:scaleX(0);transform-origin:left;transition:transform .35s}
.sv3-dir-card:hover{transform:translateY(-5px);border-color:color-mix(in srgb,var(--tone) 34%,#dedce9);box-shadow:0 24px 48px #29284913}
.sv3-dir-card:hover:after{transform:scaleX(1)}
.sv3-dir-card-head{margin-bottom:26px;min-height:69px;align-items:flex-start}
.sv3-dir-icon{position:relative;display:flex;align-items:center;justify-content:center;width:67px;height:67px;border:0;background:linear-gradient(140deg,var(--tone-bg),#fff);color:var(--tone-deep);border-radius:18px;box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--tone) 25%,#fff),0 6px 12px #2920440b;transition:transform .25s;flex-shrink:0}
.sv3-dir-icon svg{width:33px!important;height:33px!important;stroke-width:1.8;display:block}
.sv3-dir-card:hover .sv3-dir-icon{transform:translateY(-2px) rotate(-4deg)}
.sv3-dir-status{background:#f7f7fb;color:#9296a6;font-weight:800;letter-spacing:.06em;font-size:8px;border-radius:9px;padding:7px 9px;white-space:nowrap}
.sv3-dir-card h3{font-family:"Solvory Manrope",var(--sv4-font)!important;font-size:21px!important;line-height:1.3;font-weight:850;letter-spacing:-.045em;color:#2c2c38!important;margin-bottom:15px;max-width:100%;text-wrap:pretty}
.sv3-dir-card p{font-size:14.1px;line-height:1.65;color:#717684;max-width:100%}
.sv3-dir-card-end{font-size:11px;letter-spacing:.005em;padding-top:18px;margin-top:auto;border-top:1px solid #f0eff5;color:#8e91a0;font-weight:750}
.sv3-dir-card-end>span:last-child{display:grid;place-items:center;width:27px;height:27px;border-radius:50%;background:#f8f8fc;color:var(--tone-deep)}
.sv3-dir-card-end svg{color:inherit;width:16px!important;height:16px!important}
.sv3-dir-note strong,.sv3-dir-note h3{font-weight:800}
.sv3-dir-group-icon{border-radius:18px;width:63px;height:63px}
.sv3-dir-group-heading .sv3-eyebrow{font-size:10px;color:#7466b8}
.sv3-group-count{background:#fff;border:1px solid #e6e5ee;padding:9px 14px}
/* Featured home cards inherit their own refined airy product language */
.sv3-feature-grid{gap:17px}
.sv3-feature-tool{background:#fff;border:1px solid #e2e1ec;padding:25px 23px;min-height:263px;border-radius:21px}
.sv3-f-icon{width:55px;height:55px;background:linear-gradient(135deg,var(--tone-bg),#fff);border:1px solid color-mix(in srgb,var(--tone) 25%,#fff)}
.sv3-f-icon svg{width:29px!important;height:29px!important}
.sv3-f-tool-text h3{font-size:18px;color:#2c2b38}
.sv3-f-tool-text p{font-size:13px;line-height:1.65;color:#777b8b}
.sv3-f-tool-bottom{font-size:11px}
.sv3-status{background:#f8f8fc;color:#888999}
/* sidebar focus and card reading hierarchy */
.sv3-directory .sv3-dir-group{scroll-margin-top:128px}
.sv3-dir-filter button:focus-visible{outline:3px solid #a693ff;outline-offset:3px}
.sv3-dir-card[hidden]{display:none!important}
@media(max-width:1190px){
.sv3-dir-card{padding:25px 21px;min-height:290px}.sv3-dir-card h3{font-size:18px!important}.sv3-dir-card p{font-size:12.9px}.sv3-dir-icon{width:60px;height:60px}.sv3-dir-icon svg{width:28px!important;height:28px!important}
}
@media(max-width:950px){
.sv3-dir-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:13px}
.sv3-dir-card{min-height:260px;padding:22px}.sv3-dir-card h3{font-size:17px!important}.sv3-dir-card p{font-size:12.5px}
.sv3-dir-filter button{font-size:12px;padding:11px 16px}
}
@media(max-width:720px){
.sv3-dir-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.sv3-dir-card{min-height:255px;padding:18px 16px;border-radius:17px}
.sv3-dir-card h3{font-size:15px!important;margin-bottom:9px}
.sv3-dir-card p{font-size:11.8px;line-height:1.5}
.sv3-dir-icon{width:50px;height:50px;border-radius:13px}
.sv3-dir-icon svg{width:25px!important;height:25px!important}
.sv3-dir-card-head{min-height:54px;margin-bottom:18px}
.sv3-dir-status{font-size:7px;padding:5px}
.sv3-dir-card-end{font-size:9px;padding-top:12px}
.sv3-dir-filter{gap:8px}.sv3-dir-filter button{padding:10px 13px;font-size:11px}
.sv3-feature-tool{min-height:230px;padding:17px}
.sv3-f-icon{width:45px;height:45px}.sv3-f-icon svg{width:23px!important;height:23px!important}
.sv3-f-tool-text h3{font-size:14px}
.sv3-f-tool-text p{font-size:11px}
}
@media(max-width:390px){
.sv3-dir-card{padding:14px 12px;min-height:250px}
.sv3-dir-card h3{font-size:13px!important}.sv3-dir-card p{font-size:10.4px}
.sv3-dir-status{font-size:6.5px}
}
@media(prefers-reduced-motion:reduce){.sv3-dir-card,.sv3-dir-icon,.sv3-feature-tool{transition:none!important}.sv3-dir-card:hover,.sv3-dir-card:hover .sv3-dir-icon{transform:none!important}}
