/**
 * Mobile — Digital Mixing
 * Corrige le bug Autoptimize (media queries écrasées), header/burger,
 * trending, grilles de listes, corps d'article et typos.
 */

/* -------------------------------------------------------------------------
   ≤ 799px — header une ligne + menu burger (charte claire)
   ------------------------------------------------------------------------- */

@media only screen and (max-width: 799px) {
	/* Ligne unique : logo | loupe + burger */
	.main-head .wrap {
		display: flex !important;
		flex-wrap: wrap !important;
		align-items: center !important;
		column-gap: 8px !important;
	}

	.main-head {
		height: auto !important;
		padding: 0 !important;
		background: #fff !important;
		border-bottom: 1px solid #e8e8e8;
		/* Sticky logo + burger (le thème désactive sticky-nav < 800px) */
		position: sticky !important;
		top: 0 !important;
		z-index: 1000 !important;
		box-shadow: 0 2px 12px rgba(25, 35, 45, 0.08);
	}

	.admin-bar .main-head {
		top: 46px !important;
	}


	.main-head header {
		display: flex !important;
		align-items: center !important;
		justify-content: flex-start !important;
		flex: 1 1 auto !important;
		order: 1 !important;
		min-width: 0 !important;
		margin: 0 !important;
		padding: 10px 0 !important;
		min-height: 0 !important;
	}

	.main-head .title {
		float: none !important;
		text-align: left !important;
		margin: 0 !important;
		line-height: 1 !important;
		font-size: 26px !important;
	}

	.main-head .title .logo-image,
	.main-head .title img {
		max-height: 32px !important;
		width: auto !important;
		max-width: min(200px, 58vw) !important;
		display: block !important;
	}

	.main-head .right {
		display: none !important;
	}

	/* Les enfants de nav rejoignent le flex du wrap */
	.main-head .navigation {
		display: contents !important;
		background: transparent !important;
		border: 0 !important;
		min-height: 0 !important;
		height: auto !important;
		width: auto !important;
		margin: 0 !important;
		padding: 0 !important;
	}

	.navigation .menu:not(.mobile-menu) {
		display: none !important;
	}

	.navigation .mobile,
	.navigation .off-canvas {
		display: block !important;
	}

	.main-head .navigation .mobile {
		order: 2 !important;
		flex: 0 0 auto !important;
		width: auto !important;
		margin: 0 !important;
		padding: 0 !important;
		background: transparent !important;
	}

	.navigation .mobile .selected {
		display: flex !important;
		align-items: center !important;
		justify-content: flex-end !important;
		gap: 4px !important;
		position: relative !important;
		padding: 0 !important;
		margin: 0 !important;
		height: 40px !important;
		line-height: 40px !important;
		color: #19232d !important;
		text-decoration: none !important;
		float: none !important;
		clear: none !important;
		background: transparent !important;
	}

	.navigation .mobile .selected:hover,
	.navigation .mobile .selected:focus {
		text-decoration: none !important;
		color: #19232d !important;
	}

	/* Masquer libellés "Menu" / current */
	.navigation .mobile .text,
	.navigation .mobile .current {
		position: absolute !important;
		width: 1px !important;
		height: 1px !important;
		overflow: hidden !important;
		clip: rect(0, 0, 0, 0) !important;
		float: none !important;
	}

	/* Icônes loupe + burger — accent charte, pas de barre pleine */
	.navigation .mobile .hamburger,
	.navigation .mobile .fa-bars,
	.navigation .mobile .search-button .fa,
	.navigation .mobile .fa-search {
		display: flex !important;
		align-items: center !important;
		justify-content: center !important;
		float: none !important;
		width: 40px !important;
		height: 40px !important;
		margin: 0 !important;
		padding: 0 !important;
		line-height: 1 !important;
		font-size: 18px !important;
		background: transparent !important;
		color: #3192d3 !important;
		border-radius: 3px !important;
		box-sizing: border-box !important;
	}

	.navigation .mobile .hamburger:hover,
	.navigation .mobile .fa-bars:hover,
	.navigation .mobile .search-button:hover .fa,
	.navigation .mobile .search-button:focus .fa {
		background: #f4f8fb !important;
		color: #2477b0 !important;
	}

	.navigation .mobile .search {
		float: none !important;
		position: static !important;
		margin: 0 !important;
		order: -1 !important; /* loupe à gauche du burger */
		display: flex !important;
		align-items: center !important;
	}

	.navigation .mobile .search-button {
		float: none !important;
		background: transparent !important;
		border: 0 !important;
		margin: 0 !important;
		padding: 0 !important;
		width: 40px !important;
		height: 40px !important;
		line-height: 1 !important;
		cursor: pointer !important;
	}

	.navigation .mobile .search .query {
		display: none !important;
	}

	/* Recherche déployée : champ au-dessus de la ligne d'icônes */
	.navigation .mobile .search.active {
		position: absolute !important;
		right: 44px !important;
		top: 50% !important;
		transform: translateY(-50%) !important;
		width: min(72vw, 260px) !important;
		margin: 0 !important;
		float: none !important;
		z-index: 5 !important;
		background: #fff !important;
		border: 1px solid #d7e3ea !important;
		border-radius: 3px !important;
		box-shadow: 0 2px 10px rgba(25, 35, 45, 0.08);
	}

	.navigation .mobile .search.active .query {
		display: block !important;
		float: none !important;
		width: calc(100% - 40px) !important;
		margin: 0 !important;
		padding: 8px 10px !important;
		color: #19232d !important;
		background: transparent !important;
		font-size: 14px !important;
		box-sizing: border-box !important;
	}

	.navigation .mobile .search.active .search-button {
		position: absolute !important;
		right: 0 !important;
		top: 0 !important;
	}

	.navigation .mobile .search.active .search-button .fa {
		color: #3192d3 !important;
	}

	/* ---- Menu déroulant — charte claire (gris / bleu site) ---- */
	.main-head .navigation .mobile-menu-container,
	.main-head .navigation > .mobile-menu-container {
		order: 3 !important;
		flex: 1 1 100% !important;
		width: 100% !important;
		max-width: 100% !important;
		margin: 0 !important;
		padding: 0 !important;
	}

	.navigation .mobile-menu,
	.navigation.sticky .mobile-menu,
	.navigation .mobile-menu-container .mobile-menu {
		display: none !important;
		float: none !important;
		clear: both !important;
		width: 100% !important;
		margin: 0 !important;
		padding: 6px 0 !important;
		background: #f7f7f7 !important;
		background-color: #f7f7f7 !important;
		border-top: 1px solid #e0e0e0 !important;
		box-shadow: inset 0 1px 0 #fff, 0 8px 16px rgba(25, 35, 45, 0.06);
		list-style: none !important;
	}

	.navigation .mobile-menu.active,
	.navigation.sticky .mobile-menu.active,
	.navigation .mobile-menu-container .mobile-menu.active {
		display: block !important;
	}

	.navigation .mobile-menu > li,
	.navigation.sticky .mobile-menu > li {
		float: none !important;
		display: block !important;
		width: 100% !important;
		margin: 0 !important;
		border-bottom: 1px solid #e6e6e6;
	}

	.navigation .mobile-menu > li:last-child {
		border-bottom: 0;
	}

	.navigation .mobile-menu a,
	.navigation .mobile-menu > li > a,
	.navigation.sticky .mobile-menu a,
	.navigation.sticky .mobile-menu > li > a {
		color: #19232d !important;
		float: none !important;
		display: block !important;
		position: relative !important;
		width: 100% !important;
		padding: 11px 16px !important;
		line-height: 1.35 !important;
		font-size: 13px !important;
		font-weight: 600 !important;
		letter-spacing: 0.04em !important;
		text-transform: uppercase !important;
		text-decoration: none !important;
		background: transparent !important;
		box-sizing: border-box !important;
		border: 0 !important;
	}

	.navigation .mobile-menu > li > a:hover,
	.navigation .mobile-menu > li > a:focus,
	.navigation .mobile-menu > .current-menu-item > a,
	.navigation .mobile-menu > .current-menu-parent > a,
	.navigation .mobile-menu > .current-menu-ancestor > a,
	.navigation.sticky .mobile-menu > li > a:hover,
	.navigation.sticky .mobile-menu > .current-menu-item > a {
		color: #3192d3 !important;
		background: #fff !important;
		box-shadow: inset 3px 0 0 #3192d3;
	}

	.navigation .mobile-menu .sticky-logo {
		display: none !important;
	}

	/* Sous-menus */
	.navigation .mobile-menu ul {
		display: none;
		margin: 0 !important;
		padding: 0 !important;
		list-style: none !important;
		background: #fff !important;
		border-top: 1px solid #ebebeb;
	}

	.navigation .mobile-menu li.active > ul,
	.navigation .mobile-menu li.item-active > ul {
		display: block !important;
	}

	.navigation .mobile-menu li li > a {
		padding-left: 28px !important;
		font-size: 12px !important;
		font-weight: 500 !important;
		letter-spacing: 0.02em !important;
		text-transform: none !important;
		color: #3a4149 !important;
	}

	.navigation .mobile-menu .chevron {
		position: absolute !important;
		right: 8px !important;
		top: 0 !important;
		bottom: 0 !important;
		width: 40px !important;
		display: flex !important;
		align-items: center !important;
		justify-content: center !important;
		color: #3192d3 !important;
		background: transparent !important;
		border: 0 !important;
		text-decoration: none !important;
	}

	.navigation .mobile-menu .chevron .fa {
		background: transparent !important;
		color: inherit !important;
		font-size: 16px !important;
	}
}


