@charset "UTF-8";
@font-face {
    font-family: "Source Sans Pro";
    src: url(../fonts/SourceSansPro-ExtraLight.otf) format("opentype");
    font-weight: 100;
}
@font-face {
    font-family: "Source Sans Pro";
    src: url(../fonts/SourceSansPro-Light.otf) format("opentype");
    font-weight: 300;
}
@font-face {
    font-family: "Source Sans Pro";
    src: url(../fonts/SourceSansPro-Regular.otf) format("opentype");
    font-weight: 400;
}
@font-face {
    font-family: "Source Sans Pro";
    src: url(../fonts/SourceSansPro-Semibold.otf) format("opentype");
    font-weight: 600;
}
@font-face {
    font-family: "Source Sans Pro";
    src: url(../fonts/SourceSansPro-Bold.otf) format("opentype");
    font-weight: 700;
}
@font-face {
    font-family: "Source Sans Pro";
    src: url(../fonts/SourceSansPro-Black.otf) format("opentype");
    font-weight: 900;
}
@font-face {
    font-family: "Source Sans Pro";
    src: url(../fonts/SourceSansPro-ExtraLightIt.otf) format("opentype");
    font-weight: 100;
    font-style: italic;
}
@font-face {
    font-family: "Source Sans Pro";
    src: url(../fonts/SourceSansPro-LightIt.otf) format("opentype");
    font-weight: 300;
    font-style: italic;
}
@font-face {
    font-family: "Source Sans Pro";
    src: url(../fonts/SourceSansPro-It.otf) format("opentype");
    font-weight: 400;
    font-style: italic;
}
@font-face {
    font-family: "Source Sans Pro";
    src: url(../fonts/SourceSansPro-SemiboldIt.otf) format("opentype");
    font-weight: 600;
    font-style: italic;
}
@font-face {
    font-family: "Source Sans Pro";
    src: url(../fonts/SourceSansPro-BoldIt.otf) format("opentype");
    font-weight: 700;
    font-style: italic;
}
@font-face {
    font-family: "Source Sans Pro";
    src: url(../fonts/SourceSansPro-BlackIt.otf) format("opentype");
    font-weight: 900;
    font-style: italic;
}
@font-face {
    font-family: "Fira Mono";
    font-weight: 400;
    src: url(../fonts/FiraMono-Regular.ttf) format("truetype");
}
@font-face {
    font-family: "Fira Mono";
    font-weight: 500;
    src: url(../fonts/FiraMono-Medium.ttf) format("truetype");
}
@font-face {
    font-family: "Fira Mono";
    font-weight: 700;
    src: url(../fonts/FiraMono-Bold.ttf) format("truetype");
}
:root {
    --color-black: #000000;
    --color-green: #a9f9be;
    --color-pink: #f5bef1;
    --color-yellow: #f9f2cc;
    --color-white: #ffffff;
    --color-dark: #7e7e7e;
    --color-darker: #535353;
    --color-light: #d7d7d7;
    --color-lighter: #f7f7f7;
    --family-primary:
        "Source Sans Pro", Inter, SF Pro, Segoe UI, Roboto, Oxygen, Ubuntu,
        Helvetica Neue, Helvetica, Arial, sans-serif;
    --family-code:
        "Fira Mono", Inconsolata, Hack, SF Mono, Roboto Mono, Source Code Pro,
        Ubuntu Mono, monospace;
    --size-small: var(--size-7);
    --size-normal: var(--size-5);
    --size-1: 2.5rem;
    --size-2: 1.6rem;
    --size-3: 1.3rem;
    --size-4: 1.125rem;
    --size-5: 1rem;
    --size-6: 0.9rem;
    --size-7: 0.8rem;
    --weight-light: 300;
    --weight-normal: 400;
    --weight-medium: 500;
    --weight-semibold: 600;
    --weight-bold: 700;
    --weight-extrabold: 800;
    --spacing: 1rem;
    --radius: 0.25rem;
    --radius-rounded: 9999px;
    --border: var(--color-black) 1px solid;
    --border-dashed: var(--color-black) 2px dashed;
    --duration: 294ms;
}
*,
*:before,
*:after {
    box-sizing: border-box;
}
body,
h1,
h2,
h3,
h4,
p,
ul,
ol,
li,
figure,
figcaption,
blockquote,
dl,
dd {
    margin: 0;
}
body {
    min-height: 100vh;
    scroll-behavior: smooth;
    line-height: 1.35;
}
body * {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-rendering: optimizeLegibility;
}
li {
    position: relative;
    margin: calc(var(--spacing) * 0.5) auto;
}

/* ------------------ */
/* SEMANTICS ELEMENTS */
/* ------------------ */

/* Header styles */
header {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 10;
    user-select: none;
    background: #fff;
}
header a {
    text-decoration: none;
    display: inline;
}
header .logo {
    position: absolute;
    top: 0;
    left: 0;
    width: 85px;
    padding: 12px 16px 8px 14px;
    background: #fff;
}
header .logo a:hover {
    background: none;
}
header .logo .mobile-only {
    display: none;
}
header.secondary-header {
    max-width: 1440px;
    margin-left: auto;
    margin-right: auto;
    margin-top: 90px;
    padding: 0 20px;
    height: 50px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}
@media (max-width: 860px) {
    header {
        height: calc(var(--spacing) * 5);
    }
    header .logo {
        width: auto;
        height: calc(var(--spacing) * 5);
    }
    header .logo .mobile-only {
        display: inline;
    }
    header .logo svg {
        height: 100%;
    }
    header .hamburger-container {
        display: flex;
        justify-content: center;
        align-items: center;
        width: calc(var(--spacing) * 7);
        height: calc(var(--spacing) * 5);
        margin-left: auto;
        cursor: pointer;
        user-select: none;
    }
    header .hamburger-container .hamburger {
        position: relative;
        background-color: var(--color-black);
        height: 2px;
        width: calc(var(--spacing) * 2);
        z-index: 2;
    }
    header .hamburger-container .hamburger:before,
    header .hamburger-container .hamburger:after {
        content: "";
        position: absolute;
        top: 0;
        left: 0;
        transform: translateY(-6px);
        display: block;
        width: calc(var(--spacing) * 2);
        height: 2px;
        background-color: var(--color-black);
    }
    header .hamburger-container .hamburger:after {
        transform: translateY(6px);
    }
    header .hamburger-container.close .hamburger {
        transform: rotate(180deg);
        background-color: #fff0;
    }
    header .hamburger-container.close .hamburger:before {
        transform: translateY(0) rotate(-45deg);
    }
    header .hamburger-container.close .hamburger:after {
        transform: translateY(0) rotate(45deg);
    }
    header .hamburger-container.close + nav {
        display: block;
    }
    header.secondary-header {
        margin-top: 0;
        width: calc(100% + 40px);
        margin-left: -20px;
        padding: 0 20px;
        height: 40px;
        display: flex;
        align-items: center;
        justify-content: space-between;
    }
    header.secondary-header .mobile-only svg {
        width: 12px;
        transform: rotate(180deg);
    }
}

/* Nav styles */

nav {
    width: 100%;
    height: calc(var(--spacing) * 4);
    color: var(--color-darker);
    background: var(--color-white);
}

nav .navigation-inner {
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: flex-end;
}
nav .menu,
nav .languages {
    display: flex;
    align-items: center;
}
nav .menu > li + li {
    margin-left: calc(var(--spacing) * 1.5);
    list-style: none;
}
nav .menu .disabled {
    color: rgb(102 102 102 / 0.5);
}
nav .menu .dropdown-trigger .arrow-ctn {
    display: inline-block;
    vertical-align: top;
    margin-left: calc(var(--spacing) * 0.25);
    transform: translateY(5px);
}
nav .menu .dropdown-trigger .arrow-ctn .arrow {
    display: block;
    width: 7px;
    height: 7px;
    border: 1px solid var(--color-darker);
    transform: rotate(45deg);
    border-width: 0 1px 1px 0;
}
nav .menu .dropdown {
    height: 100%;
    display: flex;
    align-items: center;
}
nav .menu .dropdown:hover .dropdown-trigger,
nav .menu .dropdown:focus-within .dropdown-trigger {
    outline: none;
}
nav .menu .dropdown:hover .dropdown-trigger .arrow-ctn,
nav .menu .dropdown:focus-within .dropdown-trigger .arrow-ctn {
    transform: translateY(9px);
}
nav .menu .dropdown:hover .dropdown-trigger .arrow-ctn .arrow,
nav .menu .dropdown:focus-within .dropdown-trigger .arrow-ctn .arrow {
    transform: rotate(-135deg);
}
nav .menu .dropdown:hover .dropdown-menu,
nav .menu .dropdown:focus-within .dropdown-menu {
    display: block;
}
nav .dropdown-menu {
    position: absolute;
    padding: 0 24px 12px 16px;
    line-height: 1.5;
    margin-left: -16px;
    top: 100%;
    background: #fff;
    display: none;
    z-index: 3;
}
nav .dropdown-menu a:active {
    border: none;
}
nav .languages {
    margin-left: calc(var(--spacing) * 1);
    padding: 0 calc(var(--spacing) * 1);
    font-size: var(--size-6);
    border-left: 1px solid var(--color-light);
}
nav .languages a:first-child {
    margin-right: 4px;
}
nav .languages a:last-child {
    margin-left: 4px;
}
nav .languages a.active {
    color: #000;
    pointer-events: none;
}
nav .languages a:hover {
    color: #000;
}
header.secondary-header {
    max-width: 1440px;
    margin-left: auto;
    margin-right: auto;
    margin-top: 90px;
    padding: 0 20px;
    height: 50px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}
