@charset "UTF-8";
/*
Theme Name: Comett App
*/
@import url("https://fonts.googleapis.com/css2?family=Manrope:wght@200..800&family=Mona+Sans:ital,wght@0,200..900;1,200..900&display=swap");
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vertical-align: baseline; }

body {
  line-height: 1; }

a {
  text-decoration-skip-ink: auto; }

a[href^="tel"] {
  color: inherit;
  text-decoration: none; }

button {
  outline: 0; }

ol, ul {
  list-style: none; }

blockquote, q {
  quotes: none; }

blockquote:before, blockquote:after, q:before, q:after {
  content: '';
  content: none; }

q {
  display: inline;
  font-style: italic; }

q:before {
  content: '"';
  font-style: normal; }

q:after {
  content: '"';
  font-style: normal; }

textarea, input[type="text"], input[type="button"], input[type="submit"], input[type="reset"], input[type="search"], input[type="password"] {
  -webkit-appearance: none;
  appearance: none;
  border-radius: 0; }

input[type="search"] {
  -webkit-appearance: textfield; }

table {
  border-collapse: collapse;
  border-spacing: 0; }

th, td {
  padding: 2px; }

big {
  font-size: 120%; }

small, sup, sub {
  font-size: 80%; }

sup {
  vertical-align: super; }

sub {
  vertical-align: sub; }

dd {
  margin-left: 20px; }

kbd, tt {
  font-family: courier;
  font-size: 12px; }

ins {
  text-decoration: underline; }

del, strike, s {
  text-decoration: line-through; }

dt {
  font-weight: bold; }

address, cite, var {
  font-style: italic; }

article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
  display: block; }

* {
  box-sizing: border-box;
  -webkit-tap-highlight-color: transparent; }

.screen-reader-text {
  border: 0;
  clip: rect(1px, 1px, 1px, 1px);
  -webkit-clip-path: inset(50%);
  clip-path: inset(50%);
  height: 1px;
  margin: -1px;
  overflow: hidden;
  padding: 0;
  position: absolute !important;
  width: 1px;
  word-wrap: normal !important;
  word-break: normal; }

.screen-reader-text:focus {
  background-color: #f7f7f7;
  border-radius: 3px;
  box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6);
  clip: auto !important;
  -webkit-clip-path: none;
  clip-path: none;
  color: #007acc;
  display: block;
  font-size: 14px;
  font-size: .875rem;
  font-weight: 700;
  height: auto;
  right: 5px;
  line-height: normal;
  padding: 15px 23px 14px;
  text-decoration: none;
  top: 5px;
  width: auto;
  z-index: 100000; }

.skip-link {
  left: -9999rem;
  top: 2.5rem;
  z-index: 999999999;
  text-decoration: underline; }

.skip-link:focus {
  display: block;
  left: 6px;
  top: 7px;
  font-size: 14px;
  font-weight: 600;
  text-decoration: none;
  line-height: normal;
  padding: 15px 23px 14px;
  z-index: 100000;
  right: auto; }

.visually-hidden:not(:focus):not(:active), .form-allowed-tags:not(:focus):not(:active) {
  position: absolute !important;
  height: 1px;
  width: 1px;
  overflow: hidden;
  clip: rect(1px 1px 1px 1px);
  clip: rect(1px, 1px, 1px, 1px);
  white-space: nowrap; }

/* CSS Document */
/* IMPORTS */
/* VARIABLES */
body, .editor-styles-wrapper {
  --color--light: #FDFDFB;
  --color--light2: #EDEDEA;
  --color--dark: #16171B;
  --color--dark2: #1C1D24;
  --color--grey1: #343542;
  --color--grey2: #6D6F7F;
  --color--grey3: #888A9D;
  --color--grey4: #CFD0DA;
  --color--accent1a: #2BB0FC;
  --color--accent1b: #0A4576;
  --color--accent1c: #11264B;
  --color--accent2a: #E83DA1;
  --color--accent2b: #850A52;
  --font--xxl: 54px;
  --font--xl: 40px;
  --font--lll: 22px;
  --font--ll: 20px;
  --font--l: 18px;
  --font--m: 16px;
  --font--s: 14px;
  --font--xs: 12px;
  --wp--preset--font-size--x-large: var(--font--xl) !important;
  --wp--preset--font-size--large: var(--font--l) !important;
  --wp--preset--font-size--medium: var(--font--m) !important;
  --wp--preset--font-size--small: var(--font--s) !important;
  --font--main: "Mona Sans", sans-serif;
  --font--text: "Manrope", sans-serif;
  --container--width: 1695px; }

body:not(.wp-admin) {
  color: var(--color--dark2);
  background: var(--color--light);
  font-family: var(--font--main);
  font-size: var(--font--m);
  line-height: 1.4;
  -moz-osx-font-smoothing: grayscale;
  -webkit-font-smoothing: subpixel-antialiased;
  font-smoothing: subpixel-antialiased;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale; }

