/* ==========================================================================
   AOM — Patients page styles
   ========================================================================== */

/* ---------- Hero ----------
   The Patients twin of the Providers hero: copy flush on the canvas,
   centered — two-line title, one-line tagline, the two actions as outline
   buttons — then the photo at the framed-section width. */
.main-wrapper > .patients-hero{margin:0;border-radius:0;--section-inset:0px}
.patients-hero-inner{
  display:flex;
  flex-direction:column;
  align-items:center;
  text-align:center;
  padding-top:3.5rem;padding-bottom:2.4rem; /* the home's tightness: copy close under the header, photo close under the copy */
}
.patients-hero-title{font-size:clamp(2.5rem,5vw,4.2rem);letter-spacing:-.03em;margin-top:.8rem;max-width:16ch}
.patients-hero-sub{margin-top:1.2rem;font-size:1.08rem;color:var(--grey-700);max-width:60ch}
.patients-hero-actions{display:flex;justify-content:center;gap:.8rem;margin-top:1.8rem;flex-wrap:wrap}
.patients-hero-media{
  margin:0 var(--frame-gap);
  height:clamp(320px,56vh,600px);
  border-radius:var(--radius-card);
  overflow:hidden;
}
.patients-hero-media img{display:block;width:100%;height:100%;object-fit:cover;object-position:center}
@media (max-width:780px){
  .patients-hero-inner{padding-top:3.5rem;padding-bottom:2rem}
  .patients-hero-media{height:46vh}
}

/* ---------- What makes us unique ----------
   Full-bleed photo cards with an overlay, same visual language as the
   specialty tiles below — not a photo-on-top-of-a-grey-box card. */
.patients-unique{padding:6rem 0}
.patients-unique-head{margin-bottom:2.6rem}
.patients-unique-title{font-size:clamp(1.7rem,3vw,2.4rem);margin-top:.6rem}
.patients-unique-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:1.2rem;
}
.patients-unique-card{
  position:relative;
  aspect-ratio:16/10; /* landscape: these are statements, not destinations */
  border-radius:var(--radius-card);
  overflow:hidden;
}
.patients-unique-img{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  transition:transform .5s var(--ease);
}
.patients-unique-card:hover .patients-unique-img{transform:scale(1.06)}
.patients-unique-card::after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(to top,rgba(5,6,8,.85),rgba(5,6,8,.05) 55%,transparent);
  pointer-events:none;
}
.patients-unique-num{
  position:absolute;
  top:1.4rem;
  left:1.4rem;
  z-index:1;
  width:34px;
  height:34px;
  border-radius:50%;
  background:rgba(255,255,255,.2);
  backdrop-filter:blur(6px);
  display:flex;
  align-items:center;
  justify-content:center;
  font-family:var(--font-mono);
  font-size:.82rem;
  color:var(--white);
}
.patients-unique-copy{position:absolute;left:1.6rem;right:1.6rem;bottom:1.6rem;z-index:1}
.patients-unique-card-title{font-size:1.25rem;font-weight:550;color:var(--white)}
.patients-unique-card-text{margin-top:.5rem;font-size:.92rem;color:var(--grey-300)}
@media (max-width:780px){
  .patients-unique-grid{grid-template-columns:1fr}
  .patients-unique-card{aspect-ratio:16/10}
}