
/* Large Desktop
==================================================================================================== */
@media (min-width: 1280px) {
	.rangee {
		width: 95%;
		max-width: 1380px;
	}
	.section-col .banniere .rangee {
		width: calc(95% - 60px);
		max-width: calc(1380px - 60px);
	}
}

/*  Très Large Desktop
==================================================================================================== */
@media (min-width: 1480px) {

}

/*  #Mobile et tablette portrait
==================================================================================================== */

/* Pages filles/sœurs : sur tablette uniquement, les 4 cartes col25
   deviennent trop étroites — passage en 2 par ligne. Borne basse à
   768px : en dessous, l'empilement mobile (100 %) reprend la main. */
@media (min-width: 768px) and (max-width: 1025px) {
	.section-pages .col25 {
		flex-basis: 50%;
		width: 50%;
	}
}

@media (max-width: 1025px) {

	header#header nav, .no-mobile{
		display: none !important;
	}
	header#header {
	    position: fixed;
	   width: 100%;
	   margin: 0;
	   border-radius: 0;
	}
	body #main{
		padding-top: 85px;
	}
	#logo {
		left: 30px;
	}
	.menu-toggle {
		display: inline-flex;
	}
	/* GRILLE
	-------------------------------------------------------------- */

	.ecart-normal{
		flex: 0 0 auto;
		padding: 15px 20px;
	}
	.section-col .banniere .rangee {
		width: calc(100% - 40px)!important;
		max-width: 100%!important;
	}
	.section-col .banniere .rangee {
		padding: 20px;
	}
	.fullwidth, .full {
		width: 100%!important;
		max-width: 100%!important;
	}
	.section-logos .col15 {
		flex-basis:33.3%;
		width: 33.3%;
	}
	.banniere .col50 {
		flex-basis:100% ;
		width: 100%;
	}
	.border-left, .border-col {
		border-left:0px ;
	}
	.decalage140, .decalage15, .decalage70, .decalage {
		top: inherit;
		margin-bottom: inherit;
	}
	.reverse-mobile .rangee, .reverse-mobile {
		flex-direction: column-reverse;
	}
	.section-col .col-padding-right,.section-col .col-padding-left {
	  	padding: 0;
	}
	.aucun-ecart{
		padding: 0px!important;
	}
	.padding-col-pres.border-left {
	  padding-left: 0px;
	}
	footer#footer,  #credits p {
		text-align: left;
	}
	footer#footer .ecart-normal{
		padding: 0px 25px;
	}
	/* Blocs du footer empilés : écart UNIFORME. Sans ça, l'espacement
	   dépendait de la colonne d'origine (30px à l'intérieur d'une colonne,
	   0 à la frontière entre deux colonnes sans padding vertical). */
	footer#footer .footer-bloc {
		margin: 0 0 45px;
	}
	footer#footer .footer-bloc + .footer-bloc {
		margin-top: 0;
	}
	#credits p a {
		display: block;
		margin-right: 0px;
	}
	.text-right {
		text-align: inherit;
	}
	footer#footer #credits p a {
		display: block;
		margin: 0px 0;
	}
	/* Liens du pied de page empilés, un par ligne, alignés à gauche. */
	#credits li {
		display: block;
		margin: 0 0 12px;
	}
	#credits li:last-of-type {
		margin-bottom: 0;
	}
	/* « Site par La Confiserie » : à la ligne sous les liens, aligné à
	   gauche comme eux, dégagé du bouton retour en haut. */
	#credits .col30 {
		margin-top: 15px;
		padding-right: 80px;
	}
	#credits .text-right {
		text-align: left;
	}
	.widget-carousel .swiper-button-prev,
	.widget-carousel .swiper-button-next {
		background-size: 16px auto;
		width: 40px;
		height: 40px;
	}
	.widget-carousel .swiper-button-prev { left: 10px; }
	.widget-carousel .swiper-button-next { right: 10px; }

}

/* #Mobile
==================================================================================================== */

@media (max-width: 767px) {

	/* .padding / .padding-top / .padding-bottom : désormais fluides
	   via clamp() dans style.css, plus d'override mobile nécessaire. */
	.col3, .col5, .col15, .col10, .col20, .col30, .col40, .col48, .col50, .col60, .col70, .col80, .col85, .col90, .col25,.col33, .col45, .col55, .col57, .col75, .col65,.col66,.col35, section .col50.deux-tiers:first-of-type,section .col50.un-tiers:last-of-type,section .col50.deux-tiers:last-of-type, section .col50.un-tiers:first-of-type {
		flex-basis:100% ;
		width: 100%;
	}
	.section-reassurance .banniere::before {
		content: "";
		position: absolute;
		inset: -20px;
		border-radius: 20px;
		z-index: -1;
	}
	.decalage,.decalage15, .decalage70,.decalage100, .section-col.banniere .rangee.decalage-image .widget-image {
		top: inherit;
		margin-bottom: inherit;
	}
	.section-col .border-col .ecart-normal {
	  border-left: 0px;
	}
	#titre-simple{
		padding: 40px 0 40px 0;
	}
	#bloc-titre-page .rangee {
		min-height: 350px;
		padding: 100px 0;
		z-index: 9;
		text-align: left;
	}
	.only-mobile {
		display: block !important;
	}
	footer#footer .bouton {
		margin-bottom: 30px;
	}
	#backtotop {
	  bottom: 20px;
	}
	[class*="bg-boucles-cotes"] .une-col::before, [class*="bg-boucles-cotes"] .une-col::after,
	[class*="bg-etoiles-boucle-"] .une-col::before, [class*="bg-etoiles-boucle-"] .une-col::after {
		display: none !important;
	}
	/* Image + rond : rond réduit et toujours centré, section moins haute. */
	.section-image-rond .rangee {
		min-height: 440px;
		justify-content: center !important;
	}
	.rond-evenement {
		min-width: 300px;
		min-height: 300px;
		padding: 40px;
		margin: 40px 0;
	}
	.rond-evenement__contenu {
		max-width: 210px;
	}
	.rond-evenement__texte {
		font-size: var(--fs-plus);
	}
	/* Actualités : nuage plus resserré autour du titre. */
	.sous-titre.titre-bulle::before {
		width: calc(100% + 240px);
		height: calc(100% + 270px);
	}
	/* Agenda : la ligne s'empile (date / titre / lieu), avec de l'air
	   entre les trois groupes ; le label « Lieu » devient redondant
	   (le marqueur suffit) et saute. */
	.ligne-agenda {
		grid-template-columns: 1fr;
		gap: 16px;
		align-items: start;
	}
	.ligne-agenda__lieu-label {
		display: none;
	}
	/* L'icône « ajouter à mon agenda » se cale à droite de la ligne date,
	   et son menu se déplie vers la gauche pour rester dans l'écran. */
	.ligne-agenda__date {
		position: relative;
		padding-right: 44px;
	}
	.ligne-agenda .ajout-agenda {
		position: absolute;
		top: 0;
		right: 0;
		margin-top: 0;
	}
	.ligne-agenda .ajout-agenda__menu {
		left: auto;
		right: 0;
	}

}