.site-main, .editor-styles-wrapper {
  font-weight: 500;
  /* Style des dialogues */
  /* Group encadré */
  /* BLOC MISE EN AVANT */
  /* ACTIVITES et PARCOURS */
  /* LEXIQUE */ }
  .site-main h1, .site-main .h1, .editor-styles-wrapper h1, .editor-styles-wrapper .h1 {
    font-size: var(--font--xxl);
    display: block;
    margin: 1.2em 0 .4em;
    font-weight: 900; }
  .site-main h2, .site-main .h2, .editor-styles-wrapper h2, .editor-styles-wrapper .h2 {
    font-size: var(--font--xl);
    margin: 1.2em 0 .8em;
    font-weight: 900; }
  .site-main h3, .site-main .h3, .editor-styles-wrapper h3, .editor-styles-wrapper .h3 {
    font-size: var(--font--ll);
    margin: 1.2em 0 .8em;
    font-weight: 900; }
  .site-main h4, .site-main .h4, .editor-styles-wrapper h4, .editor-styles-wrapper .h4 {
    font-size: var(--font--l);
    margin: 1em 0 .5em;
    font-weight: 600; }
  .site-main h5, .site-main .h5, .editor-styles-wrapper h5, .editor-styles-wrapper .h5 {
    font-size: var(--font--m);
    margin: 1.2em 0 .8em;
    color: var(--color--grey2); }
  .site-main h6, .site-main .h6, .editor-styles-wrapper h6, .editor-styles-wrapper .h6 {
    font-size: var(--font--s);
    letter-spacing: -0.3px;
    margin: 1.2em 0 .8em;
    text-transform: uppercase; }
  .site-main .has-x-large-font-size, .editor-styles-wrapper .has-x-large-font-size {
    font-size: var(--font--xl); }
  .site-main .has-large-font-size, .editor-styles-wrapper .has-large-font-size {
    font-size: var(--font--l); }
  .site-main .has-medium-font-size, .editor-styles-wrapper .has-medium-font-size {
    font-size: var(--font--m); }
  .site-main .has-small-font-size, .editor-styles-wrapper .has-small-font-size {
    font-size: var(--font--s); }
  .site-main em, .editor-styles-wrapper em {
    font-style: italic; }
  .site-main p, .editor-styles-wrapper p {
    font-size: var(--font--l);
    margin: 1.5em 0 1em;
    line-height: 1.4; }
    .site-main p a, .editor-styles-wrapper p a {
      font-weight: 700; }
  .site-main ul.wp-block-list, .site-main .lexique-card ul, .site-main .doc-cat-lexique ul, .editor-styles-wrapper ul.wp-block-list, .editor-styles-wrapper .lexique-card ul, .editor-styles-wrapper .doc-cat-lexique ul {
    padding-left: 24px;
    margin-top: 48px;
    margin-bottom: 48px;
    position: relative;
    font-size: var(--font--l);
    list-style: none; }
    .site-main ul.wp-block-list li, .site-main .lexique-card ul li, .site-main .doc-cat-lexique ul li, .editor-styles-wrapper ul.wp-block-list li, .editor-styles-wrapper .lexique-card ul li, .editor-styles-wrapper .doc-cat-lexique ul li {
      margin-bottom: 14px;
      position: relative; }
      .site-main ul.wp-block-list li::before, .site-main .lexique-card ul li::before, .site-main .doc-cat-lexique ul li::before, .editor-styles-wrapper ul.wp-block-list li::before, .editor-styles-wrapper .lexique-card ul li::before, .editor-styles-wrapper .doc-cat-lexique ul li::before {
        content: '';
        position: absolute;
        left: -24px;
        top: 8px;
        width: 6px;
        height: 6px;
        background: var(--color--accent1a);
        border-radius: 10px; }
  .site-main ol.wp-block-list, .site-main .lexique-card ol, .site-main .doc-cat-lexique ol, .editor-styles-wrapper ol.wp-block-list, .editor-styles-wrapper .lexique-card ol, .editor-styles-wrapper .doc-cat-lexique ol {
    padding-left: 24px;
    margin-top: 48px;
    margin-bottom: 48px;
    position: relative;
    list-style: decimal; }
    .site-main ol.wp-block-list li, .site-main .lexique-card ol li, .site-main .doc-cat-lexique ol li, .editor-styles-wrapper ol.wp-block-list li, .editor-styles-wrapper .lexique-card ol li, .editor-styles-wrapper .doc-cat-lexique ol li {
      margin-bottom: 16px;
      position: relative; }
    .site-main ol.wp-block-list ::marker, .site-main .lexique-card ol ::marker, .site-main .doc-cat-lexique ol ::marker, .editor-styles-wrapper ol.wp-block-list ::marker, .editor-styles-wrapper .lexique-card ol ::marker, .editor-styles-wrapper .doc-cat-lexique ol ::marker {
      color: var(--color--accent2a);
      font-weight: 800; }
  .site-main .wp-block-image, .editor-styles-wrapper .wp-block-image {
    margin-top: 48px;
    margin-bottom: 48px; }
    .site-main .wp-block-image img, .editor-styles-wrapper .wp-block-image img {
      border-radius: 12px;
      overflow: hidden;
      display: block; }
  .site-main .wp-block-gallery, .editor-styles-wrapper .wp-block-gallery {
    margin-top: 48px;
    margin-bottom: 48px; }
    .site-main .wp-block-gallery .wp-block-image, .editor-styles-wrapper .wp-block-gallery .wp-block-image {
      margin: 0; }
  .site-main .wp-block-separator, .editor-styles-wrapper .wp-block-separator {
    border-width: 1px;
    margin-top: 64px;
    margin-bottom: 64px; }
  .site-main .wp-block-buttons, .editor-styles-wrapper .wp-block-buttons {
    margin-top: 48px;
    margin-bottom: 48px; }
    .site-main .wp-block-buttons .wp-block-button__link, .editor-styles-wrapper .wp-block-buttons .wp-block-button__link {
      border-radius: 16px;
      padding: 24px 48px;
      background: var(--color--dark);
      font-size: var(--font--l);
      color: var(--color--light); }
      .site-main .wp-block-buttons .wp-block-button__link:hover, .editor-styles-wrapper .wp-block-buttons .wp-block-button__link:hover {
        background: var(--color--grey1); }
  .site-main .wp-block-accordion, .editor-styles-wrapper .wp-block-accordion {
    margin-top: 60px;
    margin-bottom: 60px; }
    .site-main .wp-block-accordion .wp-block-accordion-item, .editor-styles-wrapper .wp-block-accordion .wp-block-accordion-item {
      background: var(--color--light2);
      padding: 32px 32px;
      border-radius: 20px;
      margin-bottom: 32px; }
      .site-main .wp-block-accordion .wp-block-accordion-item.is-open .wp-block-accordion-heading__toggle, .editor-styles-wrapper .wp-block-accordion .wp-block-accordion-item.is-open .wp-block-accordion-heading__toggle {
        color: var(--color--accent1a); }
      .site-main .wp-block-accordion .wp-block-accordion-item.is-open .wp-block-accordion-panel, .editor-styles-wrapper .wp-block-accordion .wp-block-accordion-item.is-open .wp-block-accordion-panel {
        margin-top: 64px; }
    .site-main .wp-block-accordion .wp-block-accordion-heading, .editor-styles-wrapper .wp-block-accordion .wp-block-accordion-heading {
      margin-top: 0px;
      margin-bottom: 0px;
      font-size: var(--font--l); }
  .site-main .wp-block-accordion-heading__toggle:hover .wp-block-accordion-heading__toggle-title, .editor-styles-wrapper .wp-block-accordion-heading__toggle:hover .wp-block-accordion-heading__toggle-title {
    text-decoration: none; }
  .site-main .wp-block-paragraph.is-style-dialogue, .editor-styles-wrapper .wp-block-paragraph.is-style-dialogue {
    padding-left: 64px;
    text-indent: 16px; }
  .site-main .wp-block-paragraph.is-style-sequence, .editor-styles-wrapper .wp-block-paragraph.is-style-sequence {
    text-decoration: underline;
    text-decoration-thickness: 1px;
    text-underline-offset: 2px; }
  .site-main .wp-block-group.is-style-encadre, .editor-styles-wrapper .wp-block-group.is-style-encadre {
    padding: 32px;
    border-radius: 20px;
    border: 1px solid var(--color--dark2); }
  .site-main .bloc-miseenavant, .editor-styles-wrapper .bloc-miseenavant {
    background: var(--color--light2);
    padding: 40px 32px;
    border-radius: 20px;
    margin-top: 48px;
    margin-bottom: 48px; }
    .site-main .bloc-miseenavant h4, .editor-styles-wrapper .bloc-miseenavant h4 {
      font-size: var(--font--l);
      font-weight: 900;
      color: var(--color--accent1a); }
      .site-main .bloc-miseenavant h4:first-of-type, .editor-styles-wrapper .bloc-miseenavant h4:first-of-type {
        margin-top: 0; }
    .site-main .bloc-miseenavant p:last-of-type, .editor-styles-wrapper .bloc-miseenavant p:last-of-type {
      margin-bottom: 0; }
    .site-main .bloc-miseenavant:first-child, .editor-styles-wrapper .bloc-miseenavant:first-child {
      margin-top: 0; }
  .site-main .bloc-chapo, .editor-styles-wrapper .bloc-chapo {
    font-size: var(--font--lll);
    font-weight: 800; }
  .site-main .big-pills, .editor-styles-wrapper .big-pills {
    margin: 40px 0;
    padding: 0;
    display: flex;
    gap: 32px;
    flex-wrap: wrap; }
    .site-main .big-pills a, .editor-styles-wrapper .big-pills a {
      color: var(--color--dark);
      text-decoration: none; }
    .site-main .big-pills .big-pill, .editor-styles-wrapper .big-pills .big-pill {
      padding: 16px 40px 16px 16px;
      border-radius: 16px;
      background: var(--color--light2);
      display: grid;
      grid-template-columns: 112px auto;
      flex-wrap: nowrap;
      gap: 24px;
      align-items: center; }
    .site-main .big-pills h6, .editor-styles-wrapper .big-pills h6 {
      font-size: var(--font--m);
      font-weight: 800;
      margin-top: 0;
      margin-bottom: 5px;
      text-transform: none; }
    .site-main .big-pills .pill-meta, .editor-styles-wrapper .big-pills .pill-meta {
      display: block;
      font-size: var(--font--xs);
      color: var(--color--grey3); }
    .site-main .big-pills img, .editor-styles-wrapper .big-pills img {
      display: block;
      height: 64px;
      width: auto;
      aspect-ratio: 1 / 1;
      object-fit: cover;
      object-position: center;
      border-radius: 100px;
      margin-left: 8px; }
  .site-main .big-pills.big-pills-film img, .editor-styles-wrapper .big-pills.big-pills-film img {
    width: 112px;
    height: auto;
    aspect-ratio: 16 / 9;
    border-radius: 8px;
    margin-left: 0; }
  .site-main .block-docs, .editor-styles-wrapper .block-docs {
    margin-top: 56px;
    margin-bottom: 56px;
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr;
    gap: 16px; }
    .site-main .block-docs .doc-card, .editor-styles-wrapper .block-docs .doc-card {
      padding: 16px 16px 24px; }
      .site-main .block-docs .doc-card h3.doc-title, .editor-styles-wrapper .block-docs .doc-card h3.doc-title {
        font-size: var(--font--m);
        margin-bottom: 4px; }
      .site-main .block-docs .doc-card .doc-film-title, .editor-styles-wrapper .block-docs .doc-card .doc-film-title {
        margin-top: 5px;
        color: var(--color--grey3);
        font-size: var(--font--m); }
      .site-main .block-docs .doc-card .doc-meta, .editor-styles-wrapper .block-docs .doc-card .doc-meta {
        font-size: var(--font--s); }
      .site-main .block-docs .doc-card img, .editor-styles-wrapper .block-docs .doc-card img {
        object-fit: cover; }
  .site-main .doc-card, .editor-styles-wrapper .doc-card {
    padding: 24px 32px 32px;
    border-radius: 16px;
    background: var(--color--light);
    border: 1px solid var(--color--grey3);
    height: 100%; }
    .site-main .doc-card a, .editor-styles-wrapper .doc-card a {
      text-decoration: none; }
    .site-main .doc-card.js-open-doc-modal, .editor-styles-wrapper .doc-card.js-open-doc-modal {
      cursor: pointer; }
    .site-main .doc-card figure, .editor-styles-wrapper .doc-card figure {
      position: relative;
      aspect-ratio: 16 / 8;
      overflow: hidden;
      background: var(--color--light2);
      display: flex;
      align-items: center;
      justify-content: center;
      border-radius: 4px; }
      .site-main .doc-card figure img, .editor-styles-wrapper .doc-card figure img {
        position: absolute;
        inset: 0;
        width: 100%;
        height: 100%;
        object-fit: cover;
        object-position: center;
        display: block;
        filter: brightness(0.7); }
      .site-main .doc-card figure .icon-light, .site-main .doc-card figure .icon-dark, .editor-styles-wrapper .doc-card figure .icon-light, .editor-styles-wrapper .doc-card figure .icon-dark {
        width: 30px;
        height: 30px;
        background-repeat: no-repeat;
        background-color: var(--color--dark);
        transition: all 200ms ease; }
      .site-main .doc-card figure .icon-light, .editor-styles-wrapper .doc-card figure .icon-light {
        background-color: var(--color--light); }
      .site-main .doc-card figure .icon-pdf, .editor-styles-wrapper .doc-card figure .icon-pdf {
        mask: url("img/icons/icon-pdf.svg") no-repeat center/contain; }
      .site-main .doc-card figure .icon-video, .editor-styles-wrapper .doc-card figure .icon-video {
        mask: url("img/icons/icon-video.svg") no-repeat center/contain; }
      .site-main .doc-card figure .icon-galerie, .editor-styles-wrapper .doc-card figure .icon-galerie {
        mask: url("img/icons/icon-gallery.svg") no-repeat center/contain; }
      .site-main .doc-card figure .icon-texte, .editor-styles-wrapper .doc-card figure .icon-texte {
        mask: url("img/icons/icon-text.svg") no-repeat center/contain; }
    .site-main .doc-card figure:hover .icon-light, .site-main .doc-card figure:hover .icon-dark, .site-main .doc-card figure:focus-visible .icon-light, .site-main .doc-card figure:focus-visible .icon-dark, .editor-styles-wrapper .doc-card figure:hover .icon-light, .editor-styles-wrapper .doc-card figure:hover .icon-dark, .editor-styles-wrapper .doc-card figure:focus-visible .icon-light, .editor-styles-wrapper .doc-card figure:focus-visible .icon-dark {
      scale: 1.2; }
    .site-main .doc-card figure:hover img, .site-main .doc-card figure:focus-visible img, .editor-styles-wrapper .doc-card figure:hover img, .editor-styles-wrapper .doc-card figure:focus-visible img {
      scale: 1.05; }
  .site-main .block-parcours, .editor-styles-wrapper .block-parcours {
    margin-top: 32px;
    margin-bottom: 48px; }
    .site-main .block-parcours .grid, .editor-styles-wrapper .block-parcours .grid {
      display: grid;
      grid-template-columns: 1fr 1fr 1fr;
      gap: 32px; }
  .site-main .activite-card, .site-main .parcours-card, .editor-styles-wrapper .activite-card, .editor-styles-wrapper .parcours-card {
    background: var(--color--light);
    border: solid 1px var(--color--grey4);
    border-radius: 16px;
    padding: 20px; }
    .site-main .activite-card .image, .site-main .parcours-card .image, .editor-styles-wrapper .activite-card .image, .editor-styles-wrapper .parcours-card .image {
      position: relative;
      background: var(--color--light2);
      border-radius: 12px;
      overflow: hidden;
      aspect-ratio: 32 / 15; }
      .site-main .activite-card .image a, .site-main .activite-card .image img, .site-main .parcours-card .image a, .site-main .parcours-card .image img, .editor-styles-wrapper .activite-card .image a, .editor-styles-wrapper .activite-card .image img, .editor-styles-wrapper .parcours-card .image a, .editor-styles-wrapper .parcours-card .image img {
        position: absolute;
        inset: 0; }
      .site-main .activite-card .image img, .site-main .parcours-card .image img, .editor-styles-wrapper .activite-card .image img, .editor-styles-wrapper .parcours-card .image img {
        object-fit: cover;
        object-position: center;
        height: 100%;
        width: 100%; }
      .site-main .activite-card .image:hover img, .site-main .activite-card .image:focus-visible img, .site-main .parcours-card .image:hover img, .site-main .parcours-card .image:focus-visible img, .editor-styles-wrapper .activite-card .image:hover img, .editor-styles-wrapper .activite-card .image:focus-visible img, .editor-styles-wrapper .parcours-card .image:hover img, .editor-styles-wrapper .parcours-card .image:focus-visible img {
        scale: 1.05; }
    .site-main .activite-card .card-content, .site-main .parcours-card .card-content, .editor-styles-wrapper .activite-card .card-content, .editor-styles-wrapper .parcours-card .card-content {
      padding: 20px; }
      .site-main .activite-card .card-content a, .site-main .parcours-card .card-content a, .editor-styles-wrapper .activite-card .card-content a, .editor-styles-wrapper .parcours-card .card-content a {
        color: var(--color--dark);
        text-decoration: none; }
    .site-main .activite-card .card-pills, .site-main .parcours-card .card-pills, .editor-styles-wrapper .activite-card .card-pills, .editor-styles-wrapper .parcours-card .card-pills {
      display: flex;
      flex-wrap: wrap;
      gap: 15px;
      margin-top: 30px; }
      .site-main .activite-card .card-pills .pill, .site-main .parcours-card .card-pills .pill, .editor-styles-wrapper .activite-card .card-pills .pill, .editor-styles-wrapper .parcours-card .card-pills .pill {
        color: var(--color--dark2);
        background: var(--color--grey4);
        padding: 14px 16px;
        font-size: var(--font--s); }
  .site-main .lexique-card, .editor-styles-wrapper .lexique-card {
    display: grid;
    grid-template-columns: 3fr 8fr 80px;
    gap: 32px;
    padding: 40px 32px;
    border-radius: 20px;
    background: var(--color--light2);
    margin-bottom: 32px;
    cursor: pointer; }
    .site-main .lexique-card .lexique-title, .editor-styles-wrapper .lexique-card .lexique-title {
      font-size: var(--font--l);
      margin-top: 0; }
      .site-main .lexique-card .lexique-title a, .editor-styles-wrapper .lexique-card .lexique-title a {
        text-decoration: none;
        color: var(--color--dark); }
    .site-main .lexique-card p:first-child, .editor-styles-wrapper .lexique-card p:first-child {
      margin-top: 0; }
    .site-main .lexique-card p:last-child, .editor-styles-wrapper .lexique-card p:last-child {
      margin-bottom: 0; }
    .site-main .lexique-card img, .editor-styles-wrapper .lexique-card img {
      max-width: 775px;
      height: auto;
      width: 100%; }
    .site-main .lexique-card .js-video-player, .editor-styles-wrapper .lexique-card .js-video-player {
      max-width: 775px; }
    .site-main .lexique-card .wp-caption, .editor-styles-wrapper .lexique-card .wp-caption {
      width: auto !important; }
    .site-main .lexique-card .toggle, .editor-styles-wrapper .lexique-card .toggle {
      text-align: right; }
  .site-main .lexique-content-wrapper, .editor-styles-wrapper .lexique-content-wrapper {
    position: relative;
    max-height: 48px;
    overflow: hidden;
    transition: max-height 200ms ease; }
  .site-main .lexique-content-wrapper.collapsed .lexique-fade, .editor-styles-wrapper .lexique-content-wrapper.collapsed .lexique-fade {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 35px;
    background: linear-gradient(to bottom, rgba(237, 237, 234, 0), #EDEDEA);
    pointer-events: none; }
  .site-main .lexique-content-wrapper.expanded .lexique-fade, .editor-styles-wrapper .lexique-content-wrapper.expanded .lexique-fade {
    display: none; }
  .site-main .lexique-toggle-btn, .editor-styles-wrapper .lexique-toggle-btn {
    cursor: pointer;
    border: none;
    background: transparent;
    font-size: 32px;
    font-weight: 500; }
  .site-main .block-lexique, .editor-styles-wrapper .block-lexique {
    margin-top: 64px;
    margin-bottom: 64px; }
  .site-main .block-entretien, .editor-styles-wrapper .block-entretien {
    margin-top: 64px;
    margin-bottom: 64px; }
  .site-main .entretien-item, .editor-styles-wrapper .entretien-item {
    max-width: 600px; }
    .site-main .entretien-item figure, .editor-styles-wrapper .entretien-item figure {
      border-radius: 16px;
      overflow: hidden;
      position: relative;
      aspect-ratio: 16 / 9;
      width: 100%;
      background: var(--color--grey1); }
      .site-main .entretien-item figure img, .editor-styles-wrapper .entretien-item figure img {
        display: block;
        position: absolute;
        inset: 0;
        object-fit: cover;
        object-position: center;
        height: 100%;
        width: 100%;
        transition: all 200ms ease; }
      .site-main .entretien-item figure::after, .editor-styles-wrapper .entretien-item figure::after {
        content: '';
        position: absolute;
        top: 50%;
        left: 50%;
        translate: -50% -50%;
        width: 80px;
        height: 72px;
        border-radius: 16px;
        background: var(--color--light) url("img/icons/icon-play.svg") no-repeat center/14px 16px;
        transition: all 200ms ease;
        opacity: 0;
        scale: .8;
        transition: all 200ms ease; }
      .site-main .entretien-item figure:hover img, .editor-styles-wrapper .entretien-item figure:hover img {
        opacity: .6; }
      .site-main .entretien-item figure:hover::after, .editor-styles-wrapper .entretien-item figure:hover::after {
        opacity: 1;
        scale: 1; }
    .site-main .entretien-item .js-open-doc-modal, .editor-styles-wrapper .entretien-item .js-open-doc-modal {
      cursor: pointer; }
    .site-main .entretien-item span.video-duration, .editor-styles-wrapper .entretien-item span.video-duration {
      position: absolute;
      top: 20px;
      right: 20px;
      color: var(--color--light);
      background: var(--color--dark2);
      padding: 14px 16px;
      border-radius: 16px;
      font-size: var(--font--s); }
    .site-main .entretien-item .entretien-title, .editor-styles-wrapper .entretien-item .entretien-title {
      margin-top: 16px; }

html {
  scrollbar-gutter: stable;
  scroll-behavior: smooth; }

body.noscroll {
  overflow: hidden; }

* {
  text-decoration-thickness: 1px !important;
  text-underline-offset: 3px; }

.container {
  max-width: var(--container--width);
  margin: 0 auto;
  padding: 0 50px; }

a, a:visited, a:link {
  color: var(--color--dark);
  text-decoration-color: var(--color--accent1a);
  text-underline-offset: 3px;
  text-decoration-thickness: 1px; }

button, input, textarea, submit {
  font-family: var(--font--main); }

button, img, a, a::before, a::after, button::before, button::after {
  transition: all 200ms ease; }

strong {
  font-weight: 800; }

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

a.btn, button.btn, submit.btn, input.btn {
  text-decoration: none;
  border-radius: 16px;
  padding: 24px 56px;
  display: inline-block;
  color: var(--color--light);
  background: var(--color--dark2);
  font-weight: 600;
  border: 1px solid var(--color--dark2);
  font-size: var(--font--m);
  cursor: pointer; }
  a.btn:hover, button.btn:hover, submit.btn:hover, input.btn:hover {
    background: var(--color--grey2);
    border-color: var(--color--grey2);
    color: var(--color--light); }
a.btn-small, button.btn-small, submit.btn-small, input.btn-small {
  padding: 16px 32px;
  font-size: var(--font--s); }
a.btn-secondary, button.btn-secondary, submit.btn-secondary, input.btn-secondary {
  color: var(--color--dark);
  background: var(--color--light2);
  border-color: var(--color--light2); }
a.btn-alert, button.btn-alert, submit.btn-alert, input.btn-alert {
  color: #BA0003;
  background: var(--color--light);
  border-color: var(--color--grey4); }
  a.btn-alert:hover, button.btn-alert:hover, submit.btn-alert:hover, input.btn-alert:hover {
    color: var(--color--light);
    background: #BA0003;
    border-color: #BA0003; }
a.btn-light, button.btn-light, submit.btn-light, input.btn-light {
  color: var(--color--dark);
  background: var(--color--light);
  border-color: var(--color--light); }
a.btn-arrow, button.btn-arrow, submit.btn-arrow, input.btn-arrow {
  position: relative;
  display: inline-flex;
  justify-content: center;
  align-items: center;
  gap: 15px; }
  a.btn-arrow::after, button.btn-arrow::after, submit.btn-arrow::after, input.btn-arrow::after {
    content: '';
    display: block;
    width: 15px;
    height: 13px;
    background: var(--color--accent1a);
    mask: url("img/icons/icon-arrow.svg") no-repeat center/contain; }
  a.btn-arrow:hover::after, button.btn-arrow:hover::after, submit.btn-arrow:hover::after, input.btn-arrow:hover::after {
    background: var(--color--accent2a); }
a.btn-arrow-back, button.btn-arrow-back, submit.btn-arrow-back, input.btn-arrow-back {
  position: relative;
  display: inline-flex;
  justify-content: center;
  align-items: center;
  gap: 15px; }
  a.btn-arrow-back::before, button.btn-arrow-back::before, submit.btn-arrow-back::before, input.btn-arrow-back::before {
    content: '';
    display: block;
    width: 15px;
    height: 13px;
    background: var(--color--accent1a);
    mask: url("img/icons/icon-arrow.svg") no-repeat center/contain;
    transform: rotate(180deg); }
  a.btn-arrow-back:hover::before, button.btn-arrow-back:hover::before, submit.btn-arrow-back:hover::before, input.btn-arrow-back:hover::before {
    background: var(--color--accent2a); }
a.btn-arrow.btn-light::after, button.btn-arrow.btn-light::after, submit.btn-arrow.btn-light::after, input.btn-arrow.btn-light::after {
  background: var(--color--dark); }
a.btn-arrow.btn-light:hover::after, button.btn-arrow.btn-light:hover::after, submit.btn-arrow.btn-light:hover::after, input.btn-arrow.btn-light:hover::after {
  background: var(--color--accent1a); }
a.btn-copy-code, button.btn-copy-code, submit.btn-copy-code, input.btn-copy-code {
  background: transparent;
  border: 0;
  padding: 0;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  gap: 8px; }
  a.btn-copy-code::before, button.btn-copy-code::before, submit.btn-copy-code::before, input.btn-copy-code::before {
    content: '';
    width: 16px;
    height: 16px;
    background: var(--color--dark);
    mask: url("img/icons/icon-copy.svg") no-repeat center/contain;
    display: inline-block; }

.pill, a.pill {
  border-radius: 12px;
  padding: 18px 24px;
  font-weight: 600;
  text-decoration: none;
  color: var(--color--light);
  background: var(--color--dark2); }
  .pill:hover, .pill:focus-visible, a.pill:hover, a.pill:focus-visible {
    background: var(--color--grey2); }

/* SEARCHFORM */
.searchform .search-input-wrapper {
  position: relative;
  width: 100%; }
  .searchform .search-input-wrapper::before {
    content: '';
    display: block;
    position: absolute;
    left: 40px;
    top: 50%;
    transform: translateY(-50%);
    width: 16px;
    height: 16px;
    background-color: var(--color--accent1a);
    mask: url("img/icons/icon-search.svg") no-repeat center/contain;
    z-index: 1;
    pointer-events: none; }
  .searchform .search-input-wrapper input[type="text"],
  .searchform .search-input-wrapper input[type="search"] {
    border: 0;
    border-radius: 16px;
    padding: 24px 40px 24px 80px;
    background: var(--color--light);
    width: 100%;
    max-width: 600px;
    font-size: var(--font--m);
    transition: all 500ms ease-in-out; }
    .searchform .search-input-wrapper input[type="text"]:focus,
    .searchform .search-input-wrapper input[type="search"]:focus {
      outline: none;
      max-width: 775px; }

#header-search .searchform .search-input-wrapper input[type="text"],
#header-search .searchform .search-input-wrapper input[type="search"] {
  max-width: 775px; }

/* HEADER */
#header {
  background: var(--color--dark2);
  position: relative;
  z-index: 1500;
  position: sticky;
  top: 0; }
  #header .cols {
    display: grid;
    grid-template-columns: 200px auto 200px;
    align-items: center;
    width: 100%; }
  #header #branding {
    text-align: center; }

