/**
 * Outil d'orientation 3e pilier, fourni par Louis (test_orientation_3e_pilier_V7).
 *
 * Repris tel quel : toutes les classes sont préfixées p3o- et scopées sous
 * .p3o-app, donc sans collision avec les styles mz- du thème. Seule la règle
 * globale `body{...}` du fichier d'origine a été retirée : le fond et les
 * marges de page sont déjà gérés par le thème.
 */

.p3o-app{--p3o-border:#d7dce2;--p3o-bg:#fff;--p3o-soft:#f5f7f9;--p3o-text:#17212b;--p3o-muted:#647180;max-width:860px;margin:0 auto;font-family:inherit;color:var(--p3o-text)}
.p3o-card{background:var(--p3o-bg);border:1px solid var(--p3o-border);border-radius:18px;padding:28px;box-shadow:0 10px 30px rgba(20,32,45,.06)}
.p3o-head{display:flex;justify-content:space-between;gap:28px;align-items:flex-start;margin-bottom:26px}.p3o-head h2{font-size:clamp(23px,3vw,34px);line-height:1.15;margin:3px 0 0}.p3o-kicker{text-transform:uppercase;letter-spacing:.08em;font-size:12px;font-weight:700;margin:0;color:var(--p3o-muted)}
.p3o-progress-wrap{min-width:150px;text-align:right}.p3o-progress{height:7px;background:var(--p3o-soft);border-radius:99px;overflow:hidden}.p3o-progress span{display:block;height:100%;width:0;background:currentColor;transition:width .25s}.p3o-progress-wrap small{display:block;margin-top:6px;color:var(--p3o-muted)}
.p3o-question h3{font-size:24px;line-height:1.25;margin:0 0 8px}.p3o-help{color:var(--p3o-muted);margin:0 0 18px;line-height:1.5}.p3o-options{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.p3o-option{border:1px solid var(--p3o-border);background:#fff;border-radius:13px;padding:15px 16px;text-align:left;cursor:pointer;font:inherit;font-weight:650;line-height:1.3}.p3o-option:hover,.p3o-option:focus{border-color:currentColor;outline:none;box-shadow:0 0 0 2px rgba(20,32,45,.08)}
.p3o-field{margin:14px 0}.p3o-field label{display:block;font-weight:650;margin-bottom:7px}.p3o-field select,.p3o-field input{width:100%;box-sizing:border-box;border:1px solid var(--p3o-border);border-radius:11px;padding:12px 13px;font:inherit;background:#fff}.p3o-inline{display:grid;grid-template-columns:1fr 1fr;gap:12px}.p3o-submit{margin-top:15px}
.p3o-actions{display:flex;gap:10px;margin-top:24px}.p3o-btn{border-radius:10px;padding:10px 14px;border:1px solid var(--p3o-border);font:inherit;cursor:pointer}.p3o-secondary{background:#fff}.p3o-link{background:transparent;border-color:transparent;text-decoration:underline}.p3o-result{border-top:1px solid var(--p3o-border);padding-top:4px}.p3o-badge{display:inline-block;padding:6px 9px;background:var(--p3o-soft);border-radius:999px;font-size:12px;font-weight:750;letter-spacing:.03em;text-transform:uppercase}.p3o-result h3{font-size:30px;line-height:1.15;margin:12px 0}.p3o-ourtake{margin:0 0 14px;padding:12px 16px;border-radius:13px;background:var(--p3o-soft);line-height:1.5}.p3o-ourtake p{margin:0 0 6px;line-height:1.5}.p3o-ourtake p:last-child{margin-bottom:0}.p3o-ourtake__name{display:block;margin:0 0 4px;font-size:16px}.p3o-keynote{margin:0 0 16px;padding:14px 18px;border-left:4px solid #1AB2D4;border-radius:0 13px 13px 0;background:#E3F6FA;line-height:1.5}.p3o-keynote strong{display:block;margin:0 0 6px;font-size:16px;color:#12294B}.p3o-keynote p{margin:0 0 6px}.p3o-keynote p:last-child{margin-bottom:0}.p3o-result p{line-height:1.58}.p3o-result-box{background:var(--p3o-soft);border-radius:13px;padding:16px 18px;margin:16px 0}.p3o-result-box strong{display:block;margin-bottom:5px}.p3o-result ul{padding-left:20px}.p3o-result li{margin:7px 0;line-height:1.45}.p3o-warning{border-left:4px solid currentColor;padding-left:14px;margin:16px 0}.p3o-disclaimer{font-size:12px;color:var(--p3o-muted);line-height:1.5;margin:10px 4px}.p3o-note{font-size:13px;color:var(--p3o-muted)}
@media(max-width:650px){.p3o-card{padding:20px}.p3o-head{display:block}.p3o-progress-wrap{margin-top:16px;text-align:left}.p3o-options,.p3o-inline{grid-template-columns:1fr}.p3o-question h3{font-size:21px}.p3o-result h3{font-size:25px}}

/*
 * Intégration Astra (thème parent) : Astra colore tous les <button> en blanc
 * sur fond teal. L'outil ne redéfinissait que le fond (blanc) de ses boutons,
 * d'où un texte blanc sur blanc, visible seulement au survol. On fixe la
 * couleur du texte et on neutralise le survol bleu d'Astra.
 */
.p3o-app .p3o-option,
.p3o-app .p3o-btn {
	color: var(--p3o-text);
}

/* Bouton principal du questionnaire (« Continuer ») : meme teal que les
   boutons du site, texte blanc. Sans cela, Astra le peint en bleu. Place
   apres les regles generales des boutons pour l'emporter sur elles. */
.p3o-app .p3o-btn.p3o-submit,
.p3o-app .p3o-btn.p3o-submit:hover,
.p3o-app .p3o-btn.p3o-submit:focus {
	background: #0B6E75;
	border-color: #0B6E75;
	color: #fff;
	font-weight: 600;
}

.p3o-app .p3o-btn.p3o-submit:hover,
.p3o-app .p3o-btn.p3o-submit:focus {
	background: #095A60;
	border-color: #095A60;
}

/* Astra fixe select et input a 40 px de haut avec line-height 1 : le texte
   du canton etait coupe en deux. On rend la hauteur au contenu. */
.p3o-app .p3o-field select,
.p3o-app .p3o-field input {
	height: auto;
	min-height: 48px;
	line-height: 1.4;
	color: var(--p3o-text);
}

.p3o-app .p3o-option:hover,
.p3o-app .p3o-option:focus,
.p3o-app .p3o-btn:hover,
.p3o-app .p3o-btn:focus {
	color: var(--p3o-text);
	background: var(--p3o-soft);
}

.p3o-app .p3o-link,
.p3o-app .p3o-link:hover,
.p3o-app .p3o-link:focus {
	background: transparent;
	color: var(--p3o-muted);
}

/* Boutons vers le comparatif, sur chaque résultat (1er octobre 2026).
   Posés juste sous « Points à vérifier pour comparer » : c'est la suite
   logique. Le premier bouton reprend le sarcelle du bouton Continuer. */
.p3o-comparatif {
	margin: 16px 0;
	padding: 16px 18px;
	border-radius: 13px;
	background: #E3F6FA;
	border-left: 4px solid #1AB2D4;
}
.p3o-comparatif__lead {
	margin: 0 0 12px;
	font-weight: 600;
	color: #12294B;
}
.p3o-comparatif__btns {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
}
.p3o-app .p3o-comparatif .p3o-btn {
	display: inline-block;
	margin: 0;
	text-decoration: none;
	line-height: 1.3;
}
.p3o-comparatif__lead { font-size: 16px; }
.p3o-comparatif__sub {
	margin: -6px 0 12px;
	font-size: 14px;
	color: #4A5560;
}