/* =========================================================
   Staff pages – bootstrap grid columns, utilities, and
   BEM component styles needed by StaffMembers / StaffMember
   ========================================================= */

/* Override layout's global text-white for staff pages */
.c-staff-page { color: #1a1a1a; }

/* Smiles brand tokens */
:root {
  --smiles-primary:   #114278;
  --smiles-secondary: #f2281d;
  --smiles-light:     #cfd9e3;
}

/* ---------------------------------------------------------
   Bootstrap-compatible responsive grid columns (missing
   from Tailwind bundle). Breakpoints: sm 576 / md 768 / lg 992
   --------------------------------------------------------- */

/* Bootstrap row — must be flex for columns to sit side-by-side */
.row { display: flex; flex-wrap: wrap; margin-right: -0.75rem; margin-left: -0.75rem; }
.row > * { padding-right: 0.75rem; padding-left: 0.75rem; }

/* base (mobile-first) */
.col { flex: 1 0 0%; }
.col-auto { flex: 0 0 auto; width: auto; }
.col-12 { flex: 0 0 auto; width: 100%; }

/* sm breakpoint ≥576px */
@media (min-width: 576px) {
  .col-sm-4  { flex: 0 0 auto; width: 33.3333%; }
  .col-sm-6  { flex: 0 0 auto; width: 50%; }
  .col-sm-10 { flex: 0 0 auto; width: 83.3333%; }
  .col-sm-12 { flex: 0 0 auto; width: 100%; }
  .offset-sm-2 { margin-left: 16.6667%; }
  .order-sm-last  { order: 999; }
  .order-sm-first { order: -1; }
  .d-sm-none { display: none !important; }
}

/* md breakpoint ≥768px */
@media (min-width: 768px) {
  .col-md-8  { flex: 0 0 auto; width: 66.6667%; }
}

/* lg breakpoint ≥992px */
@media (min-width: 992px) {
  .col-lg-3  { flex: 0 0 auto; width: 25%; }
  .col-lg-9  { flex: 0 0 auto; width: 75%; }
}

/* Flexbox helpers */
.justify-content-center { justify-content: center !important; }
.order-first { order: -1 !important; }

/* ---------------------------------------------------------
   Bootstrap utilities missing from bundle
   --------------------------------------------------------- */

.rounded-circle { border-radius: 50% !important; }

.display-1 { font-size: 5rem;   font-weight: 300; line-height: 1.2; }
.display-2 { font-size: 4.5rem; font-weight: 300; line-height: 1.2; }
.display-3 { font-size: 2rem;   font-weight: 300; line-height: 1.2; }

.text-primary { color: var(--smiles-primary) !important; }

.btn-primary {
  background-color: var(--smiles-primary);
  border-color:     var(--smiles-primary);
  color: #fff;
  display: inline-block;
  font-weight: 400;
  text-align: center;
  padding: 0.375rem 0.75rem;
  border-radius: 0.25rem;
  text-decoration: none;
  transition: background-color .15s ease-in-out, border-color .15s ease-in-out;
}
.btn-primary:hover {
  background-color: var(--smiles-secondary);
  border-color:     var(--smiles-secondary);
  color: #fff;
}

/* ---------------------------------------------------------
   c-tag  (section label chip)
   --------------------------------------------------------- */

.c-tag {
  display: inline-block;
  font-size: 0.75rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  margin-bottom: 0.5rem;
}

.c-tag__section-link { color: var(--smiles-secondary); }

/* ---------------------------------------------------------
   c-staff  (staff member card / listing)
   --------------------------------------------------------- */

.c-staff { color: #1a1a1a; }
.c-staff .c-staff__title { color: var(--smiles-primary); }
.c-staff .c-staff__tag   { color: var(--smiles-secondary); }

.c-staff img { max-width: 100%; height: auto; display: block; }

.c-staff.row { gap: 1.5rem 0; column-gap: 1.5rem; }

/* ---------------------------------------------------------
   c-clamp-text  (expandable bio text)
   --------------------------------------------------------- */

.c-clamp-text--full {
  overflow: hidden;
  transition: max-height 300ms linear;
}

.c-clamp-text--full.collapse:not(.show) { display: none; }

/* ---------------------------------------------------------
   Typography helpers
   --------------------------------------------------------- */

.text-larger { font-size: 1.125rem; line-height: 1.6; }

.rte h2, .rte h3, .rte h4 { color: var(--smiles-primary); }
.rte p  { margin-bottom: 1rem; }
.rte ul, .rte ol { padding-left: 1.5rem; margin-bottom: 1rem; }
.rte a  { color: var(--smiles-primary); }

/* ---------------------------------------------------------
   c-form-block (appointment section)
   --------------------------------------------------------- */

.c-form-block__title { color: var(--smiles-primary); }
.c-title { color: var(--smiles-primary); }

/* ---------------------------------------------------------
   c-divide (horizontal rule between sections)
   --------------------------------------------------------- */

.c-divide--b { border-bottom: 1px solid var(--smiles-light); padding-bottom: 3rem; margin-bottom: 3rem; }

/* ---------------------------------------------------------
   c-stacked-content-module  (full-width content section)
   --------------------------------------------------------- */

.c-stacked-content-module { padding: 3rem 0; }

/* ---------------------------------------------------------
   c-flourish  (decorative background wrapper for staff page)
   --------------------------------------------------------- */

.c-flourish {
  position: relative;
  overflow: hidden;
}

.c-flourish--parallax .parallax-layer {
  position: absolute;
  pointer-events: none;
}

.c-flourish--staff-page {
  background: linear-gradient(135deg, #f3f7fb 0%, #e8f0f8 100%);
}

.c-flourish--align-bottom { padding-bottom: 0; }