.admin-bar #header {
  top: 32px; }

#header-search .home-hero-section {
  position: absolute;
  z-index: 1300;
  left: 0;
  right: 0;
  opacity: 0;
  pointer-events: none;
  transform: translateY(-10%);
  transition: opacity 400ms ease, transform 400ms ease; }
#header-search .overlay {
  position: fixed;
  z-index: 1200;
  inset: 0;
  background: var(--color--dark);
  transition: opacity 400ms ease;
  opacity: 0;
  pointer-events: none; }

#header-search.active .home-hero-section {
  opacity: 1;
  pointer-events: auto;
  transform: translateY(0); }
#header-search.active .overlay {
  opacity: .9;
  pointer-events: auto; }

#menu-toggle, #menu-close {
  padding: 25px 60px; }
  #menu-toggle button, #menu-close button {
    display: flex;
    gap: 15px;
    background: var(--color--grey1);
    color: var(--color--light);
    text-transform: uppercase;
    border: 0;
    padding: 20px 25px;
    border-radius: 16px;
    font-weight: 600;
    font-size: var(--font--s);
    cursor: pointer; }
    #menu-toggle button::before, #menu-close button::before {
      content: '';
      width: 16px;
      height: 16px;
      background: var(--color--light); }
    #menu-toggle button:hover, #menu-toggle button:focus-visible, #menu-close button:hover, #menu-close button:focus-visible {
      background: var(--color--grey2); }

#menu-toggle button::before {
  mask: url("img/icons/icon-burger.svg") no-repeat center/contain; }

#menu-close button::before {
  mask: url("img/icons/icon-close.svg") no-repeat center/contain; }

