/* Thème Qantum : compléments à theme.json.
   Chaque règle correspond à un style de bloc ou à une classe posée dans une composition. */

:root {
	--qn-radius-card: 18px;
	--qn-ice-soft: rgba(143, 184, 224, .18);
}

:where(body) { -webkit-font-smoothing: antialiased; }
:focus-visible { outline: 3px solid var(--wp--preset--color--blue); outline-offset: 3px; border-radius: 6px; }
img { max-width: 100%; height: auto; }

/* ---------- Titres de marque (police Qantum) ---------- */
.is-style-qantum-brand,
.editor-styles-wrapper .is-style-qantum-brand {
	font-family: var(--wp--preset--font-family--qantum);
	font-weight: 600;
	letter-spacing: -.01em;
}

/* ---------- Bandeau d'annonce ---------- */
.qn-notice { font-size: .9375rem; font-weight: 500; text-align: center; }
.qn-notice p { margin: 0; }
.qn-notice a { color: inherit; text-decoration-thickness: 1.5px; text-underline-offset: 3px; }
.qn-notice a:hover { text-decoration-thickness: 2.5px; }

/* ---------- En-tête ---------- */
.qn-header .wp-block-site-logo img { height: 34px; width: auto; }
.qn-header .wp-block-navigation a { text-decoration: none; }
.qn-header .wp-block-navigation a:hover { text-decoration: underline; text-underline-offset: 4px; }

/* ---------- Fond à points animé ---------- */
.is-style-qantum-dots { position: relative; overflow: hidden; isolation: isolate; }
.is-style-qantum-dots > .qn-dots-canvas { position: absolute; inset: 0; width: 100%; height: 100%; z-index: -1; pointer-events: none; }
.is-style-qantum-dots::after {
	content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none;
	background: radial-gradient(60% 70% at 50% 42%, rgba(143, 184, 224, .32), transparent 70%);
}
.is-style-qantum-dots.has-navy-background-color::after { background: radial-gradient(45% 60% at 70% 45%, rgba(0, 89, 155, .35), transparent 70%); }

/* ---------- Circuit : colonnes reliées par un trait et des nœuds ---------- */
.wp-block-columns.is-style-qantum-circuit { position: relative; padding-top: 52px; gap: 48px; }
.wp-block-columns.is-style-qantum-circuit::before {
	content: ""; position: absolute; left: 7px; right: 0; top: 7px; height: 2px;
	background: linear-gradient(to right, var(--wp--preset--color--ice), var(--wp--preset--color--blue) 70%, rgba(0, 89, 155, 0));
}
.wp-block-columns.is-style-qantum-circuit > .wp-block-column { position: relative; }
.wp-block-columns.is-style-qantum-circuit > .wp-block-column::before {
	content: ""; position: absolute; left: 0; top: -52px; width: 14px; height: 14px; border-radius: 50%;
	background: var(--wp--preset--color--field); border: 2px solid var(--wp--preset--color--blue); box-shadow: 0 0 0 5px rgba(0, 89, 155, .1);
}
.wp-block-columns.is-style-qantum-circuit h3 { margin-bottom: 4px; }
.wp-block-columns.is-style-qantum-circuit p { color: var(--wp--preset--color--ink-2); margin-top: 0; }
@media (max-width: 781px) {
	.wp-block-columns.is-style-qantum-circuit { padding-top: 0; padding-left: 48px; gap: 36px; }
	.wp-block-columns.is-style-qantum-circuit::before { left: 12px; right: auto; top: 10px; bottom: 10px; width: 2px; height: auto; background: linear-gradient(to bottom, var(--wp--preset--color--ice), var(--wp--preset--color--blue)); }
	.wp-block-columns.is-style-qantum-circuit > .wp-block-column::before { left: -42px; top: 8px; }
}

/* ---------- Verre ---------- */
.is-style-qantum-glass {
	background: #fff; border: 1px solid rgba(0, 89, 155, .2); border-radius: var(--qn-radius-card);
	box-shadow: var(--wp--preset--shadow--card);
}
.is-style-qantum-glass-dark {
	background: linear-gradient(180deg, rgba(255, 255, 255, .085), rgba(255, 255, 255, .04));
	border: 1px solid rgba(143, 184, 224, .3); border-radius: 20px;
	backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px);
	box-shadow: 0 1px 0 rgba(255, 255, 255, .12) inset, 0 40px 80px -40px rgba(0, 0, 0, .7);
}

