/*
    Teaser d'une opportunité (templates/Campaign/show_builder.html.twig et Front/Organisms/Teaser) : mise en page seulement.
    Les éléments réutilisables (boutons, étiquettes, encarts, en-têtes de section, indicateur de risque, tableaux) sont des
    composants du design system.

    Deux parties :
    1. la page elle-même ;
    2. l'habillage des fragments que rendent encore des gabarits ou scripts partagés (formulaires d'investissement et de
       réservation, jauge de collecte, discussions, contenu rédigé au back-office, fenêtres modales, édition en place des
       administrateurs). Ces fragments sont regroupés sous .front-teaser-fragment ; les fenêtres modales vivent hors de la page
       (#modals-container) et s'appuient sur la classe front-teaser du <body>.
*/

/* ---------- Page ---------- */

.front-teaser-page { padding-bottom: 80px; background: hsl(var(--front-white)); color: hsl(var(--front-ink-900)); line-height: 1.5; }
.front-teaser-page :focus-visible { outline: 2px solid hsl(var(--front-ink-900)); outline-offset: 2px; }
/* Hauteur de la sous-navigation collante, sous la barre de navigation (--front-navbar-height). */
:root { --teaser-subnav-height: 56px; }
/* Défilement fluide, sauf pour qui demande moins de mouvement : la page, la sous-navigation et la galerie agrandie. Les
   scripts n'ont donc pas à lire cette préférence : un défilement sans comportement précisé la suit. */
@media (prefers-reduced-motion: no-preference) {
    html:has(.front-teaser-page), .front-teaser-subnav-inner, .front-teaser-lightbox-track { scroll-behavior: smooth; }
}
/* Une ancre ou un élément atteint au clavier ne se cache ni sous la barre de navigation, ni sous la sous-navigation,
   ni sous la barre basse des petits écrans (WCAG 2.2, 2.4.11). */
html:has(.front-teaser-page) { scroll-padding-top: calc(var(--front-navbar-height) + var(--teaser-subnav-height) + 1rem); }
html:has(.front-teaser-bar) { scroll-padding-bottom: 6rem; }
.front-teaser-anchor { display: block; height: 0; }
.front-teaser-spaced { margin-top: 32px; }

/* Titres en Poppins : 400 pour une opportunité datée, 500 pour une solution permanente. */
.front-teaser-display { font-family: var(--front-font-poppins), system-ui, sans-serif; font-weight: 500; letter-spacing: -0.01em; }
.front-teaser-page[data-teaser-variant="solution"] .front-teaser-display { font-weight: 500; }

/* Surtitre de bloc : Inter 11 px, capitales espacées, en pierre 700 comme les surtitres du design system. */
.front-teaser-label { color: hsl(var(--front-stone-700)); font: 400 11px/1.5 var(--front-font-mentions), sans-serif; font-feature-settings: 'tnum' 1; letter-spacing: .18em; text-transform: uppercase; }
.front-teaser-label--inverse { margin-bottom: 20px; color: hsl(var(--front-ink-100)); }
.front-teaser-text { color: hsl(var(--front-stone-700)); font-size: 14px; line-height: 1.625; }

/* Fil d'Ariane */
.front-teaser-breadcrumb { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding-top: 32px; }
.front-teaser-breadcrumb-trail { display: flex; align-items: center; gap: 8px; min-width: 0; color: hsl(var(--front-stone-600)); font-size: 14px; line-height: 20px; }
.front-teaser-breadcrumb-trail > a, .front-teaser-breadcrumb-trail > span { flex-shrink: 0; }
.front-teaser-breadcrumb-trail a { display: inline-flex; align-items: center; gap: 8px; text-decoration: none; }
.front-teaser-breadcrumb-trail a:hover { color: hsl(var(--front-ink-900)); }
.front-teaser-breadcrumb-trail > .front-teaser-breadcrumb-current { flex-shrink: 1; overflow: hidden; color: hsl(var(--front-ink-900)); font-weight: 500; text-overflow: ellipsis; white-space: nowrap; }

/* Bandeau : titre, repères, résumé, contact, galerie */
.front-teaser-hero { padding-bottom: 40px; }
.front-teaser-hero-title { margin-bottom: 20px; font: 500 44px/1.1 var(--front-font-lora), Georgia, serif; letter-spacing: -0.015em; }
.front-teaser-hero-tags { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-bottom: 20px; }
.front-teaser-hero-countdown { margin: -12px 0 20px; color: hsl(var(--front-stone-600)); font-size: 12px; line-height: 16px; }
.front-teaser-hero-head { display: grid; align-items: end; gap: 32px; }
.front-teaser-hero-lead { max-width: 672px; color: hsl(var(--front-stone-700)); font-size: 18px; line-height: 1.625; }
.front-teaser-hero-contact { display: flex; }

.front-teaser-confidential { display: grid; place-content: center; justify-items: center; gap: 12px; height: 420px; margin-top: 40px; padding-inline: 24px; background: linear-gradient(to bottom, hsl(var(--front-ink-900)), hsl(var(--front-ink-950))); color: hsl(var(--front-white)); text-align: center; }
.front-teaser-confidential-title { font: 500 24px/32px var(--front-font-poppins), system-ui, sans-serif; letter-spacing: -0.01em; }
.front-teaser-page[data-teaser-variant="solution"] .front-teaser-confidential-title { font-weight: 500; }
.front-teaser-confidential-text { max-width: 448px; color: hsl(var(--front-ink-300)); font-size: 14px; line-height: 20px; }
.front-teaser-confidential .front-button { margin-top: 8px; }

.front-teaser-gallery { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); grid-template-rows: repeat(2, minmax(0, 1fr)); gap: 12px; height: 520px; margin-top: 40px; }
.front-teaser-gallery--single { grid-template-rows: repeat(1, minmax(0, 1fr)); }
.front-teaser-gallery-main { position: relative; grid-column: span 12 / span 12; grid-row: span 2 / span 2; overflow: hidden; }
.front-teaser-gallery--single .front-teaser-gallery-main { grid-row: auto; }
.front-teaser-gallery-side { display: none; }
.front-teaser-gallery-thumb { position: relative; min-height: 0; overflow: hidden; }
.front-teaser-gallery-open { position: relative; display: block; width: 100%; height: 100%; padding: 0; border: 0; background: transparent; cursor: pointer; }
.front-teaser-gallery-open img { position: absolute; inset: 0; display: block; width: 100%; height: 100%; max-width: none; object-fit: cover; }
/* La vignette rogne un anneau extérieur : anneau intérieur double, encre au bord et blanc dedans, visible sur toute photo. */
.front-teaser-gallery-open:focus-visible { outline: 2px solid hsl(var(--front-white)); outline-offset: -4px; }
.front-teaser-gallery-open:focus-visible::after { content: ''; position: absolute; inset: 0; border: 2px solid hsl(var(--front-ink-900)); }
.front-teaser-gallery-video { position: absolute; bottom: 20px; left: 20px; display: inline-flex; align-items: center; gap: 8px; padding: 6px 12px; border: 0; background: rgb(255 255 255 / .95); color: hsl(var(--front-ink-900)); font-size: 12px; font-weight: 500; line-height: 16px; cursor: pointer; }
.front-teaser-gallery-count { position: absolute; right: 16px; bottom: 16px; display: inline-flex; align-items: center; gap: 8px; height: 40px; padding: 0 16px; border: 0; background: hsl(var(--front-ink-900)); color: hsl(var(--front-white)); font-size: 12px; font-weight: 500; line-height: 16px; cursor: pointer; }
/* Solution permanente : une seule rangée de 420 px, la grande photo et une colonne de vignettes. */
.front-teaser-gallery--solution { grid-template-rows: repeat(1, minmax(0, 1fr)); height: 420px; overflow: hidden; }
.front-teaser-gallery--solution .front-teaser-gallery-main { grid-row: auto; height: 100%; }
.front-teaser-gallery--solution .front-teaser-gallery-open { position: absolute; inset: 0; }
.front-teaser-gallery-video-only { height: 520px; margin-top: 40px; background: hsl(var(--front-ink-900)); }
.front-teaser-gallery-video-only iframe { display: block; width: 100%; height: 100%; border: 0; }

