/* ------------------------------------ *\
  CONTENTS
\* ------------------------------------ */

/**
 * CONTENTS..............You’re reading it!
 * FULL ARTICLE ..........................
 * VIEW TEASER ...........................
 * VIEW SLIDER CARROUSEL .................
 * MEDIA..................................
 * MEDIA QUERIES..........................
*/

/* ------------------------------------ *\
  ==FULL ARTICLE
\* ------------------------------------ */
.node--view-mode-full {
  position: relative;
}

.page-node-type-article .main .section-grid {
  margin: auto;
  max-width: 800px;
}

.page-node-type-article .region-subheader {
  position: relative;
  margin-bottom: 85px;
  margin-top: 5px;
  min-height: 100px;
}

.page-node-type-article .block-page-title-block {
  margin: auto;
  width: 800px;
}

.page-node-type-article .taxonomy-term.vocabulary-categorie .field--name-name {
  font-family: Rubik, serif;
  font-size: 30px;
  line-height: 35px;
  font-weight: 700;
  text-decoration: none;
  margin: 0;
}

.page-node-type-article .field--name-title {
  font-family: 'George Bold', serif;
  font-size: 2.5rem;
  line-height: 2.5rem;
  text-transform: uppercase;
}

.page-node-type-article .field--name-field-article-thematique {
  margin: auto;
  position: relative;
  top: -4rem;
  width: 800px;
}

.block-views-blockarticle-block-37 {
  max-width: 800px;
  margin: auto;
}

.block-views-blockarticle-block-37 .item-list ul {
  list-style: none;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: 10px;
  padding: 0 0.2rem;
}

.block-views-blockarticle-block-37 ul {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  margin: 0;
  padding: 0;
  list-style-type: none;
}

.block-views-blockarticle-block-37 .item-list li {
  padding: 0 0.5rem;
  margin: 0;
  text-align: center;
  display: inline-block;
  position: relative;
  font-family: Bitter, serif;
  font-size: 0.625rem;
  line-height: 1.25rem;
  font-weight: 400;
  color: #fff;
  background: #000;
  text-transform: uppercase;
}

.page-node-type-article .block-system-main-block {
  position: relative;
  bottom: 3rem;
}

.paragraph--type--texte .text-formatted,
.paragraph--type--slider .article-meta .field {
  color: var(--bs-black);
  font-family: Bitter, serif;
  font-weight: 300;
  font-size: 0.9375rem;
  line-height: 1.25rem;
  text-align: left;
  margin: 1.25rem 0;
}

.lpb-enable__button span {
  font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
}

.field--name-node-read-time {
  font-size: 0.75rem;
  font-weight: 300;
  font-family: Bitter, serif;
}

.node-read-time {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  margin: 22px auto 10px;
  font-family: Bitter, serif;
  font-size: 0.75rem;
  font-weight: 300;
  width: 800px;
}

.node-read-time img {
  height: 0.75rem;
  position: relative;
  top: 0.5rem;
  margin-right: 0.3rem;
}

.node__submitted {
  margin-bottom: 30px;
}

.block-social-sharing-block {
  margin: auto;
  width: 800px;
}

.block-social-sharing-block h2 {
  font-family: Bitter, serif;
  font-size: 0.75rem;
  font-weight: 300;
  line-height: 0;
}

.social-media-sharing li {
  margin: 0;
}

.social-media-sharing .share img {
  display: inline;
  height: 18px;
  width: auto;
  margin: 0 0.2rem;
}

.social-media-sharing img:hover {
  opacity: 0.4;
}

.node__meta,
.article__author {
  font-family: Bitter, serif;
  font-size: 0.75rem;
  font-weight: 300;
  line-height: 0;
  margin: 11px auto;
  width: 800px;
}

.article__author {
  font-size: 15px;
}

.page-separateur {
  width: 800px;
  margin: auto;
}

.page-separateur-inside {
  border-top: 2px dotted;
  margin: 1.875rem 0;
}