@media (max-width: 860px) {
    nav {
        width: 100%;
        height: auto;
        max-height: calc(100vh - calc(var(--spacing) * 5));
        position: absolute;
        top: calc(var(--spacing) * 5);
        display: none;
    }
    nav .navigation-inner {
        height: 100%;
        overflow-y: auto;
        display: flex;
        flex-direction: column;
    }
    nav .menu {
        flex-direction: column;
    }
    nav .menu {
        border-top: 1px solid #e6e6e6;
    }
    nav .menu > li {
        width: 100%;
        padding: 10px 20px;
    }
    nav .menu > li + li {
        margin-left: 0;
        border-top: 1px dashed #e6e6e6;
    }
    nav .menu .dropdown {
        display: block;
        height: auto;
    }
    nav .dropdown-menu {
        position: relative;
        padding: 10px 15px 10px 20px;
        margin-top: 10px;
        margin-bottom: -10px;
        width: calc(100% + 40px);
        margin-left: -20px;
        line-height: 1.5;
        top: 100%;
        background: #fff;
        background: #f7f7f7;
        display: none;
    }
    nav .languages {
        margin-left: 0;
        padding: 10px 15px;
        border-left: none;
        border-top: 1px solid #e6e6e6;
        border-bottom: 1px solid #e6e6e6;
        justify-content: flex-end;
    }
}

/* Section styles */
section {
    display: flex;
    padding: calc(var(--spacing) * 4);
}
section.one-column .column {
    width: calc(50% - calc(var(--spacing) * 2));
    display: flex;
    flex-direction: column;
    justify-content: space-around;
}
section.one-column .one-column-wrapper,
section.two-columns .two-columns-wrapper {
    display: flex;
    flex-wrap: wrap;
    margin: 0 auto;
    max-width: 1440px;
}
section.two-columns .column {
    width: calc(50% - calc(var(--spacing) * 2));
    display: flex;
    flex-direction: column;
    justify-content: space-around;
}
section.three-columns .column-title {
    width: 33%;
    margin-right: 50%;
    padding: 0 20px;
    margin-bottom: 1.35rem;
}
section.three-columns .three-columns-wrapper {
    display: flex;
    flex-wrap: wrap;
    margin: 0 auto;
    max-width: 1440px;
}
section.three-columns .column {
    width: 33%;
    padding: 0 20px;
}
@media (max-width: 1024px) {
    section.three-columns.contact {
        margin-top: calc(1.35rem * 5);
    }
}
@media (max-width: 860px) {
    section.two-columns .column {
        width: 100%;
        padding: 0;
    }
    section.three-columns .column-title {
        width: 100%;
        margin-right: 0;
        padding: 0;
    }
    section.three-columns .column {
        width: 100%;
        padding: 0;
    }
    section.three-columns .column + .column {
        margin-top: calc(1.35rem * 2);
        border-top: 1px solid #e6e6e6;
        padding-top: calc(1.35rem * 2);
    }
}

/* Article styles */
article > * + * {
    margin-top: 1em;
}

/* Footer styles */
footer.two-columns {
    border-top: 1px solid var(--color-dark);
    background: var(--color-black);
    color: var(--color-white);
}
footer.two-columns .disabled {
    color: rgb(102 102 102 / 0.5);
}
footer.two-columns .two-columns-wrapper > .col {
    display: flex;
    width: 50%;
    gap: calc(var(--spacing) * 3);
    margin-bottom: calc(var(--spacing) * 1);
}
footer.two-columns .two-columns-wrapper > .column ul {
    list-style: none;
    padding-left: 0;
    user-select: none;
}
footer.two-columns .text > h3 {
    width: 100%;
}
footer.two-columns .text h3 + p {
    margin-top: 0;
}
footer.two-columns .text .subcol {
    margin-bottom: calc(var(--spacing) * 1);
}
footer.two-columns .full-col {
    width: 100%;
    border-top: 1px solid var(--color-lighter);
    padding-top: calc(var(--spacing) * 0.6);
}
@media (max-width: 1100px) {
    footer.two-columns > .column:first-child .text .subcol:first-child {
        width: 60%;
    }
    footer.two-columns > .column:first-child .text .subcol:nth-child(2) {
        width: 40%;
    }
}
@media (max-width: 1024px) {
    footer.two-columns > .column:first-child .text .subcol:first-child,
    footer.two-columns > .column:first-child .text .subcol:nth-child(2) {
        width: 50%;
    }
}
@media (max-width: 860px) {
    footer.two-columns .two-columns-wrapper {
        flex-direction: column;
    }
    footer.two-columns .two-columnsm-wrapper > .column {
        width: 100%;
    }
    footer.two-columns .full-col {
        border-top: 0;
    }
    /*footer.two-columns .two-columns-wrapper > .column:first-child .text .subcol:first-child,
    footer.two-columns .two-columns-wrapper > .column:first-child  .text
        .subcol:nth-child(2),
    footer.two-columns
        .two-columns-wrapper
        > .col:nth-child(2)
        .text
        .subcol:first-child,
    footer.two-columns
        .two-columns-wrapper
        > .col:nth-child(2)
        .text
        .subcol:nth-child(2) {
        width: 100%;
    }
    footer.two-columns
        .two-columns-wrapper
        > .col:first-child
        .text
        .subcol:nth-child(2),
    footer.two-columns
        .two-columns-wrapper
        > .col:nth-child(2)
        .text
        .subcol:nth-child(2) {
        padding-left: 0;
        margin-top: 1.35rem;
    }
    footer.two-columns .two-columns-wrapper > .col:nth-child(2) {
        margin-top: 1.35rem;
    }
    footer.two-columns .two-columns-wrapper > .col:nth-child(2) li + li,
    footer.two-columns
        .two-columns-wrapper
        > .col:nth-child(2)
        .subcol
        + .subcol {
        width: 100%;
        margin-top: 5px;
        padding-top: 5px;
        border-top: 1px dashed #e6e6e6;
    }
    footer.two-columns .text {
        padding: 0;
        max-width: 450px;
    }*/
}

input,
button,
textarea,
select {
    /*! color: inherit; */
    font: inherit;
    border: none;
    border-radius: 0;
    box-shadow: none;
}
input:focus,
button:focus,
textarea:focus,
select:focus {
    outline: none;
}
@media (prefers-reduced-motion: reduce) {
    * {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
        scroll-behavior: auto !important;
    }
}

html {
    font-family: var(--family-primary);
    font-size: var(--size-normal);
    font-weight: var(--weight-normal);
    scroll-behavior: smooth;
}
@media (max-width: 860px) {
    html {
        font-size: var(--size-6);
    }
}

/* Fonts style */
h1,
h2,
h3,
h4,
h5,
h6 {
    font-weight: inherit;
    font-size: inherit;
}
ul,
ol {
    list-style: inside;
    padding: 0;
}
a:not([class]) {
    text-decoration-skip-ink: auto;
}
a {
    color: inherit;
    text-decoration: none;
}
img {
    max-width: 100%;
    display: block;
}

div:has(> blockquote) {
    background-color: var(--color-white);
    padding: calc(var(--spacing) * 1);
}

blockquote p::before {
    content: "\201C";
}

blockquote p::after {
    content: "\201D";
}