/* Galerie agrandie (dialog natif) */
.front-teaser-lightbox { position: fixed; inset: 0; width: 100vw; height: 100dvh; max-width: none; max-height: none; margin: 0; padding: 0; border: 0; background: hsl(var(--front-ink-950) / .96); color: hsl(var(--front-white)); }
.front-teaser-lightbox:not([open]) { display: none; }
.front-teaser-lightbox::backdrop { background: hsl(var(--front-ink-950) / .8); }
.front-teaser-lightbox-track { display: flex; height: 100%; margin: 0; padding: 0; overflow-x: auto; list-style: none; scroll-snap-type: x mandatory; scrollbar-width: none; }
.front-teaser-lightbox-track::-webkit-scrollbar { display: none; }
.front-teaser-lightbox-slide { display: grid; flex: 0 0 100%; place-items: center; min-width: 0; padding: 72px 24px; scroll-snap-align: center; }
.front-teaser-lightbox-slide img { width: auto; max-width: 100%; height: auto; max-height: 100%; object-fit: contain; }
.front-teaser-lightbox-slide iframe { width: min(100%, 1100px); aspect-ratio: 16 / 9; border: 0; }
.front-teaser-lightbox-close { position: absolute; top: 16px; right: 16px; z-index: 1; display: grid; place-items: center; width: 44px; height: 44px; border: 0; background: hsl(var(--front-ink-900)); color: hsl(var(--front-white)); cursor: pointer; }
.front-teaser-lightbox-controls { position: absolute; bottom: 16px; left: 50%; display: flex; align-items: center; gap: 4px; padding: 4px; background: rgb(255 255 255 / .95); color: hsl(var(--front-ink-900)); font-size: 13px; font-weight: 500; transform: translateX(-50%); }
.front-teaser-lightbox-controls button { display: grid; place-items: center; width: 40px; height: 40px; border: 0; background: transparent; cursor: pointer; }
.front-teaser-lightbox-controls button:hover { background: hsl(var(--front-stone-100)); }
.front-teaser-lightbox-controls span { min-width: 52px; text-align: center; }

/* Sous-navigation par ancres, collante sous la barre de navigation : pleine largeur sous 1 024 px, dans la colonne de gauche au-delà. */
.front-teaser-subnav { position: sticky; top: var(--front-navbar-height); z-index: 30; margin-inline: -16px; padding-inline: 16px; box-shadow: inset 0 -1px 0 hsl(var(--front-stone-200)); background: hsl(var(--front-white)); }
.front-teaser-subnav-inner { display: flex; align-items: center; gap: 32px; height: var(--teaser-subnav-height); overflow-x: auto; font-size: 14px; line-height: 20px; white-space: nowrap; }
.front-teaser-subnav-inner a { display: inline-flex; align-items: center; height: 100%; color: hsl(var(--front-stone-600)); text-decoration: none; }
.front-teaser-subnav-inner a:hover { color: hsl(var(--front-ink-900)); }
.front-teaser-subnav-inner a[aria-current="true"] { border-bottom: 2px solid hsl(var(--front-ink-900)); color: hsl(var(--front-ink-900)); font-weight: 500; }

.front-teaser-version { padding-block: 8px; background: hsl(var(--front-clay-100)); color: hsl(var(--front-clay-700)); font-size: 13px; font-weight: 600; text-align: center; }

/* Grille : bandeau, sous-navigation et sections à gauche, carte de souscription à droite, dès la hauteur du titre */
.front-teaser-layout { display: grid; gap: 40px; padding-top: 24px; padding-bottom: 56px; }
.front-teaser-primary { min-width: 0; }
.front-teaser-main { display: flex; flex-direction: column; gap: 80px; min-width: 0; margin-top: 56px; }
.front-teaser-section-body { margin-top: 32px; }
.front-teaser-panel { overflow: hidden; border: 1px solid hsl(var(--front-stone-200)); background: hsl(var(--front-white)); }
/* Marges internes resserrées sur mobile, 28 px à partir de 768 px. */
.front-teaser-panel--padded { padding: 20px 16px; }

/* Le projet : contenu rédigé, faits de la solution, repères */
.front-teaser-tab + .front-teaser-tab { margin-top: 56px; }
.front-teaser-tab-title { margin-bottom: 24px; padding-top: 24px; border-top: 1px solid hsl(var(--front-stone-200)); font-size: 24px; line-height: 1.375; }
.front-teaser-page .teaser-block + .teaser-block { margin-top: 40px; }
.front-teaser-page .block-title { margin-bottom: 16px; font-size: 18px; line-height: 28px; }
.front-teaser-page .teaser-admin-add { margin-block: 12px; text-align: center; }
.front-teaser-solution-facts { margin-top: 40px; }
.front-teaser-solution-row { display: grid; gap: 24px; padding: 28px; }
.front-teaser-solution-row + .front-teaser-solution-row { border-top: 1px solid hsl(var(--front-stone-200)); }
.front-teaser-portfolios, .front-teaser-envelopes { display: grid; gap: 12px; margin: 0; padding: 0; list-style: none; }
.front-teaser-portfolios a { display: flex; align-items: center; gap: 12px; height: 100%; padding: 12px; border: 1px solid hsl(var(--front-ink-900)); background: hsl(var(--front-white)); font-size: 14px; font-weight: 500; line-height: 20px; text-decoration: none; transition: background-color .12s; }
.front-teaser-portfolios a:hover { background: hsl(var(--front-stone-100)); }
.front-teaser-portfolios a > span { display: grid; flex-shrink: 0; place-items: center; width: 32px; height: 32px; background: hsl(var(--front-ink-900)); color: hsl(var(--front-white)); }
.front-teaser-envelopes { grid-template-columns: repeat(2, minmax(0, 1fr)); font-size: 14px; line-height: 20px; }
.front-teaser-envelopes li { display: flex; align-items: center; gap: 8px; padding: 12px; border: 1px solid hsl(var(--front-stone-200)); }
.front-teaser-envelopes .front-icon { flex-shrink: 0; color: hsl(var(--front-sage-700)); }
.front-teaser-features { display: grid; gap: 20px; margin-top: 40px; }
.front-teaser-feature { padding: 24px; border: 1px solid hsl(var(--front-stone-200)); background: hsl(var(--front-white)); transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease; }
.front-teaser-feature:hover, .front-teaser-feature:focus-within { box-shadow: 0 1px 2px rgb(11 31 51 / .06), 0 12px 32px rgb(11 31 51 / .1); transform: translateY(-2px); }
.front-teaser-feature-icon { display: grid; place-items: center; width: 40px; height: 40px; margin-bottom: 20px; background: hsl(var(--tone-100)); color: hsl(var(--tone-700)); }
.front-teaser-feature-title { margin-bottom: 8px; font-size: 16px; line-height: 1.5; }
.front-teaser-feature p, .front-teaser-feature ul { color: hsl(var(--front-stone-700)); font-size: 14px; line-height: 1.625; }
.front-teaser-feature ul { display: flex; flex-direction: column; gap: 4px; margin: 0; padding: 0; list-style: none; }
.front-teaser-feature a { color: hsl(var(--front-ink-900)); font-weight: 500; }

/* Chiffres clés : fiche de l'opération et titres ouverts */
.front-teaser-sheet { margin: 0; font-size: 14px; line-height: 20px; }
.front-teaser-sheet > div { display: flex; justify-content: space-between; gap: 16px; padding: 14px 28px; }
.front-teaser-sheet > div + div { border-top: 1px solid hsl(var(--front-stone-200)); }
.front-teaser-sheet dt { color: hsl(var(--front-stone-600)); }
.front-teaser-sheet dd { margin: 0; font-weight: 500; }
.front-teaser-sheet dd > span { color: hsl(var(--front-stone-600)); font-weight: 400; }
/* Notes sous les chiffres clés : les infobulles de l'ancien teaser, écrites en clair. */
.front-teaser-sheet-notes { margin-top: 12px; color: hsl(var(--front-stone-600)); font-size: 12px; line-height: 16px; }
.front-teaser-sheet-notes p { margin: 0 0 4px; }
.front-teaser-table th, .front-teaser-table td { padding: 14px 12px; }
.front-teaser-table thead th { padding-block: 12px; }
.front-teaser-table :is(th, td):first-child { padding-left: 28px; padding-right: 12px; }
.front-teaser-table :is(th, td):last-child { padding-right: 28px; }
/* Un en-tête de ligne garde le texte courant : seul l'en-tête de colonne est en capitales. */
.front-teaser-table tbody th { color: inherit; font: inherit; font-weight: 500; letter-spacing: normal; text-align: left; text-transform: none; }
.front-teaser-table-muted { color: hsl(var(--front-stone-700)); }
.front-teaser-table .front-teaser-table-end { text-align: right; }

/* Risques */