#menu1 {
  pointer-events: none;
  visibility: hidden;
  position: fixed;
  inset: 0;
  z-index: 2500; }
  #menu1 .overlay {
    position: absolute;
    inset: 0;
    background: var(--color--dark);
    transition: opacity 400ms ease;
    opacity: 0; }
  #menu1 .wrapper {
    position: relative;
    height: 100%;
    background: var(--color--dark);
    max-width: 1200px;
    transition: all 400ms ease;
    translate: -100% 0;
    overflow-y: scroll;
    overscroll-behavior: contain;
    scrollbar-width: none; }
    #menu1 .wrapper::-webkit-scrollbar {
      display: none; }
  #menu1 .menu {
    padding: 40px 60px 60px; }
  #menu1 .cols {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 80px; }

#menu1.active {
  pointer-events: auto;
  visibility: visible; }
  #menu1.active .overlay {
    opacity: .9; }
  #menu1.active .wrapper {
    translate: 0 0; }

.admin-bar #menu1 {
  top: 32px; }

#menu1 ul {
  font-family: var(--font--main); }
  #menu1 ul li {
    margin-top: 24px; }
  #menu1 ul a {
    font-size: 34px;
    text-decoration: none;
    font-weight: 900;
    color: var(--color--light); }
    #menu1 ul a:hover {
      color: var(--color--grey4); }
  #menu1 ul li.first {
    margin-top: 64px; }
  #menu1 ul li.category a {
    pointer-events: none;
    color: var(--color--accent1a);
    font-size: var(--font--s);
    text-transform: uppercase;
    font-weight: 700; }
  #menu1 ul li.small a {
    font-size: var(--font--m);
    font-weight: 600; }

#menu2 {
  display: flex;
  align-items: center;
  gap: 20px; }
  #menu2 a.icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 56px;
    height: 56px;
    border-radius: 100px;
    background-color: var(--color--grey1); }
    #menu2 a.icon::before {
      content: '';
      width: 16px;
      height: 20px;
      background-color: var(--color--light); }
    #menu2 a.icon:hover, #menu2 a.icon:focus-visible {
      background-color: var(--color--grey2);
      outline: none; }
    #menu2 a.icon.icon-search::before {
      mask: url("img/icons/icon-search.svg") no-repeat center/contain; }
    #menu2 a.icon.icon-close {
      display: none; }
      #menu2 a.icon.icon-close::before {
        mask: url("img/icons/icon-close.svg") no-repeat center/contain; }
    #menu2 a.icon.icon-account::before {
      mask: url("img/icons/icon-user.svg") no-repeat center/contain; }

/* MAIN */
#main {
  min-height: 400px; }

.content-wrapper {
  padding-top: 100px;
  padding-bottom: 100px; }

.content-grid {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 40px; }

/* HOMEPAGE */
.home-hero-section, .page-header {
  position: relative;
  background-size: cover;
  background-position: center;
  color: var(--color--light);
  background-color: var(--color--dark2); }
  .home-hero-section h1, .home-hero-section h2, .page-header h1, .page-header h2 {
    margin-top: 0 !important; }
  .home-hero-section a, .page-header a {
    color: var(--color--light); }
  .home-hero-section .container, .page-header .container {
    position: relative; }
  .home-hero-section .grid, .page-header .grid {
    height: 100%;
    display: flex;
    align-items: end;
    align-content: end; }
  .home-hero-section .wrapper, .page-header .wrapper {
    width: 100%; }
  .home-hero-section .gradient, .page-header .gradient {
    position: absolute;
    inset: 0;
    background: linear-gradient(90deg, rgba(22, 23, 27, 0.98) 20%, rgba(22, 23, 27, 0.4) 100%); }
  .home-hero-section .pills, .page-header .pills {
    display: flex;
    flex-wrap: wrap;
    gap: 25px;
    margin: 40px 0; }
    .home-hero-section .pills .pill, .page-header .pills .pill {
      border: solid 1px var(--color--grey2);
      padding: 15px 40px;
      border-radius: 16px; }
  .home-hero-section .searchform, .page-header .searchform {
    padding-top: 30px; }

.home-hero-section {
  min-height: 500px; }
  .home-hero-section .gradient {
    position: absolute;
    inset: 0;
    background: linear-gradient(90deg, rgba(22, 23, 27, 0.98) 20%, rgba(22, 23, 27, 0) 75%); }

.page-header {
  padding-bottom: 50px; }

.home-latest-posts-section .grid {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 40px; }
.home-latest-posts-section .post-card {
  padding: 16px;
  border-radius: 20px;
  border: solid 1px var(--color--grey4); }
  .home-latest-posts-section .post-card img {
    aspect-ratio: 16 / 7;
    object-fit: cover;
    object-position: center;
    border-radius: 12px; }
  .home-latest-posts-section .post-card .content {
    padding: 0 24px 24px; }
    .home-latest-posts-section .post-card .content p {
      line-height: 1.6; }

.home-explore-section {
  text-align: center; }
  .home-explore-section h2 {
    margin-bottom: .25em; }
  .home-explore-section .container {
    max-width: 1300px; }
  .home-explore-section .thematiques-pills {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
    justify-content: center;
    padding-top: 40px; }

.home-films-section .grid {
  padding-top: 40px;
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 40px 60px; }
.home-films-section .actions {
  padding-top: 80px;
  text-align: right; }

/* POST FILTERS SEARCH FORM */
.search-form-wrapper {
  background: var(--color--dark2);
  color: var(--color--light);
  padding: 40px 0; }

.custom-search-form {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 8px; }
  .custom-search-form .form-fields {
    display: flex;
    flex-wrap: wrap;
    margin-left: -8px; }
    .custom-search-form .form-fields .form-field {
      padding: 8px;
      /* Fallback width if none is specified in the array */
      width: var(--field-width, auto); }
      .custom-search-form .form-fields .form-field input[type="search"], .custom-search-form .form-fields .form-field select {
        width: 100%;
        max-width: none; }
  .custom-search-form .form-field--submit {
    display: flex;
    align-items: center;
    gap: 16px; }
  .custom-search-form button.form-reset {
    border: 0;
    background: var(--color--dark2) url("img/icons/icon-reset.svg") no-repeat center;
    background-size: 18px 18px;
    border-radius: 100px;
    width: 25px;
    height: 40px;
    cursor: pointer; }
    .custom-search-form button.form-reset:hover {
      opacity: .5; }

/* 1. Base styles for text inputs, standard selects, and Select2 containers inside .form-fields */
.search-form-wrapper .form-fields input[type="search"],
.search-form-wrapper .form-fields input[type="text"],
.search-form-wrapper .form-fields select,
.search-form-wrapper .form-fields .select2-container .select2-selection--single,
.search-form-wrapper .form-fields .select2-container .select2-selection--multiple,
.search-form-wrapper button[type="submit"] {
  background: var(--color--grey1);
  color: var(--color--light);
  padding: 15px 30px;
  border: 0;
  border-radius: 12px;
  height: auto;
  /* Prevents Select2 default fixed height from clipping padding */
  min-height: 64px;
  box-sizing: border-box;
  font-size: 15px;
  display: flex;
  align-items: center;
  border: solid 1px var(--color--grey1); }

.select2-container--default .select2-dropdown {
  margin-top: 32px !important; }

.select2-container--default .select2-selection--single .select2-selection__clear {
  color: var(--color--light); }

.search-form-wrapper .form-fields .select2-container .select2-selection--single,
.search-form-wrapper .form-fields .select2-container .select2-selection--multiple {
  padding-right: 60px; }

.search-form-wrapper button[type="submit"] {
  background: var(--color--dark2);
  border-color: var(--color--grey2); }
  .search-form-wrapper button[type="submit"]:hover {
    background: var(--color--grey2);
    border-color: var(--color--grey2); }

.search-form-wrapper .form-fields input[type="search"] {
  padding-left: 60px;
  position: relative; }

.search-form-wrapper .form-fields .field-s {
  position: relative; }
  .search-form-wrapper .form-fields .field-s::after {
    content: '';
    position: absolute;
    left: 30px;
    top: 50%;
    transform: translateY(-50%);
    width: 16px;
    height: 16px;
    background: var(--color--light);
    mask: url("img/icons/icon-search.svg") no-repeat center/contain; }

/* 2. Style text color inside Select2 rendered selections and placeholder text */
.search-form-wrapper .form-fields .select2-container .select2-selection__rendered,
.search-form-wrapper .form-fields input::placeholder,
.search-form-wrapper .form-fields textarea::placeholder,
.search-form-wrapper .form-fields .select2-container .select2-selection__placeholder {
  color: var(--color--light2) !important;
  line-height: normal !important;
  padding: 0 !important; }

/* 3. Style the Select2 arrow icon to match */
.search-form-wrapper .form-fields .select2-container .select2-selection__arrow {
  height: 100% !important;
  right: 25px !important;
  background: var(--color--light);
  mask: url("img/icons/icon-chevron.svg") no-repeat center/contain;
  width: 14px; }

.search-form-wrapper .form-fields .select2-container .select2-selection__arrow b {
  display: none; }

/* 4. Boolean wrapper styling (matching your requirements) */
.search-form-wrapper .form-fields .form-field--taxonomy_multi .checkbox-options {
  display: flex;
  gap: 16px; }
  .search-form-wrapper .form-fields .form-field--taxonomy_multi .checkbox-options label {
    margin: 0;
    gap: 8px; }

.search-form-wrapper .form-fields .form-field--boolean label, .search-form-wrapper .form-fields .form-field--taxonomy_multi label {
  font-size: 15px;
  background: var(--color--grey1);
  color: var(--color--light);
  padding: 15px 30px;
  min-height: 64px;
  border: 0;
  border-radius: 12px;
  display: flex;
  align-items: center; }

.search-form-wrapper .form-fields .form-field--boolean .checkbox-label {
  color: var(--color--light);
  margin: 0;
  cursor: pointer;
  display: flex;
  align-items: center;
  gap: 12px;
  width: 100%; }

.archive-view-switcher {
  display: flex;
  margin-bottom: 32px; }
  .archive-view-switcher .btn-list, .archive-view-switcher .btn-map {
    padding: 16px 56px;
    background: var(--color--grey1);
    color: var(--color--grey4);
    text-decoration: none;
    display: flex;
    gap: 8px;
    align-items: center; }
    .archive-view-switcher .btn-list span, .archive-view-switcher .btn-map span {
      height: 16px;
      width: 16px;
      background: var(--color--grey4); }
  .archive-view-switcher .btn-list {
    border-radius: 16px 0 0 16px; }
    .archive-view-switcher .btn-list span {
      mask: url("img/icons/icon-list.svg") no-repeat center/contain; }
  .archive-view-switcher .btn-map {
    border-radius: 0 16px 16px 0; }
    .archive-view-switcher .btn-map span {
      mask: url("img/icons/icon-map.svg") no-repeat center/contain; }
  .archive-view-switcher .btn-on {
    background: var(--color--light);
    color: var(--color--dark); }
    .archive-view-switcher .btn-on span {
      background: var(--color--accent1a); }
  .archive-view-switcher .btn-off:hover {
    background: var(--color--grey2); }

.results_num {
  color: var(--color--grey3); }

.orderby-wrapper .grid {
  margin: 24px 0 -56px;
  display: grid;
  grid-template-columns: auto auto;
  gap: 50px;
  justify-content: space-between;
  align-items: center; }
.orderby-wrapper .sort-form {
  padding: 8px 16px;
  border-radius: 12px;
  background: var(--color--light2);
  font-weight: 600;
  color: var(--color--grey3);
  font-size: var(--font--s);
  display: grid;
  grid-template-columns: auto auto;
  gap: 8px;
  align-items: center; }
  .orderby-wrapper .sort-form label {
    margin: 0; }
  .orderby-wrapper .sort-form select {
    border: 0;
    background: transparent;
    font-family: var(--font--main);
    font-size: var(--font--s);
    font-weight: 600;
    color: var(--color--dark);
    padding: 0; }

/* Masqué par défaut si le champ a la classe .hidden */
.search-form-wrapper .form-fields .form-field.hidden {
  display: none; }

