/**
 * Habillage du site : en-tête, navigation, pied de page, articles, widgets.
 */

/* Structure générale ---------------------------------------------------- */

.ww-site {
	display: flex;
	flex-direction: column;
	min-height: 100vh;
}

.ww-site-main {
	flex: 1 0 auto;
}

.ww-page-body > .ww-block:first-child {
	margin-top: 0;
}

/* En-tête ---------------------------------------------------------------- */

.ww-header {
	position: relative;
	z-index: var(--ww-z-header);
	background: var(--ww-header-bg);
	color: var(--ww-header-text);
	border-bottom: var(--ww-border);
}

.ww-has-sticky-header .ww-header {
	position: sticky;
	top: 0;
}

.ww-header__inner {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--ww-space-5);
	min-height: var(--ww-header-height);
	padding-block: var(--ww-space-3);
}

.ww-header a {
	color: inherit;
	text-decoration: none;
}

.ww-site-title {
	margin: 0;
	font-size: var(--ww-text-lg);
	letter-spacing: var(--ww-tracking-tight);
}

.ww-site-tagline {
	margin: 0;
	font-size: var(--ww-text-xs);
	color: var(--ww-color-muted);
}

.ww-header .custom-logo {
	display: block;
	width: auto;
	max-height: 52px;
}

.ww-header__end {
	display: flex;
	align-items: center;
	gap: var(--ww-space-4);
}

/* En-tête transparent (page d'accueil avec héros plein écran) */
.ww-has-transparent-header .ww-header {
	position: absolute;
	inset: 0 0 auto;
	background: transparent;
	border-bottom-color: transparent;
	color: var(--ww-color-light);
}

.ww-has-transparent-header .ww-header.is-stuck {
	position: fixed;
	background: var(--ww-header-bg);
	color: var(--ww-header-text);
	border-bottom-color: var(--ww-color-border);
	box-shadow: var(--ww-shadow-sm);
	animation: ww-slide-down var(--ww-duration) var(--ww-ease);
}

@keyframes ww-slide-down {
	from { transform: translateY(-100%); }
	to { transform: translateY(0); }
}

/* Dispositions alternatives */
.ww-header--centered .ww-header__inner {
	flex-direction: column;
	gap: var(--ww-space-3);
	text-align: center;
}

.ww-header--split .ww-header__inner {
	display: grid;
	grid-template-columns: 1fr auto 1fr;
}

.ww-header--split .ww-nav { justify-content: flex-end; }

/* Navigation ------------------------------------------------------------- */

.ww-nav {
	display: flex;
	align-items: center;
}

.ww-menu {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: var(--ww-space-2);
	margin: 0;
	padding: 0;
	list-style: none;
}

.ww-menu li { position: relative; margin: 0; }

.ww-menu a {
	display: block;
	padding: 0.55em 0.8em;
	border-radius: var(--ww-radius-sm);
	font-size: var(--ww-text-sm);
	font-weight: 600;
	transition: background-color var(--ww-duration) var(--ww-ease), color var(--ww-duration) var(--ww-ease);
}

.ww-menu a:hover,
.ww-menu a:focus-visible {
	background: color-mix(in srgb, currentColor 10%, transparent);
}

.ww-menu .current-menu-item > a,
.ww-menu .current_page_item > a,
.ww-menu .current-menu-ancestor > a {
	background: var(--ww-color-primary);
	color: var(--ww-on-primary);
}

/* Sous-menus */
.ww-menu .sub-menu {
	position: absolute;
	top: 100%;
	left: 0;
	z-index: 10;
	min-width: 14rem;
	margin: 0;
	padding: var(--ww-space-2);
	list-style: none;
	background: var(--ww-color-light);
	color: var(--ww-color-text);
	border: var(--ww-border);
	border-radius: var(--ww-radius);
	box-shadow: var(--ww-shadow-lg);
	opacity: 0;
	visibility: hidden;
	transform: translateY(6px);
	transition: opacity var(--ww-duration) var(--ww-ease), transform var(--ww-duration) var(--ww-ease), visibility var(--ww-duration);
}

.ww-menu li:hover > .sub-menu,
.ww-menu li:focus-within > .sub-menu,
.ww-menu li.is-open > .sub-menu {
	opacity: 1;
	visibility: visible;
	transform: translateY(0);
}

.ww-menu .sub-menu .sub-menu {
	top: 0;
	left: 100%;
}

