/* V5 — the evidence is part of the story: a visible control room, cleaner states, and a deliberate baseline. */

.hero {
  height: 100svh;
  min-height: 760px;
  max-height: 100svh;
}

.hero-baseline {
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: end;
  gap: 28px;
  min-height: 62px;
  padding-top: 18px;
  padding-bottom: 4px;
  border-top-color: #9a9f8f88;
  overflow: visible;
}
.hero-baseline > a {
  display: grid;
  justify-items: center;
  gap: 6px;
  color: var(--ink);
  text-align: center;
  white-space: nowrap;
}
.hero-baseline > a strong {
  color: #dfca91;
  font-size: 10px;
  letter-spacing: .18em;
  font-weight: 500;
}
.hero-baseline > a small {
  color: #ced6c8;
  font-size: 10px;
  letter-spacing: .08em;
}
.baseline-tag { line-height: 1.55; }
.baseline-right { text-align: right; }
.hero-art figcaption { display: none; }

/* Use the supplied JS Private lockup everywhere the brand appears. */
.wordmark.official-logo {
  display: block;
  width: 94px;
  height: 68px;
  overflow: hidden;
  flex: 0 0 auto;
}
.wordmark.official-logo img {
  display: block;
  width: 94px;
  height: 94px;
  margin: -13px 0 0;
  object-fit: contain;
}
.footer .wordmark.official-logo img { filter: brightness(0) saturate(100%); }

/* The section owns its background all the way to the viewport edge. */
.highwater {
  width: 100%;
  max-width: none;
  padding-left: max(48px, calc((100% - 1260px) / 2));
  padding-right: max(48px, calc((100% - 1260px) / 2));
}

/* One centered cross replaces the two almost-overlapping divider strokes. */
.share-divider:after { display: none; }
.share-divider span {
  position: relative;
  z-index: 1;
  display: grid;
  place-items: center;
  width: 34px;
  height: 34px;
  border: 1px solid #d0b77566;
  border-radius: 50%;
  background: #071b15;
  color: #d5bb78;
  font: 400 24px/1 var(--serif);
}
.share-number { line-height: .8 !important; margin-bottom: 30px !important; }
.share-person p { position: relative; z-index: 2; margin-top: 0 !important; line-height: 1.4 !important; }
.range-track > div { display: flex; justify-content: space-between; gap: 24px; }

