/* ============================================================
   PatientQ — Client Styles
   ============================================================ */

/* ── Nav save indicator ── */
.save-indicator {
  display: flex; align-items: center; gap: 6px;
  font-size: 12px; color: rgba(255,255,255,0.5);
}
.sdot {
  width: 7px; height: 7px; border-radius: 50%;
  background: rgba(255,255,255,0.3);
  transition: background 0.3s;
}
.sdot.saved  { background: #4ade80; }
.sdot.saving { background: #fbbf24; animation: blink 1s infinite; }
@keyframes blink { 0%,100%{opacity:1} 50%{opacity:0.3} }

/* ── Layout ── */
.client-wrap {
  max-width: 680px;
  margin: 0 auto;
  padding: 2rem 1.25rem 4rem;
}

/* ── Hero ── */
.c-hero { margin-bottom: 2rem; }
.c-hero h1 {
  font-family: 'DM Serif Display', serif;
  font-size: 28px; color: var(--navy);
  line-height: 1.2; margin-bottom: 6px;
}
.c-hero p { font-size: 15px; color: var(--g600); line-height: 1.65; }

/* ── Card header ── */
.c-card-header {
  display: flex; align-items: flex-start; gap: 14px;
  margin-bottom: 1.5rem;
}
.c-icon {
  width: 46px; height: 46px; border-radius: 12px;
  background: var(--teal-light);
  display: flex; align-items: center; justify-content: center;
  flex-shrink: 0;
}
.c-icon svg { width: 22px; height: 22px; }
.c-title { font-family: 'DM Serif Display', serif; font-size: 20px; color: var(--navy); line-height: 1.2; }
.c-sub   { font-size: 13px; color: var(--g600); margin-top: 3px; }