.ww-menu__toggle {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 0.2em;
	background: none;
	border: 0;
	color: inherit;
	border-radius: var(--ww-radius-sm);
}

.ww-menu__toggle .ww-icon {
	width: 1em;
	height: 1em;
	transition: transform var(--ww-duration) var(--ww-ease);
}

.ww-menu li.is-open > a > .ww-menu__toggle .ww-icon,
.ww-menu li.is-open > .ww-menu__toggle .ww-icon {
	transform: rotate(180deg);
}

/* Bouton hamburger */
.ww-burger {
	display: none;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	padding: 0;
	background: none;
	border: 0;
	color: inherit;
	cursor: pointer;
}

.ww-burger span {
	position: relative;
	display: block;
	width: 22px;
	height: 2px;
	background: currentColor;
	transition: background-color var(--ww-duration) var(--ww-ease);
}

.ww-burger span::before,
.ww-burger span::after {
	content: "";
	position: absolute;
	left: 0;
	width: 22px;
	height: 2px;
	background: currentColor;
	transition: transform var(--ww-duration) var(--ww-ease);
}

.ww-burger span::before { top: -7px; }
.ww-burger span::after { top: 7px; }

.ww-burger[aria-expanded="true"] span { background: transparent; }
.ww-burger[aria-expanded="true"] span::before { transform: translateY(7px) rotate(45deg); }
.ww-burger[aria-expanded="true"] span::after { transform: translateY(-7px) rotate(-45deg); }

@media (max-width: 1024px) {
	.ww-burger { display: inline-flex; }

	.ww-nav {
		position: fixed;
		inset: var(--ww-header-height) 0 0;
		z-index: var(--ww-z-overlay);
		display: block;
		padding: var(--ww-space-5) var(--ww-gutter) var(--ww-space-9);
		background: var(--ww-header-bg);
		color: var(--ww-header-text);
		overflow-y: auto;
		transform: translateX(100%);
		visibility: hidden;
		transition: transform var(--ww-duration) var(--ww-ease), visibility var(--ww-duration);
	}

	.ww-nav.is-open {
		transform: translateX(0);
		visibility: visible;
	}

	.ww-menu {
		flex-direction: column;
		align-items: stretch;
		gap: 0;
	}

	.ww-menu a {
		padding: 0.85em 0.4em;
		border-bottom: var(--ww-border);
		font-size: var(--ww-text-md);
	}

	.ww-menu .sub-menu {
		position: static;
		display: none;
		min-width: 0;
		padding: 0 0 0 var(--ww-space-4);
		border: 0;
		box-shadow: none;
		opacity: 1;
		visibility: visible;
		transform: none;
	}

	.ww-menu li.is-open > .sub-menu { display: block; }

	.ww-menu__toggle {
		position: absolute;
		top: 0.55em;
		right: 0;
		width: 2.4em;
		height: 2.4em;
	}
}

/* Fil d'Ariane ----------------------------------------------------------- */

.ww-breadcrumbs {
	padding-block: var(--ww-space-4);
	font-size: var(--ww-text-xs);
	color: var(--ww-color-muted);
}

.ww-breadcrumbs ol {
	display: flex;
	flex-wrap: wrap;
	gap: 0.5em;
	margin: 0;
	padding: 0;
	list-style: none;
}

.ww-breadcrumbs li + li::before {
	content: "/";
	margin-right: 0.5em;
	opacity: 0.5;
}

.ww-breadcrumbs li + li { margin-top: 0; }

/* Contenus --------------------------------------------------------------- */

.ww-page-header {
	padding-block: var(--ww-space-8) var(--ww-space-6);
}

.ww-page-header__title {
	margin-bottom: var(--ww-space-3);
}

.ww-page-header__excerpt {
	max-width: 46rem;
	color: var(--ww-color-muted);
	font-size: var(--ww-text-lg);
}

.ww-entry-content {
	padding-block: var(--ww-space-6) var(--ww-space-9);
}

.ww-entry-content > * {
	max-width: var(--ww-container-content);
	margin-inline: auto;
}

.ww-entry-content > .ww-block,
.ww-entry-content > .alignwide,
.ww-entry-content > .alignfull {
	max-width: none;
}

.ww-entry-meta {
	display: flex;
	flex-wrap: wrap;
	gap: 0.5em;
	align-items: center;
	font-size: var(--ww-text-sm);
	color: var(--ww-color-muted);
}

