/* Homepage care pathways — warm clinical editorial with a native swipe index. */
.hp-pathways{
  --care-ink:#352e21;
  --care-muted:#756d5e;
  --care-line:rgba(67,55,35,.13);
  --care-paper:#f3f0ea;
  background:var(--care-paper);
  padding:clamp(66px,8vw,112px) 0 clamp(58px,7vw,90px);
  overflow:hidden;
}
.hp-pathways .section-head{
  max-width:790px;
  margin:0 0 34px;
}
.hp-pathways .section-head .eyebrow{
  color:#766d5b;
  margin-bottom:12px;
}
.hp-pathways .section-head h2{
  color:var(--care-ink);
  max-width:19ch;
  margin:0 0 14px;
  font-size:clamp(32px,4.5vw,56px);
  font-weight:400;
  letter-spacing:-.052em;
  line-height:1.02;
}
.hp-pathways .section-head p{
  max-width:53ch;
  margin:0;
  color:var(--care-muted);
  font-size:15px;
  line-height:1.65;
}
.hp-pathways .care-grid{
  display:grid;
  grid-template-columns:repeat(12,minmax(0,1fr));
  grid-template-rows:360px 360px;
  gap:16px;
  outline:none;
}
.hp-pathways .care-card{
  position:relative;
  display:flex;
  min-width:0;
  flex-direction:column;
  overflow:hidden;
  border:1px solid var(--care-line);
  border-radius:7px;
  background:#fbfaf7;
  color:var(--care-ink);
  text-decoration:none;
  box-shadow:0 2px 8px rgba(45,36,21,.025);
  transition:transform .24s ease,border-color .24s ease,box-shadow .24s ease;
}
.hp-pathways .care-card--bariatric{grid-column:1 / 8;grid-row:1}
.hp-pathways .care-card--upper-gi{grid-column:8 / 13;grid-row:1}
.hp-pathways .care-card--metabolic{grid-column:1 / 6;grid-row:2}
.hp-pathways .care-card--app{grid-column:6 / 13;grid-row:2}
.hp-pathways .care-card:hover{
  transform:translateY(-3px);
  border-color:rgba(67,55,35,.28);
  box-shadow:0 14px 32px rgba(45,36,21,.085);
}
.hp-pathways .care-card:focus-visible,
.hp-pathways .care-grid:focus-visible{
  outline:3px solid #74664c;
  outline-offset:4px;
}
.hp-pathways .care-image{
  position:relative;
  display:block;
  flex:1 1 auto;
  min-height:0;
  overflow:hidden;
  background:#ded8cc;
}
.hp-pathways .care-image > img{
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center;
  transition:transform .48s cubic-bezier(.2,.7,.2,1);
}
.hp-pathways .care-card:hover .care-image > img{transform:scale(1.025)}
.hp-pathways .care-card--bariatric .care-image > img{object-position:center 20%}
.hp-pathways .care-card--upper-gi .care-image > img{object-position:center top}
.hp-pathways .care-card--metabolic .care-image > img{object-position:center 43%}
.hp-pathways .care-image::after{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:linear-gradient(180deg,rgba(30,26,19,.32),transparent 32%);
}
.hp-pathways .care-index{
  position:absolute;
  z-index:1;
  top:17px;
  left:18px;
  display:inline-flex;
  align-items:center;
  gap:8px;
  color:#fff;
  font-size:10px;
  font-weight:500;
  letter-spacing:.13em;
  line-height:1;
  text-transform:uppercase;
  text-shadow:0 1px 8px rgba(0,0,0,.4);
}
.hp-pathways .care-index > span{opacity:.66}
.hp-pathways .care-copy{
  display:flex;
  min-height:116px;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  padding:20px 22px 21px;
  border-top:1px solid rgba(67,55,35,.08);
}
.hp-pathways .care-copy-main{
  display:flex;
  min-width:0;
  flex-direction:column;
  align-items:flex-start;
}
.hp-pathways .care-kicker{
  display:block;
  margin:0 0 6px;
  color:#817766;
  font-size:9px;
  font-weight:500;
  letter-spacing:.14em;
  line-height:1.2;
  text-transform:uppercase;
}
.hp-pathways .care-title{
  display:block;
  margin:0;
  color:var(--care-ink);
  font-size:clamp(18px,2vw,24px);
  font-weight:400;
  letter-spacing:-.035em;
  line-height:1.13;
}
.hp-pathways .care-description{
  display:block;
  max-width:48ch;
  margin:7px 0 0;
  color:var(--care-muted);
  font-size:12px;
  line-height:1.45;
}
.hp-pathways .care-arrow{
  display:grid;
  flex:0 0 34px;
  width:34px;
  height:34px;
  place-items:center;
  border:1px solid rgba(67,55,35,.2);
  border-radius:50%;
  color:var(--care-ink);
  font-size:16px;
  line-height:1;
  transition:background-color .2s ease,color .2s ease,border-color .2s ease,transform .2s ease;
}
.hp-pathways .care-card:hover .care-arrow{
  transform:translate(2px,-2px);
  border-color:var(--care-ink);
  background:var(--care-ink);
  color:#fbfaf7;
}
.hp-pathways .care-card--app .care-image{
  display:flex;
  align-items:center;
  justify-content:center;
  background:
    radial-gradient(ellipse at 50% 55%,rgba(255,255,255,.78),rgba(255,255,255,0) 53%),
    linear-gradient(135deg,#e9e3d8,#d9d0c0);
}
.hp-pathways .care-card--app .care-image::after{display:none}
.hp-pathways .care-card--app .care-phone-stage{
  background:#000;
}
.hp-pathways .care-card--app .care-phone-stage > img{
  object-fit:contain;
  object-position:center;
}
.hp-pathways .care-phone-frame{
  position:relative;
  z-index:1;
  display:block;
  width:auto;
  height:calc(100% - 30px);
  aspect-ratio:1242 / 2688;
  padding:4px;
  flex:none;
  overflow:hidden;
  border:1px solid rgba(40,34,25,.75);
  border-radius:23px;
  background:linear-gradient(145deg,#6b6254,#211e18 28%,#171510 76%,#595041);
  box-shadow:0 16px 28px -12px rgba(48,38,23,.48),inset 0 1px 0 rgba(255,248,231,.42);
}
.hp-pathways .care-phone-screen{
  display:block;
  width:100%;
  height:100%;
  overflow:hidden;
  border-radius:19px;
  background:#201b14;
}
.hp-pathways .care-phone-screen img{
  display:block;
  width:100%;
  height:100%;
  object-fit:contain;
}
.hp-pathways .care-card--app .care-index{
  top:18px;
  left:20px;
  color:#625945;
  text-shadow:none;
}
.hp-pathways .care-card--app .care-copy{background:#fbfaf7}
.hp-pathways .care-scroll-note{display:none}
@media(max-width:900px){
  .hp-pathways .care-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
    grid-template-rows:repeat(2,340px);
  }
  .hp-pathways .care-card--bariatric{grid-column:1;grid-row:1}
  .hp-pathways .care-card--upper-gi{grid-column:2;grid-row:1}
  .hp-pathways .care-card--metabolic{grid-column:1;grid-row:2}
  .hp-pathways .care-card--app{grid-column:2;grid-row:2}
  .hp-pathways .care-copy{padding:18px}
}
@media(max-width:680px){
  .hp-pathways{
    padding:58px 0 54px;
  }
  .hp-pathways .section-head{margin:0 0 25px}
  .hp-pathways .section-head h2{
    max-width:17ch;
    font-size:clamp(32px,8.2vw,39px);
    letter-spacing:-.05em;
  }
  .hp-pathways .section-head p{font-size:14px}
  .hp-pathways .care-grid{
    display:grid;
    grid-template-columns:none;
    grid-template-rows:1fr;
    grid-auto-flow:column;
    grid-auto-columns:78vw;
    gap:13px;
    width:calc(100% + var(--gut));
    margin-right:calc(-1 * var(--gut));
    padding:0 var(--gut) 9px 0;
    overflow-x:auto;
    overscroll-behavior-x:contain;
    scroll-snap-type:x mandatory;
    scroll-padding-left:0;
    -webkit-overflow-scrolling:touch;
    scrollbar-width:none;
  }
  .hp-pathways .care-grid::-webkit-scrollbar{display:none}
  .hp-pathways .care-card,
  .hp-pathways .care-card--bariatric,
  .hp-pathways .care-card--upper-gi,
  .hp-pathways .care-card--metabolic,
  .hp-pathways .care-card--app{
    grid-column:auto;
    grid-row:auto;
    width:100%;
    min-height:0;
    aspect-ratio:1/1;
    scroll-snap-align:start;
    scroll-snap-stop:normal;
  }
  .hp-pathways .care-image{flex:1 1 54%;min-height:0}
  .hp-pathways .care-copy{
    min-height:0;
    flex:0 0 46%;
    align-items:flex-end;
    gap:10px;
    padding:15px 15px 16px;
  }
  .hp-pathways .care-kicker{font-size:8px;margin-bottom:5px}
  .hp-pathways .care-title{font-size:clamp(19px,5.2vw,23px)}
  .hp-pathways .care-description{font-size:11px;line-height:1.4;margin-top:6px}
  .hp-pathways .care-arrow{width:30px;height:30px;flex-basis:30px;font-size:14px}
  .hp-pathways .care-index{top:13px;left:14px;font-size:9px}
  .hp-pathways .care-card--app .care-index{top:14px;left:15px}
  .hp-pathways .care-card--app .care-image{flex:1 1 54%}
  .hp-pathways .care-phone-frame{
    height:calc(100% - 28px);
    padding:3px;
    border-radius:20px;
  }
  .hp-pathways .care-phone-screen{border-radius:17px}
  .hp-pathways .care-scroll-note{
    display:flex;
    align-items:center;
    gap:12px;
    margin:14px 0 0;
    color:#817766;
    font-size:9px;
    font-weight:500;
    letter-spacing:.12em;
    text-transform:uppercase;
  }
  .hp-pathways .care-scroll-line{
    display:block;
    width:42px;
    height:1px;
    background:rgba(67,55,35,.32);
  }
}
@media(prefers-reduced-motion:reduce){
  .hp-pathways .care-card,
  .hp-pathways .care-image > img,
  .hp-pathways .care-arrow{transition:none}
}