blockquote p {
    font-style: italic;
}
.quote-author {
    display: flex;
    font-weight: var(--weight-bold);
}
.quote-author::before {
    content: "\2014";
    margin-right: calc(var(--spacing) * 0.25);
}
h1,
h2,
h3,
h4 {
    font-family: var(--family-code);
    font-weight: var(--weight-bold);
    line-height: 1;
}
h1 {
    text-transform: uppercase;
    padding: calc(var(--spacing) * 1) calc(var(--spacing) * 1.5);
    border: var(--border-dashed);
}
h1:not(.h2-like) {
    font-size: var(--size-1);
}
h2,
.h2-like {
    font-size: var(--size-2);
    margin-bottom: calc(var(--spacing) * 1.5);
}
h2 + .subtitle,
.h2-like + .subtitle {
    margin-top: calc(var(--spacing) * 0.5);
    font-size: var(--size-6);
}
h2::after {
    content: url(https://infolettres.lowtechlab.org/uploads/trait2_court.svg);
    display: block;
    width: 8rem;
    height: auto;
    margin-top: calc(var(--spacing) * -0.5);
}
h3 {
    font-size: var(--size-3);
    margin-bottom: calc(var(--spacing) * 0.8);
}
h3 + p {
    margin-top: calc(var(--spacing) * 1.5);
}
h3.centered {
    text-align: center;
}
@media (max-width: 1024px) {
    h1:not(.h2-like) {
        font-size: calc(var(--size-1) - 0.2rem);
    }
}
@media (max-width: 1024px) {
    h1:not(.h2-like) {
        font-size: 1.85rem;
    }
    h2,
    .h2-like {
        font-size: 1.35rem;
    }
}
.small-text {
    font-size: 0.9rem;
}
.upper {
    text-transform: uppercase;
}
span[data-size="l"] {
    font-size: calc(var(--size-normal) * 1.7);
}
span[data-size="m"] {
    font-size: calc(var(--size-normal) * 1.2);
}
h1.offset-left {
    position: relative;
    z-index: 1;
    background: var(--color-white);
    padding: calc(var(--spacing) * 1) calc(var(--spacing) * 1.5);
    margin-left: calc(var(--spacing) * -4);
    margin-right: calc(var(--spacing) * 4);
    border: var(--border-dashed);
    max-width: 750px;
}
h1.offset-right {
    position: relative;
    z-index: 1;
    background: var(--color-white);
    padding: calc(var(--spacing) * 1) calc(var(--spacing) * 1.5);
    margin-right: calc(var(--spacing) * -4);
    margin-left: auto;
    text-align: right;
    max-width: 450px;
}
@media (max-width: 860px) {
    span[data-size="l"] {
        font-size: calc(var(--size-normal) * 1.6);
    }
    span[data-size="m"] {
        font-size: calc(var(--size-normal) * 1.2);
    }
    h1.offset-left {
        margin-left: auto;
        margin-right: auto;
        max-width: 450px;
    }
    h1.offset-right {
        padding: 0;
        margin-right: auto;
        margin-left: auto;
        text-align: left;
        max-width: 450px;
    }
}
p + p,
p + ul,
p + h2,
p + h3,
p + blockquote,
blockquote + p,
blockquote + ul,
blockquote + h2,
blockquote + h3,
blockquote + blockquote {
    margin-top: calc(var(--spacing) * 0.5);
}
strong {
    font-weight: var(--weight-bold);
}
em {
    font-style: italic;
}

/* Links style */
a {
    display: inline;
    text-decoration: 2px underline dotted;
    transition: color 0.2s cubic-bezier(0.215, 0.61, 0.355, 1);
}
a.no-u {
    text-decoration: none;
}
a:hover {
    color: var(--color-black);
    background: var(--color-green);
    text-decoration: none;
}
a + h3 {
    margin-top: calc(var(--spacing) * 1.4);
}
.toggle-trigger {
    text-decoration: underline;
    user-select: none;
    cursor: pointer;
}

.tw-nw {
    white-space: nowrap;
}

/* Colors */
span.color-pink {
    color: var(--color-black);
    background-color: var(--color-pink);
    font-family: var(--family-code);
    font-weight: var(--weight-medium);
}
span.color-yellow {
    color: var(--color-black);
    background-color: var(--color-yellow);
    font-family: var(--family-code);
    font-weight: var(--weight-medium);
}
span.color-green {
    color: var(--color-black);
    background-color: var(--color-green);
    font-family: var(--family-code);
    font-weight: var(--weight-medium);
}
span.color-dark {
    color: var(--color-black);
    background-color: var(--color-light);
    font-family: var(--family-code);
    font-weight: var(--weight-medium);
}
.bg-light-faded {
    background-color: var(--color-lighter);
}
.bg-light-faded .link-btn:hover {
    color: var(--color-lighter);
}
.bg-light-faded .link-btn:hover svg {
    fill: var(--color-lighter);
}
.bg-pink-faded {
    background-color: var(--color-pink);
}
.bg-pink-faded .link-btn:hover {
    color: var(--color-pink);
}
.bg-pink-faded .link-btn:hover svg {
    fill: var(--color-pink);
}
.bg-green-faded {
    background-color: var(--color-green);
}
.bg-yellow-faded .link-btn:hover {
    color: var(--color-green);
}
.bg-yellow-faded .link-btn:hover svg {
    fill: var(--color-green);
}
.bg-yellow-faded {
    background-color: var(--color-yellow);
}
.bg-yellow-faded a:hover {
    color: var(--color-yellow);
    background-color: var(--color-black);
}
.bg-yellow-faded .link-btn:hover {
    color: var(--color-yellow);
}
.bg-yellow-faded .link-btn:hover svg {
    fill: var(--color-yellow);
}
.ul-yellow ul {
    color: var(--color-black);
}
.strong-yellow strong {
    color: var(--color-black);
    background: var(--color-pink);
}

/* Margin - Padding */
.mt-quarter {
    margin-top: calc(1.35rem * 0.25);
}
.mt-half {
    margin-top: calc(1.35rem * 0.5);
}
.mt-1 {
    margin-top: calc(var(--spacing) * 1.35);
}
.mt-1b {
    margin-top: calc(1.35rem * 1.5);
}
.mt-2 {
    margin-top: calc(1.35rem * 2);
}
.mt-3 {
    margin-top: calc(1.35rem * 3);
}
.mt-4 {
    margin-top: calc(var(--spacing) * 5);
}
.mt-5 {
    margin-top: calc(1.35rem * 5);
}
.mt-6 {
    margin-top: calc(1.35rem * 6);
}
.p-0-20 {
    padding: 0 20px;
}
.limit-width {
    max-width: 1440px;
    margin-left: auto;
    margin-right: auto;
}
@media (max-width: 860px) {
    .mt-1,
    .mt-half,
    .mt-1b,
    .mt-2,
    .mt-3,
    .mt-4,
    .mt-5,
    .mt-6 {
        margin-top: 0;
    }
    .mt-m-quarter {
        margin-top: calc(1.35rem * 0.25);
    }
    .mt-m-half {
        margin-top: calc(1.35rem * 0.5);
    }
    .mt-m-1 {
        margin-top: 1.35rem;
    }
    .mt-m-1b {
        margin-top: calc(1.35rem * 1.5);
    }
    .mt-m-2 {
        margin-top: calc(1.35rem * 2);
    }
    .mt-m-3 {
        margin-top: calc(var(--spacing) * 3);
    }
    .mt-m-4 {
        margin-top: calc(1.35rem * 4);
    }
    .mt-m-5 {
        margin-top: calc(1.35rem * 5);
    }
    .mt-m-6 {
        margin-top: calc(1.35rem * 6);
    }
    .p-0-20 {
        padding: 0 15px;
    }
    .p-0-20.p-m-disabled {
        padding: 0;
    }
    .limit-mobile-width {
        width: 100%;
        max-width: 450px;
        margin-left: auto;
        margin-right: auto;
    }
}

/* Logo styles */
.logo-inline {
    display: inline-block;
    filter: grayscale(100%);
    background: var(--color-white);
}
.logo-inline img {
    max-height: 36px;
    max-width: 120px;
    filter: grayscale(100%);
}
.logo-inline.mt-small {
    margin-top: 0.65rem;
}
@media (max-width: 860px) {
    .logo-inline img {
        max-height: 30px;
    }
}

/* Grid */
.grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    justify-content: center;
    justify-items: center;
    align-items: center;
    gap: calc(var(--spacing) * 1);
}
.grid a:hover {
    background-color: transparent;
}
.grid .cell {
    padding: calc(var(--spacing) * 0.5);
}

.grid .cell img {
    max-width: 200px;
    max-height: 100px;
}
.grid .cell .sub-text {
    color: var(--color-dark);
}

/* Section Partners */
.partners {
    padding: calc(var(--spacing) * 3) calc(var(--spacing) * 2);
    background: var(--color-lighter);
    display: flex;
    flex-direction: column;
    align-items: center;
}
.partners h2 {
    display: flex;
    flex-direction: column;
    align-items: center;
}
.partners h2::after {
    display: none;
}
.partners img {
    width: auto;
    height: 100%;
    filter: grayscale(100%);
}
.partners .partner-subtext {
    color: var(--color-dark);
    margin-top: calc(var(--spacing) * 0.5);
    font-size: var(--size-6);
}
.partners-main {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: baseline;
    gap: calc(var(--spacing) * 3);
}
.partners-main .partner img {
    max-width: 230px;
    max-height: 90px;
}
/*.partners-main .partner + .partner {
    margin-left: calc(var(--spacing) * 4);
}*/
.partners-main a:hover {
    background-color: transparent;
}
.partners-secondary {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    justify-content: center;
}
.partners-secondary .partner img {
    height: 40px;
}
.partners-secondary .partner + .partner {
    margin-left: 35px;
}
.partners-secondary a .partner-subtext {
    visibility: hidden;
}
.partners-secondary a:hover .partner-subtext {
    visibility: visible;
}
.partners-text {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    line-height: 1.5;
}
.partners-text .partner:not(:last-child):after {
    content: "–";
    display: inline-block;
    margin-left: 10px;
    margin-right: 10px;
}
@media (max-width: 1024px) {
    .partners-main .partner img {
        max-width: 200px;
        max-height: 70px;
    }
    .partners-main {
        gap: calc(var(--spacing) * 2);
    }
    /*.partners-main .partner + .partner {
        margin-left: 40px;
    }*/
    .partners-secondary .partner img {
        height: 32px;
    }
    .partners-secondary .partner + .partner {
        margin-left: 28px;
    }
}
@media (max-width: 860px) {
    .partners-main {
        gap: calc(var(--spacing) * 1);
    }
    .partners-main .partner img {
        max-width: 180px;
        max-height: 60px;
    }
    .partners-secondary .partner img {
        height: 28px;
    }
    .partners-secondary .partner + .partner {
        margin-left: 25px;
    }
}
.partner {
    display: flex;
    flex-direction: column;
    align-items: center;
    margin: calc(var(--spacing) * 1);
}
.contribute {
    padding: calc(var(--spacing) * 4);
}
@media (max-width: 860px) {
    .contribute {
        padding: calc(1.35rem * 2) 20px;
        width: calc(100% + 40px);
        margin-left: -20px;
    }
}
.contribute .text {
    max-width: 980px;
}
.contribute.custom-contribute {
    background: #fff0;
    padding: calc(1.35rem * 2);
    padding-top: calc(1.35rem * 2 - 1rem);
}