/* Devient visible dès qu'on clique sur le bouton */
.search-form-wrapper .form-fields .form-field.hidden.is-visible {
  display: block !important;
  /* ou flex / grid selon le rendu souhaité */ }

#toggle-filters-btn {
  padding: 0;
  background: transparent;
  border: 0;
  color: var(--color--grey4);
  margin: 16px 0 0 8px;
  font-weight: 500;
  display: flex;
  align-items: center;
  gap: 5px; }
  #toggle-filters-btn::after {
    content: '';
    display: block;
    width: 8px;
    height: 8px;
    background: var(--color--grey4);
    mask: url("img/icons/icon-chevron.svg") no-repeat center/contain; }

#toggle-filters-btn[aria-expanded="true"]::after {
  transform: rotate(180deg); }

/* Espacement du bloc contenant le bouton sous le formulaire */
.search-form-wrapper .search-form-actions {
  margin-top: 16px;
  display: flex;
  justify-content: flex-start;
  /* ou center selon vos préférences */ }

#map-films {
  margin-top: -56px;
  min-height: 600px;
  height: 80vh;
  max-height: 956px;
  border-radius: 20px;
  width: 100%; }
  #map-films .marker-cluster {
    background-color: var(--color--dark2); }
    #map-films .marker-cluster div {
      background: var(--color--dark2);
      color: var(--color--light);
      font-family: var(--font--main);
      font-weight: 800; }
  #map-films .leaflet-popup-content {
    min-width: 300px; }
  #map-films .map-popup-card a {
    text-decoration: none; }
  #map-films .map-popup-card .cols {
    display: grid;
    grid-template-columns: 1fr 2fr;
    gap: 16px;
    align-items: center; }
  #map-films .map-popup-card .image img {
    aspect-ratio: 4 / 3;
    object-fit: cover;
    object-position: center;
    border-radius: 8px; }
  #map-films .map-popup-card .content .map-popup-town {
    font-size: var(--font--xs);
    margin: 0;
    font-weight: 500;
    color: var(--color--dark2);
    display: flex;
    gap: 4px;
    align-items: center; }
    #map-films .map-popup-card .content .map-popup-town span {
      height: 10px;
      width: 10px;
      background: var(--color--accent1a);
      mask: url("img/icons/icon-marker.svg") no-repeat center/contain; }
  #map-films .map-popup-card .content .map-popup-title {
    font-size: var(--font--m);
    margin: 12px 0 4px; }
  #map-films .map-popup-card .content .map-popup-director {
    font-size: var(--font--xs);
    margin: 0;
    font-weight: 500;
    color: var(--color--grey3); }

/* SINGLE FILM */
.film-section, .home-section {
  padding: 100px 0; }
  .film-section h2:first-of-type, .home-section h2:first-of-type {
    margin-top: 0; }

.section-mid {
  background: var(--color--light2); }

.section-dark {
  background: var(--color--dark2);
  color: var(--color--light); }
  .section-dark a:not(.btn) {
    color: var(--color--light); }

#film-subnav {
  position: sticky;
  z-index: 1100;
  top: 109px;
  background: var(--color--light2);
  padding: 32px 0 32px; }
  #film-subnav ul {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 20px; }
    #film-subnav ul li a {
      text-decoration: none;
      font-weight: 600;
      color: var(--color--grey2); }
    #film-subnav ul li::after {
      content: '';
      display: block;
      background: var(--color--accent2a);
      width: 6px;
      height: 6px;
      position: absolute;
      bottom: -15px;
      left: 50%;
      translate: -50% -8px;
      border-radius: 20px;
      opacity: 0;
      transition: all 200ms ease; }
    #film-subnav ul li.active {
      position: relative; }
      #film-subnav ul li.active a {
        font-weight: 800;
        color: var(--color--dark2); }
      #film-subnav ul li.active::after {
        opacity: 1;
        translate: -50% 0; }

.admin-bar #film-subnav {
  top: 141px; }

.film-hero {
  position: relative;
  min-height: 700px;
  padding: 40px 0;
  background-size: cover;
  background-position: center;
  color: var(--color--light); }
  .film-hero a {
    color: var(--color--light); }
  .film-hero .gradient {
    position: absolute;
    inset: 0;
    background: linear-gradient(90deg, rgba(22, 23, 27, 0.98) 20%, rgba(22, 23, 27, 0) 100%); }
  .film-hero .container {
    position: relative; }
  .film-hero .grid {
    height: 100%;
    display: grid;
    grid-template-rows: auto 1fr;
    align-items: end; }
  .film-hero .film-details {
    padding: 0 0 100px; }
    .film-hero .film-details .infos {
      display: flex;
      gap: 5px;
      padding-bottom: 60px; }
      .film-hero .film-details .infos img {
        max-height: 16px;
        width: auto; }
      .film-hero .film-details .infos span:not(:last-of-type)::after {
        content: '•';
        padding: 0 5px 0 8px; }
    .film-hero .film-details .actions {
      padding-bottom: 30px;
      display: flex;
      gap: 30px; }
      .film-hero .film-details .actions .btn {
        border: solid 1px var(--color--grey1);
        background: var(--color--grey1);
        color: var(--color--light);
        font-weight: 600;
        font-size: var(--font--l);
        padding: 24px 24px;
        border-radius: 16px;
        cursor: pointer;
        display: grid;
        justify-content: center;
        gap: 15px;
        align-items: center; }
      .film-hero .film-details .actions .btn.lecture {
        grid-template-columns: 16px auto;
        padding: 24px 88px; }
        .film-hero .film-details .actions .btn.lecture::before {
          content: '';
          width: 16px;
          height: 16px;
          background: var(--color--accent1a);
          mask: url("img/icons/icon-play.svg") no-repeat center/contain; }
        .film-hero .film-details .actions .btn.lecture:hover, .film-hero .film-details .actions .btn.lecture:focus-visible {
          border-color: var(--color--grey3);
          background: var(--color--dark);
          color: var(--color--light); }
          .film-hero .film-details .actions .btn.lecture:hover::before, .film-hero .film-details .actions .btn.lecture:focus-visible::before {
            background: var(--color--accent1a); }
      .film-hero .film-details .actions .btn.favori {
        background: transparent;
        border-color: var(--color--grey3); }
        .film-hero .film-details .actions .btn.favori::before {
          content: '';
          width: 24px;
          height: 21px;
          background: var(--color--grey3);
          mask: url("img/icons/icon-heart.svg") no-repeat center/contain; }
        .film-hero .film-details .actions .btn.favori:hover, .film-hero .film-details .actions .btn.favori:focus-visible {
          background: var(--color--dark); }
        .film-hero .film-details .actions .btn.favori.is-favorite::before {
          background: var(--color--accent2a); }
    .film-hero .film-details .dispo {
      font-size: var(--font--s);
      color: var(--color--grey3); }

.film-section-synopsis .cols {
  display: grid;
  gap: 50px;
  grid-template-columns: 2fr 1fr; }
.film-section-synopsis .synopsis-text, .film-section-synopsis .synopsis-text p {
  font-size: var(--font--l); }
.film-section-synopsis .synopsis-text {
  max-width: 90%; }
.film-section-synopsis .film-inline-gallery {
  display: grid;
  gap: 50px;
  grid-template-columns: 1fr 1fr;
  max-width: 80%;
  margin: 50px 0; }
  .film-section-synopsis .film-inline-gallery img {
    max-width: 100%;
    height: auto;
    border-radius: 16px;
    aspect-ratio: 16 / 9;
    object-fit: cover;
    object-position: center; }
.film-section-synopsis .info-card-dark {
  margin-top: 40px;
  background: var(--color--dark2);
  padding: 50px 50px 70px;
  border-radius: 20px;
  color: var(--color--light);
  font-weight: 500; }
  .film-section-synopsis .info-card-dark dl dt {
    text-transform: uppercase;
    font-weight: 400;
    margin: 3em 0 1.2em;
    color: var(--color--grey3);
    font-size: var(--font--s); }
  .film-section-synopsis .info-card-dark dl dt:first-of-type {
    margin-top: 0; }
  .film-section-synopsis .info-card-dark dl dd {
    margin: 0; }
  .film-section-synopsis .info-card-dark .tag-list {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    padding: 0;
    margin: 0; }
    .film-section-synopsis .info-card-dark .tag-list li {
      background: var(--color--grey1);
      padding: 14px 16px;
      border-radius: 16px;
      font-size: var(--font--s); }
      .film-section-synopsis .info-card-dark .tag-list li a {
        text-decoration: none;
        color: var(--color--light); }
        .film-section-synopsis .info-card-dark .tag-list li a:hover {
          color: var(--color--light2); }
.film-section-synopsis .autour .grid {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 30px; }
.film-section-synopsis .autour .autour-card {
  padding: 30px;
  border-radius: 20px;
  border: solid 1px var(--color--grey4); }
.film-section-synopsis .autour .autour-icon {
  padding: 15px; }
  .film-section-synopsis .autour .autour-icon img {
    width: 70px;
    height: 70px;
    object-fit: contain;
    object-position: center; }

.film-section-map .map-layout {
  padding-top: 30px;
  display: grid;
  grid-template-columns: 2fr 1fr;
  gap: 35px; }
.film-section-map #map-container {
  border-radius: 20px; }
.film-section-map #map-info-panel {
  background: var(--color--light);
  border-radius: 20px;
  height: 500px;
  overflow-y: scroll;
  scrollbar-width: none; }
  .film-section-map #map-info-panel::-webkit-scrollbar {
    display: none; }
  .film-section-map #map-info-panel .wrapper {
    padding: 50px 50px 50px; }

.film-section-realisateur {
  background: var(--color--dark); }
  .film-section-realisateur .cols {
    display: grid;
    grid-template-columns: 2fr 1fr;
    gap: 35px;
    align-items: center; }
  .film-section-realisateur .real-text {
    padding-right: 80px; }
  .film-section-realisateur img {
    border-radius: 16px; }

.film-section-analyse .cols {
  display: grid;
  grid-template-columns: 4fr 3fr;
  gap: 35px;
  padding-top: 20px; }
.film-section-analyse figure {
  position: relative;
  border-radius: 20px;
  overflow: hidden;
  background: var(--color--dark2);
  cursor: pointer;
  aspect-ratio: 16 / 9; }
  .film-section-analyse figure img {
    opacity: .5; }
  .film-section-analyse figure span.video-duration {
    position: absolute;
    top: 30px;
    right: 30px;
    color: var(--color--light);
    background: var(--color--dark2);
    padding: 14px 16px;
    border-radius: 16px;
    font-size: var(--font--s); }
  .film-section-analyse figure::after {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    translate: -50% -50%;
    width: 80px;
    height: 72px;
    border-radius: 16px;
    background: var(--color--light) url("img/icons/icon-play.svg") no-repeat center/14px 16px;
    transition: all 200ms ease; }
.film-section-analyse figure:hover img, .film-section-analyse figure:focus-visible img {
  opacity: .4;
  scale: 1.05; }
.film-section-analyse figure:hover::after, .film-section-analyse figure:focus-visible::after {
  scale: .9; }
.film-section-analyse .content {
  border-radius: 20px;
  overflow-y: scroll;
  scrollbar-width: none; }
  .film-section-analyse .content::-webkit-scrollbar {
    display: none; }
  .film-section-analyse .content .wrapper {
    padding: 50px; }
.film-section-analyse .analyse-dl {
  margin: 32px 0;
  padding: 16px 48px 16px 64px;
  position: relative; }
  .film-section-analyse .analyse-dl::after {
    content: '';
    position: absolute;
    top: 50%;
    left: 30px;
    transform: translateY(-50%);
    width: 16px;
    height: 16px;
    background: var(--color--accent1a);
    mask: url("img/icons/icon-download.svg") no-repeat center/contain; }
.film-section-analyse .contributeurs-lies .contributeur-item {
  background: var(--color--light); }

