/* ### MAIN LAYOUT ### */
body.resize *{
        transition: none !important;
        animation: none !important;
}
body.global-search-open{
        overflow: hidden;
}
#main{
        margin: 0;
        min-height: 50vh;
        /*padding-top: 140px;*/
}
.default-section-container{
        position: relative;
        overflow: hidden;
}
.default-section{
        position: relative;
        margin: 0 auto;
        max-width: var(--max-width-section);
        padding: 64px var(--margin-section);
}
.default-section-inner{
        display: flex;
        flex-direction: column;
        align-items: center;
        row-gap: 32px;
}

.full-width-section{
        position: relative;
        width: 100%;
        margin-bottom: 64px;
}

.default-grid{
        display: grid;
        grid-template-columns: repeat(12, 1fr);
        padding: 0;
        column-gap: 24px;
        row-gap: 24px;
        width: 100%;
}

/* ### BUTTONS ### */
.btn {
        font-family: 'Agrandir';
        display: inline-flex;
        align-self: flex-start;
        align-items: center;
        padding: 2px 16px;
        gap: 8px;
        font-weight: 800;
        transition: none;
}
.btn.primary {
        background: var(--primary-color);
        color: #000;
        border-radius: 40px;
}
.btn.primary:hover{
        background: #000;
        color: var(--primary-color);
}
.btn.primary:hover .text{
        color: var(--primary-color);;
}
.btn.primary:hover .icon path{
        fill: var(--primary-color);
}
.btn.primary:focus-visible,
.btn.primary:focus{
        outline: none;
        box-shadow: none;
}
.btn.inline {
        border-radius: 40px;
        color: #000;
        border: 1px solid #000;
}
.btn.inline:hover {
        background: var(--primary-color);
}
.btn.inline:focus{
        box-shadow: none;
        outline: none;
}
.btn.turquoise-blue {
        background: var(--seventh-color);
        color: #000;
        border-radius: 40px;
}
.btn.turquoise-blue:hover{
        background: #000;
}
.btn.turquoise-blue:hover .text{
        color: var(--seventh-color);
}
.btn.turquoise-blue:hover .icon path{
        fill: var(--seventh-color);
}
.btn.has-svg{
        padding: 2px 16px 2px 14px;
}
.btn svg {
        display: flex;
        align-self: center;
        width: 20px;
}
.btn.blue {
        background: var(--eighth-color);
        color: #000;
        border-radius: 40px;
}
.btn.blue:hover{
        background: #000;
}
.btn.blue:hover .text{
        color: var(--eighth-color);
}
.btn.blue:hover .icon path{
        fill: var(--eighth-color);
}

.btn.pastel-blue {
        background: var(--sixth-color);
        color: #000;
        border-radius: 40px;
        font-weight: 700;
}
.btn.pastel-blue:hover{
        background: #000;
        color: var(--sixth-color);
}
.btn.pastel-blue:hover .text{
        color: var(--sixth-color);
}
.btn.pastel-blue:hover .icon path{
        fill: var(--sixth-color);
}

/* ### TAGS ### */
.genres-container.tags .facetwp-type-checkboxes,
.tags{
        display: flex;
        flex-wrap: wrap;
        row-gap: 8px;
        column-gap: 16px;
}
.tags .facetwp-checkbox,
.tag{
        border-radius: 100%;
        padding: 8px 16px;
        text-transform: uppercase;
}
.tag.primary{
        background: var(--primary-color);
}
.tag.fifth{
        background: var(--seventh-color);
}
.tag.second{
        background: var(--second-color);
}
.tag.tenth{
        background: var(--tenth-color);
}
.tag.third{
        background: var(--third-color);
}
.tag.sixth{
        background: var(--fifth-color);
}
.tag.fourth{
        background: var(--fourth-color);
}



/* ### TITLE ### */
.section-title-container {
        position: relative;
        display: flex;
        flex-direction: column;
        align-items: center;
        row-gap: 8px;
}
.section-title-container .icon{
        position: relative;
        width: 120px;
        height: 120px;
}
.section-title-container svg {
        width: 100%;
        height: 100%;
}
.section-title-container .icon::before,
.section-title-container .icon::after{
        content: '';
        position: absolute;
        top: 50%;
        transform: translate(0, -50%);
        width: 100vw;
        height: 3px;
        background: #000;
}
.section-title-container .icon::before{
        right: calc(100% + 40px);
}
.section-title-container .icon::after{
        left: calc(100% + 40px);
}
.section-title-container h2{
        font-size: 48px;
        font-weight: 900;
        color: var(--default-text-color);
        text-align: center;
}