.header-sort {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    min-height: calc(var(--spacing) * 4);
}
.header-sort .left,
.header-sort .right {
    display: flex;
    align-items: center;
}
.header-sort .right-blog {
    padding: 7px 0;
}
.header-sort form {
    display: flex;
    flex-wrap: wrap;
}
.header-sort select {
    margin-left: 12px;
}
.header-sort label {
    white-space: pre;
}
.header-sort .select-group {
    display: flex;
    align-items: center;
    flex: 1;
}
.header-sort .toggle {
    position: relative;
    width: 38px;
    height: 18px;
    border-radius: 9px;
    transition: background 0.2s ease;
    border: 1px solid #756e1e;
    margin-left: 12px;
    cursor: pointer;
}
.header-sort .toggle:after {
    content: "";
    display: block;
    position: absolute;
    top: 2px;
    left: 3px;
    height: 12px;
    width: 12px;
    border-radius: 50%;
    background: #f8f8f4;
    transition: all 0.2s ease;
    border: 1px solid #756e1e;
}
.header-sort .toggle.active {
    background: #756e1e;
}
.header-sort .toggle.active:after {
    transform: translateX(19px);
}
@media (max-width: 1230px) {
    .header-sort.has-zones form {
        flex-wrap: wrap;
    }
    .header-sort.has-zones .select-group:first-child {
        width: 100%;
    }
    .header-sort.has-zones .select-group:nth-child(2) {
        margin-top: 10px;
    }
    .header-sort.has-zones .select-group:nth-child(2) label.ml {
        margin-left: 0;
    }
    .header-sort.has-zones button {
        margin-top: 10px;
    }
}
@media (max-width: 860px) {
    .header-sort {
        height: auto;
        min-height: 50px;
        width: calc(100% + 40px);
        margin-left: -20px;
        padding: 1.35rem 20px;
        flex-direction: column;
        align-items: flex-start;
    }
    .header-sort label {
        white-space: default;
    }
    .header-sort form {
        flex-direction: column;
        align-items: flex-start;
    }
    .header-sort form .select-group {
        flex-direction: column;
        align-items: flex-start;
    }
    .header-sort form select {
        margin-left: 0;
        margin-top: 5px;
    }
    .header-sort form .ml {
        margin-left: 0;
    }
}
.container {
    padding: calc(var(--spacing) * 4) 0 0;
}
@media (max-width: 860px) {
    .container {
        /*padding: calc(var(--spacing) * 3) calc(var(--spacing) * 1) 0;*/
    }
}
.picto {
    width: 60px;
}
@media (max-width: 860px) {
    .picto {
        width: 40px;
    }
}
.col-title {
    max-width: 1440px;
    margin-left: auto;
    margin-right: auto;
}
.two-columns {
    padding: calc(var(--spacing) * 4);
}
@media (max-width: 1024px) {
    .two-columns {
        padding: calc(var(--spacing) * 3) calc(var(--spacing) * 2);
    }
}
.two-columns .column-title {
    width: 100%;
}
.two-columns .two-columns-wrapper {
    display: flex;
    flex-wrap: wrap;
    gap: calc(var(--spacing) * 4);
}
@media (max-width: 1024px) {
    .two-columns {
        gap: calc(var(--spacing) * 2);
    }
}
.two-columns .column .content {
    margin: calc(var(--spacing) * 2) auto;
    max-width: 500px;
}
@media (max-width: 1024px) {
    .two-columns.contact {
        margin-top: calc(1.35rem * 5);
    }
}
@media (max-width: 860px) {
    .two-columns .column {
        width: 100%;
        padding: 0;
    }
    .two-columns .column + .column {
        margin-top: calc(var(--spacing) * 2);
        border-top: 1px solid var(--color-light);
        padding-top: calc(var(--spacing) * 2);
    }
    .two-columns.columns-soutenir .column + .column {
        margin-top: calc(var(--spacing) * 3);
        padding-top: calc(var(--spacing) * 3);
    }
    .two-columns.contact {
        margin-top: calc(1.35rem * 3);
    }
}
.cta {
    position: relative;
    padding: calc(var(--spacing) * 3) calc(var(--spacing) * 2);
}
.cta .icon {
    position: absolute;
    top: calc(var(--spacing) * -2);
    left: calc(var(-spacing) * 1.25);
    width: 70px;
}
.cta label {
    display: inline-block;
}
@media (max-width: 860px) {
    .cta .icon {
        display: none;
    }
}

/* Styles Génériques */
.main {
    flex-wrap: wrap;
}
.main-cover {
    position: relative;
    width: calc(100% / 2);
}

.main-cover img {
    position: absolute;
    top: 0;
    left: 0;
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.main-text {
    width: calc(100% / 2);
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: calc(var(--spacing) * 2);
}

.main-text .content {
    margin: calc(var(--spacing) * 4) auto calc(var(--spacing) * 2);
    max-width: 500px;
}
@media (max-width: 860px) {
    .main {
        width: 100%;
        height: auto;
        max-height: none;
        margin-left: 0;
        flex-direction: column;
        border-bottom: 1px solid var(--color-light);
        padding-bottom: 1.35rem;
    }
    .main-cover {
        width: 100%;
        height: auto;
        padding-top: 75%;
    }
    .main-text {
        padding: calc(var(--spacing) * 2);
        width: 100%;
    }
    .main-text .content {
        padding: 0;
        max-width: 450px;
    }
}

/* Section Présentation */
#Presentation {
    padding: 0;
}
#Presentation .main-cover {
    background-color: var(--color-green);
}
#Presentation .main-text p:nth-child(2) {
    margin-bottom: calc(var(--spacing) * 1.5);
}

/* Section Vision */

/* Section Réseau */
#Reseau {
    background-color: var(--color-yellow);
}

