/* Broker Page Template (Template A) - v2.1
 *
 * Used for 13 service sub-pages under Wholesale Brokerage and Binding Authority.
 * Matches WP page structure: Hero -> Content (Intro + Accordion) ->
 * Practice Leaders -> CTA Banner -> Insights/Programs Links -> Stay Informed
 *
 * Module styles (.broker-leaders, .broker-links, .stay-informed) live in their
 * respective module.css files. This file contains template-specific overrides only.
 *
 * Pilot page: Cannabis (/areas-of-specialization/wholesale-brokerage/cannabis/)
 */

/* ============================================================
   Full-Width Section Overrides
   ============================================================ */

.body-container--broker > .hs_cos_wrapper {
  display: block;
}

.body-container--broker .dnd-section:not([class*="force-full-width-section"]) > .row-fluid,
.body-container--broker .section-header,
.broker-by-state-container{
/*   max-width: 1080px; */
  max-width: var(--content-max-width);
    width: 85%;
  margin-left: auto;
  margin-right: auto;
}

.body-container--broker .section-header{ 
 padding-left: 0;
  padding-right: 0;
  padding-top: 80px;
}

/* ============================================================
   Hero Overrides (full hero with gradient overlay)
   WP: single teal gradient layered with bg image on same element,
   LEFT-aligned text, heading 48px uppercase (not italic),
   filled white/gray buttons with green text
   ============================================================ */

.body-container--broker .hero {
  min-height: 449px;
}

.body-container--broker .hero__content {
  padding: 50px 24px; /* WP: 50px top/bottom */
}

.body-container--broker .hero__buttons {
  justify-content: flex-start;
}

.body-container--broker .hero__overlay {
  background: linear-gradient(
    rgba(0, 152, 162, 0.70) 0%,
    rgba(0, 152, 162, 0.75) 100%
  ) !important;
  opacity: 1 !important;
}

.body-container--broker .hero__content-inner {
  text-align: left;
}

.body-container--broker .hero__headline {
  line-height: 57.6px; /* WP: 57.6px = 48px * 1.2 */
  margin-bottom: 0;
  margin-left: 0;
  margin-right: 0;
  
  
/*   max-width: 700px; /* WP Divi column ~692px; long headlines like Transportation wrap to 2 lines */ */
  text-transform: uppercase;
}

.body-container--broker .hero__subheadline {
  font-family: var(--font-heading);
  font-size: 24px;
  font-weight: 600;
  max-width: 700px;
  opacity: 1;
  line-height: 23.4px; /* WP: 23.4px (0.975x of 24px) */
  margin-bottom: 10px; /* WP: 10px */
  margin-left: 0;
  margin-right: 0;
}

.body-container--broker .hero__body {
  color: #fff;
  font-size: 22px;
  font-weight: 300;
  line-height: 1.2; /* WP: 26.4px (1.2x of 22px) */
  margin: 0 0 24px;
  max-width: 700px;
  opacity: 0.95;
}

.body-container--broker .hero__body p {
  margin: 0;
}

.body-container--broker .hero .hero__button,
.body-container--broker .hero a.hero__button {
  background-color: #fff;
  border: 0;
  color: var(--jencap-primary);
  font-size: 22px;
  font-weight: 500;
  letter-spacing: normal;
  min-width: auto;
  padding: 6.6px 22px;
  text-transform: none;
}

.body-container--broker .hero .hero__button--secondary,
.body-container--broker .hero a.hero__button--secondary {
  background-color: var(--jencap-divider);
}

.body-container--broker .hero .hero__button:hover,
.body-container--broker .hero a.hero__button:hover {
  background-color: var(--jencap-text);
  color: var(--jencap-white);
  font-family: var(--font-heading);
  text-decoration: none;
}

/* Intro paragraph moved into hero via JS to match WP layout.
   WP: white text, left-aligned, ~60% width, between subheadline and buttons. */
.body-container--broker .hero__intro {
  text-align: left;
  max-width: 680px;
  margin: 16px 0 24px;
}

.body-container--broker .hero__intro p {
  font-family: var(--font-heading);
  font-size: 15px;
  font-weight: 300;
  line-height: 1.6;
  color: #fff;
  margin: 0;
}

.body-container--broker .hero__intro a {
    color: #fff;
    text-decoration: underline;
    font-size: inherit !important;
}

/* Cannabis page: CSS text replacement for secondary button label */
.body-container--broker.page--cannabis .hero a.hero__button--secondary {
  font-size: 0;
  line-height: 0;
  overflow: hidden;
}


/* ============================================================
   Content Body (Intro + Accordion)
   WP: light gray bg (var(--jencap-background)), max-width 1080px, padding 54px
   ============================================================ */

.broker-content {
  background: var(--jencap-white);
  /* WP section padding is ~54px top (Divi 4% viewport at 1440px). Was 30px top. */
  padding: 54px 0 72px;
}

.broker-content__inner {
  max-width: 1080px;
  width: 85%;
  margin: 0 auto;
  padding: 27px 0 0 0;
}

.broker-content__intro {
  margin-bottom: 40px;
}

.broker-content__intro p {
  font-family: var(--font-heading);
  font-size: 18px;
  font-weight: 300;
  line-height: 1.6;
  color: var(--jencap-text);
  margin: 0;
}

.broker-content__intro a {
  color: var(--jencap-primary, var(--jencap-accent));
  text-decoration: underline;
}

.broker-content__intro a:hover {
  color: var(--jencap-accent, var(--jencap-primary));
}

/* Section heading: reusable heading above accordions/content blocks.
   WP: left-aligned, Jencap green, uppercase, 28px agenda. */
