/* ============================================================
   ADSGI · ADS GLOBAL INVEST — WEBSITE V2
   reconcile.css — Couche de réconciliation du vocabulaire (Mission WEB-019B)
   CSS_HTML_RECONCILIATION_MASTER_V1 · Cause racine C-01

   Rôle : styliser tous les composants de contenu hérités des
   générations antérieures (index « dealroom-tier / doc-card / smartart »,
   pages verticales « layer / flow / contrast »), alignés sur les tokens
   constitutionnels VERROUILLÉS (variables.css) :
     Navy #0A1F44 · Gold #C8A75D · blanc dominant
     Georgia (titres) · Calibri (corps)
   Aucune redéfinition de token. Chargée en dernier.
   0 classe orpheline · 0 composant non stylé · 0 section invisible.
   ============================================================ */

/* ---------- Utilitaires manquants ---------- */
.text-center { text-align: center; }
.flex-between { display: flex; align-items: center; justify-content: space-between; gap: var(--sp-md); flex-wrap: wrap; }
.flex-wrap { display: flex; flex-wrap: wrap; gap: var(--sp-sm); }
.mt-4 { margin-top: var(--sp-md); }
.mt-6 { margin-top: var(--sp-lg); }
.mt-8 { margin-top: var(--sp-xl); }
.sr-only {
  position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0;
}
.hp-field { display: none !important; }            /* honeypot anti-spam */
.required { color: var(--gold-deep); }
.list-clean { list-style: none; padding-left: 0; }
.list-clean li { position: relative; padding-left: 1.25rem; }
.list-clean li::before { content: "—"; position: absolute; left: 0; color: var(--gold-deep); }
.lead { font-size: 1.12rem; color: var(--ink-soft); }
.rule-gold { width: 56px; height: 3px; background: var(--gold); border: 0; margin: var(--sp-md) 0 var(--sp-lg); }
.section--alt { background: var(--mist); }
.section--grey { background: var(--mist); }

