/* =========================================================
   V10.4 — CARE JOURNEY INTERACTION REFINEMENT
   Hover/focus treatment for the three right-hand care panels.
   Keeps the existing geometry and content intact.
   ========================================================= */
.care-point{
  position:relative;
  isolation:isolate;
  overflow:hidden;
  cursor:pointer;
  transition:
    transform .34s cubic-bezier(.2,.7,.2,1),
    box-shadow .34s ease,
    background .34s ease,
    border-color .34s ease,
    color .34s ease;
}

/* Soft color wash enters from the lower-right without becoming a block. */
.care-point::after{
  content:"";
  position:absolute;
  inset:0;
  z-index:-1;
  background:
    radial-gradient(circle at 92% 88%, rgba(43,122,107,.20), transparent 42%),
    linear-gradient(135deg, rgba(255,255,255,0), rgba(224,239,235,.72));
  opacity:0;
  transform:scale(1.04);
  transition:opacity .38s ease, transform .55s cubic-bezier(.2,.7,.2,1);
}

.care-point::before{
  transition:
    border-color .34s ease,
    transform .55s cubic-bezier(.2,.7,.2,1),
    width .34s ease,
    height .34s ease;
}

.care-point:hover,
.care-point:focus-within{
  transform:translateX(7px) translateY(-3px);
  background:linear-gradient(135deg,#F9FCFB 0%,#DCECE8 100%);
  border-color:rgba(43,122,107,.30);
  box-shadow:0 20px 48px rgba(18,60,53,.12);
}

.care-point:hover::after,
.care-point:focus-within::after{
  opacity:1;
  transform:scale(1);
}

.care-point:hover::before,
.care-point:focus-within::before{
  transform:scale(1.08);
  border-color:rgba(217,164,65,.34);
}

.care-point span{
  position:relative;
  display:inline-flex;
  align-items:center;
  gap:9px;
  transition:color .3s ease, letter-spacing .3s ease;
}

.care-point span::after{
  content:"";
  width:0;
  height:2px;
  border-radius:999px;
  background:#D9A441;
  transition:width .3s ease;
}

.care-point:hover span,
.care-point:focus-within span{
  color:#1F6B5B;
  letter-spacing:1.7px;
}

.care-point:hover span::after,
.care-point:focus-within span::after{
  width:24px;
}

.care-point h3{
  transition:color .3s ease, transform .3s ease;
}

.care-point p{
  transition:color .3s ease;
}

.care-point:hover h3,
.care-point:focus-within h3{
  color:#123C35;
  transform:translateX(2px);
}

.care-point:hover p,
.care-point:focus-within p{
  color:#536B65;
}

@media(max-width:991px){
  .care-point:hover,
  .care-point:focus-within{transform:translateY(-5px)}
}

@media(max-width:767px){
  .care-point:hover,
  .care-point:focus-within{transform:translateY(-4px)}
}

@media(prefers-reduced-motion:reduce){
  .care-point,
  .care-point::before,
  .care-point::after,
  .care-point span,
  .care-point span::after,
  .care-point h3,
  .care-point p{transition:none}
}
