/* RESPONSIVE CSS */

@media only screen and (max-width: 1439px) {

    #header .wrapper, 
    #footer .wrapper, 
    .hero .textes, 
    .top-1 .wrapper, 
    .equipe .wrapper, 
    .papiers .wrapper, 
    .contact .wrapper {
        padding-left: 4.2%;
        padding-right: 4.2%;
    }


    /* section 'papiers' */
    .papiers .mea {
        grid-template-columns: repeat(3, 315px);
    }


	/************************************/
	/* Bloc css de la page 'food for thought' */
	/************************************/
	.fft .galerie {
		grid-template-columns: repeat(3, 315px);
	}
}


@media only screen and (max-width: 1279px) {

    /********** footer **********/
    /* section 'newsletter' */
    .newsletter .tt-h2 {
        font-size: 52px;
    }

    
    /********** middle **********/
    /* section 'hero' */
    .hero .tt-h1 {
        font-size: 52px;
        line-height: 67px;
    }


    /* section 'top-1' */
    .top-1 .chapo {
        width: 58%;
    }


    /* section 'top-2' */
    .top-2 .chapo {
        font-size: 46px;
    }


    /* section 'top-3' */
    .top-3 {
		padding-top: 110px;
	}

        .top-3 .visuel {
            width: 45%;
        }


    /* sections 'services' */
    .services .textes {
        padding: 60px;
    }


    /* section 'quote' */
    .quote .wrapper {
		padding-top: 100px;
		padding-bottom: 100px;
	}

        .quote p {
            font-size: 40px;
        }


    /* section 'equipe' */
    .equipe .fiche-2 .textes {
        margin-top: 100px;
    }

	.equipe .fiche-1 .textes {
		scroll-margin-top: 0;
	}

	.equipe .fiche-2 .textes {
		scroll-margin-top: 300px;
	}
    
    .equipe .fiche-2 .visuel {
        margin-top: -60px;
    }

		/* modal */
		#modal2.is-open {
			transform: translateY(-25%);
		}


    /* section 'clients' */
    .clients .intro {
        font-size: 38px;
    }


    /* section 'papiers' */
    .papiers .wrapper {
		padding: 60px;
	}

        .papiers .intro {
            font-size: 38px;
        }

        .papiers .mea {
            grid-template-columns: repeat(2, 315px);
        }


    /* section 'contact' */
    .contact .wrapper {
		padding: 60px;
	}

        .contact .tt-h2 {
            font-size: 38px;
        }
}


@media only screen and (max-width: 1110px) {

	/************************************/
	/* Bloc css de la page 'food for thought' */
	/************************************/
	.fft .galerie {
		grid-template-columns: repeat(2, 315px);
	}
}


