/* ============================================================
   DMD CUSTOM STYLES
   File: /wp-content/mu-plugins/css/dmd-custom.css
   Managed by: anARTIST unleashed
   ============================================================

   TABLE OF CONTENTS
   ---------------------------------------------------------
   1.  Global Tweaks
   2.  Header & Navigation
   3.  Homepage
   4.  About Us
   5.  FAQ
   6.  Footer
   7.  Regional Rep Box Layout (.box / .detailinfo)
   8.  Forms & Misc
   9.  Responsive – max-width: 1024px
   10. Responsive – max-width: 768px
   11. Responsive – max-width: 480px
   12. Responsive – min-width: 1400px
   13. Section Navigation (Leadership Team page)
   14. Board of Directors – Card Layout (white bg)
   15. Regional Representatives – Card Layout (tan bg)
   16. Advisory Board – Card Layout (white bg)
   17. Central Office – Card Layout (tan bg)
   --------------------------------------------------------- */


/* ============================================================
   1. GLOBAL TWEAKS
   ============================================================ */

.stdtext {
  font-weight: normal;
  font-size: 15px;
  color: #000;
}

.thim-sc-heading .heading-content {
  max-width: 100%;
}

.thim-sc-image-box .number {
  display: none;
}

.number {
  background: transparent !important;
}

#appresults {
  font-size: 13px !important;
}

/* ============================================================
   FIX: Text color in tan background rows
   ============================================================ */

.vc_row-has-fill p,
.vc_row-has-fill li,
.vc_row-has-fill span:not(.dmd-rep-region),
.vc_row-has-fill .wpb_text_column,
.vc_row-has-fill .wpb_wrapper,
.detailinfo p,
.detailinfo li,
.box p,
.box li {
  color: #000000;
}


/* ============================================================
   2. HEADER & NAVIGATION
   ============================================================ */

#thim-header-topbar {
  height: 36px;
  margin-bottom: 5px;
  color: #FFF;
  padding: 10px 0 0 0;
}

.menu-mobile-effect.navbar-toggle .icon-wrap span.icon-bar {
  background: #3F1955 !important;
}

.menu-mobile-effect.navbar-toggle .text-menu {
  color: #3F1955 !important;
}

.content-pusher.creative-right #masthead .main-header .header-center {
  order: 1 !important;
}


/* ============================================================
   3. HOMEPAGE
   ============================================================ */

.thimheaderhome h3 {
  background: rgba(54, 55, 88, 0.8);
  padding: 30px;
}

.thimheaderhomemobile h3 {
  padding: 25px 0;
}

#homeslidebackgroundmobile {
  display: none;
}

#homeslidesbackground {
  display: flex-end;
}

#homeslidesbackground .vc_parallax-inner {
  top: -10% !important;
}

#homeslides h3 {
  font-size: 36px !important;
  line-height: 44px;
}

.homebecometext .title-2 {
  color: #FFF !important;
}

.homebecometext h3 {
  color: #B6A176 !important;
  display: inherit;
}

.homebecometext .btn {
  background: #B6A176;
}

.homebecometext .btn:hover {
  background: #FFF !important;
  color: #B6A176 !important;
}

.home .thim-sc-image-box .text-content-inner .sub-title {
  font-size: 22px;
  font-weight: 500;
  color: #FFF;
}

.home .thim-sc-image-box .text-content-inner .underline {
  display: none;
}

.thim-sc-counter-box:not(.layout-center) .counter_box:hover .icon_counter {
  color: #B6A176;
}

.home4-header-box {
  left: 45px;
}


/* ============================================================
   4. ABOUT US
   ============================================================ */

.vc_row-has-fill .thim-sc-icon-box.layout-3 .icon-box-wrapper .description {
  color: inherit;
}

#petition .text-content-inner,
#installation .text-content-inner {
  margin-top: 15px;
}

#bylaws .text-content-inner {
  margin-top: 50px;
}


/* ============================================================
   5. FAQ
   ============================================================ */

.faqbackground .vc-hoverbox-front {
  background-position: top right;
}

.faqbackground h2 {
  font-size: 30px;
}


/* ============================================================
   6. FOOTER
   ============================================================ */

footer .vc_row[data-vc-full-width] {
  padding-right: 0 !important;
}


/* ============================================================
   7. REGIONAL REP BOX LAYOUT (.box / .detailinfo)
   ============================================================ */

.detailinfo {
  background-color: #D2C7B2;
  padding: 10px;
}

.box > * {
  background-color: #D2C7B2;
}