.node--view-mode-full .cta__same-author {
  -webkit-box-pack: left;
      -ms-flex-pack: left;
          justify-content: left;
  margin: 1rem 0;
}

/* ------------------------------------ *\
  ==VIEW TEASER
\* ------------------------------------ */

.layout__region--second > .paragraph--type--block-vue:first-child {
  margin: 4.4rem auto 0;
}

.node--type-article {
  position: relative;
}

.view-article {
  margin: 4.4rem 0;
  position: relative;
}

.article {
  width: 100%;
}

.view-article .item-list,
.view-article ul {
  width: 100%;
}

.view-article li {
  list-style-type: none;
}

.view-article
  .node--type-article
  a:where(:hover, :focus, :active)
  ~ .article
  .field--name-field-article-image
  img {
  -webkit-transform: scale(1.2);
          transform: scale(1.2);
}

.view-article .view-footer {
  text-align: right;
}

.node--type-article.node--view-mode-teaser
  a:hover
  ~ .article
  .field--name-field-article-image
  img {
  -webkit-transform: scale(1.2);
          transform: scale(1.2);
}

.view img {
  -webkit-transition: -webkit-transform 0.3s ease;
  transition: -webkit-transform 0.3s ease;
  transition: transform 0.3s ease;
  transition: transform 0.3s ease, -webkit-transform 0.3s ease;
}

.contain-2 .image-style-article-full-content {
  min-height: 152px;
}

.page-node-type-article
  .node--type-article.node--view-mode-teaser
  .taxonomy-term.vocabulary-categorie
  .field--name-name {
  text-align: center;
  font-size: 10px;
  text-transform: uppercase;
  font-weight: 300;
}