/* -------------------------------------- */
/* Code toujours utile voué à disparaitre */
/* -------------------------------------- */
.main-intro {
    padding: 0;
}
.main-intro-image {
    position: relative;
    width: calc(100% / 2);
}
.main-intro-image img {
    position: absolute;
    top: 0;
    left: 0;
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    font-family: "object-fit: cover;";
}
.main-intro-text {
    width: calc(100% / 2);
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: calc(var(--spacing) * 2);
}
.main-intro-text .text {
    margin: calc(var(--spacing) * 2) auto;
    max-width: 500px; /*! padding: 0 calc(var(--spacing)*1); */
}
.main-intro.main-intro-revert .main-intro-text {
    padding-left: calc(var(--spacing) * 2);
}
.main-intro.main-intro-sticky {
    height: auto;
    max-height: none;
}
.main-intro.main-intro-sticky .main-intro-image {
    position: sticky;
    top: 50px;
    height: calc(100vh - 50px);
    max-height: 700px;
}
@media (max-width: 1024px) {
    .main-intro.main-intro-revert .main-intro-text {
        padding-left: 0;
    }
}
@media (max-width: 860px) {
    .main-intro {
        width: 100%;
        height: auto;
        max-height: none;
        margin-left: 0;
        flex-direction: column;
        border-bottom: 1px solid var(--color-light);
        padding-bottom: 1.35rem;
    }
    .main-intro-image {
        width: 100%;
        height: auto;
        padding-top: 75%;
    }
    .main-intro-text {
        padding: calc(var(--spacing) * 2);
        width: 100%;
    }
    .main-intro-text .text {
        padding: 0;
        max-width: 450px;
    }
    .main-intro.main-intro-sticky .main-intro-image {
        position: relative;
        top: 0;
        height: auto;
        max-height: none;
    }
    .main-intro.main-intro-revert {
        flex-direction: column-reverse;
    }
}
.exergue {
    display: flex;
}
.exergue .left,
.exergue .right {
    width: 50%;
}
.exergue .image {
    position: relative;
    width: 100%;
    height: 100%;
}
.exergue .image img {
    position: absolute;
    top: 0;
    left: 0;
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    font-family: "object-fit: cover;";
}
.exergue .right {
    padding: calc(1.35rem * 4);
}
@media (max-width: 1024px) {
    .exergue .left {
        width: 40%;
    }
    .exergue .right {
        width: 60%;
        padding: calc(1.35rem * 3);
    }
}
@media (max-width: 860px) {
    .exergue {
        flex-wrap: wrap;
        width: calc(100% + 40px);
        margin-left: -20px;
    }
    .exergue .left,
    .exergue .right {
        width: 100%;
    }
    .exergue .left {
        width: 100%;
    }
    .exergue .left .image {
        width: 100%;
        padding-top: 75%;
    }
    .exergue .right {
        padding: calc(1.35rem * 2) 20px;
    }
}
.encarts {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    justify-content: flex-start;
    width: 100%;
    max-width: 1440px;
    margin-left: auto;
    margin-right: auto;
}
.encarts.encarts-centered {
    justify-content: center;
}
.encarts:not(.encarts-full) {
    padding: 0 20px;
}
.encarts .encart {
    position: relative;
    display: inline-block;
    width: calc((100% - 40px) / 3);
    border: 1px solid #e6e6e6;
    padding: 20px;
}
.encarts .encart .logo img {
    height: 40px;
    margin-bottom: 1.35rem;
}
.encarts .encart .logo:not(.color) img {
    filter: grayscale(100%);
}
.encarts .encart p + p {
    margin-top: 0.7rem;
}
.encarts .encart a:last-child {
    display: inline-block;
    margin-top: 0.7rem;
}
.encarts .encart:nth-child(3n + 2),
.encarts .encart:nth-child(3n + 3) {
    margin-left: 20px;
}
.encarts .encart:nth-child(n + 4) {
    margin-top: 20px;
}
.encarts .encart .links {
    margin-top: 0.7rem;
}
.encarts .encart .links a + a {
    margin-left: 10px;
}
.encarts .encart .links a:last-child {
    margin-top: 0;
}
.encarts .encart .text {
    max-width: none;
}
.encarts .encart .is-ltl {
    position: absolute;
    right: 4px;
    top: -6px;
    width: 24px;
    height: 24px;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    background: #183f47;
}
.encarts .encart .is-ltl svg {
    width: 10px;
    fill: #fff;
}
.encarts.two-cols .encart {
    width: calc((100% - 20px) / 2);
}
.encarts.two-cols .encart:nth-child(3n + 2),
.encarts.two-cols .encart:nth-child(3n + 3) {
    margin-left: 0;
}
.encarts.two-cols .encart:nth-child(even) {
    margin-left: 20px;
}
.encarts.two-cols .encart:nth-child(n + 3) {
    margin-top: 20px;
}
.encarts.two-cols .encart .fav {
    position: absolute;
    right: 4px;
    top: -6px;
    width: 24px;
    height: 24px;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    background: #183f47;
}
.encarts.two-cols .encart .fav svg {
    width: 8px;
    fill: #fff;
}
.encarts[data-type="articles"] {
    justify-content: flex-start;
}
.encarts[data-type="articles"] .encart {
    padding: 0;
    border: none;
}
.encarts[data-type="articles"] .encart-text {
    padding: 20px;
    border: 1px solid #e6e6e6;
    border-top-width: 0;
}
.encarts[data-type="articles"] .encart-image {
    position: relative;
    width: 100%;
    padding-top: 60%;
    display: block;
}
.encarts[data-type="articles"] .encart-image .image-placeholder {
    display: none;
}
.encarts[data-type="articles"] .encart-image picture {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}
.encarts[data-type="articles"] .encart-image img {
    position: absolute;
    top: 0;
    left: 0;
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    font-family: "object-fit: cover;";
    display: none;
}
.encarts[data-type="articles"] .encart[data-type="actu"] .encart-image {
    background: #f8f8f4;
}
.encarts[data-type="articles"] .encart[data-type="actu"] .image-placeholder {
    color: #756e1e;
}
.encarts[data-type="articles"] .encart[data-type="blog"] .encart-image {
    background: #f7f3f4;
}
.encarts[data-type="articles"] .encart[data-type="blog"] .image-placeholder {
    color: #8a394e;
}
.encarts[data-type="articles"] .encart .type {
    text-transform: uppercase;
    font-size: 0.8rem;
    margin-bottom: 0.5rem;
}
.encarts[data-type="articles"] .encart h3 + p {
    margin-top: 0;
}
.encarts[data-type="articles"].show-images .encart-image source {
    display: none;
}
.encarts[data-type="articles"].show-images .encart-image img {
    display: block;
}
.encarts[data-type="articles"].show-images .encart-image .image-placeholder {
    display: inline;
    position: absolute;
    top: 20px;
    left: 20px;
    font-size: 0.85rem;
    padding-right: 75px;
}
.encarts[data-type="annuaire"],
.encarts[data-type="events"] {
    padding: 0;
    margin-top: 0.5rem;
    justify-content: flex-start;
}
@media (max-width: 860px) {
    .encarts:not(.encarts-full) {
        padding: 0;
    }
    .encarts .encart {
        width: 100%;
    }
    .encarts .encart .logo img {
        height: 34px;
    }
    .encarts .encart:nth-child(3n + 2),
    .encarts .encart:nth-child(3n + 3) {
        margin-left: 0;
    }
    .encarts .encart:nth-child(n + 2) {
        margin-top: 20px;
    }
    .encarts.two-cols .encart {
        width: 100%;
    }
    .encarts.two-cols .encart:nth-child(even) {
        margin-left: 0;
    }
    .encarts.two-cols .encart:nth-child(n + 2) {
        margin-top: 20px;
    }
}
.centered-section {
    margin-left: auto;
    margin-right: auto;
    max-width: 900px;
}
.centered-section.buttons .link-btn {
    margin-top: calc(var(--spacing) * 1);
}
.centered-section.buttons[data-size="large"] {
    display: flex;
    flex-wrap: wrap;
    max-width: 900px;
    justify-content: center;
}
.centered-section.article-intro {
    font-style: italic;
}
.centered-section.article-image figcaption,
.centered-section.article-image .caption,
.centered-section.article-embed figcaption,
.centered-section.article-embed .caption {
    font-style: italic;
    margin-top: calc(var(--spacing) * 0.5);
}
.centered-section.article-image[data-size="large"],
.centered-section.article-embed[data-size="large"] {
    max-width: 750px;
}
.centered-section.article-image .embed-container,
.centered-section.article-embed .embed-container {
    position: relative;
    padding-top: 60%;
}
.centered-section.article-image .embed-container iframe,
.centered-section.article-embed .embed-container iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}
.text {
    margin-left: auto;
    margin-right: auto;
    display: flex;
    flex-direction: column;
    justify-content: space-around;
}
.text .picto {
    margin-bottom: calc(var(--spacing) * 0.75);
}
.text h1 {
    margin-bottom: calc(var(--spacing) * 1.35);
}
.text ul:not(.list) {
    list-style: unset;
    padding-left: calc(var(--spacing) * 1);
}
.text blockquote {
    border-left: 3px solid #e6e6e6;
    padding-left: 1em;
    margin-left: -1em;
    width: calc(100% + 1em);
    color: #666;
}
.text hr {
    border: none;
    width: 10px;
    height: 10px;
    background: #756e1e;
    margin: 2.7rem auto;
}
.text .abstract {
    font-style: italic;
}
@media (max-width: 860px) {
    .text h1.offset {
        margin-left: 0;
    }
}
.centered-text {
    display: flex;
    padding: calc(var(--spacing) * 4);
}
.centered-text .two-columns {
    padding-bottom: calc(var(--spacing) * 2);
}
.box {
    position: relative;
    border: var(--border-dashed);
    margin: calc(var(--spacing) * 2) 0;
    padding: calc(var(--spacing) * 1);
    background: var(--color-white);
}
/*.box:not(.centered-section) {
    width: calc(100% + 40px);
    margin-left: calc(var(--spacing) * -1);
}*/
.box.centered-section {
    width: 100%;
    max-width: 490px;
}
.box + p,
.box + ul {
    margin-top: calc(1.35rem * 2);
}
.box ul li + li {
    margin-top: 8px;
    border-top: 1px solid rgb(207 198 151 / 0.5);
    padding-top: 8px;
}
.box.legend {
    border: 1px dotted;
    font-size: 15px;
}
.box .type {
    font-size: 0.8rem;
    text-transform: uppercase;
    margin-bottom: 0.5rem;
    display: inline-block;
}
.box .picto {
    position: absolute;
    top: -32px;
    left: -30px;
    z-index: -1;
}
@media (max-width: 1024px) {
    .box:not(.centered-section) {
        width: 100%;
        margin-left: 0;
    }
    .box:not(.centered-section) .picto {
        top: -33px;
        left: -12px;
    }
}
@media (max-width: 1024px) {
    .box:not(.centered-section) .picto {
        top: -30px;
        left: -10px;
    }
    .box .picto {
        top: -30px;
        left: -10px;
    }
}
@media (max-width: 860px) {
    .box + p,
    .box + ul {
        margin-top: calc(1.35rem * 1.5);
    }
}
.buttons-centered {
    max-width: 1000px;
    margin-left: auto;
    margin-right: auto;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
}
.buttons {
    margin-top: calc(var(--spacing) * 2);
}
.buttons:before {
    content: "";
    display: block;
    margin-top: -1rem;
}
.buttons .link-btn {
    margin-top: 1rem;
}
.link-btn {
    display: inline-block;
    font-family: var(--family-code);
    font-weight: var(--weight-medium);
    font-size: var(--size-6);
    border: var(--border-dashed);
    padding: calc(var(--spacing) * 0.5) calc(var(--spacing) * 1);
    text-decoration: none;
    margin-right: calc(var(--spacing) * 0.5);
}
.link-btn:hover {
    background: var(--color-black);
    color: var(--color-white);
}
.link-btn svg {
    fill: var(--color-black);
}
.link-btn:hover svg {
    fill: var(--color-white);
}
.link-btn .arrow {
    display: inline-block;
    width: calc(var(--spacing) * 0.7);
    margin-left: calc(var(--spacing) * 0.4);
}
.link-btn .arrow svg {
    width: 100%;
}
.link-btn .phone {
    display: inline-block;
    width: calc(var(--spacing) * 0.7);
    margin-left: calc(var(--spacing) * 0.4);
    transform: translateY(1px);
}
.link-btn .phone svg {
    width: 100%;
}
.link-btn.link-external svg {
    transform: rotate(-45deg) scale(1.15);
}
.link-btn.link-download svg {
    transform: rotate(90deg) scale(1.1);
}
.link-btn.link-yellow:hover {
    background: var(--color-yellow);
    color: var(--color-black);
}
.link-btn.link-yellow:hover svg {
    fill: var(--color-black);
}
.link-btn.link-green:hover {
    background: var(--color-green);
    color: var(--color-black);
}
.link-btn.link-green:hover svg {
    fill: var(--color-black);
}
.link-btn.link-pink:hover {
    background: var(--color-pink);
    color: var(--color-black);
}
.link-btn.link-pink:hover svg {
    fill: var(--color-black);
}
.link-btn.link-light:hover {
    background: var(--color-light);
    color: var(--color-black);
}
.link-btn.link-light:hover svg {
    fill: var(--color-black);
}

