/* Complete, compact content is the default; scroll motion is progressive enhancement. */
.home-selector{--selector-height:calc(100svh - var(--site-header-height) - var(--site-header-offset));--selector-top:calc(var(--site-header-height) + var(--site-header-offset))}
.selector-pin{padding-block:24px}
.selector-panel{padding-block:48px}
.home-selector .selector-intro{grid-template-columns:1fr 1fr;align-items:end;gap:64px;margin-bottom:40px}
.home-selector .section-heading{gap:16px}
.home-selector .selector-guidance{gap:20px;max-width:500px}
.home-selector .selector-guidance>p{font-size:20px;line-height:28px}
.selector-families{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));column-gap:40px}
.selector-family{--family-text:1;--family-line:1;--family-arrow:1}
.selector-family::after{transform:scaleX(var(--family-line));transform-origin:left center}
.selector-family__copy{clip-path:inset(0 calc((1 - var(--family-text)) * 100%) 0 0)}
.selector-family__arrow path{stroke-dasharray:1;stroke-dashoffset:calc(1 - var(--family-arrow))}
.home-selector.is-selector-pinned{height:calc(var(--selector-height) * 2.45)}
.is-selector-pinned .selector-pin{position:sticky;top:var(--selector-top);height:var(--selector-height);display:grid;align-items:center;padding-block:16px}
/* A keyboard user never has to scroll to uncover a focused link. */
.home-selector:focus-within .selector-family{--family-text:1!important;--family-line:1!important;--family-arrow:1!important}
@media(max-width:1000px){
  .home-selector .selector-intro{gap:32px}
  .selector-families{column-gap:24px}
}
@media(max-width:767px){
  .selector-pin{padding-block:16px}
  .selector-panel{padding-block:32px}
  .home-selector .selector-intro{gap:20px;margin-bottom:20px;align-items:stretch}
  .home-selector .section-heading{gap:12px}
  .home-selector .section-heading h2{font-size:40px;line-height:42px}
  .home-selector .selector-guidance{gap:16px;max-width:none}
  .home-selector .selector-guidance>p{font-size:16px;line-height:23px}
  .selector-families{grid-template-columns:repeat(2,minmax(0,1fr));column-gap:24px}
}
@media(prefers-reduced-motion:reduce){
  .home-selector.is-selector-pinned{height:auto}
  .is-selector-pinned .selector-pin{position:static;height:auto;display:block;padding-block:24px}
  .selector-family{--family-text:1!important;--family-line:1!important;--family-arrow:1!important}
}