/* Simulateur */
.front-teaser-simulator { display: grid; margin-top: 32px; overflow: hidden; border: 1px solid hsl(var(--front-stone-200)); background: hsl(var(--front-white)); }
.front-teaser-simulator-form, .front-teaser-simulator-panel { padding: 32px; }
.front-teaser-simulator-label { font-size: 14px; font-weight: 500; line-height: 20px; }
.front-teaser-simulator-row { display: flex; align-items: baseline; justify-content: space-between; margin-bottom: 12px; }
.front-teaser-simulator-budget { margin-top: 24px; }
.front-teaser-simulator-bounds { display: flex; justify-content: space-between; margin-top: 8px; color: hsl(var(--front-stone-600)); font-size: 12px; line-height: 16px; }
.front-teaser-simulator-param { margin-top: 32px; }
.front-teaser-simulator-distribution { display: flex; align-items: baseline; justify-content: space-between; font-size: 14px; line-height: 20px; }
.front-teaser-simulator-distribution > span:last-child { color: hsl(var(--front-stone-600)); }
.front-teaser-simulator-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 32px; }
.front-teaser-simulator-panel { display: flex; flex-direction: column; background: linear-gradient(to bottom, hsl(var(--front-ink-900)), hsl(var(--front-ink-950))); color: hsl(var(--front-white)); }
.front-teaser-simulator-placeholder { max-width: 36em; color: hsl(var(--front-ink-100)); font-size: 16px; line-height: 1.625; }
.front-teaser-simulator-results {
    display: flex; flex: 1; flex-direction: column;
    /* Couleurs des graphiques, lues par campaign_simulator_controller.js. */
    /* Valeurs en hexadécimal : Chart.js ne lit pas la syntaxe hsl() à espaces. Intérêts en sauge 500 (#5F8571, 4,3:1 sur
       l'encre), axes en encre 100 (#E3E8EE). */
    --teaser-chart-value: rgba(255, 255, 255, .18);
    --teaser-chart-capital: rgba(255, 255, 255, .5);
    --teaser-chart-principal: #FFFFFF;
    --teaser-chart-interest: #5F8571;
    --teaser-chart-text: #E3E8EE;
    --teaser-chart-grid: rgba(255, 255, 255, .12);
}
.front-teaser-simulator-caption { color: hsl(var(--front-ink-100)); font-size: 14px; line-height: 20px; }
.front-teaser-simulator-capital { margin-top: 8px; font-size: 48px; font-weight: 500; letter-spacing: -0.025em; line-height: 1; }
.front-teaser-simulator-capital > span:last-child { color: hsl(var(--front-ink-100)); font-size: 24px; line-height: 32px; }
.front-teaser-simulator-gain { margin-top: 8px; color: hsl(var(--front-sage-100)); font-size: 14px; line-height: 20px; }
.front-teaser-simulator-gain > .front-icon { margin-right: 4px; vertical-align: -2px; }
.front-teaser-simulator-tabs { display: flex; gap: 8px; margin-top: 20px; }
.front-teaser-simulator-tabs button { height: 36px; padding: 0 16px; border: 1px solid hsl(var(--front-ink-300)); background: transparent; color: hsl(var(--front-ink-100)); font-size: 12px; font-weight: 500; line-height: 16px; cursor: pointer; }
.front-teaser-simulator-tabs button:hover { border-color: hsl(var(--front-white)); }
/* L'onglet courant passe en blanc, son libellé en encre (il restait blanc sur blanc). */
.front-teaser-simulator-tabs button.is-current { border-color: hsl(var(--front-white)); background: hsl(var(--front-white)); color: hsl(var(--front-ink-900)); }
.front-teaser-simulator-chart { position: relative; min-height: 190px; margin-top: 16px; }
.front-teaser-simulator-summary { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1px; margin-top: auto; overflow: hidden; border: 1px solid hsl(var(--front-ink-700) / .6); background: hsl(var(--front-ink-700) / .6); }
.front-teaser-simulator-summary > div { padding: 16px; background: hsl(var(--front-ink-900)); }
.front-teaser-simulator-summary > div > div:first-child { color: hsl(var(--front-ink-100)); font-size: 12px; line-height: 1.5; }
.front-teaser-simulator-summary > div > div:last-child { margin-top: 4px; font-weight: 500; }
.front-teaser-simulator-disclaimer { margin-top: 16px; color: hsl(var(--front-stone-600)); font: 400 12px/1.625 var(--front-font-mentions), sans-serif; font-feature-settings: 'tnum' 1; }

/* Champ de montant (carte « Investir » d'un visiteur, simulateur) */
.front-teaser-amount-label { display: block; font-size: 14px; font-weight: 500; line-height: 20px; }
.front-teaser-amount { display: flex; align-items: center; height: 56px; margin-top: 8px; padding: 0 16px; border: 2px solid hsl(var(--front-ink-900)); background: hsl(var(--front-white)); }
.front-teaser-amount input { flex: 1; width: 100%; padding: 0; border: 0; background: transparent; font-size: 24px; font-weight: 500; letter-spacing: -0.025em; line-height: 32px; font-variant-numeric: tabular-nums; }
.front-teaser-amount input:focus { outline: none; }
.front-teaser-amount input::placeholder { color: hsl(var(--front-stone-600)); font-weight: 400; opacity: 1; }
.front-teaser-amount > span:last-child { color: hsl(var(--front-stone-600)); font-size: 20px; line-height: 28px; }
.front-teaser-amount--large { height: 64px; margin-top: 12px; }
.front-teaser-amount--large > span:first-child { flex: 1; font-size: 30px; font-weight: 500; letter-spacing: -0.025em; line-height: 36px; }
.front-teaser-amount--large > span:last-child { font-size: 24px; line-height: 32px; }

/* Documents */
.front-teaser-documents-head { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px; padding: 16px 24px; border-bottom: 1px solid hsl(var(--front-stone-200)); color: hsl(var(--front-stone-700)); font-size: 14px; line-height: 20px; }
.front-teaser-documents { min-width: 560px; }
.front-teaser-documents thead th { line-height: 20px; }
.front-teaser-documents :is(th, td):first-child { padding-left: 24px; }
.front-teaser-documents :is(th, td):last-child { padding-right: 24px; }
.front-teaser-documents tbody th { font-weight: 400; }
.front-teaser-documents tbody + tbody { border-top: 1px solid hsl(var(--front-stone-200)); }
.front-teaser-table .front-teaser-table-group th { padding-block: 10px; background: hsl(var(--front-stone-100) / .6); color: hsl(var(--front-stone-700)); font: 400 11px/1.5 var(--front-font-mentions), sans-serif; letter-spacing: .12em; text-transform: uppercase; }
.front-table tbody tr.front-teaser-table-group:hover { background: hsl(var(--front-stone-100) / .6); }
.front-teaser-document-name { display: flex; align-items: center; gap: 12px; }
.front-teaser-document-name > .front-icon { flex-shrink: 0; color: hsl(var(--tone-700)); }
.front-teaser-document-name > span { font-weight: 500; }
.front-teaser-document-download { display: inline-flex; align-items: center; justify-content: center; width: 36px; height: 36px; border: 1px solid hsl(var(--front-stone-300)); transition: border-color .12s; }
.front-teaser-document-download:hover { border-color: hsl(var(--front-ink-900)); }
.front-teaser-document-locked { color: hsl(var(--front-stone-600)); font-size: 12px; line-height: 16px; }
.front-teaser-documents-empty { margin-top: 32px; color: hsl(var(--front-stone-700)); }

/* Opérateurs */

/* Accès réservé aux membres */
.front-teaser-wall { display: grid; justify-items: center; gap: 12px; margin-top: 32px; padding: 48px 24px; border: 1px solid hsl(var(--front-stone-200)); background: hsl(var(--front-stone-100)); text-align: center; }
.front-teaser-wall > .front-icon { color: hsl(var(--front-ink-700)); }
.front-teaser-wall-title { max-width: 512px; font-size: 20px; line-height: 28px; }
.front-teaser-wall-text { max-width: 512px; color: hsl(var(--front-stone-700)); font-size: 14px; line-height: 1.625; }
.front-teaser-wall-actions { display: flex; flex-wrap: wrap; justify-content: center; gap: 12px; margin-top: 12px; }

/* Carte sombre « Vous avez une question ? » */
.front-teaser-question { display: flex; flex-direction: column; gap: 24px; padding: 32px; background: linear-gradient(to bottom, hsl(var(--front-ink-900)), hsl(var(--front-ink-950))); color: hsl(var(--front-white)); }
.front-teaser-question-head { display: flex; align-items: flex-start; gap: 20px; }
.front-teaser-question-icon { display: grid; flex-shrink: 0; place-items: center; width: 56px; height: 56px; background: rgb(255 255 255 / .1); }
.front-teaser-question-title { font-size: 24px; line-height: 32px; }
.front-teaser-question-text { margin-top: 8px; color: hsl(var(--front-ink-300)); font-size: 14px; line-height: 1.625; }
.front-teaser-question-actions { display: flex; flex-direction: column; gap: 12px; white-space: nowrap; }
.front-teaser-question :focus-visible { outline-color: hsl(var(--front-white)); }