.broker-content__section-heading {
  font-family: var(--font-heading);
  font-size: 28px;
  font-weight: 600;
  color: var(--jencap-primary);
  text-transform: uppercase;
  text-align: left;
  margin: 48px 0 24px;
}

/* Sidebar layout (workers-comp Monoline card) */
.broker-content--with-sidebar .broker-content__inner {
  display: flex;
  gap: 40px;
  align-items: flex-start;
}

.broker-content__main {
  flex: 1;
  min-width: 0;
}

.broker-content__sidebar {
  flex: 0 0 280px;
}

.broker-sidebar-card {
  background: #fff;
  border: 1px solid #e0e0e0;
  border-radius: 8px;
  padding: 32px 24px;
  text-align: center;
}

.broker-sidebar-card__icon {
  width: 56px;
  height: 56px;
  margin: 0 auto 16px;
  background: rgba(0, 152, 162, 0.1);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--jencap-primary, var(--jencap-accent));
}

.broker-sidebar-card__heading {
  font-family: var(--font-heading);
  font-size: 20px;
  font-weight: 600;
  color: var(--jencap-text);
  margin: 0 0 16px;
}

.broker-sidebar-card__subheading {
  font-family: var(--font-heading);
  font-size: 16px;
  font-weight: 600;
  color: var(--jencap-primary, var(--jencap-accent));
  margin: 0 0 12px;
}

.broker-sidebar-card__text {
  font-family: var(--font-heading);
  font-size: 14px;
  font-weight: 300;
  line-height: 1.5;
  color: var(--jencap-text-muted);
  margin: 0 0 20px;
}

.broker-sidebar-card__button {
  display: inline-block;
  font-family: var(--font-heading);
  font-size: 13px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 1px;
  color: var(--jencap-primary, var(--jencap-accent));
  border: 2px solid var(--jencap-primary, var(--jencap-accent));
  border-radius: 50px;
  padding: 10px 24px;
  text-decoration: none;
  transition: background 0.2s, color 0.2s;
}


.broker-sidebar-card__button:hover {
  background: var(--jencap-primary, var(--jencap-accent));
  color: #fff;
}

@media (max-width: 768px) {
  .broker-content--with-sidebar .broker-content__inner {
    flex-direction: column;
  }
  .broker-content__sidebar {
    flex: none;
    width: 100%;
  }
}

/* Accordion overrides for broker page */
.body-container--broker .accordion {
  border: none;
}

.body-container--broker .accordion__header {
  /* WP Divi toggle title computed: 24px, weight 600. Padding on HS header
     provides the card whitespace that WP puts on the toggle container. */
  font-size: 24px;
  padding: 25px 24px;
  margin-top: 20px;
  font-family: agenda, Montserrat, sans-serif;
  font-weight: 600;
  color: var(--jencap-text);
  text-transform: none;
  background: #fff;
  border: none;
  cursor: pointer;
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 100%;
}

.body-container--broker .accordion__item.is-open .accordion__header {
  color: var(--jencap-accent);
}

.body-container--broker .accordion__header:hover {
  color: var(--jencap-primary, var(--jencap-accent));
}

.body-container--broker .accordion__icon {
  width: 16px;
  height: 16px;
  position: relative;
  flex-shrink: 0;
  /* Reset module.css chevron (border-based) so only plus/minus pseudo-elements show */
  border: none;
  display: block;
  transform: none;
}

.body-container--broker .accordion__item.is-open .accordion__icon {
  /* Override module.css rotate(-135deg) on open state */
  transform: none;
}

.body-container--broker .accordion__icon::before,
.body-container--broker .accordion__icon::after {
  content: "";
  position: absolute;
  background: #00ab62;
  transition: transform 0.3s ease;
}

.body-container--broker .accordion__icon::before {
  width: 16px;
  height: 2px;
  top: 50%;
  left: auto;
  transform: translateY(-50%);
}

.body-container--broker .accordion__icon::after {
  width: 2px;
  height: 16px;
  top: auto;
  left: 50%;
  transform: translateX(-50%);
}

.body-container--broker .accordion__item.is-open .accordion__icon::after {
  transform: translateX(-50%) rotate(90deg);
  opacity: 0;
}

.body-container--broker .accordion__panel {
  padding: 0 24px;
}

.body-container--broker .accordion__content {
  padding: 0 0 24px;
  font-family: var(--font-heading);
  font-size: 16px;
  line-height: 1.6;
  color: var(--jencap-text);
}

.body-container--broker .accordion__content ul {
  list-style: none;
  padding: 0;
  margin: 0;
  columns: 2;
  column-gap: 32px;
}

.body-container--broker .accordion__content li {
  position: relative;
  padding-left: 18px;
  margin-bottom: 6px;
  break-inside: avoid;
  font-size: var(--font-size-broker-body);
  line-height: 1.4;
  font-weight: 400;
  margin-bottom: 0;
  padding-bottom: 0;
}

.body-container--broker .accordion__content li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 8px;
  width: 6px;
  height: 6px;
  background: var(--jencap-text);
  border-radius: 50%;
}

/* ============================================================
   CAT Modeling Services (Property page only)
   WP: White bg, same max-width as content, green CTA button
   ============================================================ */

.broker-cat-modeling {
  background: #fff;
  padding: var(--wp-section-padding) 0;
}

.broker-cat-modeling__inner {
  max-width: 1080px;
  width: 85%;
  margin: 0 auto;
}

.broker-cat-modeling__heading {
  font-family: var(--font-heading);
  font-size: 40px;
  font-weight: 600;
  color: var(--jencap-text);
  margin: 0 0 16px;
  text-transform: none;
}