.ww-entry-meta a { color: inherit; }
.ww-sep { opacity: 0.5; }

.ww-featured-image {
	margin-bottom: var(--ww-space-6);
	border-radius: var(--ww-radius-lg);
	overflow: hidden;
}

.ww-with-sidebar {
	display: grid;
	gap: var(--ww-space-8);
	grid-template-columns: minmax(0, 1fr) 300px;
	align-items: start;
	padding-block: var(--ww-space-8);
}

.ww-no-sidebar .ww-with-sidebar,
.ww-with-sidebar--none {
	grid-template-columns: minmax(0, 1fr);
}

@media (max-width: 1024px) {
	.ww-with-sidebar { grid-template-columns: minmax(0, 1fr); }
}

/* Liste d'articles ------------------------------------------------------- */

.ww-posts-grid {
	display: grid;
	gap: var(--ww-space-6);
	grid-template-columns: repeat(auto-fill, minmax(min(300px, 100%), 1fr));
	padding-block: var(--ww-space-6);
}

.ww-post-card {
	display: flex;
	flex-direction: column;
	background: var(--ww-color-light);
	border: var(--ww-border);
	border-radius: var(--ww-radius);
	overflow: hidden;
	transition: transform var(--ww-duration) var(--ww-ease), box-shadow var(--ww-duration) var(--ww-ease);
}

.ww-post-card:hover {
	transform: translateY(-4px);
	box-shadow: var(--ww-shadow-lg);
}

.ww-post-card__media { display: block; }

.ww-post-card__media img {
	width: 100%;
	aspect-ratio: 3 / 2;
	object-fit: cover;
	border-radius: 0;
}

.ww-post-card__body {
	display: flex;
	flex-direction: column;
	gap: var(--ww-space-3);
	padding: var(--ww-space-5);
	flex: 1;
}

.ww-post-card__title {
	margin: 0;
	font-size: var(--ww-text-lg);
}

.ww-post-card__title a { text-decoration: none; }
.ww-post-card__excerpt { margin: 0; color: var(--ww-color-muted); font-size: var(--ww-text-sm); }
.ww-post-card__footer { margin-top: auto; }

/* Pagination ------------------------------------------------------------- */

.ww-pagination {
	padding-block: var(--ww-space-6);
}

.ww-pagination ul {
	display: flex;
	flex-wrap: wrap;
	gap: var(--ww-space-2);
	justify-content: center;
	margin: 0;
	padding: 0;
	list-style: none;
}

.ww-pagination li { margin-top: 0; }

.ww-pagination .page-numbers {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 2.6em;
	height: 2.6em;
	padding-inline: 0.6em;
	border: var(--ww-border);
	border-radius: var(--ww-radius-sm);
	font-size: var(--ww-text-sm);
	font-weight: 600;
	text-decoration: none;
}

.ww-pagination .page-numbers.current {
	background: var(--ww-color-primary);
	border-color: var(--ww-color-primary);
	color: var(--ww-on-primary);
}

/* Colonne latérale et widgets -------------------------------------------- */

.ww-sidebar {
	display: flex;
	flex-direction: column;
	gap: var(--ww-space-6);
}

.ww-widget {
	padding: var(--ww-space-5);
	background: var(--ww-color-surface);
	border-radius: var(--ww-radius);
}

.ww-widget__title {
	margin-bottom: var(--ww-space-3);
	font-size: var(--ww-text-md);
}

.ww-widget ul {
	list-style: none;
	padding: 0;
	margin: 0;
}

.ww-widget li + li {
	margin-top: var(--ww-space-2);
	padding-top: var(--ww-space-2);
	border-top: var(--ww-border);
}

/* Recherche -------------------------------------------------------------- */

.ww-search-form {
	display: flex;
	gap: var(--ww-space-2);
}

.ww-search-form .ww-btn { flex: none; }

/* Commentaires ----------------------------------------------------------- */

.ww-comments {
	padding-block: var(--ww-space-8);
	border-top: var(--ww-border);
}

.ww-comment-list {
	list-style: none;
	padding: 0;
	margin: 0 0 var(--ww-space-8);
}

.ww-comment-list .children {
	list-style: none;
	padding-left: var(--ww-space-6);
}

.ww-comment-list li { margin-top: var(--ww-space-5); }