form {
    display: flex;
    align-items: center;
}
form label {
    user-select: none;
    margin-left: calc(var(--spacing) * 1);
}
form button {
    cursor: pointer;
    padding: calc(var(--spacing) * 0.33) calc(var(--spacing) * 0.8);
    color: var(--color-black);
    background: var(--color-white);
    margin-left: calc(var(--spacing) * 1);
    border: var(--border-dashed);
    font-family: var(--family-code);
    font-weight: var(--weight-medium);
}
form button:hover {
    color: var(--color-white);
    background: var(--color-black);
}
select,
input[type="email"] {
    position: relative;
    padding: calc(var(--spacing) * 0.25) calc(var(--spacing) * 0.5);
    border: 1px solid var(--color-black);
    background: var(--color-white);
    appearance: none;
}
select::-ms-expand,
input[type="email"]::-ms-expand {
    display: none;
}
.select {
    position: relative;
}
.select:after {
    content: "";
    display: block;
    position: absolute;
    right: 14px;
    top: calc(50% - 5px);
    width: 8px;
    height: 8px;
    border: 1px solid var(--color-dark);
    transform: rotate(45deg);
    border-width: 0 1px 1px 0;
    z-index: 2;
    pointer-events: none;
}
.newsletter-form {
    overflow: hidden;
    flex-wrap: wrap;
}
.newsletter-form .input-checkbox {
    position: relative;
}
.newsletter-form .input-checkbox input[type="checkbox"] {
    position: absolute;
    opacity: 0;
    cursor: pointer;
}
.newsletter-form .input-checkbox input[type="checkbox"]:checked + label:before {
    background: #183f47;
}
.newsletter-form .input-checkbox input[type="checkbox"]:checked + label:after {
    position: absolute;
    top: 4px;
    left: 4px;
    width: 6px;
    height: 9px;
    border: 2px solid #fff;
    content: " ";
    transform: rotate(40deg);
    display: block;
    z-index: 1;
    border-width: 0 2px 2px 0;
}
.newsletter-form .input-checkbox label {
    position: relative;
    top: 0;
    width: 100%;
    color: #183f47;
    cursor: pointer;
    display: block;
    padding-left: 20px;
    text-indent: -20px;
}
.newsletter-form .input-checkbox label:before {
    content: "";
    display: inline-block;
    vertical-align: middle;
    transform: translateY(-2px);
    margin-right: 6px;
    width: 14px;
    height: 14px;
    border: 1px solid #183f47;
    border-radius: 3px;
    transition: background 0.2s ease;
}
.newsletter-form input {
    width: 100%;
    max-width: 410px;
}
.newsletter-form .potty {
    position: absolute;
    left: -9999px;
}
@media (max-width: 860px) {
    .select {
        width: 100%;
    }
    .select select {
        width: 100%;
    }
}
.mobile-only {
    display: none;
}
.list li {
    padding: 20px;
    margin-left: -20px;
}
.list li a:last-child {
    display: inline-block;
    margin-top: 0.5rem;
}
.list li h3 {
    font-family: var(--family-primary);
    font-size: (var(--size-4));
}
.list.list-green li:nth-child(even) {
    background: var(--color-green);
}
.list.list-yellow li:nth-child(odd) {
    background: var(--color-yellow);
}
.list.list-pink li:nth-child(even) {
    background: #f7f3f4;
}
@media (max-width: 860px) {
    .mobile-only {
        display: block;
    }
    .desktop-only {
        display: none !important;
    }
    .list li {
        padding: 0;
        margin-left: 0;
    }
    .list li + li {
        margin-top: 1.35rem;
        border-top: 1px dashed var(--color-light);
        padding-top: 1.35rem;
    }
    .list.list-green li:nth-child(even) {
        background: none;
    }
    .list.list-yellow li:nth-child(odd) {
        background: none;
    }
    .list.list-pink li:nth-child(even) {
        background: none;
    }
}
[data-page="blog-article"] h1,
[data-page="blog-article"] h2,
[data-page="action"] h1,
[data-page="action"] h2,
[data-page="faq"] h1,
[data-page="faq"] h2 {
    position: relative;
    scroll-margin-top: 80px;
}
[data-page="blog-article"] h1 a,
[data-page="blog-article"] h2 a,
[data-page="action"] h1 a,
[data-page="action"] h2 a,
[data-page="faq"] h1 a,
[data-page="faq"] h2 a {
    opacity: 0;
    text-decoration: none;
    transition: opacity 0.2s ease;
}
[data-page="blog-article"] h1:hover a,
[data-page="blog-article"] h2:hover a,
[data-page="action"] h1:hover a,
[data-page="action"] h2:hover a,
[data-page="faq"] h1:hover a,
[data-page="faq"] h2:hover a {
    opacity: 0.5;
}
[data-page="blog-article"] h1:hover a:hover,
[data-page="blog-article"] h2:hover a:hover,
[data-page="action"] h1:hover a:hover,
[data-page="action"] h2:hover a:hover,
[data-page="faq"] h1:hover a:hover,
[data-page="faq"] h2:hover a:hover {
    opacity: 1;
}
@media (max-width: 860px) {
    [data-page="blog"] .header-sort .right {
        margin-left: auto;
    }
}
.blog-pagination {
    display: flex;
    justify-content: center;
}
.blog-pagination .index {
    margin: 0 24px;
}
@media (max-width: 860px) {
    .blog-pagination {
        font-size: 0.9rem;
    }
    .blog-pagination .index {
        margin: 0 15px;
    }
}
.faq-section h2 {
    padding: 0.75em 1em;
    width: calc(100% + 2em);
    margin-left: -1em;
}
.faq-section summary {
    cursor: pointer;
    padding-left: 14px;
    text-indent: -14px;
}
.faq-section details {
    padding-left: 14px;
}
.faq-section details summary {
    margin-left: -14px;
}
.faq-section details[open] {
    padding-bottom: 1em;
}
.faq-section details[open] summary {
    margin-bottom: 0.75em;
}
.contact {
    width: 100%;
    max-width: 800px;
    margin-left: auto;
    margin-right: auto;
}
.contact .form {
    margin-top: 0.5rem;
    width: 100%;
    display: flex;
    justify-content: flex-start;
}
.contact .form select {
    position: relative;
}
.contact h3 + p {
    margin-top: 0;
}
.featured {
    width: calc((100% - calc(var(--spacing) * 2)) / 3);
    margin: calc(var(--spacing) * 0.5);
}
.featured .encart {
    display: inline-block;
    margin: calc(var(--spacing) * 0.5);
}
.featured .encart .image {
    display: block;
}
.featured .encart .image + .text {
    border-top: none;
}
.featured .encart .text {
    padding: calc(var(--spacing) * 1);
    max-width: none;
    border: 1px solid var(--color-light);
}
.featured .encart h3 + p {
    margin-top: 0rem;
}
.featured .encart a:last-child {
    display: inline-block;
    margin-top: 0.7rem;
}
.other-actions:not(.encarts-full) {
    width: calc((100% - calc(var(--spacing) * 2)) / 3 * 2);
    margin: calc(var(--spacing) * 0.5);
    display: flex;
    flex-wrap: wrap;
    align-items: stretch; /*! gap: 1rem; */
    align-self: stretch;
}
.other-actions:not(.encarts-full) .encart {
    width: calc(50% - calc(var(--spacing) * 1.5));
    margin: calc(var(--spacing) * 0.5);
    display: flex;
}
.other-actions:not(.encarts-full) .encart:nth-child(even) {
    margin-left: calc(var(--spacing) * 0.5);
}
.other-actions:not(.encarts-full) .encart .text {
    padding: calc(var(--spacing) * 1);
    max-width: none;
    border: 1px solid var(--color-light);
}
.other-actions:not(.encarts-full) .encart h3 + p {
    margin-top: 0rem;
}
.other-actions:not(.encarts-full) .encart a:last-child {
    display: inline-block;
    margin-top: 0.7rem;
}
.actions {
    display: flex;
    flex-wrap: wrap;
    padding: calc(var(--spacing) * 2);
    width: 100%;
    max-width: 1440px;
    margin-left: auto;
    margin-right: auto;
}
.actions h2 {
    width: 100%;
    padding-left: 20px;
}
.actions.actions-green .encart {
    background: var(--color-green);
}
.actions.actions-pink .encart {
    background: var(--color-pink);
}
.actions.actions-yellow .encart {
    background: var(--color-yellow);
}
.actions.actions-dark .encart {
    background: var(--color-lighter);
}
.actions a:hover {
    background: transparent;
}
.actions a + a {
    margin-left: 8px;
}
@media (max-width: 860px) {
    .featured {
        width: 100%;
        margin: inherit;
    }
    .featured .encart .image {
        position: relative;
        display: block;
    }
    .featured .encart .image + .text {
        border-top: none;
    }
    .other-actions:not(.encarts-full) {
        width: 100%;
        margin-left: 0;
    }
    .other-actions:not(.encarts-full) .encart {
        width: 100%;
    }
    .actions {
        width: 100%;
        max-width: 450px;
        margin-left: auto;
        margin-right: auto;
        display: block;
        padding: 0;
    }
    .actions h2 {
        padding-left: 0;
    }
}
.atlas-recap,
.atlas-cols {
    max-width: 1440px;
    margin-left: auto;
    margin-right: auto;
}
.atlas-recap {
    display: flex;
    align-items: flex-start;
    flex-wrap: wrap;
}
.atlas-recap h3 + p {
    margin-top: 0;
}
.atlas-recap .col {
    width: calc((100% - 80px) / 3);
}
.atlas-recap .col:nth-child(3n + 2),
.atlas-recap .col:nth-child(3n + 3) {
    margin-left: 40px;
}
.atlas-recap .col .sans-serif {
    font-family:
        -apple-system,
        BlinkMacSystemFont,
        helvetica neue,
        helvetica,
        arial,
        sans-serif;
    font-weight: 400;
    font-size: 1rem;
}
.atlas-cols {
    border-top: 1px solid #e6e6e6;
    padding-top: calc(1.35rem * 2);
    display: flex;
    flex-wrap: wrap;
}
.atlas-cols .atlas-domaines,
.atlas-cols .atlas-types,
.atlas-cols .atlas-continents {
    width: calc((100% - 80px) / 3);
}
.atlas-cols .atlas-domaines:nth-child(3n + 2),
.atlas-cols .atlas-domaines:nth-child(3n + 3),
.atlas-cols .atlas-types:nth-child(3n + 2),
.atlas-cols .atlas-types:nth-child(3n + 3),
.atlas-cols .atlas-continents:nth-child(3n + 2),
.atlas-cols .atlas-continents:nth-child(3n + 3) {
    margin-left: 40px;
}
.atlas-cols .atlas-domaines h3 + p,
.atlas-cols .atlas-types h3 + p,
.atlas-cols .atlas-continents h3 + p {
    margin-top: 0;
    margin-bottom: 7px;
}
.atlas-cols .atlas-domaines > .col-title h3,
.atlas-cols .atlas-types > .col-title h3,
.atlas-cols .atlas-continents > .col-title h3 {
    text-transform: uppercase;
}
.atlas-cols .atlas-domaines .sans-serif,
.atlas-cols .atlas-types .sans-serif,
.atlas-cols .atlas-continents .sans-serif {
    font-family:
        -apple-system,
        BlinkMacSystemFont,
        helvetica neue,
        helvetica,
        arial,
        sans-serif;
    text-transform: none;
    font-weight: 400;
    font-size: 1rem;
}
.atlas-cols .atlas-domaines .bar,
.atlas-cols .atlas-types .bar,
.atlas-cols .atlas-continents .bar {
    width: 100%;
    margin-top: 5px;
    height: 25px;
    background: #f4f4f4;
}
.atlas-cols .atlas-domaines .bar .fill,
.atlas-cols .atlas-types .bar .fill,
.atlas-cols .atlas-continents .bar .fill {
    position: relative;
    width: 100%;
    height: 100%;
    transform-origin: left top;
}
.atlas-cols .atlas-domaines [data-type="africa"],
.atlas-cols .atlas-types [data-type="africa"],
.atlas-cols .atlas-continents [data-type="africa"] {
    background: #e4d337;
}
.atlas-cols .atlas-domaines [data-type="america"],
.atlas-cols .atlas-types [data-type="america"],
.atlas-cols .atlas-continents [data-type="america"] {
    background: #a31f49;
}
.atlas-cols .atlas-domaines [data-type="asia"],
.atlas-cols .atlas-types [data-type="asia"],
.atlas-cols .atlas-continents [data-type="asia"] {
    background: #f6a44d;
}
.atlas-cols .atlas-domaines [data-type="europe"],
.atlas-cols .atlas-types [data-type="europe"],
.atlas-cols .atlas-continents [data-type="europe"] {
    background: #225d83;
}
.atlas-cols .atlas-domaines [data-type="oceania"],
.atlas-cols .atlas-types [data-type="oceania"],
.atlas-cols .atlas-continents [data-type="oceania"] {
    background: #819a3e;
}
.atlas-cols .atlas-domaines [data-type="energy"],
.atlas-cols .atlas-types [data-type="energy"],
.atlas-cols .atlas-continents [data-type="energy"] {
    background: #e3d237;
}
.atlas-cols .atlas-domaines [data-type="food-farming"],
.atlas-cols .atlas-types [data-type="food-farming"],
.atlas-cols .atlas-continents [data-type="food-farming"] {
    background: #7f993e;
}
.atlas-cols .atlas-domaines [data-type="water"],
.atlas-cols .atlas-types [data-type="water"],
.atlas-cols .atlas-continents [data-type="water"] {
    background: #49729a;
}
.atlas-cols
    .atlas-domaines
    [data-type="information-and-communication-technologies-ict"],