.node--type-article.node--view-mode-teaser {
  position: relative;
  height: 100%;
  -ms-flex-line-pack: center;
      align-content: center;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

.paragraph--type--slider
  .node--type-article.node--view-mode-teaser
  .taxonomy-term.vocabulary-categorie
  img,
.paragraph--type--slider .node--type-article.node--view-mode-teaser {
  max-width: 280px;
}

.viewsreference--view-title {
  display: none;
}

.field--name-field-article-highlight-node {
  margin: 0 auto;
  height: 100%;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  justify-items: center;
  justify-self: center;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.paragraph--type--slider .slick-track {
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.paragraph--type--slider.slider--multiple .field__items .slick-slide {
  margin: 0 2.188rem;
}

.article-meta {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: nowrap;
      flex-wrap: nowrap;
  -webkit-box-pack: left;
      -ms-flex-pack: left;
          justify-content: left;
  width: 100%;
  -ms-flex-line-pack: center;
      align-content: center;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
}

.node--view-mode-accroche-slider .article-meta {
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
}

.field--name-field-article-type img {
  width: 1.25rem;
  float: right;
  position: relative;
  top: 0.1rem;
}

.field--name-field-article-image {
  max-width: 100%;
  overflow: hidden;
}

.first-elt .field--name-field-article-image {
  height: 10rem;
}

.field--name-field-article-thematique {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.field--name-field-article-thematique .field__item {
  position: relative;
  font-family: Bitter, serif;
  font-size: 0.625rem;
  line-height: 1.25rem;
  font-weight: 400;
  color: #fff;
  background: #000;
  text-align: center;
  margin-bottom: 1rem;
  margin-right: 0.5rem;
  text-transform: uppercase;
  padding: 0 0.625rem;
}

.field.field--name-field-article-type {
  width: 100%;
  float: right;
}

.field--name-title {
  display: inline-block;
  position: relative;
  color: #000;
  -webkit-transition: all 1s ease;
  transition: all 1s ease;
  font-family: Bitter, serif;
  font-weight: 200;
  padding: 0 0.3rem;
  font-size: 1.25rem;
  line-height: 1.25rem;
  text-align: left;
  width: 100%;
  margin: 10px 0;
}

.view .field--name-title,
.page-node-type-article .field--name-title {
  padding: 0;
}

.node--view-mode-teaser .stretched-link:hover .field--name-title {
  color: #888;
  -webkit-transition: all 1s ease;
  transition: all 1s ease;
}

.article__title-prefix {
  font-family: Megrim, serif;
  font-weight: 400;
  font-style: normal;
  font-size: 1.25rem;
}

.article__title-wrapper {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  position: relative;
}

.article__title,
.article__title h1 {
  font-family: 'George Bold', serif;
  font-style: normal;
  font-weight: bold;
  font-size: 1.875rem;
  text-transform: uppercase;
}

.contain-2 .article-elt {
  padding: 0;
}

.layout__region--second .article__title-prefix {
  text-align: right;
}

.layout__region--first .article__title-wrapper {
  -webkit-box-pack: start;
      -ms-flex-pack: start;
          justify-content: flex-start;
}

.layout__region--first .article__title {
  margin-right: 0.1rem;
  text-align: left;
}

.layout__region--first .article__title-wrapper,
.layout__region--first .article__title-prefix {
  margin: 0 20px;
}

.article__title-wrapper::after,
.article__title-wrapper::before {
  top: 0.44rem;
  position: relative;
}

.layout__region--first .article__title-wrapper::after,
.view-display-id-page_1 .article__title-wrapper::after {
  content: '';
  -webkit-box-flex: 1;
      -ms-flex-positive: 1;
          flex-grow: 1;
  height: 0.125rem;
  border-top: 0.125rem dotted;
  display: block;
  margin-left: 0.25rem;
  margin-right: 0;
}

.layout__region--second .article__title-wrapper {
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
}

.layout__region--second .article__title {
  margin-left: 0.1rem;
  text-align: right;
}

.layout__region--second .article__title-wrapper::before {
  content: '';
  -webkit-box-flex: 1;
      -ms-flex-positive: 1;
          flex-grow: 1;
  height: 0.125rem;
  border-top: 0.125rem dotted;
  display: block;
  margin-right: 0.25rem;
  margin-left: 0;
}

.article__title-suffix {
  font-family: Bitter, serif;
  font-size: 0.94rem;
  line-height: 0.8rem;
  font-weight: 400;
  text-align: right;
  padding-top: 0.8rem;
}

.node--view-mode-teaser-video,
.node--view-mode-teaser-podcast,
.node--view-mode-teaser-immersif {
  width: inherit;
}

.node--view-mode-teaser-video a,
.node--view-mode-teaser-podcast a,
.node--view-mode-teaser-immersif a {
  text-decoration: none;
}

.view-footer {
  margin-bottom: 10px;
}

.node--view-mode-teaser-video .field--name-title,
.node--view-mode-teaser-immersif .field--name-title {
  text-align: right;
}

.node--view-mode-teaser-podcast .field--name-title {
  text-align: center;
  font-size: 0.8rem;
  letter-spacing: 0.5px;
  line-height: 0.75rem;
  margin-left: 2rem;
}

.node--view-mode-teaser-immersif .field--name-title {
  font-size: 0.94rem;
  font-family: Bitter, serif;
  font-weight: 200;
  margin: 7px 0 34px;
}

.node--view-mode-teaser-podcast img {
  width: 12.5rem;
  margin-left: 3rem;
}

.view-display-id-block_35 .view-content .views-row,
.view-display-id-page_1 .view-content {
  /* Surcharge un comportement bootstrap */
  width: 623px !important;
  margin-left: auto;
  margin-right: auto;
}

/* ------------------------------------ *\
  ==RUBRIQUES
\* ------------------------------------ */
.view-content {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -ms-flex-pack: distribute;
      justify-content: space-around;
  margin-top: 3rem;
}

.view-content .views-row {
  width: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  margin: 0;
}

.layout__region--first .view-content .views-row,
.view-display-id-page_1 .view-content .views-row {
  margin: 0 auto 2.5rem;
}

.layout__region--first .view-content .views-row:last-child {
  margin: 0 auto;
}

.layout__region--first .view-content .views-row.contain-2 {
  margin: 0 auto -17px;
}

.layout__region--second .view-article {
  margin: 0 auto 2.4rem;
}

.paragraph .file-link:not(.cta--button) {
  word-break: break-all;
  font-size: 1rem;
  line-height: 1.384rem;
}

/* ------------------------------------ *\
  ==VIEW SLIDER CARROUSEL
\* ------------------------------------ */
.node--type-article.node--view-mode-accroche-slider .article-img img,
.node--type-article.node--view-mode-accroche-slider {
  min-height: 495px;
}

.node--type-article.node--view-mode-accroche-slider
  .field--name-field-article-components
  .field__item:not(:nth-child(1), :nth-child(2)) {
  display: none;
}

.node--type-article.node--view-mode-accroche-slider .field--name-title {
  font-size: 25px;
  pointer-events: none;
  position: relative;
  color: white;
  font-family: 'George Bold', serif;
  font-style: normal;
  font-weight: normal;
  max-width: 25rem;
  z-index: 10;
  background: black;
  padding: 4px;
  line-height: 1.5;
  -webkit-box-decoration-break: clone;
          box-decoration-break: clone;
  display: inline;
}

.node--type-article.node--view-mode-accroche-slider .article-meta img {
  display: none;
}

.node--type-article.node--view-mode-accroche-slider
  .article-meta
  .taxonomy-term.vocabulary-categorie {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
  margin: 10px 0 30px;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}

.node--type-article.node--view-mode-accroche-slider
  .article-meta
  .field--name-field-article-components
  .paragraphs-description
  .paragraphs-content-wrapper {
  overflow: unset;
  line-height: inherit;
  height: unset;
}

.node--type-article.node--view-mode-accroche-slider .article-meta p em,
.node--type-article.node--view-mode-accroche-slider .article-meta p strong {
  font-weight: 400;
  font-size: 16px;
  font-style: initial;
}

.node--type-article.node--view-mode-accroche-slider
  a:active
  ~ .article-meta::after,
.node--type-article.node--view-mode-accroche-slider
  a:focus
  ~ .article-meta::after,
.node--type-article.node--view-mode-accroche-slider
  a:hover
  ~ .article-meta::after {
  opacity: 1;
}

.page-node-type-article .page-header .field--name-title {
  position: relative;
  z-index: 0;
}

.page-node-type-article .page-header h1 {
  color: var(--bs-white);
}

.page-node-type-article .page-header .field--name-title::after {
  content: '';
  height: calc(100% + 2rem);
  width: calc(100% + 2rem);
  position: absolute;
  top: -1rem;
  left: -1rem;
  border-radius: 30px;
  padding: 2rem;
  -webkit-transition: all 0.5s;
  transition: all 0.5s;
  z-index: -3;
  opacity: 0.7;
  background-color: #000000c4;
}

.node--type-article.node--view-mode-accroche-slider .article-meta {
  position: absolute;
  z-index: 1;
  -ms-flex-line-pack: center;
      align-content: center;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
  top: 50%;
  color: var(--bs-white);
  margin: 20px;
  width: 25rem;
  pointer-events: none;
}

.node--type-article.node--view-mode-accroche-slider .article--heading {
  font-family: Bitter, serif;
  font-size: 15px;
  font-weight: 400;
  color: #000;
  text-transform: uppercase;
  background: white;
  bottom: 3rem;
  line-height: 1rem;
  padding: 0.3rem 0.8rem;
  display: block;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  margin-bottom: 2rem;
}

.field .paragraph.paragraph--type--slider .slick-slider ul.slick-dots {
  position: relative;
  bottom: 30px;
}

.paragraph--type--slider .slick-slider.slick-dotted {
  margin-bottom: 0;
}

.field
  .paragraph.paragraph--type--slider
  .slick-slider
  .slick-dots
  li.slick-active
  button
  .slick-dot-icon::before {
  color: var(--bs-white);
}

/* ------------------------------------ *\
  ==MEDIA
\* ------------------------------------ */
.media--type-video {
  max-width: 49.5rem;
  margin-left: auto;
  margin-right: auto;
  border-radius: 10px;
}

.media--type-video .media-oembed-content {
  width: 100%;
  height: auto;
  min-height: 28.12rem;
  border-radius: 10px;
}

/* ------------------------------------ *\
  ==MEDIA QUERIES
\* ------------------------------------ */
@media (max-width: 1100px) {
  .page-node-type-article .main .section-grid,
  .taxonomy-term.vocabulary-categorie {
    margin: 2rem;
  }
}

@media (max-width: 800px) {
  .node--type-article.node--view-mode-teaser .field--name-title {
    font-size: 1.5rem;
    line-height: 1.5rem;
  }

  .page-node-type-article .main .section-grid {
    margin: 50px 16px;
  }

  .taxonomy-term.vocabulary-categorie {
    margin: 50px 2rem 0;
  }

  body.simple-page .page-header,
  body.simple-page .page__content {
    margin: 0 2rem;
  }

  .view-article .view-content {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    margin: 2rem;
  }

  .view-display-id-page_1 .view-content {
    margin: 0;
  }

  .view-article .view-content .views-row {
    width: calc(100%);
    margin: 0;
  }

  .block-views-exposed-filter-blockrecherche-page-1 {
    margin-left: 0;
    width: calc(100% - 3rem);
  }

  .layout__region--second .article__title-wrapper {
    -webkit-box-pack: start;
        -ms-flex-pack: start;
            justify-content: flex-start;
  }

  .layout__region--second .article__title-wrapper,
  .layout__region--second .article__title-prefix,
  .layout__region--second .article__title-suffix {
    margin: 0 20px;
  }

  .layout__region--second .article__title-wrapper::before {
    content: none;
  }

  .layout__region--second .article__title-wrapper::after {
    content: '';
    -webkit-box-flex: 1;
        -ms-flex-positive: 1;
            flex-grow: 1;
    border-top: 0.125rem dotted;
    margin-left: 1rem;
  }

  .layout__region--second .article__title-prefix,
  .layout__region--second .article__title {
    text-align: left;
  }

  .section-flex-0 > .layout > .layout__region > .paragraph {
    margin: 0 auto;
    width: 95%;
  }

  .paragraph--section--5460.section-flex-0
    > .layout
    > .layout__region
    > .paragraph {
    width: unset;
  }

  .page-node-type-article .field--name-field-article-thematique {
    left: 2rem;
    margin: 0;
    position: relative;
    top: 0;
  }

  .contain-2 .article-elt:first-child {
    padding: 0;
  }

  .media--type-video {
    max-width: unset;
    margin: 0 1.8rem;
  }

  .media--type-video .media-oembed-content {
    width: 95vw;
    min-height: unset;
    margin: auto;
  }

  .page-node-type-article .block-page-title-block {
    margin: 0 0.8rem;
    padding: 0;
    height: unset;
    width: unset;
  }

  .node-read-time {
    margin: 0 2rem;
    width: 100%;
  }

  .node__meta {
    margin: 30px 32px;
  }

  .page-separateur,
  .article__author,
  .block-social-sharing-block {
    margin: 0 2rem;
  }

  .node--view-mode-full .cta__same-author.playlist-bouton {
    bottom: 0;
  }

  .page-node-type-article .block-system-main-block {
    bottom: 0;
  }

  .page-node-type-article .region-subheader {
    margin-bottom: 5px;
  }

  .block-views-blockarticle-block-37 ul {
    margin: 0 1rem;
  }
}

@media only screen and (max-width: 500px) {
  .region-subheader h1 {
    font-size: 40px;
    line-height: 45px;
  }
}

@media (min-width: 576px) {
  /* Surcharge comportement bootstrap */
  .view-article .container {
    max-width: unset;
  }
}