.broker-cat-modeling__lead {
  font-family: var(--font-heading);
  font-size: 18px;
  font-weight: 300;
  line-height: 1.6;
  color: var(--jencap-text);
  margin: 0 0 32px;
}

.broker-cat-modeling__toggle {
  display: inline-block;
  font-family: var(--font-heading);
  font-size: 14px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 1px;
  color: var(--jencap-primary, var(--jencap-accent));
  background: #fff;
  border: 2px solid var(--jencap-primary, var(--jencap-accent));
  border-radius: 50px;
  padding: 10px 28px;
  cursor: pointer;
  margin: 0 0 24px;
  transition: background 0.2s, color 0.2s;
}

.broker-cat-modeling__toggle:hover {
  background: var(--jencap-primary, var(--jencap-accent));
  color: #fff;
}

.broker-cat-modeling__content {
  margin: 0 0 32px;
}

.broker-cat-modeling__subheading {
  font-family: var(--font-heading);
  font-size: 24px;
  font-weight: 600;
  color: var(--jencap-text);
  margin: 0 0 12px;
}

.broker-cat-modeling__content p {
  font-family: var(--font-heading);
  font-size: 16px;
  font-weight: 300;
  line-height: 1.6;
  color: var(--jencap-text);
  margin: 0 0 16px;
}

.broker-cat-modeling__content h4 {
  font-family: var(--font-heading);
  font-size: 18px;
  font-weight: 600;
  color: var(--jencap-text);
  margin: 24px 0 12px;
}

.broker-cat-modeling__content ul {
  list-style: none;
  padding: 0;
  margin: 0;
}

.broker-cat-modeling__content li {
  position: relative;
  padding-left: 18px;
  margin-bottom: 8px;
  font-family: var(--font-heading);
  font-size: 16px;
  font-weight: 300;
  line-height: 1.6;
  color: var(--jencap-text);
}

.broker-cat-modeling__content li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 10px;
  width: 6px;
  height: 6px;
  background: var(--jencap-accent, var(--jencap-secondary));
  border-radius: 50%;
}

.broker-cat-modeling__button {
  display: inline-block;
  background: var(--jencap-primary);
  color: #fff;
  font-family: var(--font-heading);
  font-size: var(--font-size-broker-body);
  font-weight: 500;
  text-transform: none;
  letter-spacing: 0;
  padding: 6px 22px;
  border-radius: 100px;
  text-decoration: none;
}

.broker-cat-modeling__button:hover {
  background: var(--jencap-text);
  color: var(--jencap-white);
  font-family: var(--font-heading);
  text-decoration: none;
}

/* ============================================================
   Top Reasons (Professional Lines page only)
   WP: White bg, same max-width as content, numbered-style list
   ============================================================ */

.broker-top-reasons {
  background: #fff;
  padding: var(--wp-section-padding) 0;
}

.broker-top-reasons__inner {
  max-width: 1080px;
  width: 85%;
  margin: 0 auto;
}

.broker-top-reasons__heading {
  font-family: var(--font-heading);
  font-size: 40px;
  font-weight: 600;
  color: var(--jencap-text);
  margin: 0 0 24px;
  text-transform: none;
}

.broker-top-reasons__list {
  list-style: none;
  padding: 0;
  margin: 0;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
  counter-reset: reasons;
}

.broker-top-reasons__list li {
  position: relative;
  padding: 24px 16px 20px;
  margin-bottom: 0;
  font-family: var(--font-heading);
  font-size: 15px;
  font-weight: 400;
  line-height: 1.5;
  color: var(--jencap-text);
  text-align: center;
  border-top: 3px solid var(--jencap-primary, var(--jencap-accent));
}

.broker-top-reasons__list li::before {
  display: block;
  counter-increment: reasons;
  content: counter(reasons);
  font-family: var(--font-heading);
  font-size: 36px;
  font-weight: 600;
  color: var(--jencap-primary, var(--jencap-accent));
  margin-bottom: 8px;
}

@media (max-width: 768px) {
  .broker-top-reasons__list {
    grid-template-columns: 1fr 1fr;
  }
}

@media (max-width: 480px) {
  .broker-top-reasons__list {
    grid-template-columns: 1fr;
  }
}

/* Leaders section needs extra height to match WP (695px vs HS ~585px).
   WP has more generous spacing around the photo and text. */
.body-container--broker .broker-leaders {
  padding: 44px 0 150px;
}

/* ============================================================
   CTA Banner Override
   WP broker sub-pages do NOT have a CTA banner between
   leaders and insights sections - hide it.
   ============================================================ */

.body-container--broker .cta-banner {
  display: none;
}

.body-container--broker .cta-banner__overlay {
  background: rgba(0, 82, 101, 0.55);
}

.body-container--broker .cta-banner__container {
  max-width: 1296px;
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  align-items: center;
  gap: 0;
  padding: var(--wp-row-padding) 0;
}

.body-container--broker .cta-banner__headline {
  grid-column: 2;
  font-size: 40px;
  font-weight: 600;
  font-style: normal;
  margin-bottom: 0;
  text-align: right;
}

.body-container--broker .cta-banner__subheadline {
  display: none;
}

/* .body-container--broker .cta-banner__button {
  grid-column: 3;
  justify-self: center;
  white-space: nowrap;
  font-size: 22px;
  font-weight: 600;
  letter-spacing: 0;
  text-transform: uppercase;
  background-color: #fff;
  color: var(--jencap-primary, var(--jencap-primary));
  border-radius: 50px;
  padding: 6.6px 22px;
} */

/* ============================================================
   Practice Leaders (fallback for non-modular broker-page-*.html templates)
   Identical to practice-leaders.module/module.css - kept in sync.
   On modular pages, module CSS loads after and takes precedence.
   ============================================================ */