.atlas-cols
    .atlas-types
    [data-type="information-and-communication-technologies-ict"],
.atlas-cols
    .atlas-continents
    [data-type="information-and-communication-technologies-ict"] {
    background: #c0b57f;
}
.atlas-cols .atlas-domaines [data-type="hygiene-health"],
.atlas-cols .atlas-types [data-type="hygiene-health"],
.atlas-cols .atlas-continents [data-type="hygiene-health"] {
    background: #aad095;
}
.atlas-cols .atlas-domaines [data-type="housing"],
.atlas-cols .atlas-types [data-type="housing"],
.atlas-cols .atlas-continents [data-type="housing"] {
    background: #b2b3aa;
}
.atlas-cols .atlas-domaines [data-type="culture-society"],
.atlas-cols .atlas-types [data-type="culture-society"],
.atlas-cols .atlas-continents [data-type="culture-society"] {
    background: #661412;
}
.atlas-cols .atlas-domaines [data-type="tools-machines"],
.atlas-cols .atlas-types [data-type="tools-machines"],
.atlas-cols .atlas-continents [data-type="tools-machines"] {
    background: #b6821b;
}
.atlas-cols .atlas-domaines [data-type="materials"],
.atlas-cols .atlas-types [data-type="materials"],
.atlas-cols .atlas-continents [data-type="materials"] {
    background: #8c6816;
}
.atlas-cols .atlas-domaines [data-type="mobility"],
.atlas-cols .atlas-types [data-type="mobility"],
.atlas-cols .atlas-continents [data-type="mobility"] {
    background: #313628;
}
.atlas-cols .atlas-domaines [data-type="r-d-prototype"],
.atlas-cols .atlas-types [data-type="r-d-prototype"],
.atlas-cols .atlas-continents [data-type="r-d-prototype"] {
    background: #225d82;
}
.atlas-cols .atlas-domaines [data-type="training-education-awareness"],
.atlas-cols .atlas-types [data-type="training-education-awareness"],
.atlas-cols .atlas-continents [data-type="training-education-awareness"] {
    background: #86c8c7;
}
.atlas-cols .atlas-domaines [data-type="service-sale-of-products"],
.atlas-cols .atlas-types [data-type="service-sale-of-products"],
.atlas-cols .atlas-continents [data-type="service-sale-of-products"] {
    background: #6ba5a4;
}
.atlas-cols .atlas-domaines [data-type="institution-communaute-fondation"],
.atlas-cols .atlas-types [data-type="institution-communaute-fondation"],
.atlas-cols .atlas-continents [data-type="institution-communaute-fondation"] {
    background: #487170;
}
.cta-annuaire-form {
    display: flex;
}
.cta-annuaire-form button {
    background: #8a394e;
}
@media (max-width: 860px) {
    .atlas-recap {
        border-top: 1px solid #e6e6e6;
    }
    .atlas-recap .col {
        width: 100%;
    }
    .atlas-recap .col:first-child {
        padding-top: calc(1.35rem * 2);
    }
    .atlas-recap .col:nth-child(3n + 2),
    .atlas-recap .col:nth-child(3n + 3) {
        margin-left: 0;
    }
    .atlas-cols {
        border-top: none;
        padding-top: 0;
    }
    .atlas-cols .atlas-domaines,
    .atlas-cols .atlas-types,
    .atlas-cols .atlas-continents {
        width: 100%;
        padding-top: calc(1.35rem * 2);
        border-top: 1px solid #e6e6e6;
    }
    .atlas-cols .atlas-domaines:nth-child(3n + 2),
    .atlas-cols .atlas-domaines:nth-child(3n + 3),
    .atlas-cols .atlas-types:nth-child(3n + 2),
    .atlas-cols .atlas-types:nth-child(3n + 3),
    .atlas-cols .atlas-continents:nth-child(3n + 2),
    .atlas-cols .atlas-continents:nth-child(3n + 3) {
        margin-left: 0;
        margin-top: 40px;
    }
}
.library {
    display: flex;
    flex-wrap: wrap;
    padding: calc(var(--spacing) * 4) calc(var(--spacing) * 6);
}
.library .library-one-type {
    width: 100%;
}
.library .library-one-type ul {
    margin-top: 0.75rem;
    display: flex;
    flex-wrap: wrap;
}
.library .library-one-type ul li {
    margin-bottom: 8px;
    width: calc((100% - 40px) / 3);
    border: 1px solid #e6e6e6;
    position: relative;
}
.library .library-one-type ul li a {
    display: block;
    padding: 8px 12px;
    padding-right: 20px;
}
.library .library-one-type ul li:nth-child(3n + 2),
.library .library-one-type ul li:nth-child(3n + 3) {
    margin-left: 20px;
}
.library .library-one-type ul li .fav {
    position: absolute;
    right: 4px;
    top: -6px;
    width: 24px;
    height: 24px;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    background: #183f47;
}
.library .library-one-type ul li .fav svg {
    width: 8px;
    fill: #fff;
}
.library .library-one-type ul li:hover {
    cursor: pointer;
    border: 1px solid #183f47;
}
.library .library-group {
    width: calc((100% - 40px) / 3);
}
.library .library-group:nth-child(3n + 2),
.library .library-group:nth-child(3n + 3) {
    margin-left: 20px;
}
.library .library-group:nth-child(n + 4) {
    margin-top: 40px;
}
.library .library-group ul {
    margin-top: 0.75rem;
}
.library .library-group ul li {
    border: 1px solid var(--color-light);
    position: relative;
}
.library .library-group ul li a {
    display: block;
    padding: 8px 12px;
    padding-right: 20px;
}
.library .library-group ul li + li {
    margin-top: 8px;
}
.library .library-group ul li .fav {
    position: absolute;
    right: calc(var(--spacing) * 0.25);
    top: calc(var(--spacing) * -0.5);
    width: calc(var(--spacing) * 1.5);
    height: calc(var(--spacing) * 1.5);
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    background: var(--color-green);
}
.library .library-group ul li .fav svg {
    width: 8px;
    fill: var(--color-black);
}
.library .library-group ul li:hover {
    cursor: pointer;
    border: 1px solid #183f47;
}
@media (max-width: 860px) {
    .library {
        padding: 0;
    }
    .library .library-group {
        width: 100%;
        max-width: 450px;
        margin: 0 auto;
    }
    .library .library-group ul li a .fav {
        right: -8px;
        top: -6px;
    }
    .library .library-group:nth-child(3n + 2),
    .library .library-group:nth-child(3n + 3) {
        margin-left: auto;
    }
    .library .library-group:nth-child(n + 4) {
        margin-top: 0;
    }
    .library .library-group + .library-group {
        margin-top: calc(1.35rem * 1.5);
    }
}
.cta-decoupage {
    padding-top: calc(1.35rem * 3);
    border-top: 1px solid #e6e6e6;
}
.cta-initial {
    display: flex;
    justify-content: space-between;
    padding: 0 20px;
}
.cta-initial .col {
    width: calc(50% - 20px);
    padding: calc(1.35rem * 2.5);
}
.bandeau {
    background: #f7f7f7;
    padding: 5px;
    margin-top: 10px;
    margin-bottom: 10px;
}
[data-id="r-d"],
[data-id="service"],
[data-id="training"],
[data-id="institution"] {
    display: inline-block;
    padding: 0 6px;
    border-radius: 9px;
    margin-top: 3px;
}
[data-id="r-d"]:not(:last-child),
[data-id="service"]:not(:last-child),
[data-id="training"]:not(:last-child),
[data-id="institution"]:not(:last-child) {
    margin-right: 4px;
}
[data-id="r-d"] {
    background: rgb(241 233 193 / 0.6);
}
[data-id="service"] {
    background: rgb(246 170 130 / 0.2);
}
[data-id="training"] {
    background: rgb(219 239 245 / 0.7);
}
[data-id="institution"] {
    background: rgb(170 209 149 / 0.25);
}
@media (max-width: 860px) {
    .cta-initial {
        flex-direction: column;
        padding: 0;
    }
    .cta-initial .col {
        width: calc(100% + 40px);
        margin-left: -20px;
        padding: calc(1.35rem * 2) 20px;
    }
    .cta-decoupage {
        padding-top: calc(1.35rem * 2);
        border-top: 1px solid #e6e6e6;
    }
}
.encyclowpedie-browse {
    margin: auto;
}
.encyclowpedie-browse h2::after {
    display: none;
}
.encyclowpedie-browse form {
    display: flex;
    flex-direction: column;
    gap: calc(var(--spacing) * 1);
}
.encyclowpedie-browse label {
    display: block;
    margin-bottom: 5px;
}
.encyclowpedie-browse button {
    color: var(--color-black);
    font-family: var(--family-code);
    font-weight: var(--weight-medium);
    text-align: center;
    border: var(--border-dashed);
    margin-left: 0;
}
.encyclowpedie-browse .yellow-button:hover {
    background-color: var(--color-black);
    color: var(--color-yellow);
}
.encyclowpedie-browse .pink-button {
    border-color: var(--color-black); /*! background: var(--color-white); */
}
.encyclowpedie-browse .pink-button:hover {
    background-color: var(--color-black);
    color: var(--color-pink);
}
.encyclowpedie-browse .title {
    text-align: center;
    margin-bottom: calc(var(--spacing) * 2.2);
}
.encyclowpedie-browse .search {
    width: 50%;
    display: block;
    margin: auto;
}
.encyclowpedie-browse .search .search-bar {
    color: var(--color-black);
    border: 1px solid var(--color-black);
    background: var(--color-white);
    width: 100%;
    padding: calc(var(--spacing) * 0.25) calc(var(--spacing) * 0.5);
    height: auto;
}
@media (max-width: 860px) {
    .encyclowpedie-browse .search {
        width: 100%;
    }
}
.encyclowpedie-browse .select-container {
    display: flex;
    gap: 20px;
    width: 50%;
}
@media (max-width: 860px) {
    .encyclowpedie-browse .select-container {
        flex-direction: column;
        width: 100%;
    }
}
.encyclowpedie-browse .select-country,
.encyclowpedie-browse .select-field,
.encyclowpedie-browse .select-other {
    flex: 1;
    border-radius: 4px;
    margin: 2px;
}
.encyclowpedie-browse .select-country select,
.encyclowpedie-browse .select-field select,
.encyclowpedie-browse .select-other select {
    width: 100%;
    margin-top: 5px;
}
section.three-columns .column-title {
    padding: 0;
}
@media (max-width: 860px) {
    .column .mobile-only {
        display: block;
    }
    .column .desktop-only {
        display: none !important;
    }
}
.separation {
    height: 1px;
    margin-top: 10px;
    margin-bottom: 10px;
    width: 100%;
    position: relative;
    left: -10px;
    border-top: 1px solid silver;
}

li .encyclowpedie-fav {
    position: absolute;
    right: 12px;
    top: 20px;
    display: flex;
    justify-content: center;
    align-items: center;
}
li .encyclowpedie-fav svg {
    width: 16px;
}
li .encyclowpedie-fav p {
    font-size: 20px;
}
@media (max-width: 860px) {
    li .encyclowpedie-fav {
        left: 0;
    }
}

/* Custom sections */
/* ------------------
*/

#Encyclowpedie {
    background: var(--color-pink);
}

/* Membres */
#Membres .grid {
    grid-template-columns: repeat(3, 1fr);
}
#Membres .grid .cell {
    align-self: stretch;
    justify-self: stretch;
    border: var(--border);
    border-color: var(--color-light);
    padding: calc(var(--spacing) * 1);
}
#Membres p:first-child + p {
    margin-top: calc(var(--spacing) * 0.5);
}
#Membres p + p {
    margin-top: calc(var(--spacing) * 0.25);
}
#Membres h3 {
    margin-top: calc(var(--spacing) * 2);
}

/* Soutenir */
#soutenir {
    background: var(--color-yellow);
}
