.cj-orientation { --cj-ink:#103843; --cj-accent:#efb79d; --cj-paper:#fbfcfc; color:var(--cj-ink); font-family:inherit; max-width:1380px; margin:0 auto; padding:24px; }
.cj-orientation * { box-sizing:border-box; }
.cj-orientation button,.cj-orientation input { font:inherit; }
.cj-orientation-app { min-height:480px; }
.cj-question-card,.cj-special-result { background:linear-gradient(140deg,#f8fbfc 0%,#fff 70%); border:1px solid #dfe7e9; border-radius:22px; padding:clamp(24px,5vw,70px); margin:20px auto; max-width:900px; box-shadow:0 16px 50px rgba(16,56,67,.06); }
.cj-header h2 { font-size:clamp(30px,4vw,55px); line-height:1.12; margin:15px 0 18px; letter-spacing:-.035em; color:var(--cj-ink); }
.cj-header p { font-size:18px; max-width:680px; }
.cj-eyebrow { display:inline-block; text-transform:uppercase; letter-spacing:.18em; font-size:12px; font-weight:700; }
.cj-options { display:grid; grid-template-columns:repeat(auto-fit,minmax(180px,1fr)); gap:15px; margin-top:35px; }
.cj-option { min-height:82px; border:1.5px solid #bbced3; background:white; color:var(--cj-ink); border-radius:12px; padding:18px; text-align:left; font-size:19px; font-weight:650; cursor:pointer; transition:transform .15s,border-color .15s,box-shadow .15s; }
.cj-option:hover,.cj-option:focus-visible { transform:translateY(-2px); border-color:var(--cj-ink); box-shadow:0 8px 20px rgba(16,56,67,.1); }
.cj-text-question { display:flex; gap:12px; margin-top:30px; }
.cj-text-question input { flex:1; min-width:0; border:1.5px solid #bbced3; border-radius:8px; padding:14px 16px; font-size:19px; }
.cj-button { display:inline-flex; justify-content:center; align-items:center; min-height:51px; padding:12px 18px; border-radius:8px; text-decoration:none !important; text-align:center; font-weight:700; font-size:14px; line-height:1.2; text-transform:uppercase; cursor:pointer; }
.cj-button-primary { background:var(--cj-ink); border:1px solid var(--cj-ink); color:#fff !important; }
.cj-button-outline { background:#fff; border:1px solid var(--cj-ink); color:var(--cj-ink) !important; }
.cj-button:hover:not(.cj-disabled) { filter:brightness(1.12); }
.cj-disabled { opacity:.45; cursor:not-allowed; }
.cj-back,.cj-form-close { display:inline-block; margin-top:20px; background:none; border:0; color:var(--cj-ink); text-decoration:underline; cursor:pointer; padding:5px 0; }
.cj-result-hero { display:grid; grid-template-columns:1fr 1fr; gap:clamp(24px,4vw,70px); align-items:center; margin:15px 0 20px; background:radial-gradient(circle at 30% 10%,#e1f5fa 0,#fff 50%); border-radius:20px; padding:20px; }
.cj-result-photo { min-height:360px; aspect-ratio:1.25; border-radius:17px; overflow:hidden; display:grid; place-items:center; background:linear-gradient(135deg,#d8eaf1,#ece2f5,#f6d9ce); color:var(--cj-ink); font-size:28px; font-weight:700; }
.cj-result-photo img { width:100%; height:100%; object-fit:cover; }
.cj-result-intro h2 { font-size:clamp(28px,3.5vw,52px); line-height:1.1; margin:15px 0 22px; letter-spacing:-.03em; }
.cj-result-intro h3 { font-size:clamp(22px,2.5vw,34px); line-height:1.15; margin:0 0 22px; }
.cj-facts { display:flex; flex-wrap:wrap; gap:9px; }
.cj-facts span { padding:9px 13px; background:#eaf1f3; border-radius:999px; font-size:14px; }
.cj-result-tabs { margin:16px 0; }
.cj-result-tabs p { margin:0 0 10px; }
.cj-tab { margin:0 10px 9px 0; border:1px solid #9fb8bf; background:white; color:var(--cj-ink); border-radius:9px; padding:11px 16px; cursor:pointer; }
.cj-tab.is-active { background:var(--cj-ink); color:#fff; }
.cj-actions { position:sticky; top:15px; z-index:5; display:flex; flex-wrap:wrap; gap:10px; align-items:stretch; background:rgba(255,255,255,.97); border:1px solid #dce6e9; box-shadow:0 10px 35px rgba(16,56,67,.09); border-radius:14px; padding:13px; margin:18px 0 30px; }
.cj-actions .cj-button { flex:1 1 160px; }
.cj-details { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:15px; }
.cj-detail-card { background:#fff; border:1px solid #e1e8ea; border-radius:12px; padding:25px; }
.cj-detail-card h3 { margin:0 0 12px; font-size:20px; color:var(--cj-ink); }
.cj-detail-card p { white-space:pre-line; margin:0; line-height:1.6; }
.cj-form-panel { position:relative; background:#fff; border:1px solid #cbdce0; border-radius:16px; padding:clamp(22px,4vw,45px); margin:30px 0; scroll-margin-top:90px; box-shadow:0 12px 30px rgba(16,56,67,.08); }
.cj-form-panel h3 { margin:0 0 25px; font-size:26px; }
.cj-route-choice { background:#eef6f7; border-radius:12px; padding:20px; margin:20px 0; }
.cj-route-choice .cj-button { margin:0 10px 10px 0; }
.cj-form-close { position:absolute; top:15px; right:25px; margin:0; }
.cj-special-result .cj-actions { margin-bottom:0; }
.cj-pass-sheet { max-width:1120px; padding:clamp(20px,3vw,38px); }
.cj-pass-hero { display:grid; grid-template-columns:minmax(240px,.9fr) minmax(0,1.1fr); gap:clamp(22px,4vw,50px); align-items:center; }
.cj-pass-picture { min-height:320px; aspect-ratio:1.12; overflow:hidden; display:grid; place-items:center; border-radius:17px; background:linear-gradient(135deg,#dceef2,#e7e1f2,#f5dbd1); color:var(--cj-ink); font-size:26px; font-weight:700; }
.cj-pass-picture img { width:100%; height:100%; object-fit:cover; }
.cj-pass-introduction .cj-header h2 { font-size:clamp(30px,4vw,48px); }
.cj-pass-note { display:inline-block; margin:8px 0 0; padding:9px 13px; border-radius:9px; background:#edf6f8; color:#3e6874; font-size:14px; }
.cj-pass-facts { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px; margin:25px 0; }
.cj-pass-fact { display:flex; flex-direction:column; gap:8px; min-width:0; padding:18px; border:1px solid #dfeaed; border-radius:13px; background:#fff; }
.cj-pass-fact .dashicons { width:27px; height:27px; font-size:27px; color:#267d8e; }
.cj-pass-fact strong { color:var(--cj-ink); font-size:15px; }
.cj-pass-fact > span:last-child { color:#4a6972; font-size:14px; line-height:1.4; }
.cj-pass-details { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; }
.cj-pass-details .cj-detail-card { padding:21px; }
@media (max-width:850px) { .cj-pass-hero { grid-template-columns:1fr; } .cj-pass-picture { min-height:250px; max-height:380px; } .cj-pass-facts { grid-template-columns:repeat(2,minmax(0,1fr)); } .cj-pass-details { grid-template-columns:1fr; } }
@media (max-width:600px) { .cj-pass-facts { gap:8px; } .cj-pass-fact { padding:13px; } .cj-pass-picture { min-height:220px; } }
@media (max-width:850px) { .cj-result-hero { grid-template-columns:1fr; } .cj-result-photo { min-height:240px; } .cj-details { grid-template-columns:1fr; } }
@media (max-width:600px) { .cj-orientation { padding:12px; } .cj-options { grid-template-columns:1fr 1fr; } .cj-option { font-size:16px; min-height:65px; } .cj-text-question { flex-direction:column; } .cj-actions .cj-button { flex-basis:calc(50% - 5px); font-size:11px; padding:10px 8px; } .cj-actions .cj-button-primary { flex-basis:100%; } .cj-result-actions { position:fixed; top:auto; bottom:0; left:0; right:0; z-index:100; margin:0; border-radius:12px 12px 0 0; padding:8px; gap:6px; } .cj-orientation:has(.cj-result-actions) { padding-bottom:195px; } }

/* Les informations rapides reprennent les six repères visuels du site. */
.cj-overview { margin:44px 0 24px; }
.cj-overview > h2 { color:var(--cj-ink); font-size:clamp(25px,2.5vw,36px); line-height:1.15; margin:10px 0 23px; letter-spacing:-.025em; }
.cj-overview-grid { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:14px; }
.cj-overview-card { display:flex; flex-direction:column; align-items:center; min-width:0; min-height:212px; padding:20px 13px 18px; background:#fff; border:1px solid #e6ecee; border-radius:16px; color:var(--cj-ink); text-align:center; cursor:pointer; box-shadow:0 10px 30px rgba(16,56,67,.055); transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease; }
.cj-overview-card:hover,.cj-overview-card:focus-visible { transform:translateY(-3px); border-color:#a7c6d0; box-shadow:0 15px 34px rgba(16,56,67,.11); }
.cj-overview-card:focus-visible,.cj-orientation .cj-form-panel :focus-visible { outline:3px solid #4b8da0; outline-offset:3px; }
.cj-overview-icon { display:grid; place-items:center; flex:none; width:56px; height:56px; margin-bottom:15px; border-radius:50%; background:#e1efff; color:#285684; }
.cj-overview-icon .dashicons { font-size:27px; width:27px; height:27px; }
.cj-tone-lilac .cj-overview-icon { background:#eee8ff; color:#7048bb; }
.cj-tone-peach .cj-overview-icon { background:#ffede6; color:#a75b3f; }
.cj-tone-aqua .cj-overview-icon { background:#e3f3f3; color:#27636d; }
.cj-tone-rose .cj-overview-icon { background:#fce8ed; color:#8a4761; }
.cj-overview-card strong { display:block; min-height:42px; max-width:175px; font-size:15px; line-height:1.27; font-weight:700; }
.cj-overview-summary { display:-webkit-box; overflow:hidden; -webkit-box-orient:vertical; -webkit-line-clamp:3; margin-top:9px; color:#4d6871; font-size:13px; line-height:1.45; overflow-wrap:anywhere; }
.cj-details { margin-top:23px; }
.cj-detail-card { scroll-margin-top:105px; border-color:#e7edef; box-shadow:0 3px 13px rgba(16,56,67,.035); }

/* Formidable conserve ses champs, sa validation et ses automatisations. */
.cj-form-panel { overflow:hidden; max-width:980px; margin:26px auto 34px; padding:0; border-color:#d6e4e8; border-radius:21px; box-shadow:0 22px 55px rgba(16,56,67,.12); }
.cj-form-header { display:flex; justify-content:space-between; gap:20px; padding:30px clamp(23px,4vw,46px) 24px; background:linear-gradient(115deg,#eef7f9 0%,#f9fbfc 72%); border-bottom:1px solid #e0eaed; }
.cj-form-header h3 { margin:8px 0 8px; color:var(--cj-ink); font-size:clamp(25px,3vw,34px); letter-spacing:-.025em; line-height:1.15; }
.cj-form-header p { max-width:660px; margin:0; color:#536d75; font-size:16px; line-height:1.5; }
.cj-form-close { position:static; flex:none; align-self:flex-start; margin:0; padding:9px 12px; border:1px solid #b8cbd1; border-radius:8px; text-decoration:none; font-size:14px; font-weight:700; }
.cj-form-close:hover { background:#e1eef1; }
.cj-form-context { display:inline-flex; align-items:center; gap:8px; margin:23px clamp(23px,4vw,46px) 0; padding:9px 14px; border-radius:999px; background:#e9f4f5; color:#194956; font-size:14px; font-weight:700; }
.cj-form-context::before { content:'✓'; display:grid; place-items:center; width:19px; height:19px; border-radius:50%; background:#cae6e8; font-size:12px; }
.cj-form-panel > .cj-form-source { display:block; padding:26px clamp(23px,4vw,46px) 38px; }
.cj-form-panel .frm_forms,.cj-form-panel .frm_form_fields,.cj-form-panel fieldset { width:100%; max-width:none; }
.cj-form-panel fieldset { min-width:0; margin:0; padding:0; border:0; }
.cj-form-panel .frm_screen_reader { position:absolute!important; width:1px!important; height:1px!important; padding:0!important; margin:-1px!important; overflow:hidden!important; clip:rect(0,0,0,0)!important; white-space:nowrap!important; border:0!important; }
.cj-form-panel .frm_fields_container { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); column-gap:20px; row-gap:23px; }
.cj-form-panel .frm_fields_container > .frm_form_field { grid-column:1 / -1; width:auto!important; float:none!important; clear:none!important; min-width:0; margin:0!important; padding:0!important; }
.cj-form-panel .frm_fields_container > .frm_form_field.frm6 { grid-column:span 1; }
.cj-form-panel .frm_primary_label { display:block; margin:0 0 9px!important; padding:0!important; color:var(--cj-ink)!important; font-size:15px!important; font-weight:700!important; line-height:1.4; }
.cj-form-panel .frm_required { color:#b75142!important; }
.cj-form-panel .frm_combo_inputs_container { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:20px; }
.cj-form-panel .frm_combo_inputs_container > .frm_form_field { width:auto!important; float:none!important; min-width:0; margin:0!important; }
.cj-form-panel .frm_combo_inputs_container .frm_description { margin:7px 0 0; color:#526d76; font-size:13px; }
.cj-form-panel input[type="text"],.cj-form-panel input[type="email"],.cj-form-panel input[type="tel"],.cj-form-panel input[type="number"],.cj-form-panel input[type="date"],.cj-form-panel select,.cj-form-panel textarea { display:block; width:100%!important; max-width:none!important; min-height:49px; padding:11px 14px!important; border:1px solid #bdcfd4!important; border-radius:9px!important; background:#fff!important; color:var(--cj-ink)!important; font:inherit!important; font-size:16px!important; line-height:1.4; box-shadow:none!important; }
.cj-form-panel textarea { min-height:115px; resize:vertical; }
.cj-form-panel input:focus,.cj-form-panel select:focus,.cj-form-panel textarea:focus { border-color:#427e90!important; box-shadow:0 0 0 3px rgba(66,126,144,.16)!important; outline:0; }
.cj-form-panel .frm_opt_container { display:flex; flex-wrap:wrap; gap:10px; }
.cj-form-panel .frm_radio,.cj-form-panel .frm_checkbox { margin:0!important; }
.cj-form-panel .frm_radio label,.cj-form-panel .frm_checkbox label { display:flex!important; align-items:center; gap:9px; min-height:43px; margin:0!important; padding:10px 14px!important; border:1px solid #d5e1e4; border-radius:10px; background:#f8fbfc; color:var(--cj-ink)!important; font-size:14px!important; line-height:1.35; cursor:pointer; }
.cj-form-panel .frm_radio label:has(input:checked),.cj-form-panel .frm_checkbox label:has(input:checked) { border-color:#477f8e; background:#edf7f7; box-shadow:inset 0 0 0 1px #477f8e; }
.cj-form-panel input[type="radio"],.cj-form-panel input[type="checkbox"] { flex:none; width:18px!important; height:18px!important; min-height:0!important; margin:0!important; accent-color:#103843; }
.cj-form-panel .frm_error { margin:7px 0 0; color:#a53636; font-size:13px; }
.cj-form-panel .frm_fields_container > .frm_form_field:has(.frm_submit) { display:block!important; visibility:visible!important; }
.cj-form-panel .frm_submit { display:flex!important; visibility:visible!important; margin-top:10px; }
.cj-form-panel .frm_button_submit { display:inline-flex!important; visibility:visible!important; }
.cj-form-panel .frm_fields_container > div:has(> input.frm_verify) { display:none!important; }
.cj-form-panel .frm_fields_container > div[id^="frm_field_"]:not(.frm_form_field) { display:none!important; }
.cj-form-panel .frm_fields_container > .frm_form_field:has(input[name="item_key"]) { display:none!important; }
.cj-form-panel .frm_other_container .frm_other_input { display:none!important; }
.cj-form-panel .frm_other_container .frm_opt_container > div:has(input[type="checkbox"]:checked) .frm_other_input { display:block!important; margin-top:8px; }
.cj-form-panel .frm_button_submit { display:inline-flex; justify-content:center; align-items:center; min-width:210px; min-height:52px; padding:12px 24px!important; border:1px solid var(--cj-ink)!important; border-radius:9px!important; background:var(--cj-ink)!important; color:#fff!important; font:inherit!important; font-size:15px!important; font-weight:700!important; text-transform:uppercase; cursor:pointer; }
.cj-form-panel .frm_button_submit:hover { background:#1b5664!important; }
.cj-form-panel .cj-form-submit { display:flex; grid-column:1 / -1; justify-content:flex-start; margin-top:4px; padding-top:23px; border-top:1px solid #e1eaed; }
.cj-orientation.cj-form-open .cj-result-actions { position:static; }
.cj-orientation.cj-form-open:has(.cj-result-actions) { padding-bottom:24px; }
.cj-details + .cj-back { margin-right:18px; }

/* Un parcours lisible, avec une question et une décision à chaque écran. */
.cj-question-card { max-width:960px; margin:32px auto; padding:0; overflow:hidden; background:#fff; border:1px solid #dce9ec; box-shadow:0 20px 55px rgba(16,56,67,.085); }
.cj-question-progress { padding:24px clamp(24px,5vw,58px) 21px; background:#f2f8f9; border-bottom:1px solid #e3edf0; }
.cj-progress-text { display:flex; justify-content:space-between; align-items:center; gap:20px; margin-bottom:13px; }
.cj-progress-count { color:#3f6874; font-size:14px; font-weight:700; white-space:nowrap; }
.cj-progress-track { height:8px; overflow:hidden; border-radius:999px; background:#d9e9ed; }
.cj-progress-fill { display:block; height:100%; border-radius:inherit; background:linear-gradient(90deg,#1c5766,#7bb9c2); transition:width .3s ease; }
.cj-question-heading { display:flex; align-items:flex-start; gap:21px; padding:clamp(27px,4vw,45px) clamp(24px,5vw,58px) 0; }
.cj-question-icon { display:grid; place-items:center; flex:none; width:62px; height:62px; border-radius:19px; background:#e5f2f4; color:#225c6c; }
.cj-question-icon .dashicons { width:29px; height:29px; font-size:29px; }
.cj-question-heading .cj-header { flex:1; min-width:0; }
.cj-question-heading .cj-header h2 { max-width:720px; margin:8px 0 0; font-size:clamp(28px,3.7vw,43px); line-height:1.14; }
.cj-question-heading .cj-eyebrow { color:#4e8290; }
.cj-question-card .cj-options { grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:13px; margin:29px 0 0; padding:0 clamp(24px,5vw,58px) clamp(30px,4vw,43px); }
.cj-question-card .cj-option { display:flex; align-items:center; gap:14px; min-width:0; min-height:90px; padding:15px 16px; border:1.5px solid #d7e4e8; border-radius:13px; background:#fff; box-shadow:0 5px 15px rgba(16,56,67,.035); font-size:16px; font-weight:700; line-height:1.3; }
.cj-question-card .cj-option:hover,.cj-question-card .cj-option:focus-visible { transform:translateY(-2px); border-color:#4c8d9b; background:#f4fafb; box-shadow:0 10px 24px rgba(16,56,67,.11); }
.cj-option-icon { display:grid; place-items:center; flex:none; width:43px; height:43px; border-radius:12px; background:#e7f3f5; color:#296778; }
.cj-option-icon .dashicons { width:22px; height:22px; font-size:22px; }
.cj-option-icon .cj-custom-svg { display:grid; place-items:center; width:24px; height:24px; color:inherit; }
.cj-option-icon .cj-custom-svg svg { display:block; width:100%; height:100%; }
.cj-option-label { flex:1; min-width:0; }
.cj-option-arrow { flex:none; width:19px; height:19px; color:#6d9ba6; font-size:19px; transition:transform .18s ease; }
.cj-option:hover .cj-option-arrow { transform:translateX(3px); }
.cj-question-card .cj-text-question { gap:12px; margin:30px 0 0; padding:0 clamp(24px,5vw,58px) clamp(30px,4vw,43px); }
.cj-question-card .cj-text-question input { min-height:58px; padding:15px 17px; border:1.5px solid #c4d8de; border-radius:10px; background:#fbfdfd; font-size:17px; }
.cj-question-card .cj-text-question input:focus { border-color:#3f8494; outline:3px solid rgba(63,132,148,.15); }
.cj-question-card .cj-text-question .cj-button { min-width:154px; min-height:58px; }
.cj-question-footer { padding:15px clamp(24px,5vw,58px) 22px; border-top:1px solid #eef2f3; }
.cj-question-footer .cj-back { margin:0; color:#446b76; font-size:14px; font-weight:600; text-decoration:none; }
.cj-question-footer .cj-back:hover { color:var(--cj-ink); text-decoration:underline; }
@media (max-width:1100px) { .cj-overview-grid { grid-template-columns:repeat(3,minmax(0,1fr)); } }
@media (max-width:600px) { .cj-overview { margin-top:32px; } .cj-overview-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:9px; } .cj-overview-card { min-height:185px; padding:16px 9px; } .cj-overview-icon { width:49px; height:49px; margin-bottom:12px; } .cj-overview-card strong { font-size:13px; min-height:34px; } .cj-overview-summary { font-size:12px; } .cj-form-header { padding-top:24px; } .cj-form-close { padding:8px; font-size:12px; } .cj-form-panel .frm_fields_container,.cj-form-panel .frm_combo_inputs_container { grid-template-columns:1fr; } .cj-form-panel .frm_fields_container > .frm_form_field.frm6 { grid-column:1 / -1; } .cj-form-panel .frm_button_submit { width:100%; } }
@media (max-width:600px) { .cj-question-card { margin:12px auto; } .cj-question-progress { padding:19px 20px 17px; } .cj-question-heading { align-items:flex-start; gap:12px; padding:25px 20px 0; } .cj-question-icon { width:45px; height:45px; border-radius:13px; } .cj-question-icon .dashicons { width:22px; height:22px; font-size:22px; } .cj-question-heading .cj-header h2 { font-size:27px; } .cj-question-card .cj-options { grid-template-columns:1fr; gap:9px; padding:0 20px 26px; margin-top:24px; } .cj-question-card .cj-option { min-height:69px; padding:10px 13px; font-size:15px; } .cj-option-icon { width:38px; height:38px; } .cj-question-card .cj-text-question { padding:0 20px 27px; } .cj-question-card .cj-text-question .cj-button { width:100%; } .cj-question-footer { padding:14px 20px 19px; } }
