

/* Browse by Condition (HTML copy of the Resources page section) */
.bbc-section, .bbc-section * { box-sizing: border-box; }
.bbc-section { display: flex; flex-direction: column; align-items: center; padding: 96px 30px; background-color: #f5f3ef; }
.bbc-section .bbc-inner { display: flex; flex-direction: column; gap: 48px; width: 100%; max-width: 1280px; padding: 0; }

/* Clinician profile: cards only, the template container sets background and spacing */
.bbc-section.bbc-section--cards-only { padding: 0; background-color: transparent; }

/* Heading block */
.bbc-section .bbc-head { display: flex; flex-direction: column; justify-content: flex-start; align-items: center; gap: 20px; width: 100%; height: auto; padding: 0; color: #fff; }
.bbc-section .bbc-eyebrow { font-family: "Caveat", cursive; font-weight: 600; font-size: 34px; line-height: 120%; color: #C86900; text-align: center; }
.bbc-section .bbc-title { width: 100%; margin: 0; font-family: "Cormorant Garamond", serif; font-weight: 600; font-style: normal; font-size: 44px; line-height: 118%; color: #1A1A1A; text-align: center; text-decoration: none; text-transform: none; }
.bbc-section .bbc-intro { display: block; max-width: 850px; margin: 0; font-family: "Jost", sans-serif; font-weight: 300; font-size: 18px; line-height: 160%; color: #4A4A48; text-align: center; text-transform: none; }

/* Card groups */
.bbc-section .bbc-main { display: block; width: auto; padding: 0; gap: 30px; }
.bbc-section .bbc-more { display: flex; flex-direction: column; gap: 30px; width: auto; padding: 0; }
.bbc-section .bbc-grid { display: flex; flex-direction: row; flex-wrap: wrap; justify-content: center; row-gap: 20px; column-gap: 20px; width: auto; padding: 0; }

/* Card */
.bbc-section .bbc-card { display: block; flex: 1 1 0%; width: 100%; height: auto; min-width: calc(33.33% - 14px); max-width: calc(33.33% - 13px); padding: 26px 28px; border: 1px solid #eae6de; border-radius: 12px; background-color: #fff; background-clip: border-box; color: inherit; text-decoration: none; transition: all 300ms; }
.bbc-section .bbc-card-icon { display: flex; flex-direction: row; flex-wrap: nowrap; justify-content: center; align-items: center; width: 58px; height: 58px; margin: 0 0 20px 0; padding: 0; border-radius: 13px; background-color: #1c3a4a; transition: all 300ms; }
.bbc-section .bbc-icon { display: block; width: 29px; max-width: 29px; line-height: 0; }
.bbc-section .bbc-icon svg { display: block; width: 29px; height: 29px; }
.bbc-section .bbc-card-title { display: block; margin: 0 0 10px 0; font-family: "Cormorant Garamond", serif; font-weight: 600; font-size: 24px; line-height: 121%; color: #1a1a1a; text-align: start; text-transform: none; }
.bbc-section .bbc-card-text { display: block; margin: 0; font-family: "Jost", sans-serif; font-weight: 300; font-size: 16px; line-height: 160%; color: #4a4a48; text-align: start; text-transform: none; }

/* Hover animation (same as original) */
.bbc-section .bbc-card:hover,
.bbc-section .bbc-card:focus-visible { transform: translateY(-6px); box-shadow: 0 22px 48px 0 rgb(28 58 74 / .13); }
.bbc-section .bbc-card:hover .bbc-card-icon,
.bbc-section .bbc-card:focus-visible .bbc-card-icon { background: #ffa440; transform: translateY(-3px); }
.bbc-section .bbc-card:hover .bbc-card-icon svg *,
.bbc-section .bbc-card:focus-visible .bbc-card-icon svg * { stroke: #1c3a4a; }

/* Breakpoints (same as Elementor: 1280 / 1024 / 880 / 767) */
@media (max-width: 1280px) {
  .bbc-section { padding: 80px 30px; }
  .bbc-section .bbc-inner { gap: 46px; }
}
@media (max-width: 1024px) {
  .bbc-section { padding-top: 60px; padding-bottom: 60px; }
  .bbc-section .bbc-inner { gap: 40px; }
  .bbc-section .bbc-head { max-width: 100%; }
  .bbc-section .bbc-title { font-size: 36px; }
  .bbc-section .bbc-intro { font-size: 16px; }
  .bbc-section .bbc-main,
  .bbc-section .bbc-more { display: flex; gap: 20px; margin: 0 auto; }
  .bbc-section .bbc-card { min-width: calc(50% - 14px); max-width: calc(50% - 10px); padding: 26px 28px; }
}
@media (max-width: 880px) {
  .bbc-section .bbc-main,
  .bbc-section .bbc-more { flex-direction: column; }
  .bbc-section .bbc-card-title { font-size: 22px; }
}
@media (max-width: 767px) {
  .bbc-section { padding: 50px 20px; }
  .bbc-section .bbc-inner { gap: 30px; }
  .bbc-section .bbc-head { gap: 15px; }
  .bbc-section .bbc-eyebrow { font-size: 25px; }
  .bbc-section .bbc-title { font-size: 28px; }
  .bbc-section .bbc-card { min-width: 100%; max-width: 100%; padding: 20px; }
}

/* Text button (SCF: button_text + button_url), same as the homepage "View all conditions" link */
.bbc-section .bbc-actions { display: flex; justify-content: flex-start; margin-top: -8px; }
.bbc-section .bbc-button { display: inline-flex; flex-direction: row; justify-content: center; gap: 6px; padding: 0; border: 0; border-radius: 0; background-color: transparent; font-family: "Jost", sans-serif; font-weight: 500; font-size: 16px; line-height: normal; letter-spacing: 0.3px; text-transform: none; text-decoration: none; text-align: center; color: #416C6E; transition: gap 0.25s cubic-bezier(.22,.61,.36,1), color 0.3s; }
.bbc-section .bbc-button-text { display: block; }
.bbc-section .bbc-button-icon { display: flex; align-items: center; }
.bbc-section .bbc-button-icon svg { display: block; width: 20px; height: 20px; fill: transparent; }
.bbc-section .bbc-button-icon svg * { transition: all 0.3s; }

/* Hover: brown text + arrow, arrow moves away from the text */
.bbc-section .bbc-button:hover,
.bbc-section .bbc-button:focus { color: #7B6244; gap: 12px; }
.bbc-section .bbc-button:hover .bbc-button-icon svg *,
.bbc-section .bbc-button:focus .bbc-button-icon svg * { stroke: #7B6244; }

/* Spacing above the button: 40px desktop/tablet, 30px mobile */
@media (max-width: 1280px) {
  .bbc-section .bbc-actions { margin-top: -6px; }
}
@media (max-width: 1024px) {
  .bbc-section .bbc-actions { margin-top: 0; }
}
@media (max-width: 767px) {
  .bbc-section .bbc-button-icon svg { width: 18px; }
  .bbc-section .bbc-button-text { text-align: left; }
}

/* Section description (WYSIWYG): spacing between paragraphs */
.bbc-section .bbc-intro p { margin: 0 0 1em; }
.bbc-section .bbc-intro p:last-child { margin-bottom: 0; }
