/* Reference-style page cards for the work and people behind OSI. */
.page-directory{background:#f7f4ed;color:#163b31}
.page-directory h2{font-size:clamp(40px,5.2vw,72px);line-height:1.08;letter-spacing:-.045em;margin:0 0 65px;max-width:950px}
.page-directory-grid{display:grid;grid-template-columns:1.2fr 1fr;gap:26px;align-items:end}
.page-directory-card{position:relative;display:block;min-width:0;overflow:hidden;isolation:isolate;border:1.5px solid #fff;border-radius:32px;background:#244c3b;box-shadow:inset 0 1px 0 #fff9,0 15px 50px #163b310c;transition:transform .3s ease,box-shadow .3s ease}
.page-events{min-height:560px}.page-team{min-height:430px}
.page-events>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 45%;z-index:-2;transition:transform .5s ease}
.page-directory-card:after{content:'';position:absolute;inset:0;z-index:-1;pointer-events:none;background:linear-gradient(180deg,transparent 45%,#0c211bd9)}
.page-directory-label{position:absolute;left:28px;right:28px;bottom:30px;display:flex;justify-content:space-between;align-items:center;gap:20px;color:#fff}
.page-directory-label h3{font-size:clamp(32px,3.3vw,48px);line-height:1.15;letter-spacing:-.035em;margin:0;color:#fff}
.open-page-pill{display:inline-flex;align-items:center;justify-content:center;white-space:nowrap;padding:11px 17px;border:1.5px solid #ffffffa6;border-radius:999px;background:#345e49b3;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);font-size:14px;line-height:1.4;font-weight:600;color:#fff}
.team-photo-placeholder{position:absolute;inset:0;z-index:-2;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:22px;padding:30px 30px 100px;background:radial-gradient(ellipse at 35% 25%,#5a7d5c,transparent 65%),#234b3a;color:#edf3e8}
.team-photo-placeholder img{width:90px;height:94px;background:#fff;border-radius:50%;padding:6px;opacity:.9}
.team-photo-placeholder span{font-size:15px;line-height:1.6;text-align:center}
.page-directory-card:hover{transform:translateY(-4px);box-shadow:0 20px 55px #163b311f}.page-directory-card:hover>img{transform:scale(1.025)}
.page-directory-card:focus-visible{outline:3px solid #bd9347;outline-offset:6px}
@media(max-width:1000px){.page-events{min-height:500px}.page-team{min-height:400px}.page-directory-label{left:23px;right:23px;bottom:26px;gap:12px}.open-page-pill{padding:10px 14px;font-size:13px}}
@media(max-width:700px){.page-directory h2{font-size:clamp(37px,10vw,52px);margin-bottom:38px}.page-directory-grid{grid-template-columns:1fr;gap:22px}.page-directory-card{border-radius:27px}.page-events{min-height:430px}.page-team{min-height:350px}.page-directory-label{left:24px;right:24px;bottom:26px}.page-directory-label h3{font-size:35px}.open-page-pill{font-size:13px}.team-photo-placeholder{padding-bottom:85px}}
@media(prefers-reduced-motion:reduce){.page-directory-card,.page-directory-card>img{transition:none}.page-directory-card:hover,.page-directory-card:hover>img{transform:none}}
/* The supplied landscape photograph keeps every volunteer in the frame. */
.page-events{min-height:440px}.page-events>img{object-fit:contain;object-position:center;background:#244c3b}.page-team{min-height:350px}
@media(max-width:1000px){.page-events{min-height:410px}.page-team{min-height:340px}}
@media(max-width:700px){.page-events{min-height:350px}.page-team{min-height:330px}}