.film-section-entretiens .grid {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 40px; }

.film-section-docs .docs-filter-bar {
  border-bottom: 1px solid var(--color--grey4);
  display: flex;
  margin: 30px 0 60px; }
  .film-section-docs .docs-filter-bar .filter-btn {
    cursor: pointer;
    padding: 24px 48px;
    font-size: var(--font--m);
    border-radius: 0;
    background: var(--color--light2);
    color: var(--color--grey2);
    border: 1px solid var(--color--grey4);
    border-width: 1px 0 0 1px;
    /* pour "réserver" l'espace du text actif qui devient bold */ }
    .film-section-docs .docs-filter-bar .filter-btn:first-child {
      border-radius: 16px 0 0 0; }
    .film-section-docs .docs-filter-bar .filter-btn:last-child {
      border-right-width: 1px;
      border-radius: 0 16px 0 0; }
    .film-section-docs .docs-filter-bar .filter-btn::after {
      content: attr(data-text);
      font-weight: 700;
      height: 0;
      visibility: hidden;
      overflow: hidden;
      user-select: none;
      pointer-events: none;
      display: block; }
    .film-section-docs .docs-filter-bar .filter-btn.active {
      background: var(--color--light);
      color: var(--color--dark);
      font-weight: 700; }
    .film-section-docs .docs-filter-bar .filter-btn:hover {
      color: var(--color--dark); }
.film-section-docs .docs-grid {
  display: grid;
  gap: 40px;
  grid-template-columns: 1fr 1fr 1fr 1fr; }

.film-section-activites .grid {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 40px;
  padding-top: 30px; }
.film-section-activites .activite-card {
  border: 0; }

.film-section-thematique .pill {
  display: inline-block;
  background: var(--color--grey1);
  padding: 14px 16px;
  font-size: var(--font--s); }
.film-section-thematique .grid {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 40px;
  margin-top: 70px; }

/* APERCU FILM */
.film-card {
  max-width: 500px; }
  .film-card a {
    text-decoration: none; }
  .film-card .thumbnail {
    position: relative;
    display: block;
    aspect-ratio: 16 / 9;
    border-radius: 16px;
    overflow: hidden; }
    .film-card .thumbnail img {
      position: absolute;
      inset: 0;
      display: block;
      aspect-ratio: 16 / 9;
      object-fit: cover;
      object-position: center; }
    .film-card .thumbnail .film-unfavorite-action {
      position: absolute;
      top: 15px;
      right: 15px; }
      .film-card .thumbnail .film-unfavorite-action button {
        position: relative;
        border: 0;
        color: var(--color--dark2);
        background: var(--color--light);
        cursor: pointer;
        padding: 0;
        width: 56px;
        height: 56px; }
        .film-card .thumbnail .film-unfavorite-action button::after {
          content: '';
          position: absolute;
          top: 50%;
          left: 50%;
          transform: translate(-50%, -50%);
          width: 16px;
          height: 16px;
          background: var(--color--dark2);
          mask: url("img/icons/icon-heart.svg") no-repeat center/contain; }
        .film-card .thumbnail .film-unfavorite-action button.is-favorite::after {
          mask: url("img/icons/icon-close.svg") no-repeat center/contain; }
    .film-card .thumbnail .thematique {
      position: absolute;
      bottom: 15px;
      right: 15px;
      color: var(--color--light);
      background: var(--color--dark2);
      padding: 14px 16px;
      border-radius: 16px;
      font-size: var(--font--s);
      font-weight: 500; }
      .film-card .thumbnail .thematique a {
        color: var(--color--light); }
    .film-card .thumbnail:hover img, .film-card .thumbnail:focus-visible img {
      scale: 1.05; }
  .film-card h3.title {
    margin-bottom: .25em;
    margin-top: .6em; }

.content-activite .grid {
  padding: 80px 0 100px;
  display: grid;
  grid-template-columns: 5fr 2fr;
  gap: 100px; }

/* RECHERCHE SEARCH */
.content-search .grid {
  padding: 80px 0 100px;
  display: grid;
  grid-template-columns: 2fr 5fr;
  gap: 100px; }
.content-search .page-title {
  margin-top: 0; }
.content-search .search-field {
  position: relative;
  margin-bottom: 64px; }
  .content-search .search-field::after {
    content: '';
    position: absolute;
    left: 30px;
    top: 50%;
    transform: translateY(-50%);
    width: 16px;
    height: 16px;
    background: var(--color--dark2);
    mask: url(img/icons/icon-search.svg) no-repeat center/contain; }
  .content-search .search-field input {
    padding-left: 64px !important; }
.content-search .search-filters-wrapper {
  background: var(--color--dark2);
  padding: 56px 32px;
  border-radius: 20px;
  color: var(--color--light); }
  .content-search .search-filters-wrapper .search-filters {
    display: grid;
    gap: 16px;
    font-weight: 600; }
  .content-search .search-filters-wrapper .search-submit {
    margin-top: 32px;
    background: var(--color--grey1);
    padding: 16px 32px; }
    .content-search .search-filters-wrapper .search-submit:hover {
      background: var(--color--grey2); }
  .content-search .search-filters-wrapper .filter-checkbox-label {
    margin: 0; }
.content-search .search-result {
  border-radius: 20px;
  background: var(--color--light2);
  padding: 32px 48px;
  display: grid;
  grid-template-columns: 6fr 2fr;
  column-gap: 80px;
  margin-bottom: 32px;
  border: 0; }
  .content-search .search-result a {
    text-decoration: none; }
  .content-search .search-result .post-type-pill {
    display: inline-block;
    font-size: var(--font--s);
    padding: 8px 16px; }
  .content-search .search-result .search-result-thumb {
    display: block;
    aspect-ratio: 16 / 10;
    border-radius: 8px;
    overflow: hidden;
    background: rgba(0, 0, 0, 0.1); }
    .content-search .search-result .search-result-thumb img {
      width: 100%;
      height: 100%;
      object-fit: cover;
      object-position: center; }
  .content-search .search-result.doc-card figure {
    aspect-ratio: 16 / 10;
    background: transparent; }
  .content-search .search-result .comett-breadcrumbs {
    padding: 0; }

/* FORM FIELD */
label {
  margin: 24px 0 8px;
  display: block;
  font-weight: 800; }

textarea, input[type="text"], input[type="button"], input[type="reset"], input[type="search"], input[type="password"], select {
  background: var(--color--light2);
  border: solid 1px var(--color--grey4);
  color: var(--color--dark);
  font-family: var(--font--main);
  padding: 24px 24px 24px 26px;
  border-radius: 12px;
  font-size: var(--font--m);
  font-weight: 500;
  width: 100%;
  max-width: 500px;
  display: block; }

input[type="submit"] {
  background: var(--color--dark);
  border: solid 1px var(--color--dark);
  color: var(--color--light);
  font-family: var(--font--main);
  padding: 16px 36px;
  border-radius: 12px;
  font-size: var(--font--m);
  font-weight: 500;
  min-width: 200px;
  display: block; }
  input[type="submit"]:hover {
    background: var(--color--dark2);
    border-color: var(--color--dark2); }

.acf-fields > .acf-field {
  padding: 16px 0 !important;
  border-top-width: 0 !important; }
  .acf-fields > .acf-field textarea, .acf-fields > .acf-field input[type="text"], .acf-fields > .acf-field input[type="button"], .acf-fields > .acf-field input[type="reset"], .acf-fields > .acf-field input[type="search"], .acf-fields > .acf-field input[type="password"], .acf-fields > .acf-field select, .acf-fields > .acf-field .select2-container--default .select2-selection--multiple {
    padding: 16px 36px !important;
    font-size: var(--font--m) !important;
    background: var(--color--light2);
    border: solid 1px var(--color--grey4);
    border-radius: 12px; }
  .acf-fields > .acf-field p.description {
    font-size: var(--font--s); }

#custom-login-form .login-username, #custom-login-form .login-password {
  display: grid;
  gap: 16px; }
  #custom-login-form .login-username input, #custom-login-form .login-password input {
    width: 100%; }

.code-comett {
  display: flex;
  align-items: center;
  gap: 8px; }

/* CONFIG ABONNEMENT */
.abonnement-config .grid {
  display: grid;
  gap: 100px;
  grid-template-columns: auto 480px;
  align-items: start; }
.abonnement-config .field {
  margin-bottom: 16px; }
.abonnement-config .radio legend {
  margin: 24px 0 8px;
  display: block;
  font-weight: 800; }
.abonnement-config .radio label {
  font-weight: 500;
  margin: 8px 0; }
.abonnement-config .inline {
  display: flex;
  gap: 16px;
  align-items: center; }
.abonnement-config select {
  max-width: 100%; }

.abonnement-prix {
  margin-top: 32px;
  text-align: center;
  border: 1px solid var(--color--dark);
  border-radius: 20px;
  padding: 32px; }
  .abonnement-prix .titre {
    font-size: var(--font--m);
    font-weight: 700; }
  .abonnement-prix .prix {
    font-size: var(--font--xl);
    font-weight: 800;
    margin-top: 24px; }
  .abonnement-prix .duree {
    font-size: var(--font--l);
    font-weight: 700; }
  .abonnement-prix .description {
    margin-top: 32px;
    font-size: var(--font--s); }
  .abonnement-prix .boutons {
    margin-top: 48px; }
  .abonnement-prix .btn {
    width: 100%;
    max-width: 300px; }
  .abonnement-prix #bouton_passculture {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    background: #870087; }

.creation_compte-wrapper .grid {
  display: grid;
  grid-template-columns: auto 480px;
  gap: 100px; }
.creation_compte-wrapper .inscription-infos {
  margin-top: 80px;
  text-align: center;
  padding: 24px 32px 40px;
  border-radius: 20px;
  border: 1px solid var(--color--dark); }

/* DOCUMENT ARCHIVES */
.document-accordion {
  background: var(--color--dark);
  color: var(--color--light);
  padding: 16px 45px;
  border-radius: 20px; }
  .document-accordion ul {
    list-style: none;
    margin: 0;
    padding: 0;
    font-size: var(--font--m);
    font-weight: 600; }
    .document-accordion ul li {
      margin: 16px 0; }
    .document-accordion ul a {
      color: var(--color--light);
      text-decoration: none; }
  .document-accordion summary.accordion-toggle {
    display: flex;
    align-items: center;
    justify-content: space-between;
    cursor: pointer;
    user-select: none;
    list-style: none;
    padding: 24px 32px;
    background: var(--color--grey1);
    border-radius: 12px;
    transition: all 200ms ease; }
    .document-accordion summary.accordion-toggle::-webkit-details-marker {
      display: none; }
    .document-accordion summary.accordion-toggle::after {
      content: '';
      display: inline-block;
      width: 8px;
      height: 8px;
      border-right: 2px solid var(--color--light);
      border-bottom: 2px solid var(--color--light);
      transform: rotate(45deg);
      transition: transform 0.25s ease;
      margin-left: 12px; }
  .document-accordion details[open] summary.accordion-toggle {
    background: var(--color--grey2); }
  .document-accordion details[open] summary.accordion-toggle::after {
    transform: rotate(-135deg); }
  .document-accordion details ul {
    font-weight: 600;
    padding-left: 0;
    margin: 32px 0; }
    .document-accordion details ul li {
      margin: 20px 0; }
      .document-accordion details ul li a {
        padding-left: 24px;
        display: block; }
  .document-accordion .is-active > a,
  .document-accordion .current-term > a {
    color: var(--color--accent1a) !important;
    position: relative;
    display: inline-block; }
    .document-accordion .is-active > a::before,
    .document-accordion .current-term > a::before {
      content: '';
      position: absolute;
      display: block;
      background: var(--color--accent1a);
      height: 2px;
      width: 11px;
      top: 50%;
      transform: translateY(-50%);
      left: 0; }

.document-archive .grid {
  padding: 80px 0;
  display: grid;
  grid-template-columns: 2fr 5fr;
  gap: 140px; }
