.walker-people-finder,
.walker-people-finder * {
box-sizing: border-box;
}
.walker-people-finder {
margin-inline: auto;
max-width: var(--walker-people-finder-max-width, 760px);
position: relative;
width: 100%;
z-index: 8;
}
.walker-people-finder__shell {
background: rgba(255, 255, 255, 0.95);
border: 1px solid rgba(255, 255, 255, 0.48);
border-radius: 24px;
box-shadow:
0 24px 62px rgba(8, 24, 33, 0.24),
0 3px 10px rgba(8, 24, 33, 0.1);
padding: 8px;
transition: var(--walker-ui-transition, 220ms ease);
}
.walker-people-finder:focus-within .walker-people-finder__shell {
border-color: rgba(0, 165, 177, 0.72);
box-shadow:
0 28px 66px rgba(8, 24, 33, 0.28),
0 0 0 4px rgba(0, 165, 177, 0.16);
}
.walker-people-finder__controls {
align-items: stretch;
display: flex;
gap: 8px;
}
.walker-people-finder__input-wrap {
flex: 1 1 auto;
align-items: center;
background: #f5f8f8;
border-radius: 17px;
display: flex;
gap: 12px;
min-height: 58px;
padding: 0 16px;
}
.walker-people-finder__state-wrap {
flex: 0 0 184px;
position: relative;
}
.walker-people-finder__state-wrap::after {
border-bottom: 2px solid var(--walker-ui-teal-dark, #007d87);
border-right: 2px solid var(--walker-ui-teal-dark, #007d87);
content: "";
height: 7px;
pointer-events: none;
position: absolute;
right: 17px;
top: calc(50% - 5px);
transform: rotate(45deg);
width: 7px;
}
.walker-people-finder__state-select {
appearance: none;
background: #edf3f3 !important;
border: 0 !important;
border-radius: 17px;
box-shadow: none !important;
color: var(--walker-ui-navy, #17334b) !important;
cursor: pointer;
font-size: 13px !important;
font-weight: 800;
height: 100%;
line-height: 1.3;
min-height: 58px;
outline: 0 !important;
padding: 0 38px 0 14px !important;
width: 100%;
}
.walker-people-finder__state-select:focus-visible {
box-shadow: inset 0 0 0 2px rgba(0, 165, 177, 0.58) !important;
}
.walker-people-finder__icon {
color: var(--walker-ui-teal, #00a5b1);
flex: 0 0 auto;
height: 22px;
width: 22px;
}
.walker-people-finder__icon,
.walker-people-finder__clear svg,
.walker-people-finder__result-arrow {
fill: none;
stroke: currentColor;
stroke-linecap: round;
stroke-linejoin: round;
stroke-width: 2;
}
.walker-people-finder__input {
appearance: none;
background: transparent !important;
border: 0 !important;
box-shadow: none !important;
color: var(--walker-ui-ink, #24343d) !important;
flex: 1 1 auto;
font-size: clamp(15px, 1.5vw, 17px) !important;
font-weight: 600;
line-height: 1.35;
min-width: 0;
outline: 0 !important;
padding: 0 !important;
width: 100%;
}
.walker-people-finder__input::-webkit-search-cancel-button {
display: none;
}
.walker-people-finder__input::placeholder {
color: #76858b;
font-weight: 500;
opacity: 1;
}
.walker-people-finder__clear {
align-items: center;
background: transparent;
border: 0;
border-radius: 50%;
color: #7f8c91;
cursor: pointer;
display: inline-flex;
flex: 0 0 auto;
height: 32px;
justify-content: center;
padding: 7px;
transition: var(--walker-ui-transition, 220ms ease);
width: 32px;
}
.walker-people-finder__clear:hover,
.walker-people-finder__clear:focus-visible {
background: rgba(0, 165, 177, 0.1);
color: var(--walker-ui-teal-dark, #007d87);
outline: 0;
}
.walker-people-finder__clear svg {
height: 17px;
width: 17px;
}
.walker-people-finder__results {
background: var(--walker-ui-white, #fff);
border: 1px solid rgba(21, 57, 70, 0.14);
border-radius: 22px;
box-shadow:
0 30px 74px rgba(9, 29, 38, 0.23),
0 4px 10px rgba(9, 29, 38, 0.08);
left: 0;
margin-top: 11px;
overflow: hidden;
position: absolute;
right: 0;
text-align: left;
} .walker-people-finder__results--portal {
display: flex;
flex-direction: column;
left: auto;
margin-top: 0;
max-height: min(560px, calc(100vh - 24px));
position: fixed;
right: auto;
z-index: 2147483000;
}
.walker-people-finder__results--portal .walker-people-finder__result-list {
min-height: 0;
overflow-y: auto;
overscroll-behavior: contain;
scrollbar-gutter: stable;
}
.walker-people-finder__results--portal .walker-people-finder__footer {
flex: 0 0 auto;
}
.walker-people-finder__results[hidden],
.walker-people-finder__clear[hidden] {
display: none !important;
}
.walker-people-finder__result-list {
display: grid;
}
.walker-people-finder__result {
align-items: center;
background: #fff;
color: inherit;
display: grid;
gap: 13px;
grid-template-columns: 54px minmax(0, 1fr) 20px;
padding: 14px 17px;
text-decoration: none !important;
transition: var(--walker-ui-transition, 220ms ease);
}
.walker-people-finder__result + .walker-people-finder__result {
border-top: 1px solid rgba(21, 57, 70, 0.08);
}
.walker-people-finder__result:hover,
.walker-people-finder__result:focus-visible,
.walker-people-finder__result.is-active {
background: rgba(0, 165, 177, 0.075);
outline: 0;
}
.walker-people-finder__avatar {
align-items: center;
background:
radial-gradient(circle at 72% 16%, rgba(255, 255, 255, 0.2), transparent 34%),
linear-gradient(135deg, var(--walker-ui-teal-dark, #007d87), var(--walker-ui-navy, #17334b));
border: 1px solid rgba(0, 165, 177, 0.24);
border-radius: 50%;
color: #fff;
display: flex;
font-size: 14px;
font-weight: 850;
height: 52px;
justify-content: center;
letter-spacing: 0.04em;
overflow: hidden;
width: 52px;
}
.walker-people-finder__avatar img {
display: block;
height: 100%;
object-fit: cover;
width: 100%;
}
.walker-people-finder__result-copy {
min-width: 0;
}
.walker-people-finder__name,
.walker-people-finder__meta,
.walker-people-finder__services {
display: block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.walker-people-finder__name {
color: var(--walker-ui-navy, #17334b);
font-size: 15px;
font-weight: 850;
letter-spacing: -0.015em;
line-height: 1.25;
}
.walker-people-finder__meta {
color: #65757b;
font-size: 12px;
font-weight: 650;
line-height: 1.35;
margin-top: 4px;
}
.walker-people-finder__services {
color: var(--walker-ui-teal-dark, #007d87);
font-size: 10px;
font-weight: 850;
letter-spacing: 0.11em;
line-height: 1.35;
margin-top: 5px;
text-transform: uppercase;
}
.walker-people-finder__result-arrow {
color: var(--walker-ui-teal, #00a5b1);
height: 18px;
transition: transform 180ms ease;
width: 18px;
}
.walker-people-finder__result:hover .walker-people-finder__result-arrow,
.walker-people-finder__result:focus-visible .walker-people-finder__result-arrow,
.walker-people-finder__result.is-active .walker-people-finder__result-arrow {
transform: translateX(3px);
}
.walker-people-finder__state {
padding: 20px 20px 18px;
}
.walker-people-finder__state-heading {
color: var(--walker-ui-navy, #17334b);
font-size: 15px;
font-weight: 850;
line-height: 1.3;
margin: 0;
}
.walker-people-finder__state-copy {
color: #64757c;
font-size: 13px;
line-height: 1.6;
margin: 5px 0 0;
}
.walker-people-finder__footer {
align-items: center;
background: #f7f9f9;
border-top: 1px solid rgba(21, 57, 70, 0.08);
display: flex;
flex-wrap: wrap;
gap: 7px 14px;
justify-content: space-between;
padding: 10px 17px;
}
.walker-people-finder__footer-note {
color: #718087;
font-size: 10px;
font-weight: 750;
letter-spacing: 0.06em;
text-transform: uppercase;
}
.walker-people-finder__footer-link {
color: var(--walker-ui-teal-dark, #007d87) !important;
font-size: 12px;
font-weight: 850;
text-decoration: none !important;
}
.walker-people-finder__footer-link:hover,
.walker-people-finder__footer-link:focus-visible {
color: var(--walker-ui-navy, #17334b) !important;
outline: 0;
text-decoration: underline !important;
}
.walker-people-finder__helper {
color: rgba(255, 255, 255, 0.66) !important;
font-size: 13px !important;
line-height: 1.5 !important;
margin: 13px 12px 0 !important;
text-align: center;
} .walker-people-finder--light .walker-people-finder__helper {
color: #65757b !important;
}
@media (max-width: 620px) {
.walker-people-finder__shell {
border-radius: 20px;
padding: 6px;
}
.walker-people-finder__controls {
flex-direction: column;
gap: 6px;
}
.walker-people-finder__state-wrap {
flex-basis: auto;
width: 100%;
}
.walker-people-finder__state-select {
border-radius: 14px;
min-height: 46px;
}
.walker-people-finder__input-wrap {
border-radius: 15px;
min-height: 54px;
padding-inline: 13px;
}
.walker-people-finder__input {
font-size: 14px !important;
}
.walker-people-finder__results {
border-radius: 18px;
}
.walker-people-finder__result {
gap: 11px;
grid-template-columns: 46px minmax(0, 1fr) 16px;
padding: 12px 13px;
}
.walker-people-finder__avatar {
font-size: 12px;
height: 44px;
width: 44px;
}
.walker-people-finder__name {
font-size: 14px;
}
.walker-people-finder__meta {
font-size: 11px;
}
.walker-people-finder__services {
display: none;
}
.walker-people-finder__footer {
align-items: flex-start;
flex-direction: column;
padding: 10px 13px;
}
}
@media (prefers-reduced-motion: reduce) {
.walker-people-finder__shell,
.walker-people-finder__clear,
.walker-people-finder__result,
.walker-people-finder__result-arrow {
transition: none;
}
}.walker-service-highlight,
.walker-service-highlight * {
box-sizing: border-box;
}
.walker-service-highlight {
--wshl-max-width: 760px;
--wshl-icon-size: 62px;
--wshl-icon-color: var(--walker-ui-teal, #0f7f83);
position: relative;
width: min(100%, var(--wshl-max-width));
max-width: 100%;
height: 100%;
color: var(--walker-ui-body, #4f6470);
}
.walker-service-highlight__inner {
position: relative;
display: flex;
flex-direction: column;
justify-content: center;
height: 100%;
}
.walker-service-highlight--surface-card {
background: var(--walker-ui-white, #fff);
border: 1px solid var(--walker-ui-border, rgba(18, 50, 71, 0.14));
border-radius: clamp(22px, 2.5vw, 32px);
box-shadow: var(--walker-ui-shadow, 0 18px 45px rgba(17, 49, 66, 0.1));
overflow: hidden;
transition: var(--walker-ui-transition, transform 220ms ease, box-shadow 220ms ease, border-color 220ms ease);
}
.walker-service-highlight--surface-card::before {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 3px;
content: "";
background: linear-gradient(90deg, var(--walker-ui-teal, #0f7f83), rgba(15, 127, 131, 0.16));
}
.walker-service-highlight--surface-card:hover {
border-color: rgba(15, 127, 131, 0.3);
box-shadow: var(--walker-ui-shadow-hover, 0 20px 50px rgba(17, 49, 66, 0.14));
transform: translateY(-3px);
}
.walker-service-highlight--surface-card .walker-service-highlight__inner {
padding: clamp(28px, 4vw, 48px);
}
.walker-service-highlight--surface-transparent .walker-service-highlight__inner {
padding: 0;
}
.walker-service-highlight__topline {
display: flex;
align-items: center;
gap: clamp(14px, 2vw, 20px);
}
.walker-service-highlight__icon-wrap {
display: flex;
align-items: center;
justify-content: center;
flex: 0 0 auto;
width: var(--wshl-icon-size);
height: var(--wshl-icon-size);
border: 1px solid rgba(15, 127, 131, 0.16);
border-radius: 20px;
background: var(--walker-ui-soft-teal, rgba(15, 127, 131, 0.07));
color: var(--wshl-icon-color);
}
.walker-service-highlight__icon {
display: block;
width: 58%;
height: 58%;
color: var(--wshl-icon-color);
}
.walker-service-highlight__icon--svg,
.walker-service-highlight__svg {
width: 58%;
height: 58%;
}
.walker-service-highlight__icon--svg {
display: flex;
align-items: center;
justify-content: center;
width: 100%;
height: 100%;
}
.walker-service-highlight__svg {
display: block;
max-width: 100%;
max-height: 100%;
color: currentColor;
}
.walker-service-highlight__icon--img {
object-fit: contain;
}
.walker-service-highlight__eyebrow,
.walker-service-highlight .walker-service-highlight__eyebrow {
margin: 0 !important;
color: var(--walker-ui-teal, #0f7f83) !important;
font-size: 11px !important;
font-weight: 800 !important;
letter-spacing: 0.18em !important;
line-height: 1.45 !important;
text-transform: uppercase;
}
.walker-service-highlight__heading,
.walker-service-highlight .walker-service-highlight__heading {
margin: clamp(20px, 2.4vw, 28px) 0 0 !important;
max-width: 690px;
color: var(--walker-ui-navy, #123247) !important;
font-size: clamp(30px, 3vw, 44px) !important;
font-weight: 750 !important;
letter-spacing: -0.055em !important;
line-height: 1.06 !important;
text-wrap: balance;
}
.walker-service-highlight__copy,
.walker-service-highlight .walker-service-highlight__copy {
margin-top: clamp(16px, 2vw, 22px);
max-width: 700px;
color: var(--walker-ui-body, #4f6470) !important;
font-size: 16px !important;
line-height: 1.7 !important;
}
.walker-service-highlight__copy > :first-child {
margin-top: 0 !important;
}
.walker-service-highlight__copy > :last-child {
margin-bottom: 0 !important;
}
.walker-service-highlight__actions {
margin-top: clamp(20px, 2.5vw, 28px);
}
.walker-service-highlight__button,
.walker-service-highlight__button:visited {
display: inline-flex;
align-items: center;
gap: 9px;
color: var(--walker-ui-teal, #0f7f83) !important;
font-size: 14px;
font-weight: 800;
letter-spacing: 0.01em;
line-height: 1.35;
text-decoration: none !important;
transition: color 180ms ease;
}
.walker-service-highlight__button-arrow {
width: 17px;
height: 17px;
fill: none;
stroke: currentColor;
stroke-linecap: round;
stroke-linejoin: round;
stroke-width: 2;
transition: transform 180ms ease;
}
.walker-service-highlight__button:hover,
.walker-service-highlight__button:focus-visible {
color: var(--walker-ui-teal-dark, #0b666a) !important;
text-decoration: none !important;
}
.walker-service-highlight__button:hover .walker-service-highlight__button-arrow,
.walker-service-highlight__button:focus-visible .walker-service-highlight__button-arrow {
transform: translateX(4px);
}
.walker-service-highlight__button:focus-visible {
outline: 3px solid rgba(15, 127, 131, 0.28);
outline-offset: 5px;
border-radius: 4px;
}
@media (max-width: 767.98px) {
.walker-service-highlight {
--wshl-icon-size: min(var(--wshl-icon-size), 58px);
}
.walker-service-highlight--surface-card .walker-service-highlight__inner {
padding: 26px 22px 24px;
}
.walker-service-highlight__icon-wrap {
border-radius: 17px;
}
.walker-service-highlight__heading,
.walker-service-highlight .walker-service-highlight__heading {
font-size: clamp(28px, 8vw, 38px) !important;
}
}
@media (prefers-reduced-motion: reduce) {
.walker-service-highlight--surface-card,
.walker-service-highlight__button,
.walker-service-highlight__button-arrow {
transition: none !important;
}
.walker-service-highlight--surface-card:hover,
.walker-service-highlight__button:hover .walker-service-highlight__button-arrow,
.walker-service-highlight__button:focus-visible .walker-service-highlight__button-arrow {
transform: none;
}
} .walker-service-highlight__expert-chip {
display: flex;
align-items: center;
gap: 13px;
margin-top: clamp(20px, 2.5vw, 28px);
padding: 12px 14px;
border: 1px solid rgba(15, 127, 131, 0.12);
border-radius: 20px;
background: var(--walker-ui-soft-teal, rgba(15, 127, 131, 0.07));
}
.walker-service-highlight__expert-photo-link {
display: block;
flex: 0 0 auto;
border-radius: 50%;
text-decoration: none !important;
}
.walker-service-highlight__expert-photo {
display: grid;
place-items: center;
width: 58px;
height: 58px;
overflow: hidden;
border: 4px solid var(--walker-ui-white, #fff);
border-radius: 50%;
background: linear-gradient(145deg, var(--walker-ui-teal, #0f7f83), var(--walker-ui-navy, #123247));
box-shadow: 0 8px 18px rgba(17, 49, 66, 0.14);
}
.walker-service-highlight__expert-photo img {
display: block;
width: 100%;
height: 100%;
object-fit: cover;
object-position: center;
}
.walker-service-highlight__expert-initials {
color: var(--walker-ui-white, #fff);
font-size: 15px;
font-weight: 850;
letter-spacing: -0.04em;
line-height: 1;
}
.walker-service-highlight__expert-copy {
display: flex;
flex: 1 1 auto;
min-width: 0;
flex-direction: column;
}
.walker-service-highlight__expert-label {
color: var(--walker-ui-gold, #b7a36a);
font-size: 10px;
font-weight: 850;
letter-spacing: 0.18em;
line-height: 1.25;
text-transform: uppercase;
}
.walker-service-highlight__expert-name,
.walker-service-highlight__expert-name:visited {
margin-top: 4px;
overflow: hidden;
color: var(--walker-ui-navy, #123247) !important;
font-size: 14px;
font-weight: 850;
letter-spacing: -0.015em;
line-height: 1.25;
text-decoration: none !important;
text-overflow: ellipsis;
white-space: nowrap;
}
.walker-service-highlight__expert-name:hover,
.walker-service-highlight__expert-name:focus-visible {
color: var(--walker-ui-teal-dark, #0b666a) !important;
}
.walker-service-highlight__expert-role {
margin-top: 3px;
overflow: hidden;
color: rgba(79, 100, 112, 0.88);
font-size: 12px;
font-weight: 650;
line-height: 1.35;
text-overflow: ellipsis;
white-space: nowrap;
}
.walker-service-highlight__expert-link,
.walker-service-highlight__expert-link:visited {
display: inline-flex;
align-items: center;
gap: 4px;
flex: 0 0 auto;
color: var(--walker-ui-teal, #0f7f83) !important;
font-size: 12px;
font-weight: 850;
line-height: 1.2;
text-decoration: none !important;
transition: color 180ms ease;
}
.walker-service-highlight__expert-link-arrow {
width: 15px;
height: 15px;
fill: none;
stroke: currentColor;
stroke-linecap: round;
stroke-linejoin: round;
stroke-width: 2;
transition: transform 180ms ease;
}
.walker-service-highlight__expert-link:hover,
.walker-service-highlight__expert-link:focus-visible {
color: var(--walker-ui-teal-dark, #0b666a) !important;
}
.walker-service-highlight__expert-link:hover .walker-service-highlight__expert-link-arrow,
.walker-service-highlight__expert-link:focus-visible .walker-service-highlight__expert-link-arrow {
transform: translateX(3px);
}
.walker-service-highlight__expert-photo-link:focus-visible,
.walker-service-highlight__expert-name:focus-visible,
.walker-service-highlight__expert-link:focus-visible {
outline: 3px solid rgba(15, 127, 131, 0.28);
outline-offset: 4px;
border-radius: 4px;
}
@media (max-width: 520px) {
.walker-service-highlight__expert-chip {
align-items: flex-start;
flex-wrap: wrap;
}
.walker-service-highlight__expert-copy {
min-width: calc(100% - 78px);
}
.walker-service-highlight__expert-link {
margin-left: 71px;
}
}
@media (prefers-reduced-motion: reduce) {
.walker-service-highlight__expert-link,
.walker-service-highlight__expert-link-arrow {
transition: none !important;
}
.walker-service-highlight__expert-link:hover .walker-service-highlight__expert-link-arrow,
.walker-service-highlight__expert-link:focus-visible .walker-service-highlight__expert-link-arrow {
transform: none;
}
}