.box {
  display: flex;
  margin-bottom: 40px;
}

.one,
.two,
.three {
  flex: 1 1 auto;
  padding: 5px;
}


/* ============================================================
   8. FORMS & MISC
   ============================================================ */

.anr_captcha_field {
  margin-bottom: 30px;
}

input[type="checkbox"]:checked::before,
input[type="radio"]:checked::before {
  font-family: FontAwesome !important;
}

#um_field_15000_username,
#um_field_15000_user_password {
  border: 1px solid #441C58;
  padding-bottom: 0;
  background: #5E5F79;
}

i.sui-check-circle,
i.sui-exclamation-circle,
i.sui-warning {
  padding: 0 !important;
  background: none !important;
}

i.sui-warning {
  color: #CA0D1B !important;
}


/* ============================================================
   9. RESPONSIVE – max-width: 1024px
   ============================================================ */

@media (max-width: 1024px) {
  .responsive .thim-sc-counter-box.demo-single-instructor {
    display: block;
    text-align: center;
    flex-wrap: wrap;
  }

  .responsive .home4-couter-box {
    margin-top: 0 !important;
  }

  .dsktp-ver {
    display: none !important;
  }

  body.responsive header#masthead .header-v1 .main-header.row .header-left {
    order: 2;
  }
}


/* ============================================================
   10. RESPONSIVE – max-width: 768px
   ============================================================ */

@media (max-width: 768px) {
  .responsive #home-main-content {
    padding-top: 0 !important;
  }

  #homeslides {
    padding-top: 0 !important;
  }

  #footeraddress,
  #footercontact,
  #footersocial,
  #footerquicklinks {
    width: 100% !important;
    max-width: 100% !important;
    padding: auto;
    margin: 0;
  }
}


/* ============================================================
   11. RESPONSIVE – max-width: 480px
   ============================================================ */

@media (max-width: 480px) {
  #homeslidebackgroundmobile {
    display: block;
  }

  #homeslidebackgroundmobile .wpb_single_image img {
    max-width: 150%;
    margin: 0 -50%;
  }

  #homeslidebackgroundmobile .vc_column_container > .vc_column-inner,
  #homeslidebackgroundmobile .responsive .thim-sc-heading.layout-2 {
    padding: 0 !important;
  }

  .responsive.home4-section .thim-sc-heading.layout-2 .heading-content .primary-heading {
    line-height: 30px;
    width: 100%;
  }

  #homeslidesbackground {
    display: none;
  }

  #homeslidesbackground .vc_parallax-inner {
    top: 0% !important;
    width: 100%;
  }

  #homeslides h3 {
    font-size: 24px !important;
    line-height: 30px;
  }
}


/* ============================================================
   12. RESPONSIVE – min-width: 1400px
   ============================================================ */

@media (min-width: 1400px) {
  body.responsive #wrapper-container .container {
    width: var(--thim-site-home-width) !important;
  }
}


/* ============================================================
   1. SECTION NAVIGATION
   ============================================================ */

.dmd-section-nav {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-bottom: 32px;
  justify-content: center;
}

.dmd-section-nav a {
  display: inline-block;
  background: #3f1955;
  color: #B49F74 !important;
  padding: 8px 20px;
  border-radius: 4px;
  font-weight: 600;
  font-size: 0.9rem;
  text-decoration: none !important;
  transition: background 0.2s ease;
}

.dmd-section-nav a:hover {
  background: #5a2a78;
}

/* Anchor scroll offset for sticky header */
#board-of-directors,
#regional-representatives,
#advisory-board,
#central-office-staff {
  scroll-margin-top: 120px;
}


/* ============================================================
   2. BOARD OF DIRECTORS – Card Layout
   Container background: white
   ============================================================ */

.dmd-board-grid {
  display: flex;
  flex-direction: column;
  gap: 32px;
  margin: 24px 0;
}

.dmd-board-card {
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  gap: 28px;
  background: #ffffff;
  border-radius: 6px;
  border-top: 4px solid #B49F74;
  box-shadow: 0 2px 12px rgba(63, 25, 85, 0.10);
  padding: 28px;
  transition: box-shadow 0.2s ease;
}

.dmd-board-card:hover {
  box-shadow: 0 6px 24px rgba(63, 25, 85, 0.18);
}

.dmd-card-photo-wrap {
  flex-shrink: 0;
  width: 240px;
}

.dmd-card-photo-wrap img {
  width: 240px;
  height: auto;
  border-radius: 4px;
  display: block;
}

