/* Générateur de contrat d'entreprise. Styles isolés (préfixe .ce-), mobile d'abord.
   Palette Concorda : navy #13294B, turquoise d'accent, blancs. Zones tactiles >= 44 px. */

.ce-landing, .ce-wizard, .ce-seo { max-width: 720px; margin-left: auto; margin-right: auto; }

/* ------------------------------------------------------------- Page d'atterrissage */
.ce-landing { text-align: center; padding: 8px 0 4px; }
.ce-eyebrow {
  display: inline-block; background: #FEF6E7; color: #8a5a12; border: 1px solid #e6c98a;
  border-radius: 999px; padding: 6px 14px; font-size: .82rem; font-weight: 600; margin-bottom: 14px;
}
.ce-landing-h { font-size: 1.9rem; line-height: 1.15; color: #13294B; margin: 0 0 12px; }
.ce-landing-lead { font-size: 1.08rem; color: #384252; margin: 0 auto 22px; max-width: 560px; }

/* Fil d'Ariane */
.ce-fil { max-width: 720px; margin: 4px auto 0; font-size: .85rem; color: #6B7280; }
.ce-fil a { color: #2f7f8f; text-decoration: none; }
.ce-fil a:hover { text-decoration: underline; }
.ce-fil span { color: #9aa3b2; }
.ce-fil span[aria-current] { color: #13294B; font-weight: 600; }

/* Cartes du hub (liste des modèles) */
.ce-hub-list { display: grid; gap: 12px; margin: 10px 0 8px; }
.ce-hub-card { display: block; border: 1px solid #e2e7ef; border-radius: 12px; padding: 16px 18px; text-decoration: none; background: #fff; transition: border-color .15s, box-shadow .15s; }
.ce-hub-card:hover { border-color: #2f7f8f; box-shadow: 0 4px 14px rgba(19,41,75,.07); }
.ce-hub-nom { display: block; font-weight: 700; color: #13294B; font-size: 1.05rem; }
.ce-hub-desc { display: block; color: #5b6472; font-size: .92rem; margin-top: 4px; }

/* FAQ (référencement + People Also Ask) */
.ce-faq { display: grid; gap: 8px; margin: 6px 0 4px; }
.ce-faq-item { border: 1px solid #e5e9f0; border-radius: 10px; padding: 2px 14px; background: #fff; }
.ce-faq-item summary { cursor: pointer; font-weight: 600; color: #13294B; padding: 12px 0; }
.ce-faq-item p { color: #4a5464; line-height: 1.55; margin: 0 0 12px; }

.ce-seo { color: #384252; line-height: 1.6; margin-top: 40px; }
.ce-seo h2 { color: #13294B; font-size: 1.25rem; margin: 26px 0 8px; }
.ce-seo-list, .ce-seo-steps { padding-left: 20px; }
.ce-seo-list li, .ce-seo-steps li { margin: 6px 0; }

/* ------------------------------------------------------------------------ Boutons */
/* Style des boutons = design system (.btn / .btn-primary / .btn-ghost). Ce fichier
   n'ajoute que la mise en page : pleine largeur et cible tactile confortable (>= 44 px). */
.ce-block {
  display: flex; align-items: center; justify-content: center;
  width: 100%; min-height: 46px; margin: 8px 0;
}
.ce-wizard .btn { min-height: 44px; }
.ce-wizard .btn[disabled] { opacity: .5; cursor: not-allowed; }

/* --------------------------------------------------------------- Barre de progression */
.ce-prog { margin: 18px 0 14px; }
.ce-prog-bar { height: 6px; background: #e7ebf1; border-radius: 999px; overflow: hidden; }
.ce-prog-fill { display: block; height: 100%; background: linear-gradient(90deg, #13294B, #37a0ad); transition: width .25s ease; }
.ce-prog-lbl { font-size: .86rem; color: #6B7280; margin: 8px 2px 0; font-weight: 600; }

/* ------------------------------------------------------------------------- Cartes */
.ce-card { background: #fff; border: 1px solid #e5e9f0; border-radius: 16px; padding: 22px; box-shadow: 0 2px 10px rgba(19,41,75,.05); }
.ce-h { font-size: 1.4rem; color: #13294B; margin: 0 0 6px; line-height: 1.2; }
.ce-aide { color: #5b6472; margin: 0 0 16px; line-height: 1.5; }

/* --------------------------------------------------------------- Choix (radios) */
.ce-choices { display: grid; gap: 10px; margin: 4px 0 14px; }
.ce-choice {
  display: block; width: 100%; text-align: left; background: #fff; border: 2px solid #dfe4ec;
  border-radius: 12px; padding: 14px 16px; cursor: pointer; min-height: 44px;
}
.ce-choice:hover { border-color: #b9c3d3; }
.ce-choice.is-on { border-color: #2f7f8f; background: #f0f8fa; }
.ce-choice-t { display: block; font-weight: 700; color: #13294B; }
.ce-choice-d { display: block; font-size: .9rem; color: #6B7280; margin-top: 3px; }

/* -------------------------------------------------------------------- Champs */
.ce-field { display: block; margin: 12px 0; }
.ce-lbl { display: block; font-weight: 600; color: #384252; margin-bottom: 6px; font-size: .95rem; }
.ce-inp {
  width: 100%; box-sizing: border-box; min-height: 48px; padding: 12px 14px; font-size: 1rem;
  border: 1px solid #cfd6e0; border-radius: 10px; background: #fff; color: #13294B;
}
.ce-inp:focus { outline: none; border-color: #2f7f8f; box-shadow: 0 0 0 3px rgba(47,127,143,.15); }
textarea.ce-inp { min-height: 110px; resize: vertical; line-height: 1.5; }
.ce-grid2 { display: grid; gap: 12px; }

/* ------------------------------------------------------------------- Cases à cocher */
.ce-checks { display: grid; gap: 8px; margin: 4px 0 14px; }
.ce-check { display: flex; gap: 12px; align-items: flex-start; padding: 12px 14px; border: 1px solid #e2e7ef; border-radius: 12px; cursor: pointer; }
.ce-check input { margin-top: 3px; width: 20px; height: 20px; flex: none; accent-color: #2f7f8f; }
.ce-check-d { display: block; font-size: .88rem; color: #6B7280; margin-top: 2px; }

/* -------------------------------------------------------------- Avertissements / notes */
.ce-warn { background: #FEF6E7; border: 1px solid #e6c98a; color: #6b4a12; border-radius: 12px; padding: 12px 14px; margin: 14px 0; line-height: 1.5; font-size: .95rem; }
.ce-note { background: #eef3f9; border-left: 3px solid #2f7f8f; padding: 12px 14px; border-radius: 8px; margin: 12px 0; color: #2b3a52; line-height: 1.5; }
.ce-note-sm { font-size: .86rem; color: #6B7280; margin: 10px 2px 0; }

/* ----------------------------------------------------------------- Infobulle (details) */
.ce-tip { border: 1px dashed #cfd6e0; border-radius: 10px; padding: 4px 12px; margin: 12px 0; }
.ce-tip summary { cursor: pointer; font-weight: 600; color: #2f7f8f; padding: 8px 0; list-style: none; }
.ce-tip summary::before { content: "ⓘ "; }
.ce-tip p { color: #4a5464; line-height: 1.55; margin: 4px 0 10px; }

/* Coordonnées complètes repliables (écran parties) */
.ce-coord { border: 1px solid #e2e7ef; border-radius: 10px; padding: 4px 12px 8px; margin: 4px 0 14px; background: #fbfcfd; }
.ce-coord summary { cursor: pointer; font-weight: 600; color: #2f7f8f; padding: 8px 0; }
.ce-coord summary::before { content: "+ "; font-weight: 700; }
.ce-coord[open] summary::before { content: "- "; }

/* --------------------------------------------------------------------- Navigation */
.ce-nav { display: flex; gap: 12px; margin-top: 18px; }
.ce-nav .btn { flex: 1; display: flex; align-items: center; justify-content: center; min-height: 46px; }
.ce-nav-arb { margin-top: 12px; }

/* =================================================== Écran 6 : arbitrage (garde-fou) */
.ce-arb {
  background: #eef4fb; border: 2px solid #13294B; border-radius: 16px; padding: 20px;
}
.ce-arb-h { color: #13294B; font-size: 1.5rem; margin: 0 0 8px; }
.ce-arb-intro { color: #2b3a52; line-height: 1.5; margin: 0 0 14px; }
.ce-arb-points { list-style: none; padding: 0; margin: 0 0 14px; display: grid; gap: 8px; }
.ce-arb-pt { display: flex; gap: 10px; align-items: flex-start; line-height: 1.45; color: #22314a; }
.ce-arb-ic {
  flex: none; width: 24px; height: 24px; border-radius: 50%; display: inline-flex;
  align-items: center; justify-content: center; font-weight: 800; color: #fff; font-size: .85rem;
}
.ce-arb-avantage .ce-arb-ic { background: #2f9e6e; }
.ce-arb-avertissement .ce-arb-ic { background: #c0392b; }
.ce-arb-avertissement { font-weight: 500; }
.ce-arb-tbl-t { font-weight: 700; color: #13294B; margin: 12px 0 6px; font-size: .95rem; }
.ce-arb-tbl { width: 100%; border-collapse: collapse; font-size: .85rem; background: #fff; border-radius: 10px; overflow: hidden; }
.ce-arb-tbl th, .ce-arb-tbl td { padding: 8px 10px; text-align: left; border-bottom: 1px solid #e5e9f0; }
.ce-arb-tbl th { background: #f5f6f7; color: #13294B; font-size: .8rem; }
.ce-arb-tbl-note { font-size: .78rem; color: #5b6472; margin: 6px 2px 0; line-height: 1.4; }
.ce-arb-lien { font-size: .85rem; margin: 12px 0 16px; }
.ce-arb-lien a { color: #2f7f8f; }
.ce-arb-refus { display: block; text-align: center; margin-top: 12px; color: #6B7280; font-size: .92rem; text-decoration: underline; }
.ce-arb-refus:hover { color: #13294B; }

/* ----------------------------------------------------------------- Récapitulatif */
.ce-recap { width: 100%; border-collapse: collapse; margin: 6px 0 4px; }
.ce-recap th, .ce-recap td { padding: 10px 8px; border-bottom: 1px solid #eceff4; text-align: left; vertical-align: top; }
.ce-recap th { color: #6B7280; font-weight: 600; width: 44%; font-size: .92rem; }
.ce-recap td { color: #13294B; }
.ce-pill { display: inline-block; padding: 3px 10px; border-radius: 999px; font-weight: 700; font-size: .78rem; letter-spacing: .02em; }
.ce-pill-vert { background: #e3f5ec; color: #1f7a52; }
.ce-pill-rouge { background: #fbe7e4; color: #a5342a; }
.ce-pill-bleu { background: #e8eef8; color: #23457e; }
.ce-pill-orange { background: #fdeede; color: #9a5410; }

/* --------------------------------------------------------------- Aperçu du contrat */
.ce-apercu { margin-top: 18px; }
.ce-doc { background: #fff; border: 1px solid #e5e9f0; border-radius: 14px; padding: 26px; color: #24303f; line-height: 1.55; font-size: .92rem; }
.ce-doc-t1 { text-align: center; color: #13294B; font-size: 1.4rem; margin: 4px 0 12px; }
.ce-doc-t2 { color: #13294B; font-size: 1.05rem; margin: 18px 0 6px; }
.ce-doc p { margin: 6px 0; }
.ce-doc-hr { border: none; border-top: 1px solid #dfe4ec; margin: 16px 0; }
.ce-doc-pagebreak { border-top: 2px dashed #c8ced8; margin: 22px 0; position: relative; }
.ce-doc-pagebreak::after { content: "nouvelle page"; position: absolute; top: -9px; right: 0; background: #fff; padding: 0 8px; font-size: .72rem; color: #9aa3b2; }
@media print { .ce-doc-pagebreak { page-break-after: always; border: none; } .ce-doc-pagebreak::after { content: ""; } }
.ce-doc-tbl { width: 100%; border-collapse: collapse; margin: 10px 0; }
.ce-doc-tbl th, .ce-doc-tbl td { border: 1px solid #d7dde6; padding: 7px 9px; text-align: left; vertical-align: top; }
.ce-doc-tbl th { background: #f5f6f7; }
.ce-doc-enc { border-radius: 10px; padding: 12px 14px; margin: 12px 0; border: 1px solid; }
.ce-doc-enc--ambre { background: #FEF6E7; border-color: #C7891F; }
.ce-doc-enc--gris { background: #f5f6f7; border-color: #c8ced8; }
.ce-doc-enc--bleu { background: #eaf0f8; border-color: #13294B; }

/* ------------------------------------------------- Bail commercial (spécifique) */
/* Message d'arrêt (écran 1 bloquant) */
.ce-stop { background: #FEF6E7; border: 1px solid #e6c98a; color: #6b4a12; border-radius: 12px; padding: 16px; margin-top: 14px; line-height: 1.5; }
.ce-stop b { display: block; color: #8a5a12; margin-bottom: 8px; font-size: 1.05rem; }
.ce-stop p { margin: 8px 0; }
/* Option grisée (contrôle de cohérence) + motif */
.ce-choice.is-off { opacity: .55; cursor: not-allowed; background: #f5f6f7; }
.ce-choice-motif { display: block; font-size: .82rem; color: #a5342a; margin-top: 5px; }
/* Échelons (loyer échelonné) */
.ce-echelons { margin: 6px 0 4px; display: grid; gap: 10px; }
.ce-echelon { display: grid; grid-template-columns: 1fr 1fr auto; gap: 10px; align-items: end; }
.ce-echelon-del { align-self: end; min-height: 44px; width: 44px; border: 1px solid #d3d9e2; background: #fff; border-radius: 10px; cursor: pointer; color: #a5342a; }
/* Encadré « ce à quoi vous ne renoncez pas » (écran 6) */
.ce-arb-reserve { background: #fff; border: 1px solid #cdd6e2; border-radius: 10px; padding: 12px 14px; margin: 0 0 14px; line-height: 1.5; color: #2b3a52; font-size: .92rem; }
/* Message d'erreur bloquant (charges) */
.ce-err { color: #a5342a; font-weight: 600; margin: 8px 2px; font-size: .92rem; }
/* Note bleue (paraphe écran 9) */
.ce-note-bleu { background: #eaf0f8; border-left-color: #13294B; }

/* --------------------------------------------------------------------- Desktop */
@media (min-width: 620px) {
  .ce-grid2 { grid-template-columns: 1fr 1fr; }
  .ce-landing-h { font-size: 2.3rem; }
}
