/**
 * Polices — alignées sur desjardinslawyers.com (HubSpot theme)
 * Corps : Open Sans | Titres : Cabin | Accents : Roboto / Roboto Slab
 */

body,
.body-wrapper,
p,
.body-container,
.content-wrapper,
button,
input,
select,
textarea {
  font-family: "Open Sans", sans-serif;
  font-weight: 400;
}

h1,
h2,
h3,
h4,
h5,
h6,
.h1,
.h2,
.h3,
.h4,
.h5,
.h6 {
  font-family: "Cabin", sans-serif;
}

h3 {
  font-weight: 600;
}

.title-text h1,
.md-service-block-two h3,
.md-singleItem-wrp h4.single_icon,
.custom-banner-section h1 {
  font-family: "Roboto", sans-serif;
}

.buttons a,
.theme-btn,
.header .mega-menu-with_icons > ul > li > a {
  font-family: "Open Sans", sans-serif;
}

/* CTA HubSpot (image bleue) — réduit sur mobile comme le site en ligne */
.hs-cta-wrapper {
  display: inline-block;
  max-width: 100%;
  box-sizing: border-box;
}

.hs-cta-wrapper a {
  display: inline-block;
  line-height: 0;
  max-width: 100%;
}

.hs-cta-wrapper .hs-cta-img {
  display: block;
  border: 0;
  max-width: 100%;
  width: auto;
  height: auto;
  vertical-align: middle;
}

.custom-banner-section .hs-cta-wrapper {
  margin-top: 10px;
}

@media (min-width: 1020px) {
  .mega-menu-with_icons > ul > li > a {
    padding: 37px 15px;
  }

  /*
   * Panneau Programmes / Programs : pleine largeur de la barre (comme le site en ligne).
   * Ancré sur header, pas sur la colonne nav à droite du logo.
   */
  header.header {
    position: relative;
  }

  .mega-menu-with_icons > ul > li.mega > ul {
    top: 112px;
    left: 0;
    right: 0;
    width: 100%;
    box-sizing: border-box;
  }

  /* Même largeur utile que le header en ligne (~90 %), pas 1170px fixe */
  .mega-menu-with_icons > ul > li.mega > ul > .content-wrapper {
    max-width: 90%;
    width: 100%;
    margin-left: auto;
    margin-right: auto;
    padding-left: 15px;
    padding-right: 15px;
    box-sizing: border-box;
  }

  /* 3 colonnes EN (Programs) — espacement comme HubSpot */
  .mega-menu-with_icons > ul > li.mega > ul.has-3 > .content-wrapper > li {
    width: 33.333%;
    padding: 20px 40px;
    border-right: 1px solid #fff;
    box-sizing: border-box;
  }

  .mega-menu-with_icons > ul > li.mega > ul.has-3 > .content-wrapper > li:last-child {
    border-right: none;
  }

  .mega-menu-with_icons > ul > li.mega > ul.has-3 > .content-wrapper > li h3 {
    margin-bottom: 20px;
  }

  /* Zone invisible pour garder le survol entre le lien et le panneau (padding 37px) */
  .mega-menu-with_icons > ul > li.mega > ul::before {
    height: 54px;
    top: -53px;
  }
}