.broker-leaders {
  background: var(--jencap-background);
  padding: 44px 0;
}


.broker-leaders__inner {
/*   max-width: 1080px; */
  max-width: var(--content-max-width);
  width: 85%;
  margin: 0 auto;
}

.broker-leaders__heading {
  font-family: var(--font-heading);
  font-size: 40px;
  font-weight: 600;
  color: var(--jencap-text);
  text-align: left;
  margin: 0 0 32px;
  text-transform: none;
  letter-spacing: normal;
}

.broker-leaders__grid {
  display: flex;
  gap: 40px;
  justify-content: flex-start;
  flex-wrap: wrap;
}

.broker-leaders__card {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  text-align: left;
  max-width: 300px;
}

.broker-leaders__photo {
  width: 250px;
  height: 250px;
  border-radius: 5px;
  overflow: hidden;
  margin-bottom: 16px;
  border: none;
  box-shadow: none;
}

.broker-leaders__photo img {
  width: 100%;
  height: 100%;
  object-fit: fill;
  display: block;
}

.broker-leaders__name {
  font-family: var(--font-heading);
  font-size: 18px;
  font-weight: 600;
  color: var(--jencap-text);
  margin: 0 0 4px;
}

.broker-leaders__title {
  font-family: var(--font-heading);
  font-size: var(--font-size-broker-body);
  font-weight: 300;
  font-style: normal;
  color: var(--jencap-text);
  margin: 0 0 8px;
}

.broker-leaders__phone {
  font-family: var(--font-heading);
  font-size: 18px;
  color: var(--jencap-text);
  margin: 15px 0 0;
  line-height: 1.4;
}

.broker-leaders__email {
  font-family: var(--font-heading);
  font-size: 15px;
  margin: 0;
  line-height: 1.4;
}

.broker-leaders__email a {
  color: var(--jencap-primary);
  text-decoration: none;
}

.broker-leaders__email a:hover {
  text-decoration: underline;
}

.broker-leaders__contact {
  font-family: var(--font-heading);
  font-size: 18px;
  color: var(--jencap-text);
  margin: 15px 0 0;
  line-height: 1.8;
}

.broker-leaders__contact a[href^="tel"] {
  color: var(--jencap-text);
  text-decoration: none;
  pointer-events: none;
}

.broker-leaders__contact a[href^="mailto"] {
  color: var(--jencap-primary);
  text-decoration: none;
  font-size: 15px;
}

.broker-leaders__contact a[href^="mailto"]:hover {
  text-decoration: underline;
}

.broker-leaders__social {
  list-style: none;
  padding: 0;
  margin: 8px 0 0;
  display: flex;
  gap: 8px;
}

.broker-leaders__social a {
  display: inline-block;
  color: var(--jencap-primary);
  text-decoration: none;
  font-size: 22px;
}

.broker-leaders__social a:hover {
  color: var(--jencap-accent);
}

.broker-leaders__social svg {
  width: 22px;
  height: 22px;
  fill: currentColor;
}

.broker-leaders__linkedin {
  display: inline-block;
  margin: 8px 0 0;
}

.broker-leaders__linkedin svg {
  width: 22px;
  height: 22px;
}

.broker-leaders__card--no-photo {
  padding: 24px 20px;
  background: #fff;
  border-radius: 4px;
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.08);
  min-width: 240px;
}

/* Environmental: 3-column grid with US map in center of row 2 */
.broker-leaders__grid--env {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 30px;
}

.broker-leaders__map {
  display: flex;
  align-items: center;
  justify-content: center;
}

.broker-leaders__map img {
  max-width: 100%;
  height: auto;
}

@media (max-width: 768px) {
  .broker-leaders__grid--env {
    grid-template-columns: 1fr;
  }
}

/* ============================================================
   Link Blocks - Insights + Programs (fallback for non-modular templates)
   Identical to link-blocks.module/module.css - kept in sync.
   ============================================================ */

.broker-links {
  background: transparent;
  padding: 0;
}

.broker-links__inner {
  max-width: none;
  width: 100%;
  margin: 0;
  display: block;
}

.broker-links__block {
  /* WP insights section is 568px vs HS 499px (69px short). Increasing from 50px to 84px
     per side (+68px total) closes the gap. Programs block overrides this via nth-child(2). */
  padding: 84px 0;
}

.broker-links__block-inner {
  max-width: 1080px;
  width: 85%;
  margin: 0 auto;
}

.broker-links__block:first-child {
  background: #fff;
  text-align: left;
  padding: 84px 0;
}

.broker-links__block:first-child .broker-links__heading {
  font-family: var(--font-heading);
  font-size: 40px;
  font-weight: 600;
  color: var(--jencap-text);
  margin: 0 0 24px;
  text-transform: none;
  text-align: left;
}

.broker-links__block:nth-child(2) {
  background: #f3f4f6;
  text-align: center;
  padding: 50px 0;
}

.broker-links__block:nth-child(2) .broker-links__description {
  color: var(--jencap-text);
}

.broker-links__block:nth-child(2) .broker-links__heading {
  font-family: var(--font-heading);
  font-size: 36px;
  font-weight: 600;
  color: var(--jencap-accent);
  margin: 0 0 12px;
  text-transform: none;
  text-align: center;
}

.broker-links__description {
  font-family: var(--font-heading);
  font-size: 16px;
  font-weight: 300;
  line-height: 1.5;
  color: var(--jencap-text);
  margin: 0 0 24px;
}