/* ### SECTION CONTENT ### */
.section-content {
        position: relative;
        width: 100%;
}
.section-content-header {
        position: absolute;
        top: -80px;
        left: 0;
        display: flex;
        justify-content: end;
        align-items: center;
        column-gap: 24px;
        width: 100%;
}
.section-content-header .arrows {
        display: flex;
        column-gap: 8px;
}
.section-content-header .arrows .arrow{
        cursor: pointer;
}
.section-content-header a {
        color: #000;
        text-decoration: underline;
}

/* ### POST SLIDER ### */
.posts-slider {
        position: relative;
        width: 100%;
}
.posts-slider-track-container {
        /*overflow: hidden;*/
}
.posts-slider .posts-slider-track {
        display: flex;
        column-gap: 32px;
        transition: transform 0.5s ease;
        will-change: transform;
}
.posts-slider .post-item {
        position: relative;
        display: flex;
        column-gap: 0;
        flex: 0 0 calc(100% / 2.5);
        box-sizing: border-box;
        cursor: pointer;
}
.posts-slider .post-item img{
        width: 50%;
        height: 264px;
        object-fit: cover;
        user-select: none;
}
.posts-slider .post-item .post-item-content {
        position: relative;
        display: flex;
        flex-direction: column;
        justify-content: space-between;
        width: 50%;
        padding: 16px;
        border: 12px solid var(--eleventh-color);
        overflow: hidden;
}
.pro-item .circle,
.show-item .circle,
.ressource-item .circle,
.shows-slider .show-item .circle,
.posts-slider .post-item .circle {
        position: absolute;
        width: 0;
        height: 0;
        border-radius: 50%;
        background: var(--second-color);
        transition: width .3s, height .3s;
        pointer-events: none;
        transform: translate(-50%, -50%);
        z-index: 0;
}
.pro-item:hover .circle,
.show-item:hover .circle,
.ressource-item:hover .circle,
.shows-slider .show-item:hover .circle,
.posts-slider .post-item:hover .circle {
        width: 80px;
        height: 80px
}
.posts-slider .post-item .post-item-content .post-item-content-inner {
        display: flex;
        flex-direction: column;
        row-gap: 24px;
}
.posts-slider .post-item .post-item-content h3 {
        position: relative;
        font-size: 20px;
        font-weight: 800;
}
.posts-slider .post-item .post-item-content h3::after {
        content: "";
        position: absolute;
        bottom: -12px;
        left: 0;
        width: 60%;
        height: 4px;
        background: #000;
}
.posts-slider .post-item .post-item-content .desc {
        position: relative;
        font-size: 14px;
}

.posts-slider .post-item .post-item-content .more {
        position: relative;
        color: #000;
}

.posts-slider .post-item .post-item-content .more:hover{
        background-color: var(--eleventh-color);
}