/* ---------- Variantes de boutons manquantes ---------- */
.btn--secondary { background: var(--gold); color: var(--navy); }
.btn--secondary:hover { background: var(--gold-deep); color: var(--navy); }
.btn--tertiary { background: transparent; color: var(--navy); border-color: var(--navy); }
.btn--tertiary:hover { background: var(--navy); color: #fff; }
.section--navy .btn--tertiary { color: #fff; border-color: rgba(255,255,255,.5); }
.section--navy .btn--tertiary:hover { background: #fff; color: var(--navy); }
.btn--sm { padding: 9px 18px; min-height: 40px; font-size: .9rem; }
.btn--lg { padding: 16px 32px; font-size: 1rem; }
.btn--link { background: none; border: none; color: var(--navy); padding: 0; min-height: 0; text-decoration: underline; text-underline-offset: 3px; }
.btn--link:hover { color: var(--gold-deep); }
.section--navy .btn--link { color: #fff; }
.btn-row { display: flex; flex-wrap: wrap; gap: var(--sp-md); margin-top: var(--sp-lg); }
.arrow { display: inline-block; }

/* ---------- Hero : sur-titre / titre / chapô / méta (vocabulaire index) ---------- */
.hero__eyebrow { display:inline-block; font-family: var(--font-body); font-size:.72rem; font-weight:700; letter-spacing:.18em; text-transform:uppercase; color: var(--gold); margin-bottom: var(--sp-sm); }
.hero__title { color: #fff; }
.hero__lead { font-size: clamp(1.05rem, 2vw, 1.3rem); color: #c9d2e3; max-width: 680px; }
.hero__rule { width: 56px; height: 3px; background: var(--gold); border: 0; margin: var(--sp-lg) 0; }
.hero__meta { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: var(--sp-md) var(--sp-xl); margin-top: var(--sp-xl); }
.hero__meta-item { display: flex; flex-direction: column; gap: 2px; border-left: 2px solid rgba(200,167,93,.5); padding-left: var(--sp-md); }
.hero__meta-label { font-size: .7rem; letter-spacing: .12em; text-transform: uppercase; color: #9fb0cc; }
.hero__meta-value { font-size: .98rem; color: #fff; font-weight: 600; }

/* ---------- En-têtes de section (vocabulaire index) ---------- */
.section-header { max-width: 760px; margin-bottom: var(--sp-xl); }
.section-header--center { margin-inline: auto; text-align: center; }
.section-header__eyebrow { display:inline-block; font-family: var(--font-body); font-size:.72rem; font-weight:700; letter-spacing:.18em; text-transform:uppercase; color: var(--gold-deep); margin-bottom: var(--sp-sm); }
.section--navy .section-header__eyebrow { color: var(--gold); }
.section-header__title { font-family: var(--font-head); color: var(--navy); }
.section--navy .section-header__title { color: #fff; }
.section-header__rule { width: 56px; height: 3px; background: var(--gold); border: 0; margin: var(--sp-md) 0; }
.section-header--center .section-header__rule { margin-inline: auto; }
.section-header__lead { font-size: 1.12rem; color: var(--ink-soft); }
.section--navy .section-header__lead { color: #c3cad9; }
.section__head { max-width: 760px; margin-bottom: var(--sp-xl); }   /* alias group C */

/* ---------- Cartes : variantes manquantes (vocabulaire index) ---------- */
.card--grey { background: var(--mist); }
.card__eyebrow { font-size: .68rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--gold-deep); margin-bottom: var(--sp-sm); }
.card__title { font-family: var(--font-head); color: var(--navy); font-size: 1.25rem; margin: 0 0 var(--sp-sm); }
.card__body { color: var(--ink-soft); font-size: .96rem; }
.card__body p:last-child { margin-bottom: 0; }
.card__link { margin-top: var(--sp-md); display: inline-flex; align-items: center; gap: 6px; font-weight: 600; color: var(--navy); }
.card__link:hover { color: var(--gold-deep); }

/* ---------- Cartes piliers (index) ---------- */
.pillar-card { background:#fff; border:1px solid var(--line); border-radius: var(--radius); padding: var(--sp-lg); box-shadow: var(--shadow-sm); transition: var(--t); display:flex; flex-direction:column; }
.pillar-card:hover { box-shadow: var(--shadow-md); transform: translateY(-2px); }
.pillar-card__title-line { font-family: var(--font-head); color: var(--navy); font-size: 1.2rem; margin: 0 0 var(--sp-sm); display:flex; align-items:baseline; gap:8px; }

/* ---------- Pastilles d'icône (index) ---------- */
.icon-wrapper { display:inline-flex; align-items:center; justify-content:center; width:48px; height:48px; border-radius: var(--radius); background: var(--mist); color: var(--navy); margin-bottom: var(--sp-md); }
.icon-wrapper--navy { background: var(--navy); color: var(--gold); }

/* ---------- Bandeaux d'information (index) ---------- */
.info-banner { border-left: 3px solid var(--navy); background: var(--mist); padding: var(--sp-md) var(--sp-lg); border-radius: var(--radius); font-size: .92rem; color: var(--ink-soft); }
.info-banner--gold { border-left-color: var(--gold); }

/* ---------- Grille de réassurance (index) ---------- */
.reassurance-grid { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: var(--sp-lg); }
.reassurance-item { padding: var(--sp-md) 0; border-top: 1px solid var(--line); }
.reassurance-item__value { display:block; font-family: var(--font-head); font-size: 1.6rem; color: var(--navy); font-weight: 700; }
.section--navy .reassurance-item { border-top-color: rgba(255,255,255,.14); }
.section--navy .reassurance-item__value { color: #fff; }
.reassurance-item__label { font-size: .82rem; color: var(--ink-mute); letter-spacing: .04em; }
.section--navy .reassurance-item__label { color: #9fb0cc; }

/* ---------- Cartes documentaires (index — doc-card) ---------- */
.doc-card { background:#fff; border:1px solid var(--line); border-radius: var(--radius); padding: var(--sp-lg); box-shadow: var(--shadow-sm); transition: var(--t); display:flex; flex-direction:column; gap: var(--sp-sm); }
.doc-card:hover { box-shadow: var(--shadow-md); transform: translateY(-2px); }
.doc-card__icon { width:40px; height:40px; display:inline-flex; align-items:center; justify-content:center; border-radius: var(--radius); background: var(--mist); color: var(--navy); }
.doc-card__id { font-family: var(--font-body); font-size: .72rem; letter-spacing: .08em; text-transform: uppercase; color: var(--gold-deep); font-weight: 700; }
.doc-card__title { font-family: var(--font-head); color: var(--navy); font-size: 1.1rem; margin: 0; }
.doc-card__meta { display:flex; flex-wrap:wrap; gap: 6px 14px; font-size: .8rem; color: var(--ink-mute); margin-top: auto; }
.doc-card__version { font-weight: 600; color: var(--navy); }
.doc-card__classification { font-size: .68rem; font-weight:700; letter-spacing:.08em; text-transform:uppercase; padding:3px 9px; border-radius:3px; background:#e7ecf6; color: var(--navy); }
.doc-card__action { margin-top: var(--sp-sm); display:inline-flex; align-items:center; gap:6px; font-weight:600; color: var(--navy); }
.doc-card__action:hover { color: var(--gold-deep); }

/* ---------- Couches DealRoom (index — vocabulaire dealroom-tier) ---------- */
.dealroom-tiers { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: var(--sp-lg); }
.dealroom-tier { border:1px solid var(--line); border-radius: var(--radius); background:#fff; padding: var(--sp-lg); display:flex; flex-direction:column; gap: var(--sp-sm); border-top: 3px solid var(--navy); }
.section--navy .dealroom-tier { background: rgba(255,255,255,.05); border-color: rgba(255,255,255,.15); }
.dealroom-tier__badge { align-self:flex-start; font-size:.68rem; font-weight:700; letter-spacing:.1em; text-transform:uppercase; padding:3px 9px; border-radius:3px; }
.dealroom-tier__badge--public        { background:#e8f0e8; color:#2f5d39; }
.dealroom-tier__badge--showcase      { background:#fbf2dd; color:#8a6a18; }
.dealroom-tier__badge--institutional { background:#e7ecf6; color: var(--navy); }
.dealroom-tier__title { font-family: var(--font-head); color: var(--navy); margin: 0; }
.section--navy .dealroom-tier__title { color: #fff; }
.dealroom-tier__desc { font-size:.95rem; color: var(--ink-soft); margin: 0; }
.section--navy .dealroom-tier__desc { color: #c3cad9; }
.dealroom-tier__access { margin-top:auto; padding-top: var(--sp-sm); border-top:1px solid var(--line); font-size:.82rem; color: var(--ink-mute); }
.section--navy .dealroom-tier__access { border-top-color: rgba(255,255,255,.14); color:#9fb0cc; }
.access-badge { font-size:.68rem; font-weight:700; letter-spacing:.08em; text-transform:uppercase; color: var(--gold-deep); }

/* ---------- Couches DealRoom (pages verticales — vocabulaire layer) ---------- */
.layers { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: var(--sp-lg); }
.layer { border:1px solid var(--line); border-radius: var(--radius); background:#fff; padding: var(--sp-lg); display:flex; flex-direction:column; gap: var(--sp-sm); border-top: 3px solid var(--navy); box-shadow: var(--shadow-sm); }
.layer__index { font-family: var(--font-head); font-size: 1.4rem; color: var(--gold-deep); font-weight: 700; }
.layer__badge { align-self:flex-start; font-size:.68rem; font-weight:700; letter-spacing:.1em; text-transform:uppercase; padding:3px 9px; border-radius:3px; background:#e7ecf6; color: var(--navy); }
.layer--public      { border-top-color:#2f5d39; }
.layer--public .layer__badge { background:#e8f0e8; color:#2f5d39; }
.layer--showcase    { border-top-color: var(--gold); }
.layer--showcase .layer__badge { background:#fbf2dd; color:#8a6a18; }
.layer--inst        { border-top-color: var(--navy); }
.layer--inst .layer__badge { background:#e7ecf6; color: var(--navy); }
.layer h3 { margin: 0; }

/* ---------- Processus horizontal (flow) ---------- */
.flow { display:flex; flex-wrap:wrap; align-items:stretch; gap: var(--sp-md); }
.flow__node { flex:1 1 160px; min-width:160px; background:#fff; border:1px solid var(--line); border-radius: var(--radius); padding: var(--sp-md); box-shadow: var(--shadow-sm); }
.flow__node h4 { margin: 0 0 4px; }
.flow__node p { font-size:.9rem; margin:0; }
.flow__arrow { display:flex; align-items:center; color: var(--gold-deep); font-size:1.4rem; font-weight:700; flex:0 0 auto; }
.section--navy .flow__node { background: rgba(255,255,255,.04); border-color: rgba(255,255,255,.12); }

/* ---------- Contraste « est / n'est pas » (cabinet) ---------- */
.contrast { display:grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: var(--sp-lg); }
.contrast__col { border:1px solid var(--line); border-radius: var(--radius); padding: var(--sp-lg); background:#fff; box-shadow: var(--shadow-sm); }
.contrast__col h3 { margin-top:0; }
.contrast__col--is { border-top: 3px solid #2f5d39; }
.contrast__col--isnot { border-top: 3px solid #8a2b2b; }
.contrast__col--isnot h3 { color:#8a2b2b; }
.legend { font-size:.82rem; color: var(--ink-mute); }
.section--navy .legend { color:#9fb0cc; }

/* ---------- SmartArt décisionnel (index) ---------- */
.smartart { display:flex; flex-wrap:wrap; align-items:stretch; gap: var(--sp-md); }
.smartart__step { flex:1 1 200px; min-width:200px; background:#fff; border:1px solid var(--line); border-radius: var(--radius); padding: var(--sp-md); box-shadow: var(--shadow-sm); display:flex; flex-direction:column; gap:6px; }
.section--navy .smartart__step { background: rgba(255,255,255,.05); border-color: rgba(255,255,255,.15); }
.smartart__number { font-family: var(--font-head); font-size:1.3rem; color: var(--gold-deep); font-weight:700; }
.smartart__label { font-family: var(--font-head); color: var(--navy); font-weight:700; }
.section--navy .smartart__label { color:#fff; }
.smartart__desc { font-size:.9rem; color: var(--ink-soft); margin:0; }
.section--navy .smartart__desc { color:#c3cad9; }
.smartart__result { font-weight:600; color: var(--navy); }
.smartart__badge { align-self:flex-start; font-size:.66rem; font-weight:700; letter-spacing:.08em; text-transform:uppercase; padding:3px 9px; border-radius:3px; }
.smartart__badge--go     { background:#e8f0e8; color:#2f5d39; }
.smartart__badge--nogo   { background:#f3e3e3; color:#8a2b2b; }
.smartart__badge--struct { background:#e7ecf6; color: var(--navy); }

/* ---------- Formulaires : vocabulaire alternatif (form-group / form-input ...) ---------- */
.form-group { margin-bottom: var(--sp-md); }
.form-label { display:block; font-size:.78rem; font-weight:700; letter-spacing:.08em; text-transform:uppercase; color: var(--ink-mute); margin-bottom:6px; }
.form-input, .form-select, .form-textarea {
  width:100%; font-family: var(--font-body); font-size:1rem; color: var(--ink);
  padding:12px 14px; background:#fff; border:1px solid var(--line); border-radius: var(--radius); min-height:44px; transition: var(--t);
}
.form-textarea { min-height:140px; resize: vertical; }
.form-input:focus, .form-select:focus, .form-textarea:focus { border-color: var(--navy); outline:none; box-shadow:0 0 0 3px rgba(10,31,68,.08); }
.form-error { color:#8a2b2b; font-size:.8rem; margin-top:4px; display:none; }
.form-error.is-on { display:block; }
.form-disclaimer { font-size:.82rem; color: var(--ink-mute); margin-top: var(--sp-md); }

/* ---------- Révélation : délais échelonnés ---------- */
.reveal--delay-1 { transition-delay: .08s; }
.reveal--delay-2 { transition-delay: .16s; }
.reveal--delay-3 { transition-delay: .24s; }
.reveal--delay-4 { transition-delay: .32s; }

/* ---------- Largeur d'item de nav garantie : pas de repli multi-lignes (m-01 / P-03) ---------- */
.nav-menu a { white-space: nowrap; }

/* ---------- Halo de curseur (décoratif, désactivé en réduction de mouvement) ---------- */
.cursor-halo { display:none; }
.desktop-only { }

/* ---------- Responsive lié aux composants réconciliés ---------- */
@media (max-width: 980px) {
  .dealroom-tiers, .layers, .smartart { grid-template-columns: 1fr; }
  .flow { flex-direction: column; }
  .flow__arrow { transform: rotate(90deg); align-self:center; }
}
@media (max-width: 820px) {
  .hero__meta, .reassurance-grid, .contrast { grid-template-columns: 1fr; }
}
@media (min-width: 640px) and (max-width: 980px) {
  .dealroom-tiers, .layers, .smartart { grid-template-columns: repeat(2, 1fr); }
}
