/* ── Centred layout (applies to every role/page) ───────────── */
.club-panel { text-align: center; }

/* Top row: logo centred, actions centred beneath */
.top-row { flex-direction: column; align-items: center; gap: 14px; }
.top-actions { justify-content: center; flex-wrap: wrap; }

/* Hero + section intros centred */
.hero { margin-left: auto; margin-right: auto; text-align: center; }
.hero h1, .hero p { margin-left: auto; margin-right: auto; }
.space-badge { margin-left: auto; margin-right: auto; }

.choose-line { text-align: center; }
.privacy-note, .progress-note, .demo-inline-note, .empty-note, .legal-notice, .legal-intro {
  margin-left: auto; margin-right: auto; text-align: center;
}

/* Content columns centred with comfortable reading width */
.card-grid, .detail-list, .journal-list, .today-grid, .keepsake-grid, .gallery-wall,
.welcome-audio, .legal-layout { margin-left: auto; margin-right: auto; }
.detail-list, .journal-list { max-width: 760px; }
.welcome-audio { text-align: center; }
.welcome-audio-player { margin-left: auto; margin-right: auto; }

/* Cards centred */
.nav-card { text-align: center; display: flex; flex-direction: column; align-items: center; }
.card-icon { margin-left: auto; margin-right: auto; }
.nav-card .card-tag { margin-left: auto; margin-right: auto; }

/* Today + info panels + keepsakes centred */
.today-card { text-align: center; }
.today-card .today-tag { margin-left: auto; margin-right: auto; }
.info-panel { text-align: center; }
.keepsake-card { text-align: center; }
.keepsake-thumb { margin-left: auto; margin-right: auto; }

/* Quick action centred */
.quick-action { justify-content: center; }

/* Lists that pair a label + chip stay as space-between rows, but centre their block */
.je-head { justify-content: center; gap: 10px; }
.cluster-head { justify-content: center; }
.stone-list li { justify-content: center; gap: 14px; text-align: center; }
.je-public { justify-content: center; }
.je-actions { justify-content: center; }

/* Forms centred */
.calm-form { margin-left: auto; margin-right: auto; text-align: center; }
.form-field { text-align: center; }
.radio-row, .form-actions { justify-content: center; }
.check-list { display: inline-grid; text-align: left; }

/* Gallery caption centred */
.gallery-head { justify-content: center; }
.gallery-cap { text-align: center; }
.area-name { text-align: center; }

/* Keep long-form legal reading comfortable (left-aligned body only) */
.legal-sidebar { text-align: left; }
.legal-doc-btn { text-align: left; }
.legal-doc-view, .legal-doc-body, .legal-para { text-align: left; }

/* Cluster certificate row centred */
.cluster-cert { justify-content: center; }
.report-entry { text-align: left; }


/* ── Family Account + Child Profiles ───────────────────────── */
.family-banner {
  position: relative; z-index: 2; margin: 24px auto 8px; max-width: 760px;
  display: flex; justify-content: space-between; align-items: center; gap: 16px; flex-wrap: wrap;
  padding: 18px 22px; border-radius: 20px;
  background: rgba(5,26,20,.32); border: 1px solid var(--line); text-align: left;
}
.family-eyebrow { margin: 0; font-weight: 950; letter-spacing: .14em; text-transform: uppercase; font-size: .72rem; color: var(--yellow); }
.family-name { margin: 4px 0; font-size: 1.7rem; line-height: 1; }
.family-sub { margin: 0; font-weight: 650; color: rgba(255,247,217,.82); }
.family-switch { display: flex; align-items: center; gap: 8px; }

.profile-grid {
  position: relative; z-index: 2; display: grid; gap: 14px; margin: 12px auto 6px; max-width: 760px;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
}
.profile-card {
  display: flex; flex-direction: column; align-items: center; gap: 8px;
  padding: 24px 18px; border-radius: 22px; cursor: pointer;
  background: rgba(5,26,20,.3); border: 1px solid var(--line); color: var(--cream);
  transition: transform .16s ease, border-color .16s ease;
}
.profile-card:hover, .profile-card:focus-visible { outline: none; transform: translateY(-3px); border-color: var(--glow); }
.profile-card h3 { margin: 6px 0 0; font-size: 1.3rem; }
.profile-card p { margin: 0; font-weight: 650; color: rgba(255,247,217,.78); font-size: .92rem; }
.profile-go { margin-top: 8px; padding: 8px 16px; border-radius: 999px; font-weight: 900; font-size: .84rem;
  background: rgba(255,230,108,.16); color: var(--yellow); border: 1px solid rgba(255,230,108,.4); }
.profile-add { border-style: dashed; opacity: .9; }

.child-avatar {
  width: 46px; height: 46px; border-radius: 999px; display: inline-grid; place-items: center;
  font-weight: 950; font-size: 1.2rem; color: #0f2a1f; vertical-align: middle;
  background: var(--tint, #5b86a6); border: 2px solid rgba(255,255,255,.5);
}
.child-avatar.big { width: 74px; height: 74px; font-size: 1.9rem; }
.child-avatar.add { background: rgba(255,255,255,.12); color: var(--cream); }

.child-ribbon {
  position: relative; z-index: 2; display: inline-flex; align-items: center; gap: 12px; flex-wrap: wrap;
  margin: 0 auto 8px; padding: 10px 16px; border-radius: 999px;
  background: rgba(5,26,20,.34); border: 1px solid var(--line); font-weight: 700; color: rgba(255,247,217,.9);
}