/* ========= About: Sub-Hero ========= */
.be-about-hero {
  padding: clamp(2.5rem, 6vw, 4rem) 0 clamp(2rem, 5vw, 3rem);
  position: relative;
  background: #f7f7f9;
}
.be-about-hero .cs-container { max-width: 80rem; margin: 0 auto; padding: 0 1rem; }
.be-breadcrumbs {
  font-size: .9rem; color: #7b7b8a; margin-bottom: .75rem; display:flex; gap:.5rem; flex-wrap:wrap;
}
.be-breadcrumbs a { color: inherit; text-decoration: none; }
.be-breadcrumbs a:hover { text-decoration: underline; }
.be-about-hero .cs-title { margin: .25rem 0 .5rem; }
.be-about-hero .cs-subtitle { color: #3a3a46; margin: 0; line-height: 1.5; }
.be-about-bg {
  position:absolute; inset:0; background: radial-gradient(60rem 30rem at 20% -10%, rgba(160,160,170,.25), transparent),
                               radial-gradient(40rem 25rem at 110% 20%, rgba(160,160,170,.18), transparent);
  pointer-events:none; z-index:0;
}

/* ========= Bio ========= */
.be-about-bio { padding: var(--sectionPadding); background:#fff; position:relative; z-index:1; }
.be-about-bio .cs-container { max-width: 80rem; margin: 0 auto; padding: 0 1rem; }
.be-grid-2 { display:grid; grid-template-columns: 1fr; gap: clamp(1.5rem, 4vw, 2.5rem); }
@media (min-width: 64rem) { .be-grid-2 { grid-template-columns: 1fr 1.1fr; align-items:center; } }

.be-portrait { margin:0; border-radius: 1rem; overflow:hidden; background:#eee; }
.be-portrait img { width:100%; height:100%; object-fit: cover; display:block; }

.be-bio-copy .cs-topper { display:inline-block; margin-bottom:.5rem; }
.be-bio-copy .cs-title { margin:0 0 .5rem; }
.be-bio-copy .cs-text { margin:0 0 1rem; }
.be-pill-list { display:flex; flex-wrap:wrap; gap:.5rem; margin: 0 0 1.25rem 0; padding:0; list-style:none; }
.be-pill-list li {
  font-weight:600; font-size:.95rem; padding:.5rem .75rem; border-radius:999px;
  background:#f1f2f6; color:#21212a; border:1px solid #e5e6ec;
}

/* ========= Features ========= */
.be-about-features { padding: var(--sectionPadding); background:#f9f9fb; }
.be-about-features .cs-container { max-width: 80rem; margin: 0 auto; padding: 0 1rem; }
.be-about-features .cs-content { text-align:left; max-width: 46rem; margin: 0 auto 1.5rem 0; }
.be-features-grid {
  list-style:none; margin:0; padding:0;
  display:grid; grid-template-columns: 1fr; gap: 1rem;
}
@media (min-width: 48rem) { .be-features-grid { grid-template-columns: repeat(3, 1fr); } }
.be-feature {
  background:#fff; border:1px solid #e9e9ef; border-radius:1rem; padding:1.25rem; display:flex; flex-direction:column; gap:.5rem;
  transition: transform .25s ease, box-shadow .25s ease;
}
.be-feature:hover { transform: translateY(-2px); box-shadow: rgba(20,20,30,.06) 0 10px 24px; }
.be-icon { font-size:1.4rem; }
.be-h3 { margin:.25rem 0; }
.be-p { margin:0; color: var(--bodyTextColor); }

/* ========= Certificates (reuse cert grid modal styles) ========= */
.be-about-certs { padding: var(--sectionPadding); background:#fff; }
.be-about-certs .cs-container { max-width: 80rem; margin: 0 auto; padding: 0 1rem; }
.be-cert-grid { /* already used on home, keep same behavior */
  display:grid; grid-template-columns: repeat(2, 1fr); gap: .75rem; padding:0; margin:1rem 0 0; list-style:none;
}
@media (min-width:48rem){ .be-cert-grid { grid-template-columns: repeat(4, 1fr);} }
.be-cert-fig { border-radius:.75rem; overflow:hidden; background:#f3f3f6; border:1px solid #e8e8ee; }
.be-cert-img { width:100%; height: 10rem; object-fit: cover; display:block; cursor: zoom-in; }
@media (min-width:48rem){ .be-cert-img { height: 12rem; } }

/* Modal (already shipped earlier; duplicate only if needed) */
.be-modal{ position:fixed; inset:0; display:none; align-items:center; justify-content:center; z-index:9999; }
.be-modal.is-open{ display:flex; }
.be-modal__backdrop{ position:absolute; inset:0; background:rgba(0,0,0,.6); }
.be-modal__dialog{ position:relative; width:min(92vw,1000px); background:#111; border-radius:1rem; padding:1rem; color:#fff; }
.be-modal__viewport{ width:100%; aspect-ratio: 5/3; background:#000; border-radius:.75rem; overflow:hidden; }
#be-modal-img{ width:100%; height:100%; object-fit: contain; }
.be-modal__caption{ margin:.75rem 0 0; font-size:.95rem; opacity:.9; }
.be-modal__close{ position:absolute; right:.5rem; top:.5rem; border:0; background:transparent; color:#fff; font-size:2rem; line-height:1; cursor:pointer; }
body.modal-open{ overflow:hidden; }

/* ========= CTA ========= */
.be-about-cta { padding: var(--sectionPadding); background: #fffbef; }
.be-cta-wrap { max-width: 80rem; margin: 0 auto; padding: 0 1rem;
  display:flex; flex-direction:column; gap:1rem; align-items:flex-start; }
@media (min-width:48rem){ .be-cta-wrap { flex-direction:row; align-items:center; justify-content:space-between; } }
.be-cta-text .cs-title{ margin:0 0 .25rem; }
.be-cta-text .cs-text{ margin:0; }

/* ========= Editor spillover (optional) ========= */
.be-about-editor { padding: var(--sectionPadding); background:#fff; }
.be-about-editor .cs-container { max-width: 80rem; margin: 0 auto; padding: 0 1rem; }

.be-about-bio a {
	color: rgb(155, 27, 27);
}

.about-text-section {
	padding: var(--sectionPadding);
	padding-top: 0;
	padding-bottom: 0;
}

.about-text-section a {
	color: rgb(155, 27, 27);
}