.broker-links__button {
  display: flex !important;
  justify-content: center !important;
  width: fit-content !important;
  background: var(--jencap-primary);
  color: #fff;
  font-family: var(--font-heading);
  font-size: var(--font-size-broker-body);
  font-weight: 500;
  text-transform: none;
  letter-spacing: 0;
  padding: 6px 22px;
  border-radius: 100px;
  text-decoration: none;
  margin: 0 auto;
}

.broker-links__button:hover {
  background: var(--jencap-text);
  color: var(--jencap-white);
  font-family: var(--font-heading);
  text-decoration: none;
}

/* ============================================================
   Insight Thumbnails (fallback for non-modular templates)
   Single-card carousel matching WP Swiper behavior
   ============================================================ */

.broker-links__thumbnails {
  margin: 0 0 32px;
  overflow: hidden;
  position: relative;
}

.broker-links__thumbnails-track {
  display: flex;
  gap: 0;
  overflow: visible;
  transition: transform 0.4s ease;
}

.broker-links__thumb-card {
  flex: 0 0 100%;
  min-width: 100%;
  text-decoration: none;
  display: block;
  border-radius: 4px;
  overflow: hidden;
  background: #f5f5f5;
}

.broker-links__thumb-card:hover .broker-links__thumb-title {
  color: var(--jencap-accent);
}

.broker-links__thumb-img {
  width: 100%;
  height: auto;
  aspect-ratio: 1080 / 675;
  object-fit: cover;
  display: block;
}

.broker-links__thumb-title {
  display: block;
  padding: 10px 8px;
  font-family: var(--font-heading);
  font-size: 14px;
  font-weight: 600;
  line-height: 1.3;
  color: var(--jencap-accent);
  transition: color 0.2s;
}

/* ============================================================
   Program Cards (fallback for non-modular templates)
   Single-card carousel matching WP Swiper behavior
   ============================================================ */

.broker-links__programs {
  margin: 0 0 32px;
  overflow: hidden;
  position: relative;
}

.broker-links__programs-track {
  display: flex;
  gap: 0;
  overflow: visible;
  transition: transform 0.4s ease;
}

.broker-links__program-card {
  flex: 0 0 100%;
  min-width: 100%;
  /* WP programs section is 963px vs HS 687px (276px short). WP uses a large
     coverflow card (~795px height within the section). Increasing from 375px
     to 650px closes the deficit. */
  min-height: 650px;
  text-decoration: none;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  padding: 30px 24px;
  border-radius: 8px;
  overflow: hidden;
  background-color: #004634;
  background-size: cover;
  background-position: center;
  position: relative;
  box-sizing: border-box;
}

.broker-links__program-card:hover {
  opacity: 0.95;
}

.broker-links__program-label {
  font-family: var(--font-heading);
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.25em;
  color: #fff;
  margin: 0 0 15px;
  display: block;
  line-height: 1.4;
}

.broker-links__program-title {
  font-family: var(--font-heading);
  font-size: 32px;
  font-weight: 600;
  color: #fff;
  margin: 0 0 20px;
  text-transform: none;
  line-height: 1.2;
}

.broker-links__program-btn {
  display: inline-block;
  font-family: var(--font-heading);
  font-size: 14px;
  font-weight: 600;
  letter-spacing: 0.15em;
  color: #fff;
  border: 2px solid #fff;
  padding: 8px 20px;
  border-radius: 4px;
  text-transform: uppercase;
  align-self: flex-start;
}

.broker-links__program-card:hover .broker-links__program-btn {
  background: rgba(255, 255, 255, 0.15);
}

/* Carousel arrows (shared by thumbnails + programs) */
.broker-links__arrow {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 40px;
  height: 40px;
  background: rgba(0, 0, 0, 0.35);
  border: none;
  border-radius: 50%;
  cursor: pointer;
  z-index: 5;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: background 0.2s;
  padding: 0;
}

.broker-links__arrow:hover {
  background: rgba(0, 0, 0, 0.6);
}

.broker-links__arrow--prev { left: 10px; }
.broker-links__arrow--next { right: 10px; }

.broker-links__arrow::after {
  content: '';
  display: block;
  width: 10px;
  height: 10px;
  border-top: 2px solid #fff;
  border-right: 2px solid #fff;
}

.broker-links__arrow--prev::after {
  transform: rotate(-135deg);
  margin-left: 3px;
}

.broker-links__arrow--next::after {
  transform: rotate(45deg);
  margin-right: 3px;
}

/* Carousel pagination dots (matches WP Swiper bullet navigation) */
.broker-links__dots {
  display: flex;
  justify-content: center;
  gap: 8px;
  margin: 16px 0 0;
}

.broker-links__dot {
  width: 12px;
  height: 12px;
  border-radius: 50%;
  border: none;
  background: #d9d9d9;
  cursor: pointer;
  padding: 0;
  transition: background 0.2s;
}

.broker-links__dot--active {
  background: var(--jencap-accent, var(--jencap-accent));
}

.broker-links__dot:hover:not(.broker-links__dot--active) {
  background: #bbb;
}

/* ============================================================
   Stay Informed (fallback for non-modular templates)
   Identical to stay-informed.module/module.css - kept in sync.
   ============================================================ */

.stay-informed {
  background: var(--jencap-divider);
  padding: 0;
}

.stay-informed__inner {
  max-width: 1296px;
  width: 90%;
  margin: 0 auto;
  padding: 27px 0 11px;
  display: flex;
  gap: 71px;
  align-items: flex-start;
}

.stay-informed__inner > div:first-child {
  flex: 0 0 36.7%;
  max-width: 36.7%;
}

.stay-informed__inner > div:last-child {
  flex: 1;
  min-width: 0;
}