/* ### SHOWS SLIDER ### */
.shows-slider {
        position: relative;
        width: 100%;
}
.shows-slider-track-container {
        /*overflow: hidden;*/
}
.shows-slider .shows-slider-track {
        display: flex;
        column-gap: 24px;
        transition: transform 0.5s ease;
        will-change: transform;
}
.shows-slider-track.slider-track.num-show-1{
        justify-content: center;
}
.shows-slider .show-item {
        position: relative;
        display: flex;
        align-self: initial;
        column-gap: 0;
        flex: 0 0 calc(100% / 3 - 16px);
        box-sizing: border-box;
        cursor: pointer;
        height: auto;
}
.show-item {
        display: flex;
        flex-direction: column;
        align-self: self-start;
        gap: 24px;
        height: 100%;
}
.show-item > img {
        width: 100%;
        aspect-ratio: 4.5/3;
        object-fit: cover;
        user-select: none;
}
.show-content {
        position: relative;
        display: flex;
        flex-direction: column;
        row-gap: 24px;
        padding: 20px 24px 24px;
        border-bottom-left-radius: 24px;
        border-bottom-right-radius: 24px;
        overflow: hidden;
        height: 100%;
}
.shows-section.primary .show-content{
        background: var(--primary-color);
}
.shows-section.inline .show-content {
        border: 1px solid #000;
}
.shows-section.inline .show-item{
        grid-column: span 4;
        border-bottom-left-radius: 16px;
        border-bottom-right-radius: 16px;
        outline: 12px solid transparent;
        transition: background 0.2s ease, outline 0.2s ease;
}
.shows-section.inline .show-item:hover {
        background: var(--primary-color);
        outline: 12px solid var(--primary-color);
}
.show-genres {
        position: absolute;
        top: 12px;
        right: 12px;
}
.show-genres .tags {
        flex-direction: column;
        gap: 4px;
        align-items: end;
}
.show-genres .tag {
        padding: 6px 12px;
        font-size: 12px;
}
.show-content h3 {
        position: relative;
        font-family: 'Agrandir Text';
        font-size: 24px;
        font-weight: 800;
}
.show-content h3::after {
        content: "";
        position: absolute;
        bottom: -12px;
        left: 0;
        width: 30%;
        height: 4px;
        background: #000;
}
.show-content-inner {
        display: flex;
        justify-content: space-between;
        align-items: flex-end;
}
.show-content-inner .icons {
        display: flex;
        flex-direction: column;
        justify-content: flex-end;
        gap: 8px;
}
.show-content-inner .icons .icon svg{
        position: relative;
        width: 40px;
        max-height: 40px;
}
.show-content .infos .company {
        position: relative;
        display: inline-flex;
        align-self: flex-start;
        background: #000;
        color: #fff;
        padding: 3px 8px 2px 8px;
}
.show-content .infos {
        display: flex;
        flex-direction: column;
        gap: 8px;
}
.show-content .infos .date-hour {
        position: relative;
        text-transform: uppercase;
        padding-left: 20px;
}
.show-content .infos .date-hour .hour {
        font-size: 14px;
}
.show-content .infos .date-hour::before {
        content: '';
        position: absolute;
        left: 0;
        top: 50%;
        transform: translate(0, -50%);
        width: 12px;
        height: 12px;
        background: #000;
        border-radius: 50px;
}
.show-content .infos .btn{
        position: relative;
}
.show-statut {
        position: absolute;
        top: 0;
        left: 0;
        display: flex;
        justify-content: center;
        align-items: center;
        z-index: 4;
        background: rgb(64 47 69 / 60%);
        width: 100%;
        aspect-ratio: 4.5/3;
        font-size: 48px;
        line-height: 1;
        font-weight: 800;
        color: var(--second-color);
}

/* ### GLOBAL SEARCH ### */
.global-search-container {
        display: none;
        position: fixed;
        top: 0;
        left: 0;
        bottom: 0;
        right: 0;
        background: rgba(0, 0, 0, 0.8);
        backdrop-filter: blur(5px);
        z-index: 999;
}
.global-search{
        position: absolute;
        top: 20vh;
        left: 50%;
        transform: translate(-50%, 0);
        display: flex;
        flex-direction: column;
        align-items: center;
}
.global-search-container input {
        width: 800px;
        font-size: 24px;
        line-height: 1;
        padding: 12px 64px 12px 24px !important;
        border: 1px solid #000;
}
.global-search-container input:focus-visible {
        outline: none;
}
.global-search-container .close-search-btn > svg {
        position: absolute;
        bottom: 56px;
        width: 56px;
        left: 50%;
        transform: translate(-50%, 0);
        cursor: pointer;
}
.global-search-inner svg {
        position: absolute;
        top: 17px;
        right: 20px;
        width: 24px;
        opacity: 0.6;
        cursor: pointer;
}
.global-search-inner {
        position: relative;
}
.global-search-inner svg * {
        fill: #000;
}
.global-search-results-container{
        display: none;
}
.global-search-results-container .loading-spinner {
        display: inline-block;
        width: 40px;
        height: 40px;
        border: 3px solid #fff;
        border-radius: 50%;
        border-top: 3px solid #000;
        border-bottom: 3px solid #000;
        animation: spin 1s linear infinite;
        margin: 10px auto;
}
/* Animation du spinner */
@keyframes spin {
        0% {
                transform: rotate(0deg);
        }
        100% {
                transform: rotate(360deg);
        }
}
.global-search-inner .global-search-results {
        display: flex;
        flex-direction: column;
        width: 100%;
        padding: 8px 0;
        border: 1px solid #000;
        background: #fff;
        max-height: 34vh;
        overflow-y: scroll;
}
.global-search-inner .global-search-results .search-item {
        font-family: 'Agrandir';
        padding: 8px 24px;
        cursor: pointer;
}
.global-search-inner .global-search-results .no-result {
        font-family: 'Agrandir';
        padding: 8px 24px;
}
.global-search-inner .facetwp-facet.facetwp-type-search {
        margin: 0;
}
.global-search-inner .global-search-results .search-item:hover {
        background: var(--primary-color);
}
.global-search-inner .global-search-results .search-item a {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 12px;
        line-height: 1;
}
.search-item .tag {
        font-size: 12px;
        padding: 7px 12px 6px;
}
.search-item .tag.post {
        background: #47E791;
}
.search-item .tag.page {
        background: #f37050;
}
.search-item .tag.spectacle {
        background: var(--primary-color);
}


