.tools-breadcrumbs { display:flex; flex-wrap:wrap; align-items:center; gap:8px 12px; padding-top:32px; color:#56616d; font-size:14px; line-height:1.5; }
.tools-breadcrumbs a:hover { color:#181818; text-decoration:underline; text-underline-offset:4px; }
.tool-links { margin-block:64px; }
.tool-links-heading { display:flex; align-items:baseline; justify-content:space-between; flex-wrap:wrap; gap:16px 24px; margin-bottom:24px; }
.tool-links-heading h2 { margin:0; font-size:32px; font-weight:400; line-height:1.2; letter-spacing:-.025em; }
.tool-links-heading > a { font-size:16px; display:flex; gap:16px; padding-block:8px; }
.tool-links-heading > a:hover { text-decoration:underline; text-underline-offset:4px; }
.tool-links-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:24px; }
.tool-links-grid > a { position:relative; display:block; min-width:0; background:#fff; border-radius:28px; padding:32px 64px 32px 32px; color:#181818; text-decoration:none; }
.tool-links-grid h3 { margin:0; font-size:24px; font-weight:400; line-height:1.25; letter-spacing:-.02em; }
.tool-links-grid p { margin:16px 0 0; max-width:40ch; color:#56616d; font-size:16px; line-height:1.6; }
.tool-links-grid > a > span { position:absolute; top:32px; right:32px; font-size:24px; line-height:1.25; }
.tool-links-grid > a:hover h3 { text-decoration:underline; text-underline-offset:5px; text-decoration-thickness:1px; }
.tool-links a:focus-visible { outline:3px solid #e83535; outline-offset:5px; }
@media(max-width:767px){.tools-breadcrumbs{padding-top:24px;font-size:12px;gap:8px}.tool-links{margin-block:48px}.tool-links-heading h2{font-size:28px}.tool-links-heading>a{font-size:14px}.tool-links-grid{grid-template-columns:1fr;gap:16px}.tool-links-grid>a{border-radius:24px;padding:24px 56px 24px 24px}.tool-links-grid h3{font-size:22px}.tool-links-grid p{font-size:14px;margin-top:12px}.tool-links-grid>a>span{top:24px;right:24px}}
.nav-tools-link { grid-column:1/-1; display:flex; justify-content:space-between; align-items:center; gap:24px; padding:16px; font-size:16px; }

/* Tool introductions share the compact navigation and author byline. */
:root:has(.tool-intro) { --header-height: 76px; }
.site-header:has(.nav-solutions) .header-container { padding-block: 8px; }
.nav-solutions { width: 220px; padding: 8px; }
.nav-solutions a { display: flex; align-items: center; min-height: 44px; padding-inline: 12px; }

main:has(> .tool-intro) > .tools-breadcrumbs { padding-top: 8px; font-size: 13px; }
.hero.tool-intro {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 8px 24px;
  padding-block: 4px 12px;
}
.hero.tool-intro h1 {
  grid-column: auto;
  max-width: none;
  font-size: clamp(28px, 3.2vw, 42px);
  line-height: 1.12;
  letter-spacing: -.03em;
  text-wrap: initial;
}
.hero.tool-intro .hero-title > p {
  margin-top: 4px;
  color: var(--muted);
  font-size: 16px;
  line-height: 1.4;
}
.hero.tool-intro .hero-copy {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 4px 16px;
  max-width: none;
  justify-self: stretch;
  padding: 0;
}
.hero.tool-intro .hero-copy > p { font-size: 14px; line-height: 1.4; color: var(--muted); }
.hero.tool-intro .author-byline { gap: 8px; margin: 0; }
.hero.tool-intro .author-byline img { width: 32px; height: 32px; }
.hero.tool-intro .author-byline .tool-author { font-size: 14px; line-height: 1.4; }
.hero.tool-intro .author-byline .author-linkedin { width: 36px; height: 36px; margin: 0; }
.hero.tool-intro .tool-author a { display: inline; margin: 0; font: inherit; text-decoration: underline; text-underline-offset: 3px; }

@media (min-width: 768px) and (max-width: 1023px) {
  .hero.tool-intro .hero-copy { display: grid; }
}
@media (max-width: 767px) {
  .site-header:has(.nav-solutions) .header-bar { padding-block: 8px; }
  .hero.tool-intro { grid-template-columns: 1fr; gap: 4px; padding-block: 6px 12px; }
}