.stay-informed__heading {
  font-family: var(--font-heading);
  font-size: 25.5px;
  font-weight: 600;
  color: var(--jencap-primary);
  margin: 0 0 10px;
  line-height: 1.2;
}

.stay-informed__description {
  font-family: var(--font-heading);
  font-size: 18px;
  font-weight: 300;
  line-height: 1.4;
  color: var(--jencap-text);
  margin: 0;
}

.stay-informed__form {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
}

.stay-informed__input {
  width: 100%;
  height: 40px;
  padding: 16px;
  border: 1px solid #cecece;
  background: #fff;
  font-size: 12px;
  font-family: var(--font-heading);
  color: #333;
  box-sizing: border-box;
  border-radius: 0;
}

.stay-informed__input::placeholder {
  color: #999;
  font-size: 12px;
  letter-spacing: 1px;
  text-transform: uppercase;
}

.stay-informed__input:focus {
  border-color: var(--jencap-accent, var(--jencap-secondary));
  outline: none;
}

.stay-informed__submit-row {
  grid-column: 1 / -1;
  text-align: left;
  margin-top: 4px;
}

.stay-informed__submit {
  background: var(--jencap-primary, var(--jencap-primary));
  color: #fff;
  border: none;
  padding: 6px 22px;
  font-size: var(--font-size-broker-body);
  font-family: var(--font-heading);
  font-weight: 600;
  cursor: pointer;
  border-radius: 20px;
  text-transform: uppercase;
}

.stay-informed__submit:hover {
  background: var(--jencap-text);
  color: #fff;
  border: none;
  font-family: var(--font-heading);
}

/* Legacy broker-stay-informed namespace */
.broker-stay-informed {
  background: var(--jencap-divider);
  padding: 0;
}

.broker-stay-informed__inner {
  max-width: 1296px;
  width: 90%;
  margin: 0 auto;
  padding: 27px 0 11px;
  display: flex;
  gap: 71px;
  align-items: flex-start;
}

.broker-stay-informed__inner > div:first-child {
  flex: 0 0 36.7%;
  max-width: 36.7%;
}

.broker-stay-informed__inner > div:last-child {
  flex: 1;
  min-width: 0;
}

.broker-stay-informed__heading {
  font-family: var(--font-heading);
  font-size: 25.5px;
  font-weight: 600;
  color: var(--jencap-primary);
  margin: 0 0 10px;
  line-height: 1.2;
}

.broker-stay-informed__description {
  font-family: var(--font-heading);
  font-size: 18px;
  font-weight: 300;
  line-height: 1.4;
  color: var(--jencap-text);
  margin: 0;
}

.broker-stay-informed__form {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
}

.broker-stay-informed__input {
  width: 100%;
  height: 40px;
  padding: 16px;
  border: 1px solid #cecece;
  background: #fff;
  font-size: 12px;
  font-family: var(--font-heading);
  color: #333;
  box-sizing: border-box;
  border-radius: 0;
}

.broker-stay-informed__input::placeholder {
  color: #999;
  font-size: 12px;
  letter-spacing: 1px;
  text-transform: uppercase;
}

.broker-stay-informed__submit-row {
  grid-column: 1 / -1;
  text-align: left;
  margin-top: 4px;
}

.broker-stay-informed__submit {
  background: var(--jencap-primary, var(--jencap-primary));
  color: #fff;
  border: none;
  padding: 6px 22px;
  font-size: var(--font-size-broker-body);
  font-family: var(--font-heading);
  font-weight: 600;
  cursor: pointer;
  border-radius: 20px;
  text-transform: uppercase;
}

.broker-stay-informed__submit:hover {
  background: var(--jencap-text);
  color: #fff;
  border: none;
  font-family: var(--font-heading);
}

/* Hide form labels - placeholder-only pattern matching WP */
.stay-informed label,
.stay-informed__form-wrapper label,
.broker-stay-informed label,
.broker-stay-informed__form label {
  display: none !important;
}

/* Match WP equal top/bottom padding on stay-informed section */
.body-container--broker .stay-informed__inner,
.body-container--broker .broker-stay-informed__inner {
  padding-bottom: var(--wp-row-padding);
}

/* ============================================================
   Responsive - 960px
   ============================================================ */

@media (max-width: 960px) {
  .body-container--broker .hero__headline {
    font-size: 36px;
  }

  .body-container--broker .hero__subheadline {
    font-size: 24px !important;
  }

  .body-container--broker .hero__buttons {
    flex-direction: column;
    align-items: center;
    gap: 10px;
  }

  .broker-content {
    padding: 32px 0;
  }

  .broker-content__inner {
    width: 90%;
  }

  .body-container--broker .accordion__content ul {
    columns: 2;
  }

  .body-container--broker .cta-banner__container {
    grid-template-columns: 1fr;
    width: 90%;
    margin: 0 auto;
    text-align: center;
    gap: 16px;
  }

  .body-container--broker .cta-banner__headline {
    grid-column: 1;
    text-align: center;
    font-size: 32px;
  }

  .body-container--broker .cta-banner__button {
    grid-column: 1;
    justify-self: center;
  }

  /* CAT Modeling responsive */
  .broker-cat-modeling {
    padding: 32px 0;
  }

  .broker-cat-modeling__inner {
    width: 90%;
  }

  .broker-cat-modeling__heading {
    font-size: 30px;
  }

  /* Top Reasons responsive */
  .broker-top-reasons {
    padding: 32px 0;
  }

  .broker-top-reasons__inner {
    width: 90%;
  }

  .broker-top-reasons__heading {
    font-size: 30px;
  }

  /* Leaders responsive */
  .broker-leaders {
    padding: 32px 0;
  }

  .broker-leaders__inner {
    width: 90%;
  }

  .broker-leaders__heading {
    font-size: 30px;
  }

  .broker-leaders__photo {
    width: 200px;
    height: 200px;
  }

  /* Link blocks responsive */
  .broker-links__block-inner {
    width: 90%;
  }

  /* Thumbnail carousel: 1 visible at all sizes */
  .broker-links__thumb-card {
    flex: 0 0 100%;
    min-width: 100%;
  }

  .broker-links__program-card {
    flex: 0 0 100%;
    min-width: 100%;
  }

  /* Stay informed responsive */
  .stay-informed__inner,
  .broker-stay-informed__inner {
    flex-direction: column;
    gap: 24px;
    width: 90%;
    padding: 24px 0 16px;
  }

  .stay-informed__inner > div:first-child,
  .broker-stay-informed__inner > div:first-child {
    flex: none;
    max-width: 100%;
  }
}