/* ### CAROUSEL ### */
.gallery-slider {
        position: relative;
        width: 100%;
        height: auto;
        aspect-ratio: 16/9;
        margin: 0 auto;
}
.gallery-slider .slides {
        position: relative;
        width: 100%;
        height: 100%;
}
.gallery-slider .slide-item{
        position: absolute;
        width: 100%;
        height: 100%;
}
.gallery-slider .slide {
        width: 100%;
        height: 100%;
        object-fit: cover;
}
.gallery-slider .slide-item.active .slide{
        display: block;
}
.gallery-slider .slide-item .caption{
        position: absolute;
        top: calc(100% + 8px);
        left: 0;
        display: none;
        width: 100%;
        font-size: 14px;
}
.gallery-slider .slide-item.active .caption{
        display: block;
}

.gallery-slider .dots {
        position: absolute;
        right: 16px;
        bottom: 16px;
        display: flex;
        column-gap: 8px;
        text-align: center;
}
.gallery-slider .dots.one-element{
        display: none;
}
.gallery-slider .dot {
        display: inline-block;
        width: 16px;
        height: 16px;
        background-color: transparent;
        border: 2px solid #fff;
        border-radius: 50%;
        cursor: pointer;
}
.gallery-slider .dot.active {
        background: #fff;
}
.gallery-single{
        width: 100%;
}
.gallery-single img,
.gallery-single iframe{
        width: 100%;
        object-fit: cover;
}

.gallery-single iframe{
        aspect-ratio: 16 / 9;
}

/* ### BREADCRUMBS ### */
.breadcrumbs a {
        text-decoration: underline;
}
.breadcrumbs a:hover {
        color: var(--second-color);
}

/* ### GRAPHIC ELEMENTS ### */
.graphic-element{
        position: absolute;
        z-index: -1;
}


/* ### RESOURCES ### */
.default-grid.ressources-grid{
        column-gap: 40px;
}
.ressource-item {
        position: relative;
        grid-column: 4 span;
        display: flex;
        flex-direction: column;
        row-gap: 8px;
}
.ressource-item::before{
        content: '';
        position: absolute;
        top: 50%;
        left: calc(100% + 20px);
        transform: translateY(-50%);
        height: 90%;
        width: 1px;
        background-color: #000;
        z-index: -1;
}
.ressource-item:nth-child(3n)::before{
        display: none;
}
.ressource-item img {
        width: 100%;
        aspect-ratio: 16/9;
        object-fit: cover;
}
.ressource-content{
        position: relative;
        overflow: hidden;
        padding: 4px 8px 32px;
        border: 10px transparent solid;
        transition: border-color 0.2s ease;
}
.ressource-item:hover .ressource-content{
        position: relative;
        overflow: hidden;
        border: 10px var(--primary-color) solid;
}
.ressource-content h3 {
        position: relative;
        font-family: 'Agrandir Text';
        text-transform: uppercase;
        margin-bottom: 16px;
        font-weight: 800;
}
.ressource-content h3::after{
        content: '';
        position: absolute;
        bottom: -8px;
        left: 0;
        height: 4px;
        width: 80px;
        background-color: #000;
}
.ressource-content span {
        position: relative;
        background-color: #000;
        color: #fff;
        padding: 0 4px;
}


