.tool-content {
    width:min(100%,1250px);
    margin-inline:auto;
    padding:24px clamp(18px,5vw,72px) var(--section-space);
    overflow-wrap:break-word;
}
.tool-content h1 {
    max-width:21ch;
    margin:14px 0 18px;
    font-size:clamp(38px,5.5vw,78px);
    font-weight:750;
    line-height:1.02;
    letter-spacing:-.045em;
}
.tool-content h2 { font-size:clamp(25px,3vw,38px); font-weight:650; line-height:1.15; letter-spacing:-.025em; }
.tool-content h3 { margin:24px 0 8px; font-size:clamp(20px,1.8vw,25px); font-weight:600; line-height:1.25; }
.tool-content > p, .tool-content > header p { max-width:68ch; font-size:clamp(16px,1.5vw,20px); }
.tool-content > header .eyebrow { display:block; margin-top:24px; color:var(--color-accent); }
.tool-content > header > a { color:var(--color-accent); font-weight:650; }
.tool-content .tool-directory {
    display:grid;
    grid-template-columns:minmax(155px,1fr) 2.8fr;
    gap:24px 36px;
    margin-top:var(--section-space);
    padding-top:24px;
    border-top:1px solid #aebec9;
}
.tool-group-heading .eyebrow { color:var(--color-accent); }
.tool-group-heading h2 { margin-top:10px; }
.tool-directory ul {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    align-content:start;
    gap:10px;
    margin:0;
    padding:0;
    list-style:none;
}
.tool-directory a {
    display:grid;
    grid-template-columns:1fr auto;
    gap:6px 12px;
    align-content:start;
    height:100%;
    padding:18px;
    border:1px solid #d4dee6;
    background:#fff;
}
.tool-directory a:is(:hover,:focus-visible) { background:#eaf1f6; border-color:#9db5c7; }
.tool-directory strong { font:600 20px/1.2 var(--font-display); }
.tool-directory small { grid-column:1 / -1; color:#455866; font-size:14px; }
.tool-arrow { color:var(--color-accent); }
.tool-section { margin-top:calc(var(--section-space) * .75); padding:clamp(16px,1.8vw,24px) clamp(18px,3vw,38px); border:1px solid #d4dee6; background:white; }
.tool-section p { max-width:82ch; margin:10px 0; }
.tool-section :is(ul,ol) { padding-left:1.4em; margin:12px 0; }
.tool-section ul { list-style:disc; }
.tool-section ol { list-style:decimal; }
.tool-section fieldset { min-width:0; margin-top:16px; padding:14px; border:1px solid #d4dee6; }
.tool-section legend { padding-inline:6px; font-weight:700; }
.tool-section a { color:var(--color-accent); text-decoration:underline; text-underline-offset:.2em; }
.tool-fields {
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(min(100%,210px),1fr));
    gap:14px 20px;
    margin:18px 0;
}
.tool-fields label { display:flex; flex-direction:column; justify-content:flex-end; gap:5px; font-weight:650; }
.tool-fields :is(input,select) {
    width:100%;
    min-width:0;
    min-height:46px;
    padding:8px 10px;
    border:1px solid #8396a5;
    border-radius:3px;
    background:#fff;
    color:var(--color-ink);
    font:500 16px/1.4 var(--font-text);
}
.tool-fields :is(input,select):focus-visible { outline:2px solid var(--color-focus); outline-offset:2px; }
.tool-content .tool-result { margin:16px 0; padding:14px 20px; border-left:3px solid var(--color-accent); background:#eaf1f6; }
.tool-section > :last-child { margin-bottom:0; }
.tool-section > .tool-result:last-child { margin-bottom:0; }
.tool-result p { margin:4px 0; }
@media (max-width:800px) {
    .tool-content .tool-directory { grid-template-columns:1fr; }
}
@media (max-width:580px) {
    .tool-directory ul { grid-template-columns:1fr; }
}
