/* Facile IT — styles du thème (site et éditeur) */

:root {
	--nuit: #0C2340;
	--nuit-2: #123056;
	--bleu: #1769C2;
	--bleu-fonce: #11529A;
	--vert: #43B66E;
	--texte: #1D2733;
	--gris: #5A6675;
	--clair: #F3F6FA;
	--trait: #DDE4EC;
	--largeur: 1120px;
	--marge: clamp(1.25rem, 4vw, 2rem);
	--rayon: 12px;
}

*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
body { margin: 0; }
img { max-width: 100%; height: auto; }

h1, h2, h3 { line-height: 1.2; color: var(--nuit); margin: 0; letter-spacing: -0.01em; }
h1 { font-size: clamp(2rem, 5vw, 3.1rem); font-weight: 700; }
h2 { font-size: clamp(1.5rem, 3.2vw, 2.1rem); font-weight: 700; }
h3 { font-size: 1.2rem; font-weight: 650; }
p { margin: 0; }
a { text-underline-offset: 0.18em; }
a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible {
	outline: 3px solid var(--vert); outline-offset: 2px;
}

.screen-reader-text {
	position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap;
}
.skip-link { position: absolute; left: -999px; top: 0; background: #fff; color: var(--nuit); padding: 0.6rem 1rem; z-index: 100; }
.skip-link:focus { left: 0; }

/* ---------- En-tête ---------- */
.site-header { background: var(--nuit); color: #fff; }
.site-header__inner {
	max-width: calc(var(--largeur) + 2 * var(--marge)); margin: 0 auto; padding: 0.9rem var(--marge);
	display: flex; align-items: center; justify-content: space-between; gap: 1.5rem; flex-wrap: wrap;
}
.site-logo { display: flex; line-height: 0; }
.site-nav__liste { list-style: none; margin: 0; padding: 0; display: flex; align-items: center; gap: 0.4rem; }
.site-nav__liste a {
	display: block; padding: 0.55rem 0.9rem; color: #fff; text-decoration: none; font-weight: 500; border-radius: 8px;
}
.site-nav__liste a:hover, .site-nav__liste .current-menu-item > a { background: rgba(255, 255, 255, 0.1); }
.site-nav__liste .menu-cta > a { background: var(--vert); color: var(--nuit); font-weight: 650; margin-left: 0.5rem; }
.site-nav__liste .menu-cta > a:hover { background: #5CC985; }

.nav-toggle { display: none; background: none; border: 0; padding: 0.6rem; cursor: pointer; border-radius: 8px; }
.nav-toggle__barres, .nav-toggle__barres::before, .nav-toggle__barres::after {
	display: block; width: 24px; height: 2px; background: #fff; border-radius: 2px;
}
.nav-toggle__barres { position: relative; margin: 8px 0; }
.nav-toggle__barres::before, .nav-toggle__barres::after { content: ""; position: absolute; left: 0; }
.nav-toggle__barres::before { top: -7px; }
.nav-toggle__barres::after { top: 7px; }

@media (max-width: 800px) {
	.nav-toggle { display: block; }
	.site-nav { display: none; flex-basis: 100%; }
	.site-nav.is-open { display: block; }
	.site-nav__liste { flex-direction: column; align-items: stretch; gap: 0.2rem; padding-bottom: 0.5rem; }
	.site-nav__liste a { padding: 0.8rem 0.9rem; }
	.site-nav__liste .menu-cta > a { margin: 0.4rem 0 0; text-align: center; }
}

/* ---------- Bandeau de titre des pages ---------- */
.page-header { background: var(--nuit); color: #fff; padding: clamp(2rem, 6vw, 3.5rem) var(--marge); border-top: 1px solid rgba(255, 255, 255, 0.08); }
.page-header__inner { max-width: var(--largeur); margin: 0 auto; }
.page-header h1 { color: #fff; }
.page-header p { margin-top: 0.9rem; max-width: 46rem; font-size: 1.15rem; color: #C9D6E6; }

/* ---------- Contenu ---------- */
.entry-content > :not(.alignfull) {
	max-width: var(--largeur); margin-left: auto; margin-right: auto;
	padding-left: var(--marge); padding-right: var(--marge);
	box-sizing: content-box;
}
.entry-content > :not(.alignfull):first-child { margin-top: clamp(2.5rem, 6vw, 4rem); }
.entry-content > :not(.alignfull):last-child { margin-bottom: clamp(2.5rem, 6vw, 4rem); }

.section { padding: clamp(3rem, 7vw, 5rem) var(--marge); margin: 0; }
.section > * { max-width: var(--largeur); margin-left: auto; margin-right: auto; }
.section--clair { background: var(--clair); }
.section > h2 + p { color: var(--gris); font-size: 1.15rem; }
.section > h2 + p, .service > p { max-width: var(--largeur); }
.intro { max-width: 46rem !important; margin-left: max(0px, calc((100% - var(--largeur)) / 2)) !important; }

/* Bandeau d'accueil */
.hero {
	background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'%3E%3Cg fill='none' stroke='%23fff' stroke-opacity='.06'%3E%3Ccircle cx='50' cy='50' r='30' stroke-width='18'/%3E%3Ccircle cx='50' cy='50' r='44' stroke-width='12' stroke-dasharray='16.6 18'/%3E%3C/g%3E%3C/svg%3E") right -6rem center / 34rem no-repeat, radial-gradient(60rem 30rem at 85% 0%, #1B4A85 0%, transparent 70%) var(--nuit);
	color: #fff; padding-top: clamp(3rem, 8vw, 5.5rem); padding-bottom: clamp(3.5rem, 9vw, 6.5rem);
}
.hero h1 { color: #fff; max-width: 17ch; }
.hero .eyebrow { color: var(--vert); font-weight: 650; letter-spacing: 0.04em; text-transform: uppercase; font-size: 0.9rem; }
.hero .lead { font-size: clamp(1.1rem, 2.2vw, 1.3rem); color: #D3DEEC; }
.hero .lead, .hero .eyebrow, .hero h1, .hero .wp-block-buttons { margin-left: max(0px, calc((100% - var(--largeur)) / 2)); }
.hero .lead { max-width: 40rem; }
.hero .wp-block-buttons { margin-top: 2rem; }

@media (max-width: 800px) { .hero { background-size: 16rem, auto; background-position: right -6rem bottom -6rem, 0 0; } }

/* Boutons */
.wp-block-button__link, .wp-element-button { text-decoration: none; cursor: pointer; border: 0; transition: background-color 0.15s; }
.wp-block-button__link:hover, .wp-element-button:hover { background-color: var(--bleu-fonce); }
.hero .wp-block-button:not(.is-style-outline) .wp-block-button__link,
.cta .wp-block-button__link { background: var(--vert); color: var(--nuit); }
.hero .wp-block-button:not(.is-style-outline) .wp-block-button__link:hover,
.cta .wp-block-button__link:hover { background: #5CC985; }
.wp-block-button.is-style-outline .wp-block-button__link {
	background: transparent; color: var(--bleu); border: 2px solid currentColor; padding: calc(0.8rem - 2px) calc(1.4rem - 2px);
}
.hero .wp-block-button.is-style-outline .wp-block-button__link { color: #fff; }
.hero .wp-block-button.is-style-outline .wp-block-button__link:hover { background: rgba(255, 255, 255, 0.1); }

/* Cartes des pôles */
.cards.wp-block-columns { display: grid; grid-template-columns: repeat(auto-fit, minmax(235px, 1fr)); gap: 1.25rem; margin-top: 2.5rem; }
.card.wp-block-column {
	background: #fff; border: 1px solid var(--trait); border-radius: var(--rayon); padding: 1.6rem;
	display: flex; flex-direction: column; gap: 0.75rem; margin: 0;
}
.card > * { margin: 0 !important; }
.card::before {
	content: ""; width: 48px; height: 48px; border-radius: 10px; margin-bottom: 0.4rem;
	background: #E8F1FB center / 26px no-repeat;
}
.card--erp::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231769C2' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cellipse cx='12' cy='5.5' rx='8' ry='3'/%3E%3Cpath d='M4 5.5v6.5c0 1.7 3.6 3 8 3s8-1.3 8-3V5.5M4 12v6.5c0 1.7 3.6 3 8 3s8-1.3 8-3V12'/%3E%3C/svg%3E"); }
.card--infra::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231769C2' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='3.5' width='18' height='7' rx='1.5'/%3E%3Crect x='3' y='13.5' width='18' height='7' rx='1.5'/%3E%3Cpath d='M7 7h.01M7 17h.01M11 7h6M11 17h6'/%3E%3C/svg%3E"); }
.card--web::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231769C2' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='4' width='18' height='16' rx='2'/%3E%3Cpath d='M3 9h18M6.5 6.5h.01M9.5 6.5h.01M10 13l-2 2 2 2M14 13l2 2-2 2'/%3E%3C/svg%3E"); }
.card--assistance::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231769C2' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 14v-2a8 8 0 0 1 16 0v2'/%3E%3Crect x='2.5' y='13' width='4' height='6' rx='1.5'/%3E%3Crect x='17.5' y='13' width='4' height='6' rx='1.5'/%3E%3Cpath d='M19.5 19c0 1.5-1.5 2.5-4 2.5H13'/%3E%3C/svg%3E"); }
.card p { color: var(--gris); font-size: 1rem; }
.card .card-link { margin-top: auto !important; padding-top: 0.5rem; }
.card .card-link a { font-weight: 600; text-decoration: none; }
.card .card-link a:hover { text-decoration: underline; }

/* Colonnes d'arguments */
.points.wp-block-columns { gap: 2rem; margin-top: 2.5rem; }
.points .wp-block-column { border-top: 3px solid var(--vert); padding-top: 1.1rem; }
.points .wp-block-column > * + * { margin-top: 0.6rem; }
.points p { color: var(--gris); }
.points + p { margin-top: 2rem; font-weight: 600; }

/* Appel à contact */
.cta { background: var(--nuit); color: #fff; text-align: center; }
.cta h2 { color: #fff; }
.cta > h2 + p { color: #D3DEEC; font-size: 1.15rem; }
.cta .wp-block-buttons { justify-content: center; margin-top: 1.75rem; }

/* Page Services */
.service { border-bottom: 1px solid var(--trait); scroll-margin-top: 1rem; }
.service:last-of-type { border-bottom: 0; }
.service h2 { display: flex; align-items: center; gap: 0.9rem; }
.service h2::before { content: ""; width: 0.6rem; height: 1.6em; background: var(--vert); border-radius: 3px; flex: none; }
.service > p { max-width: 46rem; margin-left: max(0px, calc((100% - var(--largeur)) / 2)); }
.service ul { list-style: none; padding: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 1rem; margin-top: 1.75rem; }
.service li { background: var(--clair); border-radius: var(--rayon); padding: 1.1rem 1.25rem; margin: 0; }
.service li strong { display: block; color: var(--nuit); margin-bottom: 0.2rem; }
.sommaire.wp-block-buttons { gap: 0.6rem; }

.entry-content > h2 { margin-top: 2.5rem; }
.entry-content > ul, .entry-content > ol { padding-left: calc(var(--marge) + 1.2rem); }

/* ---------- Contact ---------- */
.contact.wp-block-columns { gap: 3rem; }
.contact-coordonnees > * + * { margin-top: 0.9rem; }
.contact-form form > * + * { margin-top: 1.1rem; }
.contact-form .champs-2 { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 1.1rem; }
.contact-form label { display: block; font-weight: 600; margin-bottom: 0.35rem; color: var(--nuit); }
.contact-form input[type="text"], .contact-form input[type="email"], .contact-form input[type="tel"],
.contact-form select, .contact-form textarea {
	width: 100%; font: inherit; color: inherit; background: #fff;
	border: 1px solid #B8C4D2; border-radius: 8px; padding: 0.7rem 0.85rem;
}
.contact-form textarea { resize: vertical; }
.contact-form .consentement { display: flex; gap: 0.7rem; align-items: flex-start; }
.contact-form .consentement input { margin-top: 0.3rem; width: 1.15rem; height: 1.15rem; flex: none; }
.contact-form .consentement label { font-weight: 400; font-size: 0.95rem; color: var(--gris); margin: 0; }
.contact-form .form-note { font-size: 0.9rem; color: var(--gris); }
.contact-form button { font: inherit; font-weight: 600; background: var(--bleu); color: #fff; border-radius: 8px; padding: 0.85rem 1.6rem; }
.champ-piege { position: absolute !important; left: -9999px; }
.notice { padding: 0.9rem 1.1rem; border-radius: 8px; margin-bottom: 1.5rem; font-weight: 500; }
.notice--ok { background: #E4F6EB; color: #14532D; }
.notice--erreur { background: #FDECEC; color: #8A1C1C; }

/* ---------- Pied de page ---------- */
.site-footer { background: var(--nuit); color: #C9D6E6; padding: 2.75rem var(--marge) 1.5rem; }
.site-footer__inner {
	max-width: var(--largeur); margin: 0 auto; display: flex; justify-content: space-between; gap: 2rem; flex-wrap: wrap;
}
.site-footer__marque p { margin-top: 0.8rem; }
.site-footer__liens { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 0.4rem 1.5rem; }
.site-footer__liens a { color: #fff; text-decoration: none; display: inline-block; padding: 0.3rem 0; }
.site-footer__liens a:hover { text-decoration: underline; }
.site-footer__legal {
	max-width: var(--largeur); margin: 2rem auto 0; padding-top: 1.25rem;
	border-top: 1px solid rgba(255, 255, 255, 0.12); font-size: 0.9rem;
}