/* ============================================================
   Responsive - 768px (tablet) - must follow 960px block for cascade
   ============================================================ */

@media (max-width: 768px) {
  /* Match WP single-column list at tablet (WP renders 1-col at 768px) */
  .body-container--broker .accordion__content ul {
    columns: 1;
  }
  .body-container--broker .hero__subheadline {
    font-size: 24px !important;
  }
}

/* ============================================================
   Responsive - 480px (phone)
   ============================================================ */

@media (max-width: 480px) {
  .body-container--broker .hero {
    min-height: 350px;
  }

  .body-container--broker .hero__headline {
    font-size: 28px;
  }

  .body-container--broker .hero__subheadline {
    font-size: 24px !important;
  }

  .body-container--broker .hero__button {
    font-size: 14px;
    padding: 10px 24px;
  }

  .broker-content {
    padding: 24px 0;
  }

  .broker-content__intro p {
    font-size: 16px;
  }

  .body-container--broker .accordion__header {
    font-size: 16px;
    padding: 14px 16px;
  }

  .body-container--broker .accordion__content ul {
    columns: 1;
  }

  .body-container--broker .accordion__content li {
    font-size: 14px;
  }

  /* CAT Modeling responsive */
  .broker-cat-modeling__heading {
    font-size: 26px;
  }

  /* Top Reasons responsive */
  .broker-top-reasons__heading {
    font-size: 26px;
  }

  /* Leaders responsive */
  .broker-leaders__heading {
    font-size: 26px;
  }

  .broker-leaders__photo {
    width: 180px;
    height: 180px;
  }

  .broker-leaders__name {
    font-size: 16px;
  }

  .broker-leaders__title {
    font-size: 15px;
  }

  /* Link blocks responsive */
  .broker-links__block:first-child .broker-links__heading {
    font-size: 28px;
  }

  .broker-links__block:nth-child(2) .broker-links__heading {
    font-size: 26px;
  }

  .broker-links__button {
    font-size: 16px;
  }

  .broker-links__thumb-card {
    flex: 0 0 100%;
    min-width: 100%;
  }

  .broker-links__program-card {
    flex: 0 0 100%;
    min-width: 100%;
    min-height: 300px;
  }

  .broker-links__program-title {
    font-size: 24px;
  }

  /* Stay informed responsive */
  .stay-informed__heading,
  .broker-stay-informed__heading {
    font-size: 22px;
  }

  .stay-informed__form,
  .broker-stay-informed__form {
    grid-template-columns: 1fr;
  }
}

/* ============================================================
   768px TABLET FIXES (absorbed from tablet-fixes.css)
   ============================================================ */

@media (max-width: 960px) {
  .body-container--broker .broker-leaders {
    padding-bottom: 48px !important;
  }
}

@media (max-width: 768px) {

  /* Hero */
  .body-container--broker .hero {
    min-height: 280px !important;
  }

  .body-container--broker .hero__content {
    padding: 32px 24px 24px !important;
  }

  .body-container--broker .hero__headline {
    font-size: 30px !important;
  }

  .body-container--broker .hero__body {
    font-size: 16px !important;
    margin: 0 0 16px !important;
  }

  .body-container--broker .hero__intro p {
    font-size: 22px !important;
  }

  /* Content + Accordion */
  .broker-content {
    padding: 24px 0 32px !important;
  }

  .body-container--broker .accordion__header {
    padding: 20px 16px !important;
    font-size: 18px !important;
  }

  .body-container--broker .accordion__panel {
    padding: 0 16px !important;
  }

  .body-container--broker .accordion__content {
    padding: 0 0 16px !important;
  }

  /* Practice Leaders */
  .body-container--broker .broker-leaders {
    padding: 32px 0 48px !important;
  }

  .broker-leaders {
    padding: 32px 0 48px;
  }

  .broker-leaders__heading {
    font-size: 26px;
    margin: 0 0 20px;
  }

  .broker-leaders__photo {
    width: 180px;
    height: 180px;
  }

  .broker-leaders__grid {
    gap: 24px;
  }

  .broker-leaders__card {
    max-width: 260px;
  }

  .broker-leaders__grid--env {
    grid-template-columns: 1fr;
  }

  /* Link Blocks */
  .broker-links__block {
    padding: 28px 0;
  }

  .broker-links__block-inner {
    width: 90%;
  }

  .broker-links__block:first-child .broker-links__heading {
    font-size: 28px;
    margin: 0 0 16px;
  }

  .broker-links__block:nth-child(2) .broker-links__heading {
    font-size: 26px;
    margin: 0 0 10px;
  }

  /* Stay Informed */
  .stay-informed__inner,
  .broker-stay-informed__inner {
    gap: 16px !important;
    padding: 20px 0 12px !important;
    width: 90% !important;
  }

  /* CAT Modeling + Top Reasons */
  .broker-cat-modeling {
    padding: 24px 0 !important;
  }

  .broker-cat-modeling__inner {
    width: 90% !important;
  }

  .broker-cat-modeling__heading {
    font-size: 26px !important;
  }

  .broker-top-reasons {
    padding: 24px 0 !important;
  }

  .broker-top-reasons__inner {
    width: 90% !important;
  }

  .broker-top-reasons__heading {
    font-size: 26px !important;
  }

  .broker-top-reasons__list {
    grid-template-columns: 1fr 1fr;
  }

  /* CTA Banner */
  .body-container--broker .cta-banner__container {
    padding: 16px 0 !important;
    gap: 12px !important;
  }

  .body-container--broker .cta-banner__headline {
    font-size: 26px !important;
  }
}