.banner.full-width-section img {
        width: 100%;
        object-fit: cover;
        height: 70vh;
}
.banner-content {
        position: absolute;
        bottom: 0;
        left: 0;
        right: 0;
        max-width: var(--max-width-section);
        margin: 0 auto;
        padding: 0 var(--margin-section);
}
.no-banner-img .banner-content{
        position: relative;
        padding: 0;
}
.no-banner-img .graphic-elements,
.no-banner-img .graphic-element{
        display: none;
}
.banner-content.top {
        top: 0;
        left: 50%;
        bottom: initial;
        right: initial;
        transform: translate(-50%, 0);
}
.banner-content.center {
        display: flex;
        justify-content: center;
}
.banner-content .tags {
        margin-bottom: 16px;
}
.banner-content .tag {
        font-size: 18px;
        letter-spacing: 1px;
        color: #000;
}
.banner-content .banner-title {
        font-family: 'Agrandir Text';
        display: inline-block;
        max-width: 704px;
        font-size: 52px;
        font-weight: 800;
        line-height: 1;
        color: #000;
        padding: 4px 24px;
        margin: 0;
        background: var(--primary-color);
        border-top-left-radius: 24px;
        border-top-right-radius: 24px;
}
.top.banner-content .banner-title {
        border-radius: 0 0 24px 24px;
}
.banner-content .infos {
        position: absolute;
        top: calc(100% + 16px);
        display: flex;
        align-items: center;
        row-gap: 16px;
        column-gap: 16px;
}
.banner-content .infos .credits {
        display: flex;
        column-gap: 24px;
        font-family: 'Agrandir Text';
        padding: 0 16px;
        background: #000;
        font-size: 28px;
        line-height: 1.2;
        font-weight: bold;
}
.banner-content .infos .credits .director,
.banner-content .infos .credits .company{
        position: relative;
        font-family: 'Agrandir Text';
        color: #fff;
}
.banner-content .infos .credits .company::after{
        content: '';
        position: absolute;
        width: 1px;
        height: 24px;
        background: #fff;
        left: -12px;
        bottom: 5px;
}
.banner-content .infos .credits.no-director .company::after{
        display: none;
}
.banner-content .infos .dates {
        padding: 0 16px;
        font-size: 26px;
        line-height: 1.2;
        color: #000;
        text-transform: uppercase;
        border: 1px solid #000;
}



.banner .graphic-elements {
        position: absolute;
        bottom: 0;
        left: 0;
        right: 0;
        max-width: var(--max-width-section);
        margin: 0 auto;
}
.banner .graphic-element{
        z-index: 2;
}
.banner .graphic-element:nth-of-type(1) {
        position: absolute;
        bottom: 24px;
        right: 40px;
}
.banner .graphic-element:nth-of-type(2) {
        position: absolute;
        top: 80px;
        left: 40px;
}
.banner.no-banner-img .banner-content-inner {
        position: relative;
}
.banner.no-banner-img .banner-content-inner .banner-title {
        position: relative;
        top: initial;
        left: initial;
        border-radius: 0 0 24px 24px;
}
.content-section.no-banner-img {
        padding-top: 40px;
}

.right-col .content h1 {
        position: relative;
        font-family: 'Agrandir Text';
        font-size: 40px;
        font-weight: 800;
        margin: 0;
}
.right-col .content h1::after {
        content: '';
        position: absolute;
        bottom: -8px;
        left: 0;
        height: 4px;
        width: 80px;
        background: #000;
}