/* Carte de souscription */
.front-teaser-aside-inner { display: flex; flex-direction: column; gap: 20px; }
.front-teaser-invest { overflow: hidden; border: 1px solid hsl(var(--front-stone-200)); background: hsl(var(--front-white)); box-shadow: 0 12px 40px rgb(11 31 51 / .1); }
.front-teaser-invest-head { padding: 28px; background: linear-gradient(to bottom, hsl(var(--front-ink-900)), hsl(var(--front-ink-950))); color: hsl(var(--front-white)); }
.front-teaser-invest-top { display: flex; align-items: center; justify-content: space-between; margin-bottom: 20px; }
.front-teaser-invest-title { color: hsl(var(--front-ink-300)); font: 400 11px/1.5 var(--front-font-mentions), sans-serif; font-feature-settings: 'tnum' 1; letter-spacing: .18em; text-transform: uppercase; }
.front-teaser-invest-status { display: inline-flex; align-items: center; gap: 6px; padding: 4px 10px; font-size: 12px; font-weight: 500; line-height: 16px; }
.front-teaser-invest-status > span { width: 6px; height: 6px; }
.front-teaser-invest-status--open { background: hsl(var(--front-sage-500) / .2); color: hsl(var(--front-sage-100)); }
.front-teaser-invest-status--open > span { background: hsl(var(--front-sage-500)); }
.front-teaser-invest-status--soon { background: hsl(var(--front-brass-500) / .2); color: hsl(var(--front-white)); }
.front-teaser-invest-status--soon > span { background: hsl(var(--front-brass-500)); }
.front-teaser-invest-status--closed { background: rgb(255 255 255 / .1); color: hsl(var(--front-ink-100)); }
.front-teaser-invest-status--closed > span { background: hsl(var(--front-ink-300)); }
.front-teaser-invest-yield { display: flex; flex-direction: column; align-items: flex-start; gap: 2px; }
.front-teaser-invest-yield > span:last-child { color: hsl(var(--front-ink-300)); font-size: 14px; line-height: 20px; }
.front-teaser-invest-amount { font-size: 30px; font-weight: 500; letter-spacing: -0.025em; line-height: 36px; font-variant-numeric: tabular-nums; }
.front-teaser-invest-body { padding: 28px; }
.front-teaser-invest-body > .front-teaser-fragment, .front-teaser-invest-cta { margin-top: 24px; }
/* Repères de l'opération (durée, risque, revenus), sur deux colonnes comme ceux des cartes de la mosaïque. */
.front-teaser-invest-facts { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; padding-bottom: 24px; border-bottom: 1px solid hsl(var(--front-stone-200)); font-size: 14px; line-height: 20px; }
.front-teaser-invest-facts dt { color: hsl(var(--front-stone-600)); font-size: 11px; line-height: 16px; }
.front-teaser-invest-facts dd { margin: 2px 0 0; font-weight: 500; }
.front-teaser-invest-facts .front-risk-scale { display: flex; }
.front-teaser-invest-none { color: hsl(var(--front-stone-600)); font-weight: 400; }
.front-teaser-invest-secondary { margin-top: 12px; }
.front-teaser-invest-taxation { margin-top: 24px; padding-top: 24px; border-top: 1px solid hsl(var(--front-stone-200)); }
.front-teaser-invest-taxation h3 { margin-bottom: 4px; font-size: 14px; font-weight: 500; line-height: 20px; }
.front-teaser-invest-taxation p { color: hsl(var(--front-stone-700)); font-size: 14px; line-height: 1.625; }
/* Dispositifs fiscaux éligibles : une étiquette par dispositif, lien vers sa page quand elle existe. */
.front-teaser-invest-regimes { display: flex; flex-wrap: wrap; gap: 8px; margin: 12px 0 0; padding: 0; list-style: none; }
.front-teaser-invest-regimes a.front-tag:hover { border-color: hsl(var(--front-ink-900)); color: hsl(var(--front-ink-900)); }
.front-teaser-regime { font-weight: 500; }

/* Rappel par un conseiller */

/* Barre basse des petits écrans : elle s'efface tant que la carte « Investir » est à l'écran (teaser_page.js). */
.front-teaser-bar { position: fixed; inset-inline: 0; bottom: 0; z-index: 40; display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 12px 16px; border-top: 1px solid hsl(var(--front-stone-200)); background: hsl(var(--front-white)); box-shadow: 0 -8px 24px rgb(1 25 42 / .08); transition: transform .15s; }
.front-teaser-bar > p { font-weight: 500; font-variant-numeric: tabular-nums; }
.front-teaser-bar--away { visibility: hidden; transform: translateY(100%); }