.document-archive .cat-title {
  margin-top: 0; }
.document-archive .films-document-group .film-group {
  display: grid;
  grid-template-columns: 2fr 3fr;
  align-items: start;
  gap: 40px;
  border-top: 1px solid var(--color--grey4);
  padding: 64px 0; }
  .document-archive .films-document-group .film-group .big-pills {
    margin: 0; }
    .document-archive .films-document-group .film-group .big-pills .big-pill {
      width: 100%; }
.document-archive .doc-cat-lexique {
  margin-bottom: 56px; }
.document-archive .document-list {
  display: grid;
  gap: 24px; }
  .document-archive .document-list .doc-card {
    display: grid;
    grid-template-columns: 20px 1fr;
    gap: 24px;
    padding: 20px 32px 20px;
    border-color: var(--color--grey4);
    border-radius: 16px; }
    .document-archive .document-list .doc-card .doc-title {
      font-size: var(--font--l);
      font-weight: 800;
      margin: 0 0 7px; }
    .document-archive .document-list .doc-card .doc-meta {
      color: var(--color--grey2); }
    .document-archive .document-list .doc-card figure {
      margin-top: 5px;
      aspect-ratio: 1 / 1;
      background: transparent; }
      .document-archive .document-list .doc-card figure img {
        display: none; }
      .document-archive .document-list .doc-card figure .icon-dark, .document-archive .document-list .doc-card figure .icon-light {
        width: 20px;
        height: 20px; }
      .document-archive .document-list .doc-card figure .icon-light {
        background-color: var(--color--dark); }
      .document-archive .document-list .doc-card figure:hover .icon-dark, .document-archive .document-list .doc-card figure:hover .icon-light {
        scale: 1; }

/* SINGLE POST */
.content-single .grid {
  padding: 80px 0 100px;
  display: grid;
  grid-template-columns: 5fr 2fr;
  gap: 100px; }

/* PAGE */
.content-page .wrapper {
  padding: 80px 0 100px; }

/* PARCOURS */
.content-parcours .grid {
  padding: 80px 0 100px;
  display: grid;
  grid-template-columns: 2fr 5fr;
  gap: 100px; }

.parcours-pills {
  display: flex;
  gap: 16px;
  align-items: center; }

.classe-pill {
  display: inline-flex;
  gap: 4px;
  padding: 16px 24px;
  border-radius: 16px;
  background: var(--color--light2);
  margin-bottom: 56px; }
  .classe-pill .term {
    font-weight: bold; }

.parcours-tree {
  background: var(--color--dark);
  color: var(--color--light);
  padding: 16px 45px;
  border-radius: 20px; }
  .parcours-tree > ul > li {
    padding: 16px 0;
    border-bottom: dotted 1px var(--color--grey3); }
    .parcours-tree > ul > li:last-child {
      border-bottom: 0; }
  .parcours-tree ul {
    font-size: var(--font--m);
    font-weight: 900; }
    .parcours-tree ul li {
      margin: 16px 0; }
    .parcours-tree ul a {
      color: var(--color--light);
      text-decoration: none; }
    .parcours-tree ul .children {
      font-weight: 500; }
      .parcours-tree ul .children a {
        color: var(--color--grey3); }
    .parcours-tree ul .current_page_item > a {
      color: var(--color--accent1a);
      padding-left: 24px;
      position: relative;
      display: inline-block; }
      .parcours-tree ul .current_page_item > a::before {
        content: '';
        position: absolute;
        display: block;
        background: var(--color--accent1a);
        height: 2px;
        width: 11px;
        top: 10px;
        left: 0; }

.post-linear-navigation {
  padding-top: 80px; }
  .post-linear-navigation .nav-links {
    display: flex;
    align-items: stretch;
    justify-content: space-between;
    gap: 1.5rem; }
  .post-linear-navigation .nav-previous {
    text-align: left;
    display: none; }
  .post-linear-navigation .nav-next {
    margin-left: auto;
    text-align: right; }

/* METIERS */
.post-type-archive-metier article.metier {
  padding: 48px;
  border-radius: 16px;
  border: solid 1px var(--color--grey4); }
  .post-type-archive-metier article.metier a {
    text-decoration: none; }
  .post-type-archive-metier article.metier .entry-title {
    font-size: var(--font--lll);
    margin-top: 0; }
  .post-type-archive-metier article.metier .entry-summary, .post-type-archive-metier article.metier .entry-summary p {
    font-size: var(--font--m); }

/* LEXIQUE */
.lexique-header {
  position: sticky;
  top: 0;
  background: var(--color--dark2);
  padding: 40px 0 24px;
  z-index: 10; }
  .lexique-header .alphabet-link {
    text-decoration: none;
    color: var(--color--light);
    padding: 10px 15px 24px;
    border-radius: 12px;
    font-weight: 600; }
    .lexique-header .alphabet-link.disabled {
      opacity: .3;
      pointer-events: none; }
    .lexique-header .alphabet-link:hover, .lexique-header .alphabet-link.active {
      background: var(--color--grey1); }
  .lexique-header .alphabet-nav {
    display: flex;
    justify-content: space-between; }

.admin-bar .lexique-header {
  top: 32px; }

.letter-group {
  scroll-margin-top: 160px; }

input.lexique-search-input {
  background: var(--color--grey1);
  color: var(--color--light);
  padding: 15px 30px;
  border: 0;
  border-radius: 12px !important;
  height: auto;
  min-height: 64px;
  box-sizing: border-box;
  font-size: 15px;
  border: solid 1px var(--color--grey1);
  padding-left: 60px;
  position: relative;
  max-width: 780px; }

.lexique-search-wrapper {
  position: relative;
  margin-bottom: 28px; }
  .lexique-search-wrapper::after {
    content: '';
    position: absolute;
    left: 30px;
    top: 50%;
    transform: translateY(-50%);
    width: 16px;
    height: 16px;
    background: var(--color--light);
    mask: url(img/icons/icon-search.svg) no-repeat center/contain; }

/* ACCES CLASSE */
.classe-description-wrap {
  max-width: 650px;
  margin-top: 64px; }

.classe-films-grid {
  padding: 64px 0;
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 64px; }

.classe-code-form-wrap {
  margin: 64px 0; }

.class-plusloin {
  margin: 0 0 80px; }
  .class-plusloin .liens {
    display: flex;
    align-items: center;
    gap: 16px; }

.comett-classe-banner {
  padding: 10px 30px;
  background: var(--color--accent2a);
  font-size: var(--font--s); }
  .comett-classe-banner a {
    text-decoration: none;
    color: var(--color--light);
    font-weight: 600; }

/* BREADCRUMB */
.comett-breadcrumbs {
  padding: 50px 0;
  font-size: var(--font--s); }
  .comett-breadcrumbs a {
    text-decoration: none;
    color: var(--color--accent1a);
    font-weight: 700; }
  .comett-breadcrumbs .sep {
    padding: 0 5px; }

/* CONTRIBUTEURS */
.contributeurs-lies {
  display: flex;
  flex-wrap: wrap;
  gap: 20px; }
  .contributeurs-lies .contributeur-item {
    display: flex;
    align-items: center;
    gap: 15px;
    background: var(--color--light2);
    padding: 16px 20px 16px 24px;
    border-radius: 16px; }
    .contributeurs-lies .contributeur-item h4 {
      margin-top: 0; }
  .contributeurs-lies .contributeur-thumbnail img {
    width: 64px;
    height: 64px;
    object-fit: cover;
    object-position: center;
    border-radius: 200px; }
  .contributeurs-lies .contributeur-fonction {
    font-size: var(--font--s);
    color: var(--color--grey3); }

/* FOOTER */
#footer {
  background: var(--color--dark);
  padding: 90px 0 150px;
  color: var(--color--light); }
  #footer .footer1 .cols {
    display: grid;
    grid-template-columns: 120px 1fr 1fr 1fr 1fr 370px;
    gap: 30px; }
  #footer .footer1 a {
    color: var(--color--light);
    text-decoration: none; }
    #footer .footer1 a:hover, #footer .footer1 a:focus-visible {
      color: var(--color--grey3); }
  #footer .footer1 ul.menu li a {
    margin-bottom: 25px;
    display: inline-block; }
  #footer .footer1 ul.menu > li.menu-item-has-children > a {
    text-transform: uppercase;
    font-size: var(--font--s);
    color: var(--color--accent1a); }
    #footer .footer1 ul.menu > li.menu-item-has-children > a:hover, #footer .footer1 ul.menu > li.menu-item-has-children > a:focus-visible {
      color: var(--color--accent2a); }
  #footer .footer2 {
    margin-top: 100px; }
    #footer .footer2 .cols {
      display: grid;
      grid-template-columns: auto 280px;
      gap: 30px;
      align-items: end; }
    #footer .footer2 a {
      color: var(--color--grey3);
      text-decoration: none; }
      #footer .footer2 a:hover, #footer .footer2 a:focus-visible {
        color: var(--color--grey4); }
    #footer .footer2 ul.menu {
      display: flex;
      gap: 30px; }
  #footer .support a {
    display: grid;
    justify-content: normal;
    grid-template-columns: 24px auto 30px;
    gap: 20px;
    align-items: center;
    padding: 40px;
    border-radius: 16px;
    border: solid 1px var(--color--grey1);
    background: var(--color--grey1);
    color: var(--color--light);
    font-weight: 600;
    font-size: var(--font--l); }
    #footer .support a::before {
      content: '';
      width: 24px;
      height: 24px;
      background: var(--color--accent1a);
      mask: url("img/icons/icon-info.svg") no-repeat center/contain; }
    #footer .support a::after {
      content: '';
      width: 15px;
      height: 13px;
      background: var(--color--light);
      mask: url("img/icons/icon-arrow.svg") no-repeat center/contain; }
    #footer .support a:hover, #footer .support a:focus-visible {
      color: var(--color--light);
      background: var(--color--dark); }
      #footer .support a:hover::before, #footer .support a:focus-visible::before {
        background: var(--color--accent2a); }
      #footer .support a:hover::after, #footer .support a:focus-visible::after {
        translate: 10px 0; }
  #footer .vitrine a {
    display: grid;
    justify-content: center;
    grid-template-columns: 16px auto;
    gap: 10px;
    align-items: center;
    padding: 25px;
    border-radius: 16px;
    color: var(--color--light);
    background: transparent;
    border: solid 1px var(--color--grey2);
    font-weight: 700; }
    #footer .vitrine a::before {
      content: '';
      width: 16px;
      height: 16px;
      background: var(--color--accent1a);
      mask: url("img/icons/icon-return.svg") no-repeat center/contain; }
    #footer .vitrine a:hover, #footer .vitrine a:focus-visible {
      border-color: var(--color--grey1);
      background: var(--color--grey1);
      color: var(--color--light); }
      #footer .vitrine a:hover::before, #footer .vitrine a:focus-visible::before {
        background: var(--color--accent2a); }

#backtotop {
  width: 60px;
  height: 50px;
  background: var(--color--dark);
  border: solid 1px var(--color--grey2);
  border-bottom: 0;
  border-radius: 16px 16px 0 0;
  position: fixed;
  bottom: 0;
  right: 5%;
  cursor: pointer;
  opacity: 0;
  pointer-events: none;
  transform: translateY(50%);
  transition: all 200ms ease; }
  #backtotop::after {
    content: '';
    position: absolute;
    left: 50%;
    top: 15px;
    transform: translateX(-50%) rotate(-90deg);
    display: block;
    width: 20px;
    height: 20px;
    background: var(--color--light);
    mask: url("img/icons/icon-arrow.svg") no-repeat center/contain; }
  #backtotop.active {
    opacity: 1;
    pointer-events: auto;
    transform: translateY(0); }
  #backtotop:hover, #backtotop:focus-visible {
    height: 60px; }
    #backtotop:hover::after, #backtotop:focus-visible::after {
      background: var(--color--accent1a); }