@media only screen and (max-width: 991px) {

    /********** general **********/
    /* push */
    .push .tt-h2 {
        font-size: 18px;
    }


    /********** header **********/
	#header {
		z-index: 98;
	}


	/* logo */
	#header .logo {
		width: 70px;
	}


	/* bouton 'burger' */
	.burger {
		--size: 44px;
		--line-width: 20px;
		--line-height: 2px;
		--gap: 4px;

		display: flex;
		flex-direction: column;
		justify-content: center;
		align-items: center;
		gap: var(--gap);
		width: var(--size);
		height: var(--size);
		border: 0;
		background: var(--opacityMob);
		backdrop-filter: blur(5px);
		border-radius: 12px;
		cursor: pointer;
		transition: transform .5s cubic-bezier(.77, 0, .18, 1);
	}

	.burger span {
		width: var(--line-width);
		height: var(--line-height);
		background: var(--colorMain);
		border-radius: 20px;
		transform-origin: center;
		transition:
			transform .5s cubic-bezier(.77, 0, .18, 1),
			opacity .3s ease,
			width .5s ease;
	}


    /* menu */
    .lk-box {
		display: flex;
        justify-content: center;
		padding: 0 12px;
        line-height: 42px;
	}

	body.menu-is-open {
		overflow: hidden;
	}

	#header .cadre {
		padding: 0;
		background: none;
		backdrop-filter: none;
	}

	#header .inner-nav {
		flex-direction: column;
        gap: 15px;
        position: absolute;
        top: -23px;
    	right: -4.3vw;
		width: 100vw;
		height: 100vh;
        margin: 0;
        padding: 50px 25px;
        opacity: 0;
        visibility: hidden;
        pointer-events: none;
        transform: translateY(-10px);
        transition:
            opacity 0.3s ease,
            transform 0.3s ease,
            visibility 0.3s;
    }

	#header .menu {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        gap: 30px;
		width: 100%;
    }

    #header nav.menu-open .inner-nav {
		background: var(--opacityBlur);
		backdrop-filter: blur(5px);
        opacity: 1;
        visibility: visible;
        pointer-events: auto;
        transform: translateY(0);
    }

	#header nav.menu-open .burger {
		background: none;
		backdrop-filter: blur(0);
		transform: rotate(180deg);
	}

    #header nav.menu-open .burger span:nth-child(1) {
        transform: translateY(6px) rotate(45deg);
    }

    #header nav.menu-open .burger span:nth-child(2) {
        opacity: 0;
		width: 0;
    }

    #header nav.menu-open .burger span:nth-child(3) {
        transform: translateY(-6px) rotate(-45deg);
    }


    /********** footer **********/
    #footer {
		padding: 24px 0;
	}

		#footer .wrapper {
			padding: 0 4.3vw;
		}


    /* section 'newsletter' */
	.newsletter .cols {
		flex-direction: column;
	}

		.newsletter .logo {
			order: 0;
			margin-bottom: 24px;
		}

		.newsletter .tt-h2 {
            order: 1;
			width: 100%;
			margin-bottom: 24px;
			font-size: 24px;
            text-align: center;
		}

	.newsletter .tt-h2 br, 
    .newsletter form {
		display: none;
	}


    /* section 'mentions' */
	.mentions {
		flex-direction: column;
		margin-top: 0;
	}

		.mentions .bloc-left ul {
			flex-direction: column;
			gap: 32px;
		}

		.mentions .bloc-right {
            margin-top: 16px;
		}


    /************************************/
	/* Bloc css de la page 'index' */
	/************************************/
	/* section 'hero' */
	.hero {
		flex-direction: column;
		justify-content: flex-start;
		height: auto;
	}

        .hero > div {
			width: 100%;
		}

        .hero .visuel {
            order: 0;
			height: 64.5vw;
		}

		.hero .textes {
            order: 1;
			max-width: 100%;
			padding: 16px 4.3vw 60px;
		}

			.hero .tt-h1 {
				font-size: 40px;
				line-height: normal;
			}

			.hero .sous-titre {
				margin-top: 25px;
			}

			.hero .lien {
				margin-top: 25px;
			}


    /* section 'top-1' */
	.top-1 {
		padding: 32px 0 69px;
	}

		.top-1 .wrapper {
            flex-direction: column;
			padding: 0 4.3vw;
		}

			.top-1 .chapo {
				width: 100%;
				font-size: 20px;
			}

            .top-1 .push {
				margin-top: 24px;
			}


    /* section 'top-2' */
	.top-2 {
		padding: 104px 0 39px;
	}

		.top-2 .wrapper {
			padding: 0 4.3vw;
		}

			.top-2 .chapo {
				font-size: 24px;
			}

			.top-2 .cols {
				flex-direction: column;
				margin-top: 33px;
			}

				.top-2 .cols .paragraphe {
					width: 100%;
					font-size: 18px;
                    line-height: 1.5;
				}

			.top-2 .vign-top {
				top: -152px;
				left: 50%;
				transform: translateX(14px);
				width: 160px;
				height: 106px;
			}

			.top-2 .vign-bot {
				bottom: -136px;
				left: 50%;
				transform: translateX(-168px);
				width: 192px;
				height: 123px;
			}


    /* section 'top-3' */
	.top-3 {
		padding: 132px 0 53px;
	}

		.top-3 .wrapper {
			flex-direction: column;
			padding: 0 4.3vw;
		}

			.top-3 .textes, 
            .top-3 .visuel {
				width: 100%;
			}

				.top-3 .chapo {
					font-size: 24px;
					line-height: normal;
				}

				.top-3 .paragraphe {
					margin-top: 24px;
					font-size: 18px;
                    line-height: 1.5;
				}

            .top-3 .visuel {
				max-width: 430px;
				margin-top: 40px;
			}


    /* sections 'services' */
	.services {
		flex-direction: column;
        padding: 24px 4.3vw;
	}

		.services .visuel {
			width: 100%;
            height: 60vw;
		}

		.services.sv-inv .visuel {
			order: 1;
		}

		.services .textes {
			width: 100%;
			padding: 0 0 24px;
		}

		.services.sv-inv .textes {
			order: 0;
		}

			.services .tt-h2 {
				font-size: 20px;
			}

            .services .tt-h2 br {
				display: none;
			}

		.services .cols {
			flex-direction: column;
			margin-top: 0;
		}

		.services .col-item {
			width: 100%;
            margin-top: 24px;
		}


    /* section 'quote' */
	.quote .wrapper {
		padding: 57px 4.3vw 45px;
	}

		.quote p {
			font-size: 24px;
		}

		.quote p::before, 
		.quote p::after {
			width: 47px;
			height: 42px;
		}

        .quote p::before {
			margin: 0 0 10px 0;
            display: block;
		}

		.quote p::after {
			margin: 0 0 -42px 18px;
		}


    /* section 'equipe' */
    .equipe .wrapper {
        padding: 40px 4.3vw;
    }

        .equipe .equipe-fiche {
            flex-direction: column;
        }

            .equipe .textes, 
            .equipe .visuel {
                width: 100%;
            }

            .equipe .textes {
                padding: 0;
            }

			.equipe .fiche-1 .textes {
				scroll-margin-top: 80px;
			}

			.equipe .fiche-2 .textes {
				scroll-margin-top: 80px;
			}

            .equipe .eqp-inv .textes {
                order: 0;
            }

            .equipe .eqp-inv .visuel {
                order: 1;
            }

            .equipe .fiche-1 .visuel, 
            .equipe .fiche-2 .visuel {
                margin-top: 24px;
            }

            .equipe .fiche-2 .textes {
                margin-top: 32px;
            }

            .equipe .tt-h2 {
                font-size: 32px;
            }

            .equipe .ss-tt {
                font-size: 18px;
            }

            .equipe .lien {
                margin-top: 30px;
            }


		/* modal */
		#modal1, 
		#modal2 {
			justify-content: center;
		}

		.modal .modal-content {
			width: 96%;
			height: 96vh;
			padding: 60px 8.5% 40px;
		}

		.modal .modal-scroll {
			width: 100%;
			padding: 0;
		}

		.modal .close-btn {
			left: 8.5%;
		}


    /* section 'clients' */
	.clients .wrapper {
		padding: 95px 4.3vw 69px;
	}

		.clients .intro {
			font-size: 24px;
		}

		.clients .liste-clients {
			margin-top: 28px;
		}

		.clients .liste-clients li {
			width: 167px;
		}


    /* section 'papiers' */
	.papiers .wrapper {
		padding: 65px 4.3vw 70px;
	}

		.papiers .intro {
			font-size: 24px;
		}


    /* section 'contact' */
	.contact .wrapper {
        flex-direction: column;
		padding: 32px 4.3vw;
	}

		.contact .textes, 
		.contact .formulaire {
			width: 100%;
		}

		.contact .textes {
			padding-right: 0;
		}

			.contact .tt-h2 {
				font-size: 24px;
			}

			.contact .intro {
				font-size: 18px;
                line-height: 1.5;
			}

		.contact .formulaire {
			flex-direction: column;
            margin-top: 30px;
			padding: 0;
		}

			.contact .form-bloc {
				width: 100%;
				margin-bottom: 20px;
			}

			.contact .form-bloc.large {
				width: 100%;
				margin-bottom: 20px;
			}

			.contact .form-bloc label {
				font-size: 18px;
			}

			.contact .input-box {
				font-size: 18px;
			}


	/************************************/
	/* Bloc css de la page 'article' */
	/************************************/
	/* boutons outils */
	.article .tools .btn-print {
		display: none;
	}


	/************************************/
	/* Bloc css de la page 'food for thought' */
	/************************************/
	.fft .intro {
		width: 100%;
	}

	.fft .wrapper > .lien .lk-box {
		width: 100%;
	}
}