/* The three states use one semantic palette instead of inheriting unrelated text colors. */
.chart-result { position: relative; }
.chart-result strong { color: #395a47; }
.chart-result[data-state="down"] strong { color: #697b6e; }
.chart-result[data-state="neutral"] strong { color: #536e5b; }
.chart-result[data-state="positive"] strong { color: #937039; }
.chart-result[data-state="positive"] #chart-status { color: #8f713c; }
.scenario-buttons button[data-state="down"] { color: #697b6e; }
.scenario-buttons button[data-state="neutral"] { color: #8e7745; }
.scenario-buttons button[data-state="positive"] { color: #496b53; }
.hwm-visual[data-state="down"] .threshold { stroke: #9da996; }
.hwm-visual[data-state="neutral"] .threshold { stroke: #b49b65; }
.hwm-visual[data-state="positive"] .threshold { stroke: #9a8045; }
.hwm-visual[data-state="positive"] .profit-zone { fill: #b89652; }

/* Back-office capture: a concrete control room replaces the abstract portal placeholder. */
.bo-frame {
  min-width: 0;
  border: 1px solid #b6c1b4;
  background: #f4f5f1;
  color: #193a34;
  box-shadow: 24px 34px 70px rgba(20, 50, 38, .13);
  transform: perspective(1400px) rotateY(5deg) rotateX(1deg);
  transform-origin: center right;
}
.bo-windowbar {
  min-height: 38px;
  padding: 0 16px;
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: center;
  gap: 13px;
  border-bottom: 1px solid #d7ddd5;
  background: #fffefa;
  color: #61736a;
  font-size: 8px;
  letter-spacing: .16em;
}
.bo-window-dots { display: flex; gap: 5px; }
.bo-window-dots i { width: 6px; height: 6px; display: block; border-radius: 50%; background: #c7cec3; }
.bo-window-dots i:first-child { background: #b79a59; }
.bo-live { color: #72866e; font-size: 0; }
.bo-live:after { content: "STRUCTURE RÉELLE · DONNÉES DE DÉMO"; font-size: 7px; }
.bo-live i { display: inline-block; width: 5px; height: 5px; margin-right: 4px; border-radius: 50%; background: #789a76; }
.bo-layout { display: grid; grid-template-columns: 172px minmax(0, 1fr); min-height: 446px; }
.bo-sidebar { display: flex; flex-direction: column; padding: 18px 12px 14px; background: #102f2a; color: #dce6e2; }
.bo-brand { display: flex; align-items: center; gap: 8px; padding: 0 5px 16px; border-bottom: 1px solid #31504a; }
.bo-brand > span { width: 29px; height: 29px; display: grid; place-items: center; border: 1px solid #c4a965; color: #e1ce9c; font: 12px Georgia, serif; }
.bo-brand strong, .bo-brand small { display: block; }
.bo-brand strong { font: 600 10px Georgia, serif; letter-spacing: .18em; }
.bo-brand small { margin-top: 4px; color: #829c95; font-size: 6px; letter-spacing: .12em; }
.bo-sidebar nav { display: grid; gap: 3px; margin-top: 18px; }
.bo-sidebar nav span { min-height: 28px; padding: 0 7px; display: flex; align-items: center; gap: 7px; border-radius: 3px; color: #91aaa3; font-size: 8px; }
.bo-sidebar nav span b { flex: 1; font-weight: 500; }
.bo-sidebar nav span em { min-width: 15px; height: 15px; display: grid; place-items: center; border-radius: 10px; background: #c3a664; color: #173a32; font-size: 8px; font-style: normal; }
.bo-sidebar nav .is-active { background: #31534c; color: #fff; }
.bo-guard { display: flex; gap: 6px; margin-top: auto; padding: 9px 7px; border: 1px solid #3d5f57; border-radius: 4px; background: #1a3b34; }
.bo-guard > span { color: #d0b671; font-size: 9px; }
.bo-guard strong, .bo-guard small { display: block; }
.bo-guard strong { font-size: 7px; }
.bo-guard small { margin-top: 3px; color: #8fa69f; font-size: 6px; line-height: 1.35; }
.bo-workspace { min-width: 0; padding: 22px 24px 20px; background: #f5f6f3; }
.bo-heading { display: flex; align-items: end; justify-content: space-between; gap: 12px; }
.bo-heading > div > span, .bo-panel-head small, .bo-integrity > small { color: #8a7445; font-size: 7px; letter-spacing: .13em; }
.bo-heading h3 { margin: 6px 0 0; color: #193a34; font: 400 27px/1 Georgia, serif; letter-spacing: -.03em; }
.bo-heading > b { color: #60776c; font-size: 7px; font-weight: 500; }
.bo-metrics { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 7px; margin-top: 20px; }
.bo-metrics > div { min-width: 0; padding: 11px 10px; border: 1px solid #dbe1da; background: #fffefa; }
.bo-metrics small, .bo-metrics span { display: block; }
.bo-metrics small { color: #768679; font-size: 6px; letter-spacing: .1em; }
.bo-metrics strong { display: block; margin: 8px 0 4px; color: #193a34; font: 400 20px Georgia, serif; }
.bo-metrics span { color: #829287; font-size: 7px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.bo-metrics .needs-review { background: #fbf7eb; border-color: #ded1b1; }
.bo-metrics .needs-review strong { color: #98763d; }
.bo-board { display: grid; grid-template-columns: minmax(0, 1.45fr) minmax(150px, .72fr); gap: 10px; margin-top: 10px; }
.bo-queue, .bo-integrity { min-width: 0; border: 1px solid #dbe1da; background: #fffefa; }
.bo-panel-head { display: flex; justify-content: space-between; gap: 8px; align-items: end; padding: 12px 13px 10px; border-bottom: 1px solid #e1e6df; }
.bo-panel-head strong { display: block; margin-top: 4px; color: #27483f; font: 400 14px Georgia, serif; }
.bo-panel-head > span { color: #759274; font-size: 6px; white-space: nowrap; }
.bo-request { display: grid; grid-template-columns: minmax(0, 1fr) auto auto; align-items: center; gap: 8px; padding: 11px 13px; border-bottom: 1px solid #e4e8e2; }
.bo-request:last-child { border-bottom: 0; }
.bo-request b, .bo-request small { display: block; }
.bo-request b { color: #315348; font-size: 9px; }
.bo-request small { margin-top: 3px; color: #829188; font-size: 7px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.bo-request > strong { color: #2c5142; font: 400 13px Georgia, serif; white-space: nowrap; }
.bo-request em { padding: 4px 5px; border: 1px solid #dfd2b2; color: #98763d; background: #fbf7eb; font-size: 6px; font-style: normal; white-space: nowrap; }
.bo-request em.ready { border-color: #bdd0ba; color: #4e7657; background: #edf4ec; }
.bo-request em.muted { border-color: #d8dfd8; color: #75847a; background: #f3f5f1; }
.bo-integrity { padding: 13px; }
.bo-integrity > strong { display: block; margin: 9px 0 5px; color: #27483f; font: 400 23px Georgia, serif; }
.bo-integrity > p { margin: 0 0 17px; color: #76877b; font-size: 8px; line-height: 1.5; }
.integrity-line { height: 4px; margin-top: 9px; background: #e4e8e2; }
.integrity-line span { display: block; width: var(--level); height: 100%; background: #6e9476; }
.integrity-meta { display: flex; justify-content: space-between; margin-top: 4px; color: #86948a; font-size: 7px; }
.integrity-meta b { color: #416652; font-weight: 500; }
.bo-audit { margin-top: 23px; padding-top: 12px; border-top: 1px solid #e2e7e0; }
.bo-audit span, .bo-audit b, .bo-audit small { display: block; }
.bo-audit span { color: #8a7445; font-size: 6px; letter-spacing: .1em; }
.bo-audit b { margin-top: 7px; color: #315348; font-size: 8px; font-weight: 500; }
.bo-audit small { margin-top: 4px; color: #829188; font-size: 7px; }
.bo-frame .preview-disclaimer { padding: 10px 14px 12px; background: #eff2ed; border-top: 1px solid #d7ded5; color: #718276; font-size: 8px; letter-spacing: .02em; }

@media (max-width: 1050px) {
  .bo-frame { transform: none; }
  .bo-layout { grid-template-columns: 145px minmax(0, 1fr); }
  .bo-workspace { padding: 18px 15px; }
  .bo-board { grid-template-columns: 1fr; }
  .bo-integrity { display: grid; grid-template-columns: 1fr 1fr; column-gap: 14px; }
  .bo-integrity > p, .bo-integrity > small, .bo-integrity > strong { grid-column: 1 / -1; }
  .bo-audit { margin-top: 12px; }
}
@media (max-width: 900px) {
  .hero { height: auto; min-height: 0; max-height: none; }
  .hero-baseline { grid-template-columns: 1fr auto; gap: 15px; min-height: 70px; }
  .hero-baseline > a { justify-items: end; text-align: right; }
  .baseline-right { display: none; }
  .bo-frame { width: 100%; }
  .highwater { width: 100%; padding-left: 20px; padding-right: 20px; }
  .bo-layout { grid-template-columns: 1fr; min-height: 0; }
  .bo-sidebar { display: none; }
  .bo-windowbar { grid-template-columns: auto 1fr; }
  .bo-live { display: none; }
  .bo-workspace { padding: 17px 13px 15px; }
  .bo-heading h3 { font-size: 23px; }
  .bo-metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .bo-metrics strong { font-size: 18px; }
  .bo-request { grid-template-columns: minmax(0, 1fr) auto; }
  .bo-request em { grid-column: 1 / -1; justify-self: start; margin-top: -3px; }
  .bo-integrity { display: block; }
  .bo-audit { margin-top: 22px; }
}
@media (max-width: 420px) {
  .hero-baseline { margin-top: 20px; padding-top: 14px; }
  .hero-baseline > a strong { font-size: 8px; }
  .hero-baseline > a small, .baseline-tag { font-size: 8px; }
  .bo-metrics { gap: 5px; }
  .bo-metrics > div { padding: 9px 8px; }
  .bo-metrics strong { margin-top: 6px; font-size: 16px; }
  .bo-panel-head { display: block; }
  .bo-panel-head > span { display: block; margin-top: 8px; }
}

/* Client portal capture — deliberately mirrors the investor space, never the admin post. */
.bo-frame.client-capture {
  border-color: #bfc8ba;
  background: #f4f3ec;
  color: #193a34;
  transform: perspective(1400px) rotateY(5deg) rotateX(1deg);
}
.client-windowbar {
  min-height: 36px;
  padding: 0 15px;
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: center;
  gap: 12px;
  border-bottom: 1px solid #d7ddd5;
  background: #fffefa;
  color: #61736a;
  font-size: 8px;
  letter-spacing: .16em;
}
.client-dots { display: flex; gap: 5px; }
.client-dots i { width: 6px; height: 6px; display: block; border-radius: 50%; background: #c7cec3; }
.client-dots i:first-child { background: #b79a59; }
.client-lock { color: #6f896e; font-size: 7px; letter-spacing: .11em; }
.client-lock i { display: inline-block; width: 5px; height: 5px; margin-right: 4px; border-radius: 50%; background: #769a76; }
.client-layout { display: grid; grid-template-columns: 142px minmax(0, 1fr); min-height: 495px; }
.client-sidebar { display: flex; flex-direction: column; padding: 17px 11px 13px; background: #102f2a; color: #dce6e2; }
.client-brand { display: flex; align-items: center; gap: 8px; padding: 0 5px 15px; border-bottom: 1px solid #31504a; }
.client-brand > span { width: 28px; height: 28px; display: grid; place-items: center; border: 1px solid #c4a965; color: #e1ce9c; font: 12px Georgia, serif; }
.client-brand strong, .client-brand small { display: block; }
.client-brand strong { font: 600 10px Georgia, serif; letter-spacing: .16em; }
.client-brand small { margin-top: 4px; color: #829c95; font-size: 6px; letter-spacing: .1em; }
.client-sidebar nav { display: grid; gap: 3px; margin-top: 18px; }
.client-sidebar nav span { min-height: 28px; padding: 0 7px; display: flex; align-items: center; gap: 7px; border-radius: 3px; color: #91aaa3; font-size: 8px; }
.client-sidebar nav span b { flex: 1; font-weight: 500; }
.client-sidebar nav .is-active { background: #31534c; color: #fff; }
.client-user { display: flex; align-items: center; gap: 7px; margin-top: auto; padding: 12px 5px 0; border-top: 1px solid #31504a; }
.client-user > span { width: 25px; height: 25px; display: grid; place-items: center; border-radius: 50%; background: #e9e4d5; color: #24463e; font: 11px Georgia, serif; }
.client-user small, .client-user strong { display: block; }
.client-user small { color: #829b94; font-size: 6px; letter-spacing: .08em; }
.client-user strong { margin-top: 3px; color: #eef0e3; font-size: 8px; font-weight: 500; }
.client-brand.official-client-brand { display: block; padding: 0 5px 14px; }
.client-brand.official-client-brand img { display: block; width: 86px; height: 86px; margin: -10px auto -7px; object-fit: contain; }
.client-brand.official-client-brand > span { width: auto; height: auto; display: block; border: 0; color: #829c95; font: 500 6px/1.3 var(--sans); letter-spacing: .12em; text-align: center; }
.client-workspace { min-width: 0; padding: 20px 21px 17px; background: #f5f6f3; }
.client-heading { display: flex; align-items: end; justify-content: space-between; gap: 12px; }
.client-heading > div > span, .client-panel-head small { color: #8a7445; font-size: 7px; letter-spacing: .13em; }
.client-heading h3 { margin: 5px 0 0; color: #193a34; font: 400 25px/1 Georgia, serif; letter-spacing: -.03em; }
.client-heading p { margin: 5px 0 0; color: #718177; font-size: 8px; }
.client-heading > b { align-self: start; padding: 7px 8px; border: 1px solid #d7c89f; background: #faf6ec; color: #80683b; font-size: 7px; font-weight: 500; white-space: nowrap; }
.client-hero-grid { display: grid; grid-template-columns: minmax(0, 1.17fr) minmax(135px, .83fr); gap: 8px; margin-top: 18px; }
.client-portfolio-card, .client-metric, .client-panel { min-width: 0; border: 1px solid #dbe1da; background: #fffefa; }
.client-portfolio-card { padding: 12px 13px 10px; }
.client-card-top { display: flex; justify-content: space-between; gap: 6px; color: #768679; font-size: 6px; letter-spacing: .1em; }
.client-card-top small { color: #729074; white-space: nowrap; }
.client-card-top small i { display: inline-block; width: 4px; height: 4px; margin-right: 3px; border-radius: 50%; background: #769a76; }
.client-value { display: block; margin-top: 10px; color: #193a34; font: 400 28px/1 Georgia, serif; letter-spacing: -.03em; }
.client-gain { margin-top: 6px; color: #4e7657; font-size: 9px; font-weight: 600; }
.client-gain small { margin-left: 4px; color: #7d8d80; font-size: 7px; font-weight: 400; }
.client-chart { display: block; width: 100%; height: 107px; margin-top: 11px; overflow: visible; }
.client-chart .chart-grid { stroke: #dfe5dd; stroke-width: 1; }
.client-chart .chart-area { fill: #8aae8c33; }
.client-chart .chart-line { fill: none; stroke: #4e7657; stroke-width: 2.5; stroke-linecap: round; }
.client-chart circle { fill: #4e7657; }
.client-periods { display: flex; justify-content: space-between; color: #8a978d; font-size: 6px; letter-spacing: .05em; }
.client-side-metrics { display: grid; gap: 8px; }
.client-metric { padding: 11px 11px 9px; }
.client-metric small, .client-metric span { display: block; }
.client-metric small { color: #768679; font-size: 6px; letter-spacing: .08em; }
.client-metric strong { display: block; margin: 7px 0 4px; color: #315348; font: 400 18px/1 Georgia, serif; }
.client-metric span { color: #829188; font-size: 7px; }
.client-metric.featured { background: #edf4ec; border-color: #bdd0ba; }
.client-metric.featured strong { color: #416b4c; }
.client-metric.profit { background: #fbf7eb; border-color: #ded1b1; }
.client-metric.profit strong { color: #98763d; }
.client-lower-grid { display: grid; grid-template-columns: minmax(0, 1.17fr) minmax(135px, .83fr); gap: 8px; margin-top: 8px; }
.client-panel { padding: 12px 13px 9px; }
.client-panel-head { display: flex; justify-content: space-between; align-items: end; gap: 8px; padding-bottom: 9px; border-bottom: 1px solid #e1e6df; }
.client-panel-head strong { display: block; margin-top: 4px; color: #315348; font: 400 14px Georgia, serif; }
.client-panel-head > b { color: #8a7445; font-size: 7px; font-weight: 500; white-space: nowrap; }
.client-capital-bar { display: flex; height: 6px; margin: 12px 0 8px; background: #edf0e9; }
.client-capital-bar i:first-child { width: 80%; background: #7b9b7c; }
.client-capital-bar i:last-child { width: 20%; background: #d5b66f; }
.client-legend { display: flex; justify-content: space-between; gap: 8px; color: #7c8b80; font-size: 6px; }
.client-legend > span { white-space: nowrap; }
.client-legend i { display: inline-block; width: 5px; height: 5px; margin-right: 4px; border-radius: 50%; background: #7b9b7c; }
.client-legend > span:last-child i { background: #d5b66f; }
.client-legend b { margin-left: 2px; color: #3d5f4a; font-weight: 500; }
.client-lot { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 3px 8px; padding: 9px 0 7px; border-top: 1px solid #e5e9e3; }
.client-lot:first-of-type { margin-top: 9px; }
.client-lot span { color: #537264; font-size: 7px; }
.client-lot b { color: #315348; font: 400 11px Georgia, serif; white-space: nowrap; }
.client-lot small { grid-column: 1 / -1; color: #829188; font-size: 6px; }
.client-activity > div { display: grid; grid-template-columns: 18px minmax(0, 1fr) auto; gap: 7px; align-items: center; padding: 11px 0; border-bottom: 1px solid #e5e9e3; }
.client-activity > div:last-child { border-bottom: 0; }
.client-activity > div > span { width: 18px; height: 18px; display: grid; place-items: center; border-radius: 50%; background: #edf4ec; color: #4e7657; font-size: 9px; }
.client-activity p, .client-activity strong, .client-activity small { margin: 0; display: block; }
.client-activity strong { color: #36584a; font-size: 7px; font-weight: 600; }
.client-activity small { margin-top: 3px; color: #829188; font-size: 6px; }
.client-activity > div > b { color: #4e7657; font: 400 10px Georgia, serif; white-space: nowrap; }
.client-activity em { padding: 3px 4px; border: 1px solid #d7c89f; color: #98763d; background: #fbf7eb; font-size: 6px; font-style: normal; }
.client-note { padding: 9px 13px 11px; border-top: 1px solid #d7ded5; background: #eff2ed; color: #718276; font-size: 8px; letter-spacing: .02em; }

@media (max-width: 1050px) {
  .bo-frame.client-capture { transform: none; }
  .client-layout { grid-template-columns: 125px minmax(0, 1fr); }
  .client-workspace { padding: 17px 14px 15px; }
  .client-heading h3 { font-size: 22px; }
  .client-lower-grid { grid-template-columns: 1fr; }
}
@media (max-width: 900px) {
  .client-layout { grid-template-columns: 1fr; min-height: 0; }
  .client-sidebar { display: none; }
  .client-windowbar { grid-template-columns: auto 1fr; }
  .client-lock { display: none; }
  .wordmark.official-logo { width: 72px; height: 58px; }
  .wordmark.official-logo img { width: 78px; height: 78px; margin: -10px -3px 0; }
  .client-workspace { padding: 16px 12px 14px; }
  .client-heading { display: block; }
  .client-heading > b { display: inline-block; margin-top: 9px; }
  .client-hero-grid { grid-template-columns: 1fr; }
  .client-side-metrics { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .client-metric { padding: 9px 8px; }
  .client-metric strong { font-size: 16px; }
  .client-metric span { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
}
@media (max-width: 420px) {
  .client-heading h3 { font-size: 21px; }
  .client-side-metrics { grid-template-columns: 1fr 1fr; }
  .client-metric.profit { grid-column: 1 / -1; }
  .client-value { font-size: 26px; }
  .client-legend { display: block; line-height: 1.8; }
  .client-legend > span { display: block; }
  .client-activity > div { grid-template-columns: 18px minmax(0, 1fr); }
  .client-activity > div > b, .client-activity em { grid-column: 2; justify-self: start; }
}