/* Broker By State */

.full-width-bg {
  width: 100%;
  background-color: #EFEFEE;
  padding: 54px 0;
  color: #333;
}

.jencap-container {
  max-width: 1080px;
  margin: 0 auto;
  padding: 0;
}

.jencap-title {
  font-weight: 600 !important;
  color: #393f3e !important;
  margin: 27px 0 65px 0;
  font-size: 40px;
  font-family: 'agenda';
}

.jencap-content {
  display: flex;
  gap: 60px;
  align-items: flex-start;
  font-family: 'agenda';
  font-size: 18.5px !important;
  font-weight: 300;
}

.contact-column {
  flex: 1.9;
}

.contact-card {
  margin-bottom: 25px;
  font-family: var(--jencap-heading);
}

.b-dark-green { border-top: 12px solid #00764f; }
.b-light-green { border-top: 12px solid #00ab62; }
.b-charcoal { border-top: 12px solid #334041; }
.b-teal { border-top: 12px solid #00a4ad; }

.contact-card p, .contact-card .info {
  line-height: 1.15 !important;
  font-weight: 300 !important;
}

.contact-card .name {
  font-weight: 600 !important;
  margin: 0 0 8px 0;
  font-family: 'agenda';
  font-size: 18.5px !important;
}

.contact-card .position {
  margin: 0;
  color: #444;
  font-family: 'agenda';
  font-size: 18.5px !important;
  font-weight: 300;
}

.contact-card .info {
  font-family: var(--jencap-heading);
  margin-top: 15px;
  font-weight: 300;
}

.contact-card a {
  font-family: var(--jencap-heading);
  color: var(--jencap-primary);
  text-decoration: none;
}

.map-column {
  flex: 3;
}

.map-column img {
  width: 100%;
  max-width: 625px;
  height: auto;
  display: block;
}

/* --- ENVIRONMENTAL PAGE SPECIFIC - ISOLATED LOGIC --- */

.jencap-content.environmental-layout {
  display: grid !important;
  grid-template-columns: 1fr 1fr 1fr !important;
  gap: 60px !important;
  align-items: start !important;
}

.environmental-layout .jencap-col {
  flex: none !important;
  width: 100% !important;
  max-width: 100% !important;
  display: block !important;
}

.environmental-layout .map-wrapper {
  margin-top: 20px !important;
  width: 100% !important;
}

.environmental-layout .map-wrapper img {
  width: 100% !important;
  max-width: 100% !important;
  height: auto !important;
}

/* --- TABLET & MOBILE QA --- */

@media (max-width: 960px) {
  .jencap-container {
    padding: 0 30px !important;
  }

  /* Both layouts wrap to 2 columns */
  .jencap-content:not(.environmental-layout) {
    flex-wrap: wrap !important;
  }
  
  .contact-column, .map-column {
    flex: 1 1 45% !important;
  }

  .jencap-content.environmental-layout {
    grid-template-columns: 1fr 1fr !important;
  }
}

@media (max-width: 600px) {
  .jencap-title {
    font-size: 32px !important;
  }

  /* Both layouts stack to 1 column */
  .jencap-content, 
  .jencap-content.environmental-layout {
    display: flex !important;
    flex-direction: column !important;
  }

  .contact-column, .map-column, .jencap-col {
    width: 100% !important;
  }
}

/* Visibility Toggles */
.mobile-only { display: none !important; }

@media (max-width: 1120px) {
  /* Hide desktop grid, show mobile/tablet structure */
  .jencap-content.environmental-layout.desktop-only { display: none !important; }
  .mobile-only { display: block !important; }
  
  .jencap-container { 
    padding: 0 40px !important; 
  }

  /* Tablet: All cards wrap to 2 columns */
  .mobile-card-grid {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 40px !important;
  }

  /* Map is pushed to the bottom below all cards */
  .mobile-map {
    margin-top: 60px !important;
    width: 100% !important;
    display: flex;
    justify-content: center;
  }
  
  .mobile-map img {
    max-width: 625px !important; /* Matches original map sizing */
    width: 100% !important;
    height: auto;
  }
}

@media (max-width: 600px) {
  /* Mobile: All cards stack to 1 column */
  .mobile-card-grid {
    grid-template-columns: 1fr !important;
  }
  
  .jencap-container { 
    padding: 0 20px !important; 
  }
  
  .full-width-bg {
    padding: 40px 0 !important;
  }
  .body-container--broker .hero__headline {
    line-height: 28px !important;
  }
}

@media screen and (max-width: 960px) {
.cat-intro-row {
    display: flex;
    gap: 0;
}

.cat-btn-col {
    margin-left: 0px !important;
}

    .broker-cat-modeling__heading, .broker-cat-modeling__lead {
        text-align: center;
    }

.cat-intro-row {
    display: flex;
    align-items: center !important;
    gap: 0 !important;
    justify-content: center !important;
    flex-direction: column !important;
}
}