.index-grid{grid-template-columns:1fr;gap:54px}
.directory-group,.directory-group-wide{grid-column:1/-1;max-width:none}
.directory-group .tool-list,.directory-group-wide .tool-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:62px}

/* Readability pass: keep supporting UI comfortably legible without competing with the main hierarchy. */
.hero-label,.index-kicker,.group-number,.tool-index,.principles-kicker,.principle>span{font-size:13px}
.navlinks{font-size:13px}
.group-head p{font-size:14px;line-height:1.58}
.directory-copy strong{font-size:18px}
.directory-copy span{font-size:14px;line-height:1.55}
.directory-link .tool-arrow{font-size:21px;color:#77736b}
.index-intro p{font-size:15px;line-height:1.68}
.principle strong{font-size:15.5px}
.principle p{font-size:14px;line-height:1.6}
.footer-row,.footer-links{font-size:13px}

@media(max-width:900px){
  .index-grid{gap:44px}
  .directory-group .tool-list,.directory-group-wide .tool-list{grid-template-columns:1fr}
}

@media(max-width:720px){
  .brand{font-size:16px}.brand-mark{width:27px;height:27px;flex-basis:27px}
  .navlinks{font-size:13px}
  .home-hero{padding-top:34px}
  .hero-label{font-size:13px;line-height:1.5;margin-bottom:18px}
  .hero-copy h1{font-size:clamp(44px,12.8vw,52px);line-height:.96}
  .hero-copy p{font-size:16px;line-height:1.62;margin-top:20px}
  .search-wrap{grid-template-columns:40px minmax(0,1fr);height:62px}
  .search-wrap input{height:60px;font-size:20px}
  .search-glyph{font-size:25px}
  .calculator-index{padding-top:48px}
  .index-kicker{font-size:13px;margin-bottom:11px}
  .index-intro h2{font-size:clamp(38px,10vw,44px);line-height:1.03}
  .index-intro p{font-size:15.5px;line-height:1.65;margin-top:15px}
  .group-head{grid-template-columns:42px 1fr;gap:12px;padding:20px 0 23px}
  .group-number{font-size:13px}
  .group-head h3{font-size:29px}
  .group-head p{font-size:14.5px;line-height:1.55}
  .directory-link{grid-template-columns:42px minmax(0,1fr) 22px;gap:12px;padding:19px 0}
  .tool-index{font-size:13px;padding-top:4px}
  .directory-copy strong{font-size:17.5px;line-height:1.3}
  .directory-copy span{font-size:14px;line-height:1.5;margin-top:5px}
  .directory-link .tool-arrow{font-size:22px;color:#6f6b64}
  .principles{padding:56px 0 62px}
  .principles-kicker{font-size:13px}
  .principles-copy h2{font-size:clamp(40px,11vw,48px);line-height:1}
  .principles-copy p{font-size:15.5px;line-height:1.65}
  .principle{grid-template-columns:42px 1fr;gap:12px;padding:18px 0 20px}
  .principle>span{font-size:13px}.principle strong{font-size:16px}.principle p{font-size:14.5px;line-height:1.6}
  .footer-row,.footer-links{font-size:13px;line-height:1.5}
}

@media(max-width:430px){
  .hero-copy h1{font-size:clamp(43px,12.7vw,49px)}
  .group-head{grid-template-columns:38px 1fr}.directory-link{grid-template-columns:38px minmax(0,1fr) 21px;gap:11px}
}

.group-head h3 a{color:inherit;text-decoration:none}.group-head h3 a:hover{text-decoration:underline;text-underline-offset:4px}
.hero-mobile-break{display:block}@media(min-width:721px){.hero-mobile-break{display:inline}}

.home-category-shortcuts{display:flex;align-items:center;gap:8px 13px;flex-wrap:wrap;margin-top:18px;color:#615d56;font-family:var(--mono);font-size:12px;font-weight:700;letter-spacing:.045em;text-transform:uppercase}.home-category-shortcuts>span{color:#8a857d}.home-category-shortcuts a{min-height:36px;display:inline-flex;align-items:center;color:inherit;text-decoration:none;border-bottom:1px solid #c7c2b8}.home-category-shortcuts a:hover,.home-category-shortcuts a:focus-visible{color:var(--accent);border-color:currentColor;outline:0}
@media(max-width:720px){.home-category-shortcuts{gap:5px 12px;margin-top:16px;font-size:12px}.home-category-shortcuts>span{flex:1 0 100%;margin-bottom:2px}.home-category-shortcuts a{min-height:44px}}
