/* Chapter 02: an editorial introduction followed by three living portraits. */
#care.care{display:block;padding-top:clamp(64px,7vw,112px);padding-bottom:clamp(72px,8vw,128px)}
#care .care-left{position:static;display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);grid-template-areas:"label copy" "title copy" "title note" "title control";column-gap:clamp(40px,7vw,112px);max-width:1080px;margin:0 auto clamp(42px,5vw,72px);align-items:start}
#care .care-left>.eyebrow{grid-area:label;margin:0 0 22px}
#care .care-left>h2{grid-area:title;font-size:clamp(38px,4.6vw,66px);line-height:1.18;letter-spacing:-.055em;margin:0}
#care .care-left>p:not(.eyebrow){grid-area:copy;align-self:end;font-size:16px;line-height:1.9;margin:0 0 14px;max-width:36ch;word-break:keep-all;overflow-wrap:break-word}
#care .care-left>.small-note{grid-area:note;font-size:11px;line-height:1.7;max-width:40ch;word-break:keep-all}
#care .care-motion-toggle{grid-area:control;justify-self:start;margin:18px 0 0;min-height:44px;background:transparent}
#care .care-timeline{max-width:1080px;margin:0 auto}
#care .care-timeline article{display:grid;grid-template-columns:56px clamp(164px,16vw,196px) minmax(0,1fr);grid-template-areas:"number media copy";column-gap:clamp(24px,3.2vw,48px);padding:32px 0;min-height:0;align-items:center}
#care .care-timeline .step-no{grid-area:number;font-size:clamp(32px,3vw,42px);line-height:1;align-self:center}
#care .care-timeline article>div{grid-area:copy;min-width:0}
#care .care-timeline h3{font-size:clamp(26px,2.3vw,33px);line-height:1.35;margin:0 0 13px;letter-spacing:-.035em}
#care .care-timeline p{font-size:15px;line-height:1.85;max-width:46ch;word-break:keep-all;overflow-wrap:break-word;text-wrap:balance}
#care .care-video-button,#care .care-timeline article>img{grid-area:media;width:100%;height:auto;aspect-ratio:3/4;align-self:center;border-radius:110px 110px 10px 10px;cursor:zoom-in}
#care .care-video-button>img,#care .care-preview{object-position:50% 28%}
#care .care-timeline article:nth-child(2) .care-video-button>img,#care .care-timeline article:nth-child(2) .care-preview{object-position:50% 22%}
#care .care-video-button>.care-video-hint{opacity:1;transform:none;bottom:16px;left:50%;right:auto;translate:-50% 0;width:max-content;max-width:calc(100% - 20px);padding:6px 10px;font-size:10px;line-height:1.4;border:1px solid #ffffff45;border-radius:20px;background:#171311b8;color:white}
#care .care-video-button:hover{transform:translateY(-3px);box-shadow:0 12px 30px #24160b20}
#care .care-video-button:hover>.care-video-hint,#care .care-video-button:focus-visible>.care-video-hint{background:#171311e6}
@media(max-width:1000px){
  #care .care-left{column-gap:36px;grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
  #care .care-left>h2{font-size:clamp(36px,4.7vw,47px)}
  #care .care-left>p:not(.eyebrow){font-size:15px}
  #care .care-timeline article{grid-template-columns:44px clamp(140px,19vw,170px) minmax(0,1fr);column-gap:28px}
}
@media(max-width:760px){
  #care .care-left{display:block;max-width:560px;margin-left:0;margin-bottom:36px}
  #care .care-left>h2{font-size:clamp(38px,6.8vw,52px);margin-bottom:24px}
  #care .care-left>.eyebrow{font-size:10px;margin-bottom:20px}
  #care .care-left>p:not(.eyebrow){max-width:38ch;margin-bottom:12px}
  #care .care-motion-toggle{margin-top:18px}
}
@media(max-width:640px){
  #care.care{padding-top:64px;padding-bottom:72px}
  #care .care-timeline article{grid-template-columns:38px minmax(0,1fr);grid-template-areas:"media media" "number copy";gap:24px 16px;padding:28px 0 34px}
  #care .care-video-button,#care .care-timeline article>img{width:100%;max-width:400px;justify-self:center;aspect-ratio:5/6;border-radius:200px 200px 12px 12px}
  #care .care-timeline .step-no{font-size:32px;align-self:start;padding-top:4px}
  #care .care-timeline h3{font-size:26px;margin-bottom:10px}
  #care .care-timeline p{font-size:14px;line-height:1.85;max-width:34ch}
  #care .care-video-button>.care-video-hint{bottom:14px;font-size:11px;padding:7px 12px}
}
@media(prefers-reduced-motion:reduce){#care .care-video-button:hover{transform:none}}
