/* A compact portrait row on the homepage and a wider directory on its own page. */
.care-team {display:grid;grid-template-columns:minmax(0,1fr) auto;gap:24px}
.homepage .care-team h2 {max-width:600px;align-self:center}
.care-team h2>span {white-space:nowrap}
.care-team-all {align-self:center}
.care-team-list {grid-column:1/-1;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px;min-width:0}
.care-doctor {display:flex;flex-direction:column;min-width:0;overflow:hidden;border:1px solid var(--line);border-radius:16px;background:#fff}
.care-portrait {position:relative;display:grid;place-items:center;flex:none;overflow:hidden;height:230px;background:#eef1e8;color:#b7c0aa}
.care-portrait>img {width:100%;height:100%;object-fit:cover;object-position:50% 27%}
.care-portrait--cardiologist {background:#f4ecd9;color:#d5c8a9}
.care-portrait--hematologist {background:#f2e6df;color:#d4bfb2}
.care-portrait--neurologist {background:#e8eddf;color:#bfcbb2}
.care-portrait--ent {background:#f2e6df;color:#d4bfb2}
.care-portrait--dermatologist {background:#f0eee4;color:#cfcbb9}
.care-placeholder {position:absolute;bottom:-12px;width:88%;height:94%;fill:currentColor}
.care-doctor-info {display:flex;flex:1;flex-direction:column;padding:20px}
.care-doctor h3 {font-size:21px;line-height:1.2;letter-spacing:-.025em}
.care-doctor-role {min-height:44px;margin-top:9px;margin-bottom:20px;font-size:15px;line-height:1.45;color:var(--ink-soft)}
.care-doctor-role span {display:block}
.homepage .care-doctor .care-doctor-about {display:flex;justify-content:space-between;width:100%;min-height:44px;margin-top:auto;padding:10px 15px;border-radius:10px;font-size:14px}
.care-team-list:focus-visible {outline-offset:5px}
/* Directory: photo, personal introduction, then a real button, as in the reference. */
.team-main {padding-top:20px}
.team-back {display:inline-flex;align-items:center;gap:9px;margin-bottom:30px;color:var(--muted);font-size:15px}
.team-back .icon {width:17px;height:17px;transform:rotate(180deg)}
.team-page-intro {display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:70px;align-items:center;margin-bottom:38px}
.team-page-intro h1 {max-width:660px;font-size:50px;line-height:1.07;letter-spacing:-.05em;font-weight:600}
.team-page-intro>p {max-width:470px;font-size:18px;line-height:1.55;color:var(--ink-soft)}
.team-directory {display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}
.team-directory .care-doctor {display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.2fr);min-height:330px;border:0;background:#f4f6f0;border-radius:18px}
.team-directory .care-portrait {height:100%;min-height:330px}
.team-directory .care-portrait>img {object-position:50% 25%}
.team-directory .care-doctor-info {padding:28px 25px;min-width:0}
.team-directory .care-doctor h2 {font-size:27px;line-height:1.1;letter-spacing:-.035em}
.team-directory .care-doctor-role {order:-1;min-height:0;margin:0 0 14px;font-size:14px}
.team-directory .care-doctor-role span {display:inline}
.team-directory .care-doctor-role span:before {content:" · "}
.team-doctor-intro {margin-top:18px;font-size:16px;line-height:1.5;color:var(--ink-soft)}
.team-doctor-topics {margin-top:16px;font-size:14px;line-height:1.4;color:var(--muted)}
.team-directory .care-doctor .care-doctor-about {margin-top:auto;padding-top:11px;transform:translateY(1px)}
.team-directory .team-doctor-topics {margin-bottom:24px}
.team-help {display:flex;align-items:center;justify-content:space-between;gap:30px;margin-top:40px;padding:30px 32px;background:#fcf5d6;border-radius:18px}
.homepage .team-help h2 {font-size:28px}
.team-help>div {display:flex;gap:12px;flex:none}
.team-help .button {min-height:52px;border-radius:12px}
.team-page .full-footer {margin-top:44px}
.team-profile-head {display:flex;align-items:center;gap:20px;margin-bottom:20px}
.team-profile-photo {width:98px;height:116px;object-fit:cover;object-position:50% 25%;border-radius:12px;flex:none}
.team-profile-head h2 {margin-bottom:8px;padding-right:0}
.team-profile-head p {font-size:15px;color:var(--ink-soft)}
.team-profile-description {color:var(--ink-soft);font-size:17px}
@media(max-width:1100px) {
  .care-team-list {gap:15px}
  .care-portrait {height:205px}
  .care-doctor-info {padding:18px}
  .care-doctor h3 {font-size:20px}
  .team-directory .care-doctor {grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr)}
  .team-directory .care-doctor-info {padding:24px 20px}
  .team-directory .care-doctor h2 {font-size:24px}
  .team-help {align-items:flex-start;flex-direction:column;gap:22px}
}
@media(max-width:900px) {
  .care-team-list {grid-template-columns:none;grid-auto-flow:column;grid-auto-columns:260px;overflow-x:auto;padding-bottom:12px;scroll-snap-type:x proximity;overscroll-behavior-x:contain;scrollbar-width:thin;scrollbar-color:#bbc4b2 #f2f4ee}
  .care-team-list>.care-doctor {scroll-snap-align:start}
  .care-portrait {height:210px}
  .team-page-intro {gap:30px}
  .team-page-intro h1 {font-size:42px}
  .team-page-intro>p {font-size:16px}
  .team-directory {gap:18px}
  .team-directory .care-doctor {grid-template-columns:1fr}
  .team-directory .care-portrait {min-height:0;height:250px}
  .team-directory .care-doctor-info {padding:24px}
  .team-directory .care-doctor h2 {font-size:27px}
  .team-directory .team-doctor-intro {min-height:72px}
}
@media(max-width:600px) {
  .care-team {grid-template-columns:1fr;gap:20px}
  .homepage .care-team h2 {font-size:28px;max-width:300px}
  .care-team-list {grid-column:1;grid-row:2;grid-auto-columns:252px;gap:14px}
  .care-team-all {grid-column:1;grid-row:3;justify-self:stretch}
  .care-portrait {height:200px}
  .team-main {padding-top:10px}
  .team-back {margin-bottom:24px}
  .team-page-intro {grid-template-columns:1fr;gap:20px;margin-bottom:28px}
  .team-page-intro h1 {font-size:38px;max-width:340px}
  .team-page-intro>p {font-size:16px}
  .team-directory {grid-template-columns:1fr;gap:20px}
  .team-directory .care-portrait {height:255px}
  .team-directory .care-portrait>img {object-position:50% 22%}
  .team-directory .team-doctor-intro {min-height:0}
  .team-directory .care-doctor-role {font-size:14px}
  .team-help {padding:25px 20px;margin-top:28px;gap:20px}
  .homepage .team-help h2 {font-size:27px}
  .team-help>div {display:grid;grid-template-columns:1fr;width:100%;gap:12px}
  .team-help .button {min-height:58px;justify-content:space-between;font-size:14px;padding-inline:16px}
}