.dmd-card-content {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.dmd-card-header h3 {
  color: #3f1955 !important;
  font-weight: bold !important;
  margin: 0 0 4px 0 !important;
  font-size: 1.25rem;
  line-height: 1.3;
}

.dmd-card-header h4 {
  color: #B49F74;
  margin: 0 !important;
  font-size: 1rem;
  font-weight: 600;
}

.dmd-card-bio p {
  margin: 0 0 10px 0;
  font-size: 0.95rem;
  line-height: 1.65;
  color: #333;
}

.dmd-card-bio p:last-child {
  margin-bottom: 0;
}

.dmd-edu-list {
  margin: 6px 0 0 0 !important;
  padding-left: 20px !important;
  font-size: 0.95rem;
  line-height: 1.65;
  color: #333;
}

.dmd-edu-list li {
  margin-bottom: 4px;
}

.dmd-card-footer {
  margin-top: 4px;
}

@media (max-width: 900px) {
  .dmd-card-photo-wrap,
  .dmd-card-photo-wrap img {
    width: 200px;
  }
}

@media (max-width: 600px) {
  .dmd-board-card {
    flex-direction: column;
    align-items: center;
    text-align: center;
    padding: 22px 18px;
    gap: 16px;
  }

  .dmd-card-photo-wrap,
  .dmd-card-photo-wrap img {
    width: 240px;
  }

  .dmd-card-header h3 {
    font-size: 1.15rem;
  }

  .dmd-edu-list {
    text-align: left;
    display: inline-block;
  }

  .dmd-card-footer {
    width: 100%;
    text-align: center;
  }
}


/* ============================================================
   3. REGIONAL REPRESENTATIVES – Card Layout
   Container background: #D2C7B2 (warm tan)
   ============================================================ */

.dmd-reps-grid {
  display: flex;
  flex-direction: column;
  gap: 28px;
  margin: 24px 0;
}

.dmd-rep-card {
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  gap: 28px;
  background: #FDFAF6;
  border-radius: 6px;
  border-top: 4px solid #3f1955;
  box-shadow: 0 2px 10px rgba(80, 55, 40, 0.15);
  padding: 28px;
  transition: box-shadow 0.2s ease;
}

.dmd-rep-card:hover {
  box-shadow: 0 6px 20px rgba(80, 55, 40, 0.25);
}

.dmd-rep-photo-wrap {
  flex-shrink: 0;
  width: 240px;
}

.dmd-rep-photo-wrap img {
  width: 240px;
  height: auto;
  border-radius: 4px;
  display: block;
}

.dmd-rep-content {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.dmd-rep-header h3 {
  color: #3f1955 !important;
  font-weight: bold !important;
  margin: 0 0 5px 0 !important;
  font-size: 1.2rem;
  line-height: 1.3;
}

.dmd-rep-credential {
  display: block;
  font-size: 0.85rem;
  color: #5a4a3a;
  font-style: italic;
  margin-bottom: 3px;
}

.dmd-rep-institution {
  display: block;
  font-size: 0.95rem;
  font-weight: 600;
  color: #3f1955;
  margin-bottom: 2px;
}

.dmd-rep-region {
  display: inline-block;
  font-size: 0.8rem;
  font-weight: 700;
  color: #FDFAF6;
  background: #3f1955;
  border-radius: 3px;
  padding: 2px 9px;
  margin-top: 4px;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.dmd-rep-bio p {
  margin: 0 0 10px 0;
  font-size: 0.95rem;
  line-height: 1.65;
  color: #333;
}

.dmd-rep-bio p:last-child {
  margin-bottom: 0;
}

.dmd-rep-footer {
  margin-top: 4px;
}

@media (max-width: 900px) {
  .dmd-rep-photo-wrap,
  .dmd-rep-photo-wrap img {
    width: 180px;
  }
}

@media (max-width: 600px) {
  .dmd-rep-card {
    flex-direction: column;
    align-items: center;
    text-align: center;
    padding: 22px 18px;
    gap: 16px;
  }

  .dmd-rep-photo-wrap,
  .dmd-rep-photo-wrap img {
    width: 200px;
  }

  .dmd-rep-header h3 {
    font-size: 1.1rem;
  }

  .dmd-rep-region {
    display: inline-block;
  }

  .dmd-rep-footer {
    width: 100%;
    text-align: center;
  }
}


/* ============================================================
   4. ADVISORY BOARD – Card Layout
   Container background: white
   ============================================================ */

.dmd-advisory-grid {
  display: flex;
  flex-direction: column;
  gap: 32px;
  margin: 24px 0;
}

.dmd-advisory-card {
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  gap: 28px;
  background: #ffffff;
  border-radius: 6px;
  border-top: 4px solid #B49F74;
  box-shadow: 0 2px 12px rgba(63, 25, 85, 0.10);
  padding: 28px;
  transition: box-shadow 0.2s ease;
}

.dmd-advisory-card:hover {
  box-shadow: 0 6px 24px rgba(63, 25, 85, 0.18);
}

.dmd-advisory-photo-wrap {
  flex-shrink: 0;
  width: 240px;
}

.dmd-advisory-photo-wrap img {
  width: 240px;
  height: auto;
  border-radius: 4px;
  display: block;
}

.dmd-advisory-content {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.dmd-advisory-header h3 {
  color: #3f1955 !important;
  font-weight: bold !important;
  margin: 0 0 5px 0 !important;
  font-size: 1.2rem;
  line-height: 1.3;
}

.dmd-advisory-role {
  display: block;
  font-size: 0.95rem;
  font-weight: 600;
  color: #B49F74;
  margin-bottom: 2px;
}

.dmd-advisory-institution {
  display: block;
  font-size: 0.9rem;
  color: #5a4060;
  font-style: italic;
  margin-bottom: 2px;
}

.dmd-advisory-bio p {
  margin: 0 0 10px 0;
  font-size: 0.95rem;
  line-height: 1.65;
  color: #333;
}

.dmd-advisory-bio p:last-child {
  margin-bottom: 0;
}

.dmd-advisory-footer {
  margin-top: 4px;
}

@media (max-width: 900px) {
  .dmd-advisory-photo-wrap,
  .dmd-advisory-photo-wrap img {
    width: 180px;
  }
}

@media (max-width: 600px) {
  .dmd-advisory-card {
    flex-direction: column;
    align-items: center;
    text-align: center;
    padding: 22px 18px;
    gap: 16px;
  }

  .dmd-advisory-photo-wrap,
  .dmd-advisory-photo-wrap img {
    width: 200px;
  }

  .dmd-advisory-header h3 {
    font-size: 1.1rem;
  }

  .dmd-advisory-footer {
    width: 100%;
    text-align: center;
  }
}


/* ============================================================
   5. CENTRAL OFFICE – Card Layout
   Container background: #D2C7B2 (warm tan)
   ============================================================ */

.dmd-office-grid {
  display: flex;
  flex-direction: column;
  gap: 28px;
  margin: 24px 0;
}

.dmd-office-card {
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  gap: 28px;
  background: #FDFAF6;
  border-radius: 6px;
  border-top: 4px solid #3f1955;
  box-shadow: 0 2px 10px rgba(80, 55, 40, 0.15);
  padding: 28px;
  transition: box-shadow 0.2s ease;
}

.dmd-office-card:hover {
  box-shadow: 0 6px 20px rgba(80, 55, 40, 0.25);
}

.dmd-office-photo-wrap {
  flex-shrink: 0;
  width: 240px;
}

.dmd-office-photo-wrap img {
  width: 240px;
  height: auto;
  border-radius: 4px;
  display: block;
}

.dmd-office-content {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.dmd-office-header h3 {
  color: #3f1955 !important;
  font-weight: bold !important;
  margin: 0 0 4px 0 !important;
  font-size: 1.2rem;
  line-height: 1.3;
}

.dmd-office-header h4 {
  color: #B49F74;
  margin: 0 !important;
  font-size: 1rem;
  font-weight: 600;
}

.dmd-office-bio p {
  margin: 0 0 10px 0;
  font-size: 0.95rem;
  line-height: 1.65;
  color: #333;
}

.dmd-office-bio p:last-child {
  margin-bottom: 0;
}

.dmd-office-footer {
  margin-top: 4px;
}

@media (max-width: 900px) {
  .dmd-office-photo-wrap,
  .dmd-office-photo-wrap img {
    width: 180px;
  }
}

@media (max-width: 600px) {
  .dmd-office-card {
    flex-direction: column;
    align-items: center;
    text-align: center;
    padding: 22px 18px;
    gap: 16px;
  }

  .dmd-office-photo-wrap,
  .dmd-office-photo-wrap img {
    width: 200px;
  }

  .dmd-office-header h3 {
    font-size: 1.1rem;
  }

  .dmd-office-footer {
    width: 100%;
    text-align: center;
  }
}