.ww-comment-list .comment-body {
	padding: var(--ww-space-5);
	background: var(--ww-color-surface);
	border-radius: var(--ww-radius);
}

.ww-comment-list .comment-meta {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: var(--ww-space-2);
	margin-bottom: var(--ww-space-3);
	font-size: var(--ww-text-sm);
}

.ww-comment-list .avatar {
	border-radius: 50%;
}

.comment-form {
	display: grid;
	gap: var(--ww-space-4);
}

.comment-form .form-submit { margin: 0; }

.comment-form input[type="submit"] {
	width: auto;
	padding: 0.78em 1.5em;
	background: var(--ww-color-primary);
	color: var(--ww-on-primary);
	border: 0;
	border-radius: var(--ww-radius-sm);
	font-weight: 700;
}

/* Pied de page ----------------------------------------------------------- */

.ww-footer {
	margin-top: auto;
	background: var(--ww-footer-bg);
	color: var(--ww-footer-text);
}

.ww-footer a {
	color: inherit;
	text-decoration: none;
}

.ww-footer a:hover {
	color: var(--ww-color-primary);
	text-decoration: underline;
}

.ww-footer__widgets {
	display: grid;
	gap: var(--ww-space-7);
	grid-template-columns: repeat(var(--ww-footer-cols, 4), minmax(0, 1fr));
	padding-block: var(--ww-space-9);
}

@media (max-width: 1024px) {
	.ww-footer__widgets { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 480px) {
	.ww-footer__widgets { grid-template-columns: minmax(0, 1fr); }
}

.ww-footer .ww-widget {
	padding: 0;
	background: none;
}

.ww-footer .ww-widget li + li {
	border-top-color: color-mix(in srgb, currentColor 18%, transparent);
}

.ww-footer__bottom {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: var(--ww-space-4);
	padding-block: var(--ww-space-5);
	border-top: 1px solid color-mix(in srgb, currentColor 18%, transparent);
	font-size: var(--ww-text-sm);
}

.ww-footer__legal {
	display: flex;
	flex-wrap: wrap;
	gap: var(--ww-space-4);
	margin: 0;
	padding: 0;
	list-style: none;
}

.ww-footer__legal li { margin-top: 0; }

/* Réseaux sociaux --------------------------------------------------------- */

.ww-socials {
	display: flex;
	flex-wrap: wrap;
	gap: var(--ww-space-2);
	margin: 0;
	padding: 0;
	list-style: none;
}

.ww-socials li { margin-top: 0; }

.ww-social-link {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 2.5rem;
	height: 2.5rem;
	border: 1px solid color-mix(in srgb, currentColor 25%, transparent);
	border-radius: 50%;
	transition: background-color var(--ww-duration) var(--ww-ease), color var(--ww-duration) var(--ww-ease), transform var(--ww-duration) var(--ww-ease);
}

.ww-social-link:hover {
	background: var(--ww-color-primary);
	border-color: var(--ww-color-primary);
	color: var(--ww-on-primary);
	transform: translateY(-2px);
	text-decoration: none;
}

.ww-social-link .ww-icon { width: 1.15rem; height: 1.15rem; }

/* Page 404 et recherche vide ---------------------------------------------- */

.ww-empty {
	padding-block: var(--ww-space-10);
	text-align: center;
}

.ww-empty__code {
	font-size: clamp(4rem, 14vw, 9rem);
	font-weight: 900;
	line-height: 1;
	color: var(--ww-color-primary);
	letter-spacing: var(--ww-tracking-tight);
}

/* Bouton retour en haut ---------------------------------------------------- */

.ww-to-top {
	position: fixed;
	right: var(--ww-space-5);
	bottom: var(--ww-space-5);
	z-index: var(--ww-z-header);
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 2.9rem;
	height: 2.9rem;
	background: var(--ww-color-dark);
	color: var(--ww-color-light);
	border: 0;
	border-radius: 50%;
	box-shadow: var(--ww-shadow);
	opacity: 0;
	visibility: hidden;
	transform: translateY(10px);
	transition: opacity var(--ww-duration) var(--ww-ease), transform var(--ww-duration) var(--ww-ease), visibility var(--ww-duration);
}

.ww-to-top.is-visible {
	opacity: 1;
	visibility: visible;
	transform: translateY(0);
}

/* Masquage à la demande (réglages d'affichage de la page) ------------------ */

.ww-hide-header .ww-header,
.ww-hide-footer .ww-footer {
	display: none;
}