.wrapper {
        border-bottom: 4px solid #000;
}
.wrapper-header {
        display: flex;
        justify-content: space-between;
        align-items: center;
        padding: 12px 0;
        column-gap: 16px;
        cursor: pointer;
}
.wrapper-header span {
        font-size: 24px;
        font-weight: 800;
        line-height: 1.2;
}
.wrapper-header .wrapper-header-inner {
        font-size: 14px;
        font-weight: 500;
}
.wrapper-header svg {
        width: 28px;
        height: 28px;
        transform: rotate(90deg);
        flex-shrink: 0;
}
.is-open .wrapper-header svg {
        transform: rotate(-90deg);
}
.wrapper-content {
        overflow: hidden;
        padding-bottom: 16px;
}

.wrapper-content a {
        text-decoration: underline;
}
.wrapper-content a:hover{
        color: var(--primary-color);
        color: var(--current-color);
}

.tcm-password-form {
        grid-column: 3 / span 6;
}
.tcm-password-form > p {
        display: inline-flex;
        align-self: start;
        background: var(--sixth-color);
        margin: 0;
        padding: 16px 24px;
        font-weight: 800;
}
.tcm-password-form-inner {
        display: flex;
        flex-direction: column;
        row-gap: 18px;
        margin-top: 24px;
}
.tcm-password-form-inner input {
        display: inline-flex;
        align-self: start;
        border-radius: 56px;
        border: 1px solid #000;
        padding: 4px 24px;
}

/* ### MODAL NEWSLETTER ### */
.modal-content {
        border: 0;
        border-radius: 0;
}
.modal-header {
        padding: 20px 24px 24px 24px;
        border: 0;
}
.modal-footer {
        padding: 12px 24px 20px 24px;
        border: 0;
}
.modal-body {
        display: flex;
        flex-direction: column;
        row-gap: 16px;
        padding: 0 24px 24px;
}
.modal-title {
        position: relative;
        display: inline-flex;
        align-self: start;
        font-size: 24px;
        font-style: normal;
        font-weight: 500;
        line-height: normal;
}
.sib_signup_box_inside_1 {
        display: flex;
        flex-direction: column;
        row-gap: 24px;
}
.row-form-newsletter {
        display: flex;
        flex-direction: column;
}
.row-form-newsletter label {
        display: none;
}
.row-form-newsletter textarea,
.row-form-newsletter input {
        font-family: 'Agrandir';
        display: inline-flex;
        align-self: flex-start;
        align-items: center;
        padding: 2px 16px;
        gap: 8px;
        font-weight: 800;
        transition: none;
        background: var(--primary-color);
        color: #000;
        border-radius: 40px;
}
.row-form-newsletter textarea:focus-visible,
.row-form-newsletter input:focus-visible{
        outline: none;
}
.row-form-newsletter textarea::placeholder,
.row-form-newsletter input::placeholder {
        background: #000;
        color: var(--primary-color);
}
.sib_msg_disp{
        display: none;
}
.modal-body p{
        margin: 0;
}
.modal-body .btn{
        display: inline-flex;
        align-self: start;
        margin: 0;
}
.row-input {
        display: flex;
        flex-direction: column;
        row-gap: 4px;
}
.row-input input {
        border: 1px solid #000;
        padding: 4px 12px;
}

.modal-header .btn-close:focus-visible,
.modal-header .btn-close:focus {
        outline: none;
        box-shadow: none;
}

/* ### 404 ### */
.error-404-section .graphic-element:nth-of-type(1) {
        bottom: 0;
        left: 0;
}
.error-404-section .graphic-element:nth-of-type(2) {
        top: 40px;
        right: 80px;
}
.default-section-container.error-404-section {
        min-height: 50vh;
}
.error404 #footer {
        margin-top: 40px;
}
.error-404-section .default-section-inner{
        align-items: start;
        row-gap: 8px;
}
.error-404-section h1{
        font-weight: 800;
}
.error-404-section .section-header{
        margin-top: 32px;
}
.error-404-section .section-header span {
        font-size: 24px;
}

@media (max-width: 1400px) {

}

@media (max-width: 1200px) {
        .shows-slider .show-item {
                flex: 0 0 calc(100% / 2.5 - 16px);
        }

        .section-title-container .icon {
                width: 104px;
                height: 104px;
        }
        .section-title-container h2 {
                font-size: 40px;
        }

        .graphic-element{
                display: none;
        }

        .banner-content .tag {
                font-size: 16px;
        }
        .banner-content .banner-title {
                font-size: 44px;
        }
        .banner-content .infos .credits {
                font-size: 24px;
        }
        .banner-content .infos .dates {
                font-size: 22px;
        }
}