@media(min-width:640px) {
    .front-teaser-hero-title { font-size: 64px; }
    .front-teaser-question-actions { flex-direction: row; }
    .front-teaser-portfolios { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .front-teaser-envelopes { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media(min-width:768px) {
    .front-teaser-panel--padded { padding: 28px; }
    .front-teaser-gallery-main { grid-column: span 8 / span 8; }
    .front-teaser-gallery--single .front-teaser-gallery-main { grid-column: span 12 / span 12; }
    .front-teaser-gallery-side { display: contents; }
    .front-teaser-gallery-side > .front-teaser-gallery-thumb { grid-column: span 4 / span 4; }
    .front-teaser-gallery--pair .front-teaser-gallery-thumb { grid-row: span 2 / span 2; }
    .front-teaser-gallery--solution .front-teaser-gallery-side { display: grid; grid-column: span 4 / span 4; grid-template-rows: repeat(2, minmax(0, 1fr)); gap: 12px; height: 100%; min-height: 0; }
    .front-teaser-gallery--solution.front-teaser-gallery--pair .front-teaser-gallery-side { grid-template-rows: repeat(1, minmax(0, 1fr)); }
    .front-teaser-gallery--solution .front-teaser-gallery-thumb { grid-column: auto; grid-row: auto; }
    .front-teaser-gallery--solution .front-teaser-gallery-thumb .front-teaser-gallery-open { position: absolute; inset: 0; }
    .front-teaser-features { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .front-teaser-solution-row { grid-template-columns: repeat(12, minmax(0, 1fr)); }
    .front-teaser-solution-row > h3 { grid-column: span 4 / span 4; }
    .front-teaser-solution-row > ul { grid-column: span 8 / span 8; }
}
@media(min-width:1024px) {
    .front-teaser-page { padding-bottom: 0; }
    .front-teaser-hero-contact { display: none; }
    .front-teaser-subnav { margin-inline: 0; padding-inline: 0; }
    .front-teaser-layout { grid-template-columns: repeat(12, minmax(0, 1fr)); }
    .front-teaser-primary { grid-column: span 8 / span 8; }
    .front-teaser-aside { grid-column: span 4 / span 4; }
    .front-teaser-simulator { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .front-teaser-simulator-form, .front-teaser-simulator-panel { padding: 40px; }
    .front-teaser-question { padding: 40px; }
    .front-teaser-bar { display: none; }
    html:has(.front-teaser-bar) { scroll-padding-bottom: 0; }
}
/* La carte de souscription reste à l'écran, si la fenêtre est assez haute pour la montrer entière. */
@media(min-width:1024px) and (min-height:820px) {
    .front-teaser-aside-inner { position: sticky; top: calc(var(--front-navbar-height) + 1.5rem); }
}
@media(prefers-reduced-motion:reduce) {
    .front-teaser-feature, .front-teaser-bar { transition: none; }
    .front-teaser-feature:hover { transform: none; }
}


/* ---------- Fragments historiques ---------- */

/*
    Les fragments rendus par des gabarits ou scripts partagés (formulaires d'investissement et de réservation, jauge de collecte,
    discussions, contenu rédigé au back-office, formulaire HubSpot) ont été mis en forme sur une remise à zéro complète des
    marges, retraits et bordures : on la reprend, confinée à ces fragments et sans spécificité, pour que leurs propres règles
    l'emportent toujours.
*/
:where(.front-teaser-fragment) :where(*, ::before, ::after) { margin: 0; padding: 0; border: 0 solid; }
:where(.front-teaser-fragment) :where(h1, h2, h3, h4, h5, h6) { font-size: inherit; font-weight: inherit; }
:where(.front-teaser-fragment) :where(ol, ul, menu) { list-style: none; }
:where(.front-teaser-fragment) :where(a) { color: inherit; text-decoration: inherit; }
:where(.front-teaser-fragment) :where(img, svg, video, canvas, iframe) { display: block; vertical-align: middle; }
:where(.front-teaser-fragment) :where(img, video) { max-width: 100%; height: auto; }
:where(.front-teaser-fragment) :where(table) { border-collapse: collapse; }
:where(.front-teaser-fragment) :where(button, input, select, textarea) { background-color: transparent; border-radius: 0; }
.front-teaser-page .is-hidden { display: none !important; }
.front-teaser.modal-open { overflow: hidden; }

/* Utilitaires des gabarits partagés de la jauge et des discussions. */
.front-teaser-fragment .d-f { display: flex; }
.front-teaser-fragment .ai-center, .front-teaser-fragment .a-i-c { align-items: center; }
.front-teaser-fragment .j-c-c { justify-content: center; }
.front-teaser-fragment .mt-15 { margin-top: 15px; }
.front-teaser-fragment .m-t-10 { margin-top: 10px; }
.front-teaser-fragment .m-b-20, .front-teaser-fragment .mb-5 { margin-bottom: 20px; }

/* Les boutons et indicateurs de chargement des gabarits partagés gardent leur forme. */
.front-teaser .ax-btn { border-radius: 9999px; }
.front-teaser .ax-icon__loader { border-radius: 50%; }

/* ---------- Contenu rédigé au back-office (HTML Froala), au corps de texte de la page ---------- */

.front-teaser-page .fr-view { font-size: 17px; line-height: 1.625; color: hsl(var(--front-stone-700)); overflow-wrap: anywhere; }
.front-teaser-page .fr-view > :first-child { margin-top: 0; }
.front-teaser-page .fr-view p, .front-teaser-page .fr-view ul, .front-teaser-page .fr-view ol, .front-teaser-page .fr-view blockquote, .front-teaser-page .fr-view table { margin: 0 0 1.25rem; }
.front-teaser-page .fr-view b, .front-teaser-page .fr-view strong { font-weight: 500; }
/* Encre pour le gras, les titres et les liens, sauf sous un élément dont le style en ligne fixe la couleur (section sur
   fond sombre, par exemple) : ils en héritent au lieu de disparaître. */
.front-teaser-page .fr-view :is(b, strong, h1, h2, h3, h4, h5, h6):not(:where([style*="color"] *)) { color: hsl(var(--front-ink-900)); }
.front-teaser-page .fr-view h1, .front-teaser-page .fr-view h2, .front-teaser-page .fr-view h3, .front-teaser-page .fr-view h4, .front-teaser-page .fr-view h5, .front-teaser-page .fr-view h6 { margin: 2em 0 .75em; font: 500 22px/30px var(--front-font-poppins), system-ui, sans-serif; letter-spacing: -0.01em; }
.front-teaser-page .fr-view h4, .front-teaser-page .fr-view h5, .front-teaser-page .fr-view h6 { font-size: 18px; line-height: 26px; }
.front-teaser-page .fr-view ul { padding-left: 24px; list-style: disc; }
.front-teaser-page .fr-view ol { padding-left: 24px; list-style: decimal; }
.front-teaser-page .fr-view li + li { margin-top: .35em; }
/* Les boutons du contenu (.ax-btn) gardent leurs couleurs : la règle des liens les rendait encre sur encre. */
.front-teaser-page .fr-view a:not(.ax-btn) { text-decoration: underline; text-underline-offset: 3px; }
.front-teaser-page .fr-view a:not(.ax-btn):not(:where([style*="color"] *)) { color: hsl(var(--front-ink-900)); }
.front-teaser-page .fr-view a:not(.ax-btn):hover { text-decoration-thickness: 2px; }
/* Le fond du contenu rédigé est inconnu (sections sombres) : anneau double, encre à l'extérieur et blanc au contact. */
.front-teaser-page .fr-view :focus-visible { box-shadow: 0 0 0 2px hsl(var(--front-white)); }
.front-teaser-page .fr-view img, .front-teaser-page .fr-view video, .front-teaser-page .fr-view iframe { max-width: 100%; height: auto; border: 0; }
.front-teaser-page .fr-view iframe { aspect-ratio: 16 / 9; width: 100%; height: auto; }
.front-teaser-page .fr-view .fr-dib { display: block; margin-inline: auto; }
.front-teaser-page .fr-view .fr-fil { float: left; margin: .5em 1em .5em 0; }
.front-teaser-page .fr-view .fr-fir { float: right; margin: .5em 0 .5em 1em; }
.front-teaser-page .fr-view blockquote { padding-left: 20px; border-left: 3px solid hsl(var(--front-ink-900)); color: hsl(var(--front-stone-700)); }
.front-teaser-page .fr-view table { display: block; max-width: 100%; overflow-x: auto; border-collapse: collapse; }
.front-teaser-page .fr-view th, .front-teaser-page .fr-view td { padding: 10px 14px; border: 1px solid hsl(var(--front-stone-200)); text-align: left; vertical-align: top; }
.front-teaser-page .fr-view th { background: hsl(var(--front-stone-100)); font-weight: 500; }
.front-teaser-page .fr-view hr { margin: 2em 0; border: 0; border-top: 1px solid hsl(var(--front-stone-200)); }
.front-teaser-page .block-body { min-width: 0; }

.front-teaser-page .ax-gauge__heading { display: flex; flex-direction: row-reverse; align-items: baseline; justify-content: space-between; gap: 12px; margin: 0; }
.front-teaser-page .ax-gauge__label { color: hsl(var(--front-ink-300)); font-size: 14px; line-height: 20px; }
.front-teaser-page .ax-gauge__value { font-size: 30px; font-weight: 500; line-height: 36px; letter-spacing: -0.025em; font-variant-numeric: tabular-nums; }
.front-teaser-page .ax-gauge__bar { display: flex; height: 6px; margin-top: 12px; overflow: hidden; background: hsl(var(--front-ink-700)); }
.front-teaser-page .ax-gauge__bar .progress-bar { display: block; height: 100%; background-color: hsl(var(--front-ink-300)) !important; }
.front-teaser-page .ax-gauge__bar .progress-bar.last { background-color: white !important; }
.front-teaser-page .ax-gauge__bar .progress-remaining { flex: 1; }

/* Formulaires d'investissement et de réservation (rendus par InvestmentController et ReservationController) : champ et boutons
   de la carte de souscription. Les identifiants, noms et attributs data-* ne changent pas. */
.front-teaser-page #subscribe-panel .ax-panel__section { padding: 0; }
.front-teaser-page #subscribe-panel .ax-panel__section + .ax-panel__section { margin-top: 16px; padding-top: 16px; border-top: 1px solid hsl(var(--front-stone-200)); }
.front-teaser-page #subscribe-panel .ax-panel__section p { margin: 0 0 12px; font-size: 14px; line-height: 20px; }
/* Montant envisagé ou souscrit : de la taille du texte du champ de montant. */
.front-teaser-page #subscribe-panel .ax-panel__section p.ax-panel__amount { margin: 0; font-size: 24px; font-weight: 500; line-height: 32px; letter-spacing: -0.025em; font-variant-numeric: tabular-nums; }
.front-teaser-page #subscribe-panel .ax-fieldset { display: grid; gap: 0; }
.front-teaser-page #subscribe-panel .ax-label, .front-teaser-page #subscribe-panel .ax-field > label { display: block; margin-bottom: 8px; font-size: 14px; font-weight: 500; line-height: 20px; }
.front-teaser-page #subscribe-panel .ax-compoundfield { display: flex; align-items: center; height: 56px; padding: 0 16px; border: 2px solid hsl(var(--front-ink-900)); background: white; }
.front-teaser-page #subscribe-panel .ax-compoundfield > div { flex: 1; min-width: 0; }
.front-teaser-page #subscribe-panel .ax-compoundfield .form-control { height: 52px; padding: 0; border: 0; background: transparent; font-size: 24px; font-weight: 500; line-height: 32px; letter-spacing: -0.025em; }
.front-teaser-page #subscribe-panel .ax-compoundfield .form-control:focus-visible { outline: 0; }
.front-teaser-page #subscribe-panel .ax-compoundfield__addon { padding: 0 0 0 8px; color: hsl(var(--front-stone-600)); font-size: 20px; }
.front-teaser-page #subscribe-panel .ax-btn { width: 100%; min-height: 48px; height: 48px; margin-top: 24px; padding: 0; overflow: visible; border: 0; background: hsl(var(--front-button-primary)); color: hsl(var(--front-button-primary-foreground)); font-size: 14px; font-weight: 500; line-height: 20px; }
.front-teaser-page #subscribe-panel .ax-btn:hover { background: hsl(var(--front-button-primary-hover)); color: hsl(var(--front-button-primary-foreground)); }
.front-teaser-page #subscribe-panel .ax-btn--secondary { border: 1px solid hsl(var(--front-ink-900)); background: transparent; color: hsl(var(--front-ink-900)); }
.front-teaser-page #subscribe-panel .ax-btn--secondary:hover { background: hsl(var(--front-ink-900)); color: white; }
.front-teaser-page #subscribe-panel .ax-btn--link { height: auto; min-height: 0; margin-top: 12px; text-decoration: underline; text-underline-offset: 3px; background: transparent; color: hsl(var(--front-ink-900)); }

/* ---------- Discussions (gabarits Front/Organisms/Comment, chargés par campaign_comments_controller.js) ---------- */

.front-teaser .ax-chat { display: grid; gap: 32px; }
.front-teaser .ax-chat__loader { display: flex; align-items: center; gap: 12px; color: hsl(var(--front-stone-700)); }
.front-teaser .ax-chat__loader p { margin: 0; }

/* Champs, cases et pastilles partagés avec les autres formulaires embarqués. */
.front-teaser .ax-fieldset__element.ax-field { flex: 1; min-width: 0; }
.front-teaser .ax-fieldset__element--noflex { flex: none; }
.front-teaser .ax-profile-badge { display: inline-grid; place-items: center; flex: none; width: 40px; height: 40px; background: hsl(var(--front-ink-900)); color: white; font: 600 13px/1 var(--front-font-sans), sans-serif; text-transform: uppercase; }
.front-teaser .ax-textarea { display: block; border: 1px solid hsl(var(--front-stone-500)); background: white; }
.front-teaser .ax-textarea textarea { display: block; width: 100%; min-height: 48px; padding: 12px 16px; border: 0; background: transparent; font: 400 16px/24px var(--front-font-sans), sans-serif; resize: vertical; }
.front-teaser .ax-textarea:focus-within { outline: 2px solid hsl(var(--front-ink-900)); outline-offset: 2px; }
.front-teaser .ax-checkbox { display: inline-flex; align-items: center; gap: 8px; cursor: pointer; font-size: 14px; }
.front-teaser .ax-checkbox input { width: 18px; height: 18px; margin: 0; accent-color: hsl(var(--front-ink-900)); }
.front-teaser .ax-checkbox > span { display: inline; }

/* Avatar : initiales dans un carré d'encre, comme les autres pastilles du design system. */
.front-teaser .ax-chat__avatar { display: grid; place-items: center; flex: none; width: 40px; height: 40px; background: hsl(var(--front-ink-900)); color: white; font: 600 13px/1 var(--front-font-sans), sans-serif; text-transform: uppercase; }
.front-teaser .ax-chat__avatar .ax-icon { display: none; }
.front-teaser .ax-chat__avatar:has(.ax-icon__logo)::before { content: 'A'; }

/* Zone de saisie d'un message ou d'une réponse : l'avatar, puis le champ sous son libellé, l'option confidentielle et le bouton. */
.front-teaser .ax-chat__holder { margin: 0; }
/* La saisie du premier niveau est suivie des fils : une marge les sépare du bouton « Poster » (les formulaires de réponse ont celle de leur bloc). */
.front-teaser #ax_comment_thread_container > .ax-chat__holder { margin-bottom: 32px; }
.front-teaser .ax-chat__input.is-loading { opacity: .6; }
.front-teaser .ax_comment_new_form { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 16px; align-items: start; }
.front-teaser .ax-chat__composer { display: grid; gap: 12px; min-width: 0; }
.front-teaser .ax-chat__label { color: hsl(var(--front-ink-900)); font: 500 15px/24px var(--front-font-sans), sans-serif; }
.front-teaser .ax-chat .ax-textarea textarea { min-height: 96px; padding: 12px 16px; line-height: 26px; }
.front-teaser .ax-chat__options { display: grid; gap: 4px; }
.front-teaser .ax-chat .ax-checkbox { font-size: 15px; line-height: 24px; }
.front-teaser .ax-chat__hint { margin: 0 0 0 26px; color: hsl(var(--front-stone-700)); font-size: 13px; line-height: 20px; }
.front-teaser .ax-chat__submit { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 8px; }

/* Fils : un filet entre deux messages, chacun avec son avatar, son auteur, sa date, son texte et ses actions. */
.front-teaser .ax-chat__threads { display: grid; gap: 24px; margin: 0; padding: 0; list-style: none; }
/* Un fil : une bordure latérale de 3 px sur toute sa hauteur, la question en bleu marine, ses réponses en blanc, le tout à l'alignement. */
.front-teaser .ax-chat__thread { border-left: 3px solid hsl(var(--front-ink-900)); }
.front-teaser .ax-chat__empty { margin: 0; padding-top: 24px; border-top: 1px solid hsl(var(--front-stone-200)); color: hsl(var(--front-stone-700)); }
.front-teaser .ax-chat__message { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 16px; }
.front-teaser .ax-chat__message.is-loading { opacity: .5; }
.front-teaser .ax-chat__content { display: grid; gap: 8px; min-width: 0; }
.front-teaser .ax-chat__metadata { display: flex; flex-wrap: wrap; align-items: baseline; gap: 2px 12px; }
.front-teaser .ax-chat__author { color: hsl(var(--front-ink-900)); font-size: 16px; font-weight: 500; line-height: 24px; }
.front-teaser .ax-chat__date, .front-teaser .ax-chat__update { color: hsl(var(--front-stone-700)); font-size: 13px; line-height: 20px; }
.front-teaser .ax-chat__text { color: hsl(var(--front-ink-900)); font-size: 16px; line-height: 26px; overflow-wrap: anywhere; }
.front-teaser .ax-chat__text p { margin: 0 0 12px; }
.front-teaser .ax-chat__text .text-overflow { display: none; }
.front-teaser .ax-chat__text.has-more-text .text-more { display: none; }
.front-teaser .ax-chat__text.has-more-text .text-overflow { display: inline; }

/* Actions : liens-boutons soulignés, assez hauts pour se viser au doigt, avec l'anneau de focus du design system. */
.front-teaser .ax-chat__actions { display: flex; flex-wrap: wrap; align-items: center; gap: 0 20px; }
.front-teaser .ax-chat__actions[hidden] { display: none; }
.front-teaser .ax-chat__actions > div { display: flex; flex-wrap: wrap; gap: 0 20px; }
.front-teaser .ax-chat__actions > div:not(:has(*)) { display: none; }
.front-teaser .ax-chat__action, .front-teaser .ax-chat__charger { min-height: 32px; padding: 4px 0; border: 0; background: transparent; color: hsl(var(--front-ink-900)); font: 500 14px/20px var(--front-font-sans), sans-serif; text-decoration: underline; text-underline-offset: 3px; cursor: pointer; }
.front-teaser .ax-chat__action:hover, .front-teaser .ax-chat__charger:hover { text-decoration-thickness: 2px; }
.front-teaser .ax-chat__action:focus-visible, .front-teaser .ax-chat__charger:focus-visible { outline: 2px solid hsl(var(--front-ink-900)); outline-offset: 2px; }

/* Question d'origine : fond bleu marine de la navbar, texte blanc ; avatar, actions, saisie et boutons s'inversent avec elle. */
.front-teaser .ax-chat__thread > .ax-chat__message { padding: 20px 24px; background: hsl(var(--front-ink-900)); color: white; }
.front-teaser .ax-chat__thread > .ax-chat__message .ax-chat__avatar { background: white; color: hsl(var(--front-ink-900)); }
.front-teaser .ax-chat__thread > .ax-chat__message :is(.ax-chat__author, .ax-chat__text, .ax-chat__action, .ax-chat__label, .ax-checkbox) { color: white; }
.front-teaser .ax-chat__thread > .ax-chat__message :is(.ax-chat__date, .ax-chat__update, .ax-chat__hint) { color: hsl(var(--front-white) / .8); }
.front-teaser .ax-chat__thread > .ax-chat__message :is(.help-block.danger, .danger) { color: hsl(var(--front-clay-100)); }
.front-teaser .ax-chat__thread > .ax-chat__message :focus-visible { outline-color: white; }
.front-teaser .ax-chat__thread > .ax-chat__message .front-button--primary { --button-bg: var(--front-white); --button-fg: var(--front-ink-900); --button-hover: var(--front-stone-100); --button-active: var(--front-stone-200); }
.front-teaser .ax-chat__thread > .ax-chat__message .front-button--secondary { --button-bg: var(--front-ink-900); --button-fg: var(--front-white); --button-hover: var(--front-ink-800); --button-active: var(--front-ink-700); border-color: hsl(var(--front-ink-500)); }
.front-teaser .ax-chat .ax-textarea textarea { color: hsl(var(--front-ink-900)); }

/* Réponses : l'inverse, fond blanc et texte bleu marine, dans la même largeur que la question ; « Voir toutes les réponses » et le
   formulaire de réponse prolongent le même bloc blanc. */
.front-teaser .ax_comment_replies { display: grid; margin: 0; padding: 0; }
.front-teaser .ax-chat__message--response { padding: 20px 24px; border: 1px solid hsl(var(--front-stone-200)); border-left: 0; background: white; }
.front-teaser .ax-chat__message--response + .ax-chat__message--response { border-top: 0; }
.front-teaser .ax-chat__charger { display: block; width: 100%; margin: 0; padding: 12px 24px; border: 1px solid hsl(var(--front-stone-200)); border-left: 0; border-top: 0; background: white; text-align: left; }
.front-teaser .ax-chat__charger[hidden] { display: none; }
.front-teaser .ax-chat__reply { margin: 0; padding: 20px 24px; border: 1px solid hsl(var(--front-stone-200)); border-left: 0; background: white; }
.front-teaser .ax-chat__reply:empty { display: none; }
@media (max-width: 639px) {
    .front-teaser .ax-chat__message { gap: 12px; }
    .front-teaser .ax-chat__message .ax-chat__avatar, .front-teaser .ax-chat__reply .ax-chat__avatar { width: 32px; height: 32px; font-size: 12px; }
    .front-teaser .ax-chat__thread > .ax-chat__message, .front-teaser .ax-chat__message--response, .front-teaser .ax-chat__reply { padding: 16px; }
    .front-teaser .ax-chat__charger { padding: 12px 16px; }
}
@media (max-width: 479px) {
    .front-teaser .ax_comment_new_form { grid-template-columns: minmax(0, 1fr); }
    .front-teaser .ax-chat__avatar--self { display: none; }
}

/* ---------- Formulaires embarqués (accès au dossier, discussions, onboarding) ---------- */

.front-teaser .ax-fieldset { display: grid; gap: 16px; }
.front-teaser .ax-fieldset--flex { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 12px; }
.front-teaser .ax-fieldset--flex .ax-field { flex: 1 1 160px; }
.front-teaser .ax-label, .front-teaser .ax-field > label { display: block; margin-bottom: 8px; font: 600 14px/20px var(--front-font-sans), sans-serif; }
.front-teaser .form-control { display: block; width: 100%; height: 56px; padding: 0 16px; border: 1px solid hsl(var(--front-stone-500)); border-radius: 0; background: white; color: hsl(var(--front-ink-900)); font: 500 20px/28px var(--front-font-sans), sans-serif; font-variant-numeric: tabular-nums; }
.front-teaser select.form-control { height: 48px; font-size: 16px; }
.front-teaser textarea.form-control { height: auto; min-height: 96px; padding: 12px 16px; font-size: 16px; }
.front-teaser .form-control::placeholder { color: hsl(var(--front-stone-700)); opacity: .8; font-weight: 400; }
.front-teaser .form-control:focus-visible { outline: 2px solid hsl(var(--front-ink-900)); outline-offset: 2px; }
.front-teaser .ax-compoundfield { display: flex; align-items: stretch; border: 2px solid hsl(var(--front-stone-500)); background: white; }
.front-teaser .ax-compoundfield > div { flex: 1; min-width: 0; }
.front-teaser .ax-compoundfield .form-control { height: 54px; border: 0; }
.front-teaser .ax-compoundfield:focus-within { outline: 2px solid hsl(var(--front-ink-900)); outline-offset: 2px; }
.front-teaser .ax-compoundfield .form-control:focus-visible { outline: 0; }
.front-teaser .ax-compoundfield__addon { display: grid; place-items: center; padding: 0 16px; color: hsl(var(--front-stone-700)); font-size: 20px; }
.front-teaser .ax-has-errors, .front-teaser .ax-compoundfield.ax-has-errors { border-color: hsl(var(--front-clay-500)); }
.front-teaser .help-block.danger, .front-teaser .alert-danger, .front-teaser .danger { display: block; margin-top: 8px; color: hsl(var(--front-clay-700)); font-size: 14px; line-height: 20px; }
.front-teaser .list-unstyled { margin: 0; padding: 0; list-style: none; }
.front-teaser .required { font-weight: 600; }

.front-teaser .ax-btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 48px; padding: 12px 24px; border: 1px solid transparent; border-radius: 9999px; background: hsl(var(--front-ink-900)); color: white; font: 600 16px/24px var(--front-font-sans), sans-serif; text-decoration: none; cursor: pointer; transition: background-color .2s, color .2s, border-color .2s; }
.front-teaser .ax-btn:hover { background: hsl(var(--front-ink-800)); }
.front-teaser .ax-btn--secondary { border-color: hsl(var(--front-ink-900)); background: white; color: hsl(var(--front-ink-900)); }
.front-teaser .ax-btn--secondary:hover { background: hsl(var(--front-stone-100)); }
.front-teaser .ax-btn--tertiary { background: white; color: hsl(var(--front-ink-900)); }
.front-teaser .ax-btn--link { padding-inline: 8px; background: transparent; color: hsl(var(--front-ink-900)); text-decoration: underline; text-underline-offset: 3px; }
.front-teaser .ax-btn--link:hover { background: transparent; text-decoration-thickness: 2px; }
.front-teaser .ax-btn--small { min-height: 40px; padding-block: 8px; font-size: 14px; }
.front-teaser .ax-btn--fullwidth { width: 100%; }
.front-teaser .ax-btn.is-disabled, .front-teaser .ax-btn:disabled { opacity: .4; pointer-events: none; }
.front-teaser .ax-btn.is-loading { opacity: .7; cursor: progress; }

.front-teaser .ax-icon__loader { display: inline-block; width: 24px; height: 24px; border: 3px solid hsl(var(--front-stone-200)); border-top-color: hsl(var(--front-ink-900)); border-radius: 50%; animation: front-spin 1s linear infinite; }
.front-teaser .ax-icon__info { display: inline-grid; place-items: center; width: 16px; height: 16px; border: 1px solid currentColor; color: hsl(var(--front-stone-700)); font: 600 11px/1 var(--front-font-mentions), sans-serif; font-style: normal; cursor: help; }
.front-teaser .ax-icon__info::before { content: 'i'; }
.front-teaser .message-red { padding: 12px 16px; border: 1px solid hsl(var(--front-clay-500)); background: hsl(var(--front-clay-100)); color: hsl(var(--front-clay-700)); font-size: 14px; }

/* ---------- Fenêtres modales (Bootstrap pour la logique, habillage Encre & Laiton) ---------- */

.front-teaser .modal { position: fixed; inset: 0; z-index: 1050; display: none; overflow: auto; outline: 0; }
.front-teaser .modal.fade { opacity: 0; transition: opacity .15s linear; }
.front-teaser .modal.fade.in { opacity: 1; }
.front-teaser .modal-dialog { position: relative; width: auto; max-width: 560px; margin: 10vh auto; padding-inline: 16px; }
.front-teaser .modal.fade .modal-dialog { transform: translateY(-24px); transition: transform .2s ease-out; }
.front-teaser .modal.fade.in .modal-dialog { transform: none; }
.front-teaser .modal-content { position: relative; padding: 32px; background: white; box-shadow: 0 12px 40px rgba(11,31,51,.10); }
.front-teaser .modal-header { margin-bottom: 20px; padding-right: 40px; }
.front-teaser .modal-title { font: 500 22px/30px var(--front-font-poppins), system-ui, sans-serif; }
.front-teaser .modal-body p { margin-bottom: 16px; color: hsl(var(--front-stone-700)); }
.front-teaser .close { position: absolute; top: 12px; right: 12px; z-index: 1; display: grid; place-items: center; width: 40px; height: 40px; padding: 0; border: 0; background: transparent; color: hsl(var(--front-ink-900)); font-size: 0; cursor: pointer; }
.front-teaser .close::before { content: '×'; font: 400 30px/1 var(--front-font-sans), sans-serif; }
.front-teaser .close .ax-icon { display: none; }
.front-teaser .modal-backdrop { position: fixed; inset: 0; z-index: 1040; background: hsl(var(--front-ink-950) / .6); }
.front-teaser .modal-backdrop.fade { opacity: 0; transition: opacity .15s linear; }
.front-teaser .modal-backdrop.in { opacity: 1; }

/* Infobulles et fenêtres contextuelles Bootstrap (discussions, suppression d'un bloc par un administrateur). */
.front-teaser .tooltip { position: absolute; z-index: 1070; display: block; max-width: 280px; opacity: 0; pointer-events: none; font: 400 13px/18px var(--front-font-sans), sans-serif; }
.front-teaser .tooltip.in { opacity: 1; }
.front-teaser .tooltip-inner { padding: 8px 12px; background: hsl(var(--front-ink-900)); color: white; text-align: left; }
.front-teaser .tooltip.top { margin-top: -6px; }
.front-teaser .tooltip.bottom { margin-top: 6px; }
.front-teaser .tooltip-arrow { display: none; }
.front-teaser .popover { position: absolute; top: 0; left: 0; z-index: 1060; display: none; max-width: 300px; padding: 0; border: 1px solid hsl(var(--front-stone-300)); background: white; box-shadow: 0 1px 2px rgba(11,31,51,.06), 0 8px 24px rgba(11,31,51,.08); font: 400 14px/20px var(--front-font-sans), sans-serif; }
.front-teaser .popover-title { margin: 0; padding: 10px 14px; border-bottom: 1px solid hsl(var(--front-stone-200)); font-weight: 600; }
.front-teaser .popover-content { display: flex; flex-wrap: wrap; gap: 8px; padding: 14px; }
.front-teaser .popover-content p { flex: 1 0 100%; margin: 0; }
.front-teaser .popover .arrow { display: none; }

/* Fenêtres d'accueil de l'onboarding progressif (composants Vue, montés par general/modal-button). */
.front-teaser .modal-vue { position: fixed; inset: 0; z-index: 9999; display: flex; align-items: center; justify-content: center; }
.front-teaser .modal-vue > .modal-background { position: absolute; inset: 0; z-index: 0; background: hsl(var(--front-ink-950) / .7); }
.front-teaser .modal-component { position: absolute; z-index: 1; }
.front-teaser .ax-onboardingModal, .front-teaser .ax-onboardingModal-v2 { display: flex; width: 100%; max-width: 560px; max-height: 92vh; overflow-y: auto; background: white; color: hsl(var(--front-ink-900)); box-shadow: 0 12px 40px rgba(11,31,51,.10); text-align: left; }
.front-teaser .ax-onboardingModal-v2 { max-width: 920px; }
.front-teaser .ax-onboardingModal__side, .front-teaser .ax-onboardingModal-v2__side { display: flex; flex: 1; flex-direction: column; min-width: 0; padding: 32px; background: white; overflow: auto; }
.front-teaser .ax-onboardingModal-v2__side.dark { background: linear-gradient(180deg, hsl(var(--front-ink-900)), hsl(var(--front-ink-950))); color: white; }
.front-teaser .ax-onboardingModal-v2__side.dark a { color: inherit; }
.front-teaser .ax-onboardingModal__heading, .front-teaser .ax-onboardingModal-v2__heading { margin-bottom: 24px; padding-bottom: 16px; border-bottom: 1px solid hsl(var(--front-stone-200)); }
.front-teaser .ax-onboardingModal__title, .front-teaser .ax-onboardingModal-v2__title { margin: 0; font: 500 20px/30px var(--front-font-poppins), system-ui, sans-serif; }
.front-teaser .ax-onboardingModal p, .front-teaser .ax-onboardingModal-v2 p { margin: 0 0 12px; font-size: 15px; line-height: 23px; }
.front-teaser .ax-onboardingModal ul { margin: 0 0 12px; padding-left: 24px; list-style: disc; font-size: 15px; line-height: 23px; }
.front-teaser .ax-onboardingModal__question, .front-teaser .ax-onboardingModal-v2__question { margin-top: 16px; }
.front-teaser .ax-onboardingModal__question .ax-checkbox, .front-teaser .ax-onboardingModal-v2__question .ax-checkbox { align-items: flex-start; font-size: 14px; line-height: 21px; }
.front-teaser .ax-onboardingModal__question .ax-checkbox input, .front-teaser .ax-onboardingModal-v2__question .ax-checkbox input { flex: none; margin-top: 2px; }
.front-teaser .ax-onboardingModal__cta, .front-teaser .ax-onboardingModal-v2__cta { display: grid; gap: 8px; margin-top: 28px; }
.front-teaser .ax-onboardingModal__footer, .front-teaser .ax-onboardingModal-v2__footer { display: flex; align-items: flex-start; gap: 12px; margin-top: 24px; padding-top: 20px; border-top: 1px solid hsl(var(--front-stone-200)); color: hsl(var(--front-stone-700)); font-size: 12px; line-height: 18px; }
.front-teaser .ax-onboardingModal-v2__side.dark .ax-onboardingModal-v2__footer { border-color: hsl(var(--front-ink-700)); color: hsl(var(--front-ink-100)); }
.front-teaser .ax-onboardingModal .text-center, .front-teaser .ax-onboardingModal .text-left, .front-teaser .ax-onboardingModal-v2 .text-left { text-align: left; }
@media (max-width: 767px) {
    .front-teaser .modal-component { inset: 0; }
    .front-teaser .ax-onboardingModal, .front-teaser .ax-onboardingModal-v2 { display: block; max-width: none; height: 100%; max-height: none; }
}


/* ---------- Formulaire HubSpot d'avant lancement ---------- */

.front-teaser .teaser-invest__hubspot .hs-form fieldset { max-width: none !important; }
.front-teaser .teaser-invest__hubspot .hs-form-field { margin-top: 12px; }
.front-teaser .teaser-invest__hubspot label { display: block; margin-bottom: 6px; font: 600 14px/20px var(--front-font-sans), sans-serif; }
.front-teaser .teaser-invest__hubspot .hs-input:not([type="checkbox"]):not([type="radio"]) { width: 100% !important; height: 48px; padding: 0 16px; border: 1px solid hsl(var(--front-stone-500)); background: white; font: 400 16px/24px var(--front-font-sans), sans-serif; }
.front-teaser .teaser-invest__hubspot .hs-error-msgs { margin: 6px 0 0; padding: 0; list-style: none; color: hsl(var(--front-clay-700)); font-size: 13px; }
.front-teaser .teaser-invest__hubspot input[type="submit"] { margin-top: 16px; height: 48px; padding: 0 24px; border: 0; border-radius: 9999px; background: hsl(var(--front-ink-900)); color: white; font: 600 16px/28px var(--front-font-sans), sans-serif; cursor: pointer; }
.front-teaser .hubspot-spinner { display: grid; place-items: center; min-height: 64px; }

/* ---------- Édition en place des administrateurs ---------- */

.front-teaser .block-actions { display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-end; gap: 8px; margin-bottom: 12px; }
.front-teaser .btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 36px; padding: 6px 14px; border: 1px solid transparent; background: hsl(var(--front-ink-900)); color: white; font: 600 13px/20px var(--front-font-sans), sans-serif; text-decoration: none; cursor: pointer; }
.front-teaser .btn:hover { background: hsl(var(--front-ink-700)); }
.front-teaser .btn-danger { background: hsl(var(--front-clay-700)); }
.front-teaser .btn-danger:hover { background: hsl(var(--front-clay-500)); }
.front-teaser .btn-success { background: hsl(var(--front-sage-700)); }
.front-teaser .btn.disabled, .front-teaser .btn[disabled] { opacity: .4; pointer-events: none; }
.front-teaser .label { display: inline-flex; align-items: center; padding: 4px 10px; background: hsl(var(--front-stone-100)); color: hsl(var(--front-stone-700)); font: 600 12px/16px var(--front-font-sans), sans-serif; }
.front-teaser .label-warning { background: hsl(var(--front-brass-100)); color: hsl(var(--front-ink-900)); }
.front-teaser .label-info { background: hsl(var(--front-azur-100)); color: hsl(var(--front-azur-700)); }
.front-teaser .block-form { margin-top: 16px; }
.front-teaser .block-form .container-fluid { padding: 20px; border: 1px solid hsl(var(--front-stone-200)); background: white; }
.front-teaser .block-form .form-group { margin-bottom: 16px; }
.front-teaser .block-form label { display: block; margin-bottom: 6px; font: 600 14px/20px var(--front-font-sans), sans-serif; }
.front-teaser .block-form .form-control { height: 44px; font-size: 16px; }
.front-teaser .block-form .pull-right { float: right; }