/* PAGINATION */
.pagination-wrapper {
  margin-top: 80px; }
  .pagination-wrapper .nav-links {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 12px; }
  .pagination-wrapper .page-numbers {
    padding: 12px 20px;
    border-radius: 12px;
    border: 1px solid var(--color--grey4);
    background: var(--color--light); }
    .pagination-wrapper .page-numbers.current {
      background: var(--color--dark2);
      border-color: var(--color--dark2);
      color: var(--color--light); }
  .pagination-wrapper a.page-numbers {
    text-decoration: none; }
    .pagination-wrapper a.page-numbers:hover {
      background: var(--color--light2); }

/* COMPTE UTILISATEUR */
#account-subnav {
  background: var(--color--light2);
  margin-bottom: 80px; }
  #account-subnav ul {
    display: flex;
    justify-content: start;
    align-items: center; }
    #account-subnav ul li a {
      text-decoration: none;
      font-weight: 600;
      color: var(--color--grey2);
      padding: 32px 32px;
      display: block; }
    #account-subnav ul li.active a {
      font-weight: 800;
      color: var(--color--dark2);
      background: rgba(0, 0, 0, 0.1); }

.compte-wrapper {
  padding-bottom: 96px; }

.compte-infos .grid {
  display: grid;
  grid-template-columns: 2fr 1fr;
  gap: 160px;
  align-items: start; }
.compte-infos .form-actions {
  display: flex;
  gap: 24px;
  align-items: center;
  justify-content: end; }
.compte-infos ul.infos-list li {
  padding: 16px 0;
  display: flex;
  justify-content: space-between;
  align-items: center;
  color: var(--color--grey2);
  border-bottom: solid 1px var(--color--grey4); }
.compte-infos ul.infos-list span:last-child {
  color: var(--color--dark);
  font-weight: 800; }
.compte-infos .account-buttons {
  margin: 48px 0;
  display: flex;
  gap: 24px;
  justify-content: end;
  align-items: center; }
.compte-infos .infos-suppression {
  background: var(--color--light2);
  padding: 40px;
  border-radius: 16px;
  margin-top: 80px; }
  .compte-infos .infos-suppression .btn {
    margin-top: 24px; }
  .compte-infos .infos-suppression h3:first-of-type {
    margin-top: 0; }
.compte-infos .abonnement {
  padding: 48px;
  border: solid 1px var(--color--grey4);
  border-radius: 16px; }
  .compte-infos .abonnement .btn {
    margin-top: 24px; }
  .compte-infos .abonnement h3:first-of-type {
    margin-top: 0; }

.compte-favoris .films-grid {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 32px 40px; }

.compte-comptes-lies .grid {
  display: grid;
  gap: 128px;
  grid-template-columns: 2fr 1fr; }
.compte-comptes-lies .table-comptes-lies {
  margin-top: 48px;
  width: 100%;
  border-collapse: collapse;
  font-size: var(--font--s); }
  .compte-comptes-lies .table-comptes-lies th {
    color: var(--color--grey3); }
  .compte-comptes-lies .table-comptes-lies th, .compte-comptes-lies .table-comptes-lies td {
    text-align: left;
    padding: 8px 16px 8px 0; }
  .compte-comptes-lies .table-comptes-lies tr {
    border-bottom: 1px solid var(--color--grey3); }
  .compte-comptes-lies .table-comptes-lies td:last-child {
    text-align: right; }
.compte-comptes-lies .comptes-lies-code {
  padding: 40px 32px;
  border: 1px solid var(--color--dark2);
  border-radius: 20px;
  text-align: center; }
  .compte-comptes-lies .comptes-lies-code h3 {
    margin-top: 0; }
  .compte-comptes-lies .comptes-lies-code p {
    font-size: var(--font--m); }
  .compte-comptes-lies .comptes-lies-code .code-wrapper {
    display: flex;
    gap: 12px;
    align-items: center;
    justify-content: center;
    font-size: var(--font--l);
    text-align: center;
    margin: 32px auto;
    padding: 16px;
    border-radius: 12px;
    border: 1px dashed var(--color--dark2); }

.compte-classe .grid {
  display: grid;
  gap: 128px;
  grid-template-columns: 6fr 7fr; }
.compte-classe .classe-card {
  padding: 48px;
  border-radius: 20px;
  background: var(--color--light2);
  margin-bottom: 32px; }
  .compte-classe .classe-card h3:first-child {
    margin-top: 0;
    font-weight: 800;
    font-size: var(--font--ll); }
    .compte-classe .classe-card h3:first-child a {
      display: flex;
      gap: 16px;
      align-items: center;
      text-decoration: none; }
  .compte-classe .classe-card .icon-external-link {
    content: '';
    width: 16px;
    height: 16px;
    background: var(--color--dark);
    mask: url("img/icons/icon-blank.svg") no-repeat center/contain;
    display: inline-block; }
.compte-classe ul.classe-meta li {
  padding: 16px 0;
  display: flex;
  align-items: center;
  border-bottom: solid 1px var(--color--grey4); }
.compte-classe .classe-code-box {
  display: flex;
  gap: 16px;
  align-items: center; }
.compte-classe .classe-actions {
  display: flex;
  gap: 16px;
  align-items: center;
  margin-top: 32px; }
  .compte-classe .classe-actions .btn {
    padding-top: 12px;
    padding-bottom: 12px;
    border-radius: 12px; }
.compte-classe .classe-form-container {
  padding: 48px;
  border-radius: 20px;
  border: 1px solid var(--color--grey4); }
  .compte-classe .classe-form-container h3:first-child {
    margin-top: 0;
    font-size: var(--font--lll); }
  .compte-classe .classe-form-container textarea, .compte-classe .classe-form-container input[type="text"], .compte-classe .classe-form-container input[type="button"], .compte-classe .classe-form-container input[type="reset"], .compte-classe .classe-form-container input[type="search"], .compte-classe .classe-form-container input[type="password"] {
    max-width: none; }

/* ===================================================================
   MODAL DOCS STYLES
=================================================================== */
/* Curseur et prévisualisation */
.doc-preview {
  cursor: pointer;
  margin: 0; }

/* Modale Overlay */
.doc-modal {
  position: fixed;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  z-index: 9999;
  display: flex;
  align-items: center;
  justify-content: center;
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.25s ease, visibility 0.25s ease; }

.admin-bar .doc-modal {
  top: 32px; }

.doc-modal.is-active {
  opacity: 1;
  visibility: visible; }

.doc-modal-overlay {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: var(--color--dark2, rgba(0, 0, 0, 0.85)); }

/* Wrapper principal prenant tout l'écran en flex pour espacer le haut et le bas */
.doc-modal-wrapper {
  position: relative;
  z-index: 2;
  width: 100%;
  max-width: 100%;
  height: 100%;
  max-height: 100vh;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  /* Aligne la top-bar en haut et pousse le reste */
  padding: 32px 64px;
  box-sizing: border-box; }

/* Conteneur dynamique injecté par JS */
.doc-modal-content {
  display: flex;
  flex-direction: column;
  height: 100%;
  justify-content: space-between;
  width: 100%; }

/* Top Bar Layout fixe en haut : Film (Gauche), Titre (Centre), Bouton Fermer (Droite) */
.doc-modal-top-bar {
  display: grid;
  grid-template-columns: 300px auto 300px;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  flex-shrink: 0; }

.doc-modal-title {
  font-size: var(--font--ll);
  color: var(--color--light);
  margin: 0;
  text-align: center;
  flex: 1;
  font-weight: 800; }

/* Attached Film Card (Top Left) */
.modal-film-card {
  display: flex;
  align-items: center;
  gap: 16px;
  text-decoration: none; }
  .modal-film-card .modal-film-thumb {
    width: 88px;
    height: auto;
    aspect-ratio: 16 / 10;
    object-fit: cover;
    object-position: center;
    border-radius: 12px; }
  .modal-film-card .modal-film-info {
    display: flex;
    flex-direction: column; }
    .modal-film-card .modal-film-info .modal-film-title {
      font-weight: 800;
      line-height: 1.2;
      font-size: var(--font--m);
      color: var(--color--light); }
    .modal-film-card .modal-film-info .modal-film-real {
      font-weight: 600;
      line-height: 1.2;
      margin-top: 8px;
      font-size: var(--color--xs);
      color: var(--color--grey2); }

/* Close Button (Top Right) */
.doc-modal-close-wrapper {
  text-align: right; }

.doc-modal-close {
  background: var(--color--grey1);
  border: none;
  color: var(--color--light);
  width: 80px;
  height: 80px;
  border-radius: 20px;
  font-size: 48px;
  font-weight: 100;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  z-index: 10;
  transition: background 0.2s ease;
  flex-shrink: 0; }
  .doc-modal-close:hover {
    background: var(--color--grey2); }

/* Corps de la modale : centrage horizontal et vertical des contenus (Vidéo / Galerie) */
.doc-modal-body {
  position: relative;
  width: 100%;
  max-width: 900px;
  /* Limite la largeur à ~900px comme demandé */
  margin: auto;
  /* Centrage horizontal et vertical parfait dans l'espace disponible */
  display: flex;
  flex-direction: column;
  justify-content: center; }

/* 1. Vidéo oEmbed (16:9) */
.doc-modal-video {
  position: relative;
  padding-bottom: 56.25%;
  height: 0;
  overflow: hidden;
  background: #000;
  border-radius: 6px;
  width: 100%; }

.doc-modal-video iframe,
.doc-modal-video embed,
.doc-modal-video object {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%; }

/* 2. Galerie Swiper & External Arrows */
.doc-modal-gallery-wrapper {
  position: relative;
  width: 100%;
  padding: 0 50px;
  /* Espace pour les flèches de navigation externes */
  box-sizing: border-box; }

.doc-modal-swiper {
  width: 100%; }
  .doc-modal-swiper .swiper-slide {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center; }
    .doc-modal-swiper .swiper-slide img {
      max-width: 100%;
      max-height: 55vh;
      object-fit: contain;
      border-radius: 6px; }

/* Légende sous l'image active */
.swiper-slide-caption {
  color: #fff;
  font-size: 13px;
  text-align: center;
  margin-top: 12px;
  opacity: 0.85; }

/* Flèches de navigation externes positionnées à gauche et à droite de l'image */
.doc-swiper-prev,
.doc-swiper-next {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  color: #fff;
  cursor: pointer;
  z-index: 5;
  background: transparent;
  border: none;
  font-size: 32px;
  width: 40px;
  height: 40px;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: opacity 0.2s; }
  .doc-swiper-prev:hover,
  .doc-swiper-next:hover {
    opacity: 0.7; }

.doc-swiper-prev {
  left: 0; }

.doc-swiper-next {
  right: 0; }

/* Carrousel de miniatures ancré tout en bas de l'écran */
.doc-modal-thumbs-swiper {
  margin-top: 20px;
  width: 100%;
  height: 60px;
  flex-shrink: 0; }
  .doc-modal-thumbs-swiper .swiper-wrapper {
    justify-content: center;
    /* Centre les miniatures si elles ne remplissent pas tout l'écran */ }
  .doc-modal-thumbs-swiper .swiper-slide {
    width: 80px;
    height: 60px;
    opacity: 0.4;
    cursor: pointer;
    transition: opacity 0.2s ease; }
    .doc-modal-thumbs-swiper .swiper-slide img {
      width: 100%;
      height: 100%;
      object-fit: cover;
      border-radius: 4px; }
    .doc-modal-thumbs-swiper .swiper-slide.swiper-slide-thumb-active {
      opacity: 1; }

/* 3. Container Texte Blanc */
.doc-modal-text-box {
  background: #ffffff;
  padding: 30px;
  border-radius: 6px;
  max-height: 75vh;
  overflow-y: auto;
  color: #333;
  width: 100%; }
  .doc-modal-text-box h2 {
    margin-top: 0; }