@media (max-width: 992px) {
        body.nav-open{
                overflow: hidden;
        }
        .default-section{
                padding: 32px var(--margin-section);
        }

        .shows-slider .show-item {
                flex: 0 0 calc(100% / 2 - 16px);
        }

        .show-item:hover .circle,
        .ressource-item:hover .circle,
        .pro-item:hover .circle,
        .shows-slider .show-item .circle,
        .posts-slider .post-item .circle{
                display: none;
        }

        .global-search-container input{
                width: 95vw;
        }

        .posts-slider .post-item {
                flex: 0 0 calc(100% / 1.5);
        }

        .banner .graphic-element{
                display: none;
        }

        .banner-content .banner-title {
                max-width: 600px;
                margin-left: 0;
        }

        .ressource-item {
                grid-column: 6 span;
        }
        .ressource-item:nth-child(2n)::before{
                display: none;
        }
        .ressource-item:nth-child(3n)::before{
                display: block;
        }
}

@media (max-width: 768px) {
        .default-section{
                padding: 24px var(--margin-section);
        }

        .shows-slider .show-item {
                flex: 0 0 calc(100% / 1.5 - 16px);
        }

        .full-width-section {
                margin-bottom: 40px;
        }
        .default-section {
                padding: 24px var(--margin-section);
        }

        .section-content {
                padding-top: 32px;
        }
        .section-content-header {
                top: -24px;
        }

        .posts-slider .post-item {
                flex-direction: column;
        }
        .posts-slider .post-item img,
        .posts-slider .post-item .post-item-content{
                width: 100%;
        }

        .global-search{
                top: 24px;
        }
        .global-search-inner .global-search-results{
                max-height: 50vh;
        }

        .banner-content.top{
                top: initial;
                bottom: 0;
                left: 0;
                right: 0;
                transform: none;
        }
        .banner-content .banner-title,
        .top.banner-content .banner-title{
                border-radius: 12px 12px 0 0;
        }
        .banner-content .tag {
                font-size: 16px;
        }
        .banner-content.right .banner-content-inner{
                justify-content: start;
        }
        .banner-content .banner-title {
                max-width: 100%;
                font-size: 36px;
                padding: 4px 16px;
                border-top-left-radius: 16px;
                border-top-right-radius: 16px;
        }
        .banner-content .infos{
                top: calc(100% + 8px);
        }
        .banner-content .infos .credits {
                font-size: 24px;
        }
        .banner-content .infos {
                flex-direction: column;
                align-items: start;
        }
        .banner-content .infos .credits {
                margin-left: 0;
        }
        .banner-content .infos .dates {
                font-size: 22px;
        }
        .banner-content .infos {
                row-gap: 8px;
        }
        .banner-content .infos .credits{
                margin-left: 0;
        }
}

@media (max-width: 576px) {
        .section-title-container .icon {
                width: 80px;
                height: 80px;
        }
        .section-title-container h2 {
                font-size: 32px;
        }
        .section-title-container .icon::before,
        .section-title-container .icon::after {
                height: 2px;
        }

        .full-width-section {
                margin-bottom: 32px;
        }

        .tag {
                padding: 6px 12px;
        }

        .shows-slider .show-item {
                flex: 0 0 100%;
        }

        .global-search-container input{
                width: 90vw;
        }

        .posts-slider .post-item {
                flex: 0 0 100%;
        }

        .banner-content .tag {
                font-size: 14px;
        }
        .banner-content .infos .credits {
                font-size: 20px;
        }
        .banner-content .infos .dates {
                font-size: 18px;
        }

        .default-grid.ressources-grid{
                row-gap: 40px;
                column-gap: 0;
        }
        .ressource-item {
                grid-column: 12 span;
        }
        .ressource-item:nth-child(2n)::before{
                display: block;
        }
        .ressource-item::before{
                top: initial;
                bottom: -20px;
                left: 50%;
                transform: translateX(-50%);
                width: 100%;
                height: 1px;
        }
        .ressource-item img{
                aspect-ratio: 16/9;
        }
}