@media only screen and (max-width: 770px) {

	/************************************/
	/* Bloc css de la page 'food for thought' */
	/************************************/
	.fft .galerie {
		grid-template-columns: repeat(1, 315px);
	}
}


@media only screen and (max-width: 699px) {

	/************************************/
	/* Bloc css de la page 'index' */
	/************************************/
    /* section 'papiers' */
    .papiers .mea {
		display: flex;
		justify-content: flex-start;
		gap: 20px;
		width: 100%;
		max-width: 100%;
		padding: 0 0 20px;
		overflow-x: auto;
		overflow-y: hidden;
		scroll-snap-type: x mandatory;
		scroll-behavior: smooth;
		scrollbar-width: none;
	}

	.papiers .mea::-webkit-scrollbar {
		display: none;
	}

	.papiers .mea .push {
		flex: 0 0 315px;
		width: 315px;
		min-width: 0;
		scroll-snap-align: center;
		scroll-snap-stop: always;
	}

	.papiers .mea::after {
		content: '';
		flex: 0 0 calc(20px);
	}

	.papiers .slider-dots {
		display: flex;
		justify-content: center;
		align-items: center;
		gap: 8px;
		margin-top: 10px;
	}

	.papiers .slider-dot {
		width: 7px;
		height: 7px;
		padding: 0;
		border: 0;
		background: var(--colorDots);
		border-radius: 50%;
		cursor: pointer;
		transition:
			width .3s ease,
			background-color .3s ease,
			transform .3s ease;
	}

	.papiers .slider-dot.active {
		width: 20px;
		border-radius: 10px;
		background: var(--colorMain);
	}


	/************************************/
	/* Bloc css de la page 'article' */
	/************************************/
	.article .wrapper {
		padding: 128px 4.3vw 79px;
	}

		.article .tt-h1 {
			font-size: 40px;
		}

		.article .intro {
			margin-top: 53px;
			font-size: 20px;
			line-height: 1.5;
		}

		.article .visuel {
			margin-top: 40px;
		}

		.article .visuel + .paragraphe {
			margin-top: 40px;
		}

		.article .wrapper > .tt-h2 {
			font-size: 18px;
		}


		/* encadre */
		.article .encadre {
			margin-top: 40px;
		}

		.article .top-line {
			align-items: flex-start;
			flex-direction: column;
		}

		.article .top-line .logo {
			margin: 0 0 32px;
		}


	/************************************/
	/* Bloc css de la page 'food for thought' */
	/************************************/
	.fft::before {
		height: 623px;
	}

	.fft .wrapper {
		padding: 177px 4.3vw 40px;
	}

		.fft .tt-h1 {
			font-size: 40px;
		}

		.fft .intro {
			height: 180px;
			margin-top: 50px;
			font-size: 20px;
		}
}