/* -------------------------------------------------------------------------
   ≤ 767px — header, trending, listes, single, typos
   ------------------------------------------------------------------------- */

@media only screen and (max-width: 767px) {
	/* Conteneur : pleine largeur, marges latérales réduites
	   overflow-x: clip (pas hidden) pour ne pas casser position:sticky du header */
	html,
	body {
		overflow-x: clip !important;
	}

	.main-wrap {
		overflow-x: clip !important;
	}

	body.boxed {
		padding-left: 0 !important;
		padding-right: 0 !important;
	}

	.wrap,
	.boxed .main-wrap,
	.main.wrap,
	.main-head .wrap,
	.top-bar .wrap,
	.main-footer .wrap,
	.lower-foot .wrap {
		width: 100% !important;
		max-width: 100% !important;
		margin-left: 0 !important;
		margin-right: 0 !important;
		padding-left: 14px !important;
		padding-right: 14px !important;
		box-sizing: border-box !important;
	}

	/* Grille SmartMag : annuler gutter -25px qui déborde du wrap */
	.row,
	.wrap > .row,
	.main > .row,
	.main .post-wrap > .row,
	.news-focus > .row {
		margin-left: 0 !important;
		margin-right: 0 !important;
	}

	/* ---- Header : déjà en ligne unique ≤799 ; affiner paddings ---- */
	.main-head .wrap {
		padding-left: 14px !important;
		padding-right: 14px !important;
	}

	.main-head header {
		padding: 8px 0 !important;
	}

	/* Plus de barre nav pleine largeur séparée */
	.main-head .navigation,
	.navigation {
		margin-left: 0 !important;
		margin-right: 0 !important;
	}

	.navigation .mobile .selected {
		padding-left: 0 !important;
		padding-right: 0 !important;
	}

	.navigation .mobile .hamburger,
	.navigation .mobile .fa-bars,
	.navigation .mobile .fa-search,
	.navigation .mobile .search-button .fa {
		margin-right: 0 !important;
		width: 40px !important;
		height: 40px !important;
	}

	/* ---- Top bar / trending : compact + marquee ---- */
	.top-bar {
		padding: 0 !important;
		min-height: 0 !important;
		height: auto !important;
		border-top-width: 2px !important;
		border-top-color: #3192d3 !important;
	}

	.top-bar .wrap {
		display: block !important;
		padding-left: 12px !important;
		padding-right: 12px !important;
	}

	.top-bar-content {
		display: flex !important;
		align-items: center !important;
		gap: 10px !important;
		padding: 0 !important;
		margin: 0 !important;
		min-height: 0 !important;
		height: 28px !important;
		overflow: hidden !important;
		max-width: 100% !important;
		box-sizing: border-box !important;
	}

	/* Recherche déjà dans le header : masquer ici */
	.top-bar .search {
		display: none !important;
	}

	.top-bar .menu {
		display: none !important;
	}

	/* Drapeaux Polylang : conservés, à droite du défileur */
	.top-bar-content > ul {
		display: flex !important;
		align-items: center !important;
		flex: 0 0 auto !important;
		gap: 4px !important;
		margin: 0 !important;
		padding: 0 !important;
		list-style: none !important;
		float: none !important;
		height: 28px !important;
	}

	.top-bar-content > ul .lang-item {
		margin: 0 !important;
		padding: 0 !important;
		float: none !important;
		list-style: none !important;
		line-height: 0 !important;
	}

	.top-bar-content > ul .lang-item a {
		display: block !important;
		line-height: 0 !important;
	}

	.top-bar-content > ul .lang-item img {
		display: block !important;
		width: 16px !important;
		height: auto !important;
	}

	.trending-ticker {
		display: flex !important;
		align-items: center !important;
		justify-content: flex-start !important;
		gap: 8px !important;
		text-align: left !important;
		margin: 0 !important;
		padding: 0 !important;
		float: none !important;
		width: auto !important;
		max-width: 100% !important;
		flex: 1 1 auto !important;
		min-width: 0 !important;
		height: 28px !important;
		overflow: hidden !important;
		order: 0 !important;
	}

	.trending-ticker .heading {
		float: none !important;
		flex: 0 0 auto !important;
		margin: 0 !important;
		padding: 0 !important;
		font-size: 9px !important;
		font-weight: 700 !important;
		letter-spacing: 0.06em !important;
		line-height: 28px !important;
		color: #3192d3 !important;
		white-space: nowrap !important;
	}

	/* Liste native masquée : remplacée par la piste marquee (js) */
	.trending-ticker.dm-ticker-marquee > ul {
		display: none !important;
	}

	.trending-ticker .dm-ticker-track {
		flex: 1 1 auto !important;
		min-width: 0 !important;
		overflow: hidden !important;
		height: 28px !important;
		mask-image: linear-gradient(90deg, transparent 0, #000 10px, #000 calc(100% - 10px), transparent 100%);
		-webkit-mask-image: linear-gradient(90deg, transparent 0, #000 10px, #000 calc(100% - 10px), transparent 100%);
	}

	.trending-ticker .dm-ticker-inner {
		display: flex !important;
		flex-wrap: nowrap !important;
		width: max-content !important;
		animation: dm-ticker-marquee var(--dm-ticker-duration, 40s) linear infinite;
	}

	.trending-ticker .dm-ticker-group {
		display: flex !important;
		flex-wrap: nowrap !important;
		align-items: center !important;
		flex: 0 0 auto !important;
	}

	.trending-ticker .dm-ticker-item {
		flex: 0 0 auto !important;
		white-space: nowrap !important;
		font-size: 11px !important;
		line-height: 28px !important;
		color: #656565 !important;
		text-decoration: none !important;
		padding-right: 1.75rem !important;
	}

	.trending-ticker .dm-ticker-item::after {
		content: "•";
		margin-left: 1.75rem;
		color: #c5c5c5;
		font-weight: 700;
	}

	.trending-ticker .dm-ticker-item:hover,
	.trending-ticker .dm-ticker-item:focus {
		color: #3192d3 !important;
	}

	.trending-ticker .dm-ticker-track:hover .dm-ticker-inner {
		animation-play-state: paused;
	}

	@media (prefers-reduced-motion: reduce) {
		.trending-ticker .dm-ticker-inner {
			animation: none !important;
			transform: none !important;
		}

		.trending-ticker .dm-ticker-group:last-child {
			display: none !important;
		}

		.trending-ticker .dm-ticker-track {
			mask-image: none !important;
			-webkit-mask-image: none !important;
		}

		.trending-ticker .dm-ticker-item {
			max-width: 100%;
			overflow: hidden;
			text-overflow: ellipsis;
		}

		.trending-ticker .dm-ticker-group {
			max-width: 100%;
			overflow: hidden;
		}

		.trending-ticker .dm-ticker-item:not(:first-child) {
			display: none !important;
		}

		.trending-ticker .dm-ticker-item:first-child::after {
			display: none;
		}
	}

	@keyframes dm-ticker-marquee {
		from {
			transform: translateX(0);
		}
		to {
			transform: translateX(-50%);
		}
	}

	/* Fallback sans JS : ellipsis sur 1 titre */
	.trending-ticker:not(.dm-ticker-marquee) ul {
		float: none !important;
		flex: 1 1 auto !important;
		min-width: 0 !important;
		max-width: 100% !important;
		margin: 0 !important;
		padding: 0 !important;
		list-style: none !important;
		overflow: hidden !important;
	}

	.trending-ticker:not(.dm-ticker-marquee) li {
		display: none !important;
		max-width: 100% !important;
		overflow: hidden !important;
	}

	.trending-ticker:not(.dm-ticker-marquee) li.active,
	.trending-ticker:not(.dm-ticker-marquee) li:first-child {
		display: block !important;
	}

	.trending-ticker:not(.dm-ticker-marquee) li.active ~ li:first-child {
		display: none !important;
	}

	.trending-ticker:not(.dm-ticker-marquee) a {
		display: block !important;
		max-width: 100% !important;
		overflow: hidden !important;
		text-overflow: ellipsis !important;
		white-space: nowrap !important;
		font-size: 11px !important;
		line-height: 28px !important;
		padding: 0 !important;
		margin: 0 !important;
	}

	/* ---- Grilles / listes : 1 colonne ---- */
	.row .column,
	.column,
	.row [class*="col-"],
	.column.half,
	.col-6,
	.col-4,
	.col-8,
	.col-3,
	.column.one-third,
	.column.one-fourth,
	.listing .column,
	.listing.grid-3 .column,
	.listing.grid-overlay .column,
	.highlights-box .column.half,
	.highlights-box.three-col .column.one-third,
	.highlights-box.three-col article,
	.highlights-box.three-col .posts,
	.no-sidebar .highlights-box.three-col article {
		width: 100% !important;
		float: none !important;
		max-width: 100% !important;
		margin-left: 0 !important;
		margin-right: 0 !important;
		padding-left: 0 !important;
		padding-right: 0 !important;
		clear: both !important;
	}

	.highlights-box,
	.highlights-box.three-col,
	.listing,
	.listing.grid-overlay,
	.listing.grid-3,
	.right-sidebar .listing.grid-3,
	.right-sidebar .grid-overlay.grid-3 {
		margin-left: 0 !important;
		margin-right: 0 !important;
		padding-left: 0 !important;
		padding-right: 0 !important;
	}

	.highlights-box .column.half {
		margin-top: 0 !important;
		margin-bottom: 28px !important;
		border-right: 0 !important;
	}

	.highlights-box.three-col .column.one-third {
		margin-bottom: 28px !important;
	}

	.highlights-box.three-col .posts {
		padding-left: 0 !important;
		margin-top: 14px !important;
	}

	.listing article,
	.listing.grid-overlay article,
	.highlights {
		margin-bottom: 28px !important;
	}

	.listing.grid-overlay article .image-link,
	.listing .image-link,
	.highlights > article > a.image-link,
	.news-focus .focus .image-link {
		width: 100% !important;
		max-width: 100% !important;
		aspect-ratio: 702 / 336 !important;
		overflow: hidden !important;
		display: block !important;
		line-height: 0 !important;
	}

	.listing.grid-overlay article .image-link img,
	.highlights > article > a.image-link img,
	.listing .image-link img,
	.listing-alt > a img {
		width: 100% !important;
		max-width: 100% !important;
		height: 100% !important;
		object-fit: cover !important;
		object-position: center center !important;
		display: block !important;
	}

	.listing-alt > a {
		aspect-ratio: 351 / 185 !important;
		overflow: hidden !important;
		line-height: 0 !important;
	}

	.listing-alt article > a {
		max-width: 100% !important;
		float: none !important;
		display: block !important;
	}

	.listing-alt article .content {
		margin-left: 0 !important;
		margin-top: 12px !important;
	}

	/* Typos listes */
	.news-focus .focus .image-link {
		float: none !important;
		margin: 0 0 12px !important;
		width: 100% !important;
		display: block !important;
	}

	.news-focus .excerpt {
		border-bottom: 0 !important;
		padding-bottom: 0 !important;
	}

	.listing.grid-overlay h2,
	.listing.grid-overlay h2 a,
	.highlights h2,
	.highlights h2 a,
	.listing-alt .content > a,
	.news-focus .focus h2 a {
		font-size: 1.2rem !important;
		line-height: 1.35 !important;
		padding-right: 0 !important;
	}

	.listing .excerpt,
	.listing-alt .content .excerpt,
	.highlights .excerpt,
	.news-focus .excerpt {
		font-size: 0.95rem !important;
		line-height: 1.55 !important;
	}

	.post-header .post-title,
	.main-heading,
	.listing .post-title {
		font-size: 1.25rem !important;
		line-height: 1.35 !important;
		margin-right: 0 !important;
		float: none !important;
		padding-left: 12px !important;
		width: auto !important;
		max-width: 100% !important;
	}

	.post-header .post-title:before {
		top: 0.35em !important;
		height: 1.1em !important;
	}

	.post-header .comments {
		float: none !important;
		display: inline-block !important;
		margin: 0 0 8px !important;
	}

	.right-sidebar .grid-overlay.grid-3 .meta,
	.listing .meta,
	.highlights .meta {
		display: block !important;
		font-size: 0.75rem !important;
		line-height: 1.4 !important;
	}

	/* ---- Single / corps d'article ---- */
	.main-content,
	.col-8.main-content,
	.sidebar,
	.col-4.sidebar {
		width: 100% !important;
		float: none !important;
		margin-left: 0 !important;
		margin-right: 0 !important;
	}

	.post-content,
	.post-layout-cover .post-content,
	.post-content-right,
	.post-container .post-content {
		margin-left: 0 !important;
		margin-right: 0 !important;
		padding-left: 0 !important;
		padding-right: 0 !important;
	}

	.post-share {
		margin-left: 0 !important;
		padding-left: 0 !important;
		padding-right: 0 !important;
	}

	.post-content,
	.post-content.description {
		font-size: 1.05rem !important;
		line-height: 1.7 !important;
	}

	.post-content p,
	.post-content li {
		font-size: inherit !important;
		line-height: 1.7 !important;
	}

	.post-content h2,
	.post-content h2.wp-block-heading {
		font-size: 1.35rem !important;
		line-height: 1.3 !important;
		margin-top: 1.5em !important;
	}

	.post-content h3,
	.post-content h3.wp-block-heading {
		font-size: 1.15rem !important;
		line-height: 1.35 !important;
	}

	.post-content ul,
	.post-content ol {
		margin-left: 0.25em !important;
		padding-left: 1.2em !important;
	}

	.post-content figure,
	.post-content .wp-block-image,
	.post-content .wp-block-embed,
	.post-content .aspiesoft-embed {
		margin-left: 0 !important;
		margin-right: 0 !important;
		width: 100% !important;
		max-width: 100% !important;
	}

	.post-layout-cover .post-content > p img.alignnone,
	.post-layout-cover .wp-caption.alignnone,
	.post-layout-cover .post-content > p img.alignleft,
	.post-layout-cover .post-content > p img.alignright {
		margin-left: 0 !important;
		margin-right: 0 !important;
		max-width: 100% !important;
	}

	.entry-title,
	.main-heading,
	.post .post-title,
	.post-header .post-title {
		font-size: 1.4rem !important;
		line-height: 1.3 !important;
	}

	/* Breadcrumbs moins invasifs */
	.breadcrumbs {
		padding: 10px 12px !important;
		font-size: 12px !important;
		line-height: 1.4 !important;
	}

	/* Pubs / embeds : ne pas forcer de colonnes étroites */
	.main-content iframe,
	.main-content ins,
	.main-content .adsbygoogle {
		max-width: 100% !important;
	}
}

/* Très petits écrans */
@media only screen and (max-width: 400px) {
	.wrap,
	.main.wrap,
	.main-head .wrap,
	.top-bar .wrap {
		padding-left: 12px !important;
		padding-right: 12px !important;
	}

	.main-head .title {
		font-size: 22px !important;
	}

	.post-content,
	.post-content.description {
		font-size: 1rem !important;
		line-height: 1.65 !important;
	}

	.listing.grid-overlay h2,
	.listing.grid-overlay h2 a,
	.highlights h2,
	.highlights h2 a {
		font-size: 1.1rem !important;
		line-height: 1.35 !important;
	}
}