/* ---------- Tools: one minimalist look ---------- */
/* Page frame: calm title, plenty of space, tool sits on a clean white panel */
body.hm-tool .entry-content{max-width:1040px;margin-inline:auto}
body.hm-tool .entry-title,body.hm-tool .page-title{font-size:clamp(1.8rem,4vw,2.6rem);margin-bottom:.4em}
body.hm-tool .entry-content > p:first-of-type{font-size:1.1rem;color:var(--hm-mute);max-width:44em}
body.hm-tool .entry-content > div:not(.wp-block-buttons):not(.wp-block-group),
body.hm-tool .entry-content > section,
body.hm-tool .entry-content > main{border:1px solid var(--hm-line)!important;border-radius:20px!important;box-shadow:none!important;margin-block:24px}

/* Type: same two fonts everywhere inside a tool */
body.hm-tool .entry-content,
body.hm-tool .entry-content :where(*:not(svg):not(path):not(canvas)){font-family:var(--hm-body)!important;letter-spacing:0}
body.hm-tool .entry-content h1,
body.hm-tool .entry-content h2,
body.hm-tool .entry-content h3,
body.hm-tool .entry-content h4{font-family:var(--hm-heading)!important;font-weight:700;color:var(--hm-ink);line-height:1.2;text-shadow:none!important;text-transform:none!important}
body.hm-tool .entry-content h1{font-size:clamp(1.6rem,3.4vw,2.1rem)}
body.hm-tool .entry-content h2{font-size:clamp(1.3rem,2.6vw,1.6rem)}
body.hm-tool .entry-content h3{font-size:1.15rem}
body.hm-tool .entry-content label{font-weight:700;color:var(--hm-ink)}

/* Buttons: same shape, same colours, same size, in every tool */
body.hm-tool .entry-content button,
body.hm-tool .entry-content [role="button"],
body.hm-tool .entry-content input[type="button"],
body.hm-tool .entry-content input[type="submit"],
body.hm-tool .entry-content a.button,
body.hm-tool .entry-content .btn{
	font-family:var(--hm-body)!important;font-weight:700;font-size:1rem;line-height:1.2;
	min-height:44px;min-width:44px;padding:.6em 1.1em;
	background:var(--hm-brand)!important;color:var(--hm-ink)!important;
	border:2px solid var(--hm-ink)!important;border-radius:12px!important;
	box-shadow:none!important;text-shadow:none!important;text-transform:none!important;text-decoration:none;cursor:pointer;
}
body.hm-tool .entry-content button:hover,
body.hm-tool .entry-content .btn:hover{filter:brightness(.95)}
body.hm-tool .entry-content button[aria-pressed="true"],
body.hm-tool .entry-content button[aria-selected="true"],
body.hm-tool .entry-content button.active,
body.hm-tool .entry-content button.selected,
body.hm-tool .entry-content button.is-active,
body.hm-tool .entry-content button.on{background:var(--hm-ink)!important;color:#fff!important}
body.hm-tool .entry-content button:disabled{opacity:.55;cursor:not-allowed}

/* Fields */
body.hm-tool .entry-content input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="color"]):not([type="button"]):not([type="submit"]),
body.hm-tool .entry-content select,
body.hm-tool .entry-content textarea{
	font-family:var(--hm-body)!important;font-size:1rem;min-height:44px;padding:.5em .8em;
	background:#fff!important;color:var(--hm-ink)!important;border:2px solid var(--hm-edge)!important;border-radius:10px!important;box-shadow:none!important;
}
body.hm-tool .entry-content input[type="checkbox"],
body.hm-tool .entry-content input[type="radio"]{width:22px;height:22px;accent-color:var(--hm-ink)}
body.hm-tool .entry-content input[type="range"]{accent-color:var(--hm-ink)}

/* Focus: always visible, same everywhere */
body.hm-tool .entry-content :focus-visible{outline:3px solid var(--hm-ink)!important;outline-offset:3px}

/* Links */
body.hm-tool .entry-content a:not(.btn):not(.button){color:var(--hm-link);text-decoration:underline;text-underline-offset:3px}

/* Embedded frames: rounded, thin border, full width */
body.hm-tool .entry-content iframe{max-width:100%;border:1px solid var(--hm-line);border-radius:16px;background:#fff}

/* Phones */
@media(max-width:600px){body.hm-tool .entry-content button{width:auto}}

/* Intro text above a tool lines up with the title */
body.hm-tool .entry-content > p,body.hm-tool .entry-content > h2,body.hm-tool .entry-content > h3{margin-left:0!important;margin-right:auto!important;max-width:44em}

/* Tool pages laid out with the pattern: the tool sits in the toolbox section */
body.hm-tool .hm-toolbox{padding-top:32px}
body.hm-tool .hm-toolbox > div:not(.wp-block-group):not(.wp-block-buttons),
body.hm-tool .hm-toolbox > section{border:1px solid var(--hm-line)!important;border-radius:20px!important;box-shadow:none!important;margin-block:0 24px}
body.hm-tool .hm-toolbox > p,body.hm-tool .hm-toolbox > h2,body.hm-tool .hm-toolbox > h3{max-width:44em}
