:root{--brand:#2563eb;--brand-600:#2563eb;--brand-700:#1d4ed8;--slate-50:#f8fafc;--slate-100:#f1f5f9;--slate-200:#e2e8f0;--slate-500:#64748b;--slate-900:#0f172a}
html,body{scroll-behavior:smooth}
.btn-primary{display:inline-flex;align-items:center;justify-content:center;padding:.75rem 1.1rem;border-radius:.75rem;background:linear-gradient(180deg,#3b82f6,#2563eb);color:#fff;font-weight:600;box-shadow:0 8px 18px rgba(37,99,235,.25)}
.btn-primary:hover{filter:brightness(.96)}
.btn-light{display:inline-flex;align-items:center;justify-content:center;padding:.75rem 1.1rem;border-radius:.75rem;background:rgba(255,255,255,.1);color:#fff;border:1px solid rgba(255,255,255,.25)}
.btn-brand-solid{display:inline-flex;align-items:center;justify-content:center;padding:.75rem 1.5rem;border-radius:.75rem;background:#1d4ed8;color:#fff;font-weight:700;border:1px solid #1e40af;box-shadow:0 10px 24px rgba(29,78,216,.32);transition:background-color .2s ease,transform .2s ease,box-shadow .2s ease}
.btn-brand-solid:hover{background:#1e40af;transform:translateY(-1px);box-shadow:0 14px 28px rgba(30,64,175,.38)}
.btn-brand-solid:focus-visible{outline:2px solid #93c5fd;outline-offset:2px}
.tools-shell{border:1px solid #dbeafe;border-radius:1.75rem;padding:1.25rem;background:linear-gradient(160deg,rgba(255,255,255,.92),rgba(239,246,255,.8));box-shadow:0 20px 45px rgba(15,23,42,.08)}
.tools-eyebrow{display:inline-flex;align-items:center;gap:.45rem;font-size:.72rem;letter-spacing:.08em;text-transform:uppercase;font-weight:700;color:#0c4a6e;background:#ecfeff;border:1px solid #bae6fd;border-radius:9999px;padding:.42rem .72rem}
.tools-preview{border:1px solid #cbd5e1;background:#fff;border-radius:1.25rem;padding:.8rem;box-shadow:0 18px 35px rgba(15,23,42,.1)}
.tools-preview-head{display:flex;align-items:center;justify-content:space-between;padding:.4rem .45rem .75rem .45rem;color:#334155;font-size:.9rem;font-weight:600}
.tools-live{font-size:.75rem;color:#0f766e;background:#ccfbf1;border:1px solid #99f6e4;padding:.2rem .55rem;border-radius:9999px}
.tools-preview-image-wrap{aspect-ratio:16/10;overflow:hidden;border-radius:1rem;border:1px solid #e2e8f0;background:#f1f5f9}
.tools-preview-image-wrap img{transition:opacity .24s ease,transform .32s ease;will-change:opacity,transform}
.tools-metrics{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.6rem;margin-top:.75rem}
.metric-item{border:1px solid #e2e8f0;background:#f8fafc;border-radius:.8rem;padding:.65rem .55rem}
.metric-value{font-size:1rem;font-weight:700;color:#0f172a;line-height:1.1}
.metric-label{font-size:.7rem;color:#64748b;margin-top:.2rem}
.metric-copy{font-size:.72rem;line-height:1.45;color:#475569;margin-top:.35rem}
.tool-item{display:flex;align-items:flex-start;gap:.85rem;width:100%;padding:.95rem;border:1px solid #dbe4ef;border-radius:1rem;background:linear-gradient(180deg,#fff,#f8fbff);transition:.2s box-shadow,.2s border-color,.2s background,.2s transform;text-align:left}
.tool-item:hover{box-shadow:0 14px 28px rgba(15,23,42,.09);transform:translateY(-1px)}
.tool-item.active{border-color:#3b82f6;background:linear-gradient(145deg,#eff6ff,#dbeafe);box-shadow:0 14px 28px rgba(37,99,235,.2)}
.tool-icon{height:2.4rem;width:2.4rem;border-radius:.8rem;background:linear-gradient(180deg,#e0ecff,#bfdbfe);color:#1e3a8a;display:grid;place-content:center;font-weight:800;font-size:.82rem;letter-spacing:.03em;flex-shrink:0}
.tool-title{font-weight:700;color:#0f172a}
.tool-sub{font-size:.84rem;color:#475569;line-height:1.35;margin-top:.18rem}
.tool-meta{font-size:.73rem;color:#1d4ed8;margin-top:.38rem;font-weight:600}
.tool-arrow{margin-left:auto;color:#64748b;font-size:1.35rem;line-height:1;padding-top:.05rem}
.feature-li{display:flex;align-items:center;gap:.5rem;padding:.6rem .75rem;border:1px solid var(--slate-200);border-radius:.75rem;background:#fff}
.feature-card{padding:1rem;border:1px solid var(--slate-200);border-radius:1rem;background:#fff;box-shadow:0 8px 20px rgba(2,6,23,.05)}
.feature-badge{height:2.25rem;width:2.25rem;border-radius:.6rem;background:rgba(37,99,235,.1);color:#1d4ed8;display:grid;place-content:center;font-weight:700;margin-bottom:.5rem}
.feature-title{font-weight:600;color:#0f172a}
.feature-sub{font-size:.875rem;color:var(--slate-500)}
.testimonial{padding:1rem;border:1px solid var(--slate-200);border-radius:1rem;background:#fff;box-shadow:0 8px 20px rgba(2,6,23,.05);display:flex;flex-direction:column;gap:.5rem}
.video-card{position:relative;aspect-ratio:16/9;border-radius:1rem;overflow:hidden;border:1px solid var(--slate-200);background:#000}
.video-card .play{position:absolute;inset:auto;left:50%;top:50%;transform:translate(-50%,-50%);height:60px;width:60px;border-radius:9999px;background:rgba(255,255,255,.85);display:grid;place-content:center;color:#0f172a;font-size:1.1rem;font-weight:700;box-shadow:0 6px 16px rgba(0,0,0,.25)}
.video-card:hover .play{background:#fff}
.footer-head{font-weight:600;margin-bottom:.75rem}
.footer-links{display:grid;gap:.4rem;font-size:.875rem}
.footer-links a{text-decoration:none}
.footer-dark{background:#020617;color:#e5e7eb}
.footer-dark .footer-head{color:#e5e7eb;font-size:.95rem;text-transform:none}
.footer-dark .footer-links a{color:#9ca3af}
.footer-dark .footer-links a:hover{color:#ffffff}
.footer-dark hr{border-color:#111827}
.store-badges img{height:40px;object-fit:contain}
.footer-social a{height:32px;width:32px;border-radius:9999px;border:1px solid #4b5563;display:grid;place-content:center;font-size:.75rem;color:#9ca3af}
.footer-social a:hover{border-color:#e5e7eb;color:#e5e7eb}

.scroll-top-btn{box-shadow:0 10px 25px rgba(15,23,42,.4)}

@media (max-width:767px){
	.tools-shell{padding:1rem;border-radius:1.25rem}
	.tools-preview-head{font-size:.82rem}
	.tools-metrics{grid-template-columns:1fr}
	.tool-item{padding:.85rem}
}