/* ---------- Vidéo encadrée ---------- */
.wp-block-embed.is-style-qantum-video .wp-block-embed__wrapper {
	border-radius: var(--qn-radius-card); overflow: hidden; background: var(--wp--preset--color--navy-2);
	box-shadow: var(--wp--preset--shadow--video), 0 0 0 1px rgba(10, 27, 46, .08);
}
.wp-block-image.is-style-qantum-rounded img { border-radius: var(--qn-radius-card); }

/* ---------- Bouton « lien souligné » ---------- */
.wp-block-button.is-style-qantum-link .wp-block-button__link {
	background: transparent; color: var(--wp--preset--color--navy); box-shadow: none;
	padding: 0 0 3px; border-radius: 0; border-bottom: 1.5px solid rgba(0, 89, 155, .4);
}
.wp-block-button.is-style-qantum-link .wp-block-button__link:hover { border-color: var(--wp--preset--color--blue); background: transparent; }
.has-navy-background-color .wp-block-button.is-style-qantum-link .wp-block-button__link { color: #fff; border-color: rgba(143, 184, 224, .5); }

/* ---------- Fil d'Ariane (extension) ---------- */
.qn-breadcrumb { font-size: .875rem; color: var(--wp--preset--color--ink-2); }
.qn-breadcrumb ol { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: nowrap; gap: 6px; min-width: 0; }
.qn-breadcrumb li { white-space: nowrap; }
.qn-breadcrumb li:last-child { overflow: hidden; text-overflow: ellipsis; min-width: 0; }
.qn-breadcrumb li + li::before { content: "/"; margin-right: 6px; color: var(--wp--preset--color--line); }
.qn-breadcrumb a { color: inherit; text-decoration: none; }
.qn-breadcrumb a:hover { color: var(--wp--preset--color--blue); text-decoration: underline; }
.qn-breadcrumb [aria-current] { color: var(--wp--preset--color--ink); }

/* ---------- Liste d'articles ---------- */
.qn-cards .wp-block-post { display: flex; }
.qn-card {
	display: flex; flex-direction: column; width: 100%; background: #fff; border: 1px solid var(--wp--preset--color--line);
	border-radius: var(--qn-radius-card); overflow: hidden; transition: border-color .15s ease, box-shadow .15s ease;
	position: relative;
}
.qn-card:hover, .qn-card:focus-within { border-color: rgba(0, 89, 155, .45); box-shadow: var(--wp--preset--shadow--card); }
.qn-card .wp-block-post-featured-image { margin: 0; aspect-ratio: 16 / 9; overflow: hidden; }
.qn-card .wp-block-post-featured-image img { width: 100%; height: 100%; object-fit: cover; }
.qn-card .wp-block-post-title a { color: var(--wp--preset--color--navy); text-decoration: none; }
.qn-card .wp-block-post-title a::after { content: ""; position: absolute; inset: 0; }
.qn-card .wp-block-post-title a:hover { text-decoration: underline; text-underline-offset: 4px; }
.qn-card .wp-block-post-excerpt__more-text { display: none; }
.qn-card-body { flex: 1; }

.qn-featured { position: relative; }
.qn-featured .wp-block-post-featured-image { margin: 0; }
.qn-featured .wp-block-post-featured-image img { border-radius: var(--qn-radius-card); aspect-ratio: 16 / 10; object-fit: cover; width: 100%; }
.qn-featured .wp-block-post-title a { color: var(--wp--preset--color--navy); text-decoration: none; }
.qn-featured .wp-block-post-title a::after { content: ""; position: absolute; inset: 0; }
.qn-featured .wp-block-post-title a:hover { text-decoration: underline; text-underline-offset: 5px; }

.qn-meta { display: flex; flex-wrap: wrap; gap: 6px 14px; font-size: .875rem; color: var(--wp--preset--color--ink-2); }
.qn-meta > * { margin: 0 !important; }

.wp-block-query-pagination { font-weight: 500; }
.wp-block-query-pagination a { text-decoration: none; }
.wp-block-query-pagination .page-numbers { padding: 6px 12px; border-radius: 8px; }
.wp-block-query-pagination .page-numbers.current { background: var(--wp--preset--color--navy); color: #fff; }

/* ---------- Article ---------- */
.qn-aside .qn-toc { position: sticky; top: 32px; max-height: calc(100vh - 64px); overflow-y: auto; }
@media (max-width: 1080px) {
	.qn-article-layout { flex-direction: column; }
	.qn-article-layout > .qn-aside { width: 100%; flex-basis: auto !important; }
	.qn-aside .qn-toc { position: static; max-height: none; background: #fff; border: 1px solid var(--wp--preset--color--line); border-radius: 12px; padding: 18px 20px; }
}
/* En-tête d'article : titre à gauche, image à droite */
.qn-article-head .wp-block-post-featured-image { margin: 0; }
.qn-article-head .wp-block-post-featured-image img { border-radius: var(--qn-radius-card); aspect-ratio: 4 / 3; object-fit: cover; width: 100%; }

.qn-prose > * + * { margin-top: 1.25em; }
.qn-prose h2 { margin-top: 2.2em; scroll-margin-top: 24px; }
.qn-prose h3 { margin-top: 1.8em; scroll-margin-top: 24px; }
.qn-prose h4 { margin-top: 1.5em; }
.qn-prose p, .qn-prose li { font-size: 1.125rem; line-height: 1.7; }
.qn-prose ul, .qn-prose ol { padding-left: 1.3em; }
.qn-prose li + li { margin-top: .4em; }
.qn-prose table { width: 100%; border-collapse: collapse; font-size: 1rem; }
.qn-prose th, .qn-prose td { border-bottom: 1px solid var(--wp--preset--color--line); padding: 10px 12px; text-align: left; vertical-align: top; }
.qn-prose th { color: var(--wp--preset--color--navy); font-weight: 600; }

/* Sommaire (extension) */
.qn-toc { font-size: .9375rem; }
.qn-toc-title { font-weight: 600; color: var(--wp--preset--color--navy); margin: 0 0 12px; font-size: .9375rem; }
.qn-toc ol { list-style: none; margin: 0; padding: 0 0 0 14px; border-left: 2px solid var(--wp--preset--color--line); }
.qn-toc li { margin: 0; }
.qn-toc li + li { margin-top: 8px; }
.qn-toc a { color: var(--wp--preset--color--ink-2); text-decoration: none; display: block; line-height: 1.4; }
.qn-toc a:hover, .qn-toc a[aria-current="true"] { color: var(--wp--preset--color--blue); }
.qn-toc a[aria-current="true"] { font-weight: 500; }

/* « L'essentiel » : résumé en tête d'article */
.qn-takeaways { border-left: 3px solid var(--wp--preset--color--blue); }
.qn-takeaways .qn-takeaways-title { font-weight: 600; color: var(--wp--preset--color--navy); }
.qn-takeaways ul { margin: 0; padding-left: 1.2em; }
.qn-takeaways li + li { margin-top: .4em; }

/* Boîte auteur (extension) */
.qn-author { display: grid; grid-template-columns: 64px 1fr; gap: 18px; align-items: start; }
.qn-author img { width: 64px; height: 64px; border-radius: 50%; object-fit: cover; }
.qn-author-name { font-weight: 600; color: var(--wp--preset--color--navy); margin: 0; }
.qn-author-role { color: var(--wp--preset--color--ink-2); font-size: .9375rem; margin: 2px 0 8px; }
.qn-author-bio { margin: 0; font-size: 1rem; }
.qn-author a { font-size: .9375rem; }

/* FAQ en blocs Détails */
.qn-faq .wp-block-details summary { font-weight: 600; color: var(--wp--preset--color--navy); cursor: pointer; font-size: 1.0625rem; }
.qn-faq .wp-block-details > :not(summary) { margin-top: .75rem; color: var(--wp--preset--color--ink-2); }

/* ---------- Pied de page ---------- */
.qn-footer a { color: #C9DAEC; text-decoration: none; }
.qn-footer a:hover { color: #fff; }
.qn-footer .wp-block-site-logo img { height: 26px; width: auto; }

@media (prefers-reduced-motion: reduce) {
	html { scroll-behavior: auto; }
	* { transition: none !important; }
}

/* ---------- À la une : le premier article de la page 1 prend toute la largeur ---------- */
@media (min-width: 900px) {
	body.blog:not(.paged) .qn-cards .wp-block-post-template > .wp-block-post:first-child { grid-column: 1 / -1; }
	body.blog:not(.paged) .qn-cards .wp-block-post:first-child .qn-card { flex-direction: row; align-items: stretch; }
	body.blog:not(.paged) .qn-cards .wp-block-post:first-child .wp-block-post-featured-image { flex: 0 0 58%; aspect-ratio: auto; min-height: 360px; }
	body.blog:not(.paged) .qn-cards .wp-block-post:first-child .qn-card-body { padding: 40px 44px !important; display: flex; flex-direction: column; justify-content: center; gap: 16px !important; }
	body.blog:not(.paged) .qn-cards .wp-block-post:first-child .wp-block-post-title { font-size: clamp(1.75rem, 2.4vw, 2.25rem) !important; line-height: 1.15; }
	body.blog:not(.paged) .qn-cards .wp-block-post:first-child .wp-block-post-excerpt { font-size: 1.125rem; }
}

/* Sommaire avant le texte sur mobile */
@media (max-width: 781px) {
	.qn-article-layout > .qn-aside { order: -1; }
}

/* Sections pleine largeur collées les unes aux autres, et au pied de page */
.wp-site-blocks > * + * { margin-block-start: 0; }
.qn-flow > * { margin-block-start: 0; margin-block-end: 0; }

/* ---------- Vidéo hébergée : image d'attente et bouton de lecture ---------- */
.wp-block-video.is-style-qantum-video { position: relative; margin: 0; border-radius: var(--qn-radius-card); overflow: hidden; background: var(--wp--preset--color--navy-2); box-shadow: var(--wp--preset--shadow--video), 0 0 0 1px rgba(10, 27, 46, .08); aspect-ratio: 16 / 9; }
.wp-block-video.is-style-qantum-video video { width: 100%; height: 100%; display: block; object-fit: cover; }
.wp-block-video.is-style-qantum-video video::cue { font-family: var(--wp--preset--font-family--inter); font-size: clamp(15px, 1.7vw, 22px); background: rgba(10, 27, 46, .78); color: #fff; line-height: 1.35; }
.qn-play { all: unset; box-sizing: border-box; cursor: pointer; position: absolute; inset: 0; display: flex; align-items: flex-end; padding: clamp(16px, 2.4vw, 28px); background: linear-gradient(180deg, rgba(10, 27, 46, 0) 50%, rgba(10, 27, 46, .78)); }
.qn-play[hidden] { display: none; }
.qn-play-row { display: flex; align-items: center; gap: 16px; }
.qn-play-icon { flex: none; width: 64px; height: 64px; border-radius: 50%; display: grid; place-items: center; background: rgba(255, 255, 255, .16); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); box-shadow: 0 0 0 1px rgba(255, 255, 255, .5) inset; transition: transform .2s ease, background .2s ease; }
.qn-play-icon svg { width: 24px; height: 24px; margin-left: 4px; fill: #fff; }
.qn-play:hover .qn-play-icon, .qn-play:focus-visible .qn-play-icon { transform: scale(1.06); background: rgba(0, 89, 155, .8); }
.qn-play:focus-visible .qn-play-icon { box-shadow: 0 0 0 3px var(--wp--preset--color--ice); }
.qn-play-label { color: #fff; font-size: 17px; font-weight: 500; text-shadow: 0 1px 8px rgba(10, 27, 46, .6); }
.qn-play-label small { display: block; font-size: 14px; font-weight: 400; color: #C9DAEC; }
@media (max-width: 560px) { .qn-play-icon { width: 52px; height: 52px; } }
