@font-face{
  font-family:"Fraunces";
  src:url("../fonts/fraunces-latin.woff2") format("woff2");
  font-weight:300 900;
  font-style:normal;
  font-display:swap;
}

@font-face{
  font-family:"Archivo";
  src:url("../fonts/archivo-latin.woff2") format("woff2");
  font-weight:100 900;
  font-style:normal;
  font-display:swap;
}

@font-face{
  font-family:"JetBrains Mono";
  src:url("../fonts/jetbrainsmono-latin.woff2") format("woff2");
  font-weight:100 800;
  font-style:normal;
  font-display:swap;
}

.data-scene{
  color:var(--ink);
}

.economy-module .scene__inner,
.ecosystem-module .scene__inner{
  justify-content:flex-start;
}

.data-layout{
  display:grid;
  gap:18px;
}

.economy-module .scene__body,
.ecosystem-module .scene__body{
  width:100%;
  max-width:none;
}

.economy-layout{
  grid-template-columns:minmax(280px,.55fr) minmax(0,1.45fr);
  grid-template-areas:
    "toolbar focus"
    "path path"
    "detail detail"
    "panels panels";
  gap:clamp(10px,1.6vh,16px) clamp(16px,2vw,28px);
  align-items:stretch;
}

.data-toolbar{
  grid-area:toolbar;
  display:grid;
  align-content:center;
  gap:12px;
  padding:14px;
  border:1px solid var(--rule);
  border-radius:8px;
  background:rgba(251,250,246,.82);
  box-shadow:var(--shadow-1);
  min-height:148px;
}

.data-control{
  display:flex;
  align-items:center;
  gap:6px;
  flex-wrap:wrap;
}

.data-control__label,
.economy-summary__kicker,
.ecosystem-detail__kicker,
.economy-card__tag{
  font-family:var(--mono);
  font-size:.68rem;
  line-height:1;
  letter-spacing:0;
  text-transform:uppercase;
  color:var(--ink-mute);
}

.data-pill{
  min-width:42px;
  min-height:34px;
  border:1px solid var(--rule);
  border-radius:999px;
  background:var(--paper-2);
  color:var(--ink-soft);
  font:700 .78rem/1 var(--mono);
  cursor:pointer;
  transition:background var(--dur-fast) var(--ease), border-color var(--dur-fast) var(--ease), color var(--dur-fast) var(--ease);
}

.data-pill:hover,
.data-pill:focus-visible,
.data-pill.is-active,
.data-pill.is-selected{
  border-color:var(--accent);
  background:var(--accent-tint);
  color:var(--accent-ink);
  outline:none;
}

.data-note{
  margin:0;
  max-width:560px;
  color:var(--ink-mute);
  font:500 .78rem/1.35 var(--sans);
}

.economy-focus{
  grid-area:focus;
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(270px,.68fr);
  gap:10px clamp(18px,2.4vw,32px);
  align-items:stretch;
  padding:clamp(16px,2vw,24px);
  border:1px solid var(--rule);
  border-left:4px solid var(--accent);
  border-radius:8px;
  background:var(--paper-2);
  box-shadow:var(--shadow-1);
  min-height:148px;
}

.economy-summary{
  grid-area:focus;
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(250px,.62fr);
  gap:8px 18px;
  align-items:end;
  padding:clamp(16px,2vw,24px);
  border:1px solid var(--rule);
  border-left:4px solid var(--accent);
  border-radius:8px;
  background:var(--paper-2);
  box-shadow:var(--shadow-1);
  min-height:148px;
}

.economy-summary strong{
  color:var(--ink);
  font:760 clamp(1.25rem,1.8vw,1.74rem)/1.05 var(--display);
}

.economy-summary span:last-of-type{
  color:var(--accent-ink);
  font:900 clamp(1.08rem,1.6vw,1.7rem)/1 var(--mono);
  text-align:right;
  overflow-wrap:anywhere;
}

.economy-summary small{
  grid-column:1 / -1;
  padding-top:10px;
  border-top:1px solid var(--rule-soft);
  color:var(--ink-soft);
  font:500 .9rem/1.38 var(--sans);
}

.economy-focus__text{
  display:grid;
  align-content:center;
  gap:6px;
}

.economy-focus__text h3{
  margin:0;
  color:var(--ink);
  font:760 clamp(1.35rem,2.1vw,2rem)/1.04 var(--display);
}

.economy-focus__text p,
.economy-focus__cohort{
  margin:0;
  color:var(--ink-soft);
  font:500 .9rem/1.38 var(--sans);
}

.economy-focus__amount{
  display:grid;
  align-content:center;
  gap:7px;
  padding:14px 16px;
  border:1px solid rgba(23,114,124,.2);
  border-radius:8px;
  background:var(--data-tint);
}

.economy-focus__amount span,
.economy-focus__amount small{
  color:var(--ink-mute);
  font:800 .68rem/1.2 var(--mono);
  letter-spacing:0;
  text-transform:uppercase;
}

.economy-focus__amount strong{
  overflow-wrap:anywhere;
  color:var(--accent-ink);
  font:900 clamp(1.24rem,2.2vw,2.25rem)/1 var(--mono);
}

.economy-focus__cohort{
  grid-column:1 / -1;
  padding-top:10px;
  border-top:1px solid var(--rule-soft);
}

.economy-path,
.economy-grid{
  grid-area:path;
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:clamp(10px,1.5vw,16px);
}

.economy-card{
  border:1px solid var(--rule);
  border-radius:8px;
  background:var(--paper-2);
  overflow:hidden;
  box-shadow:var(--shadow-1);
}

.economy-card.is-primary{
  border-color:rgba(210,39,48,.42);
}

.economy-card.is-selected{
  box-shadow:inset 0 0 0 2px rgba(210,39,48,.24), var(--shadow-1);
}

.economy-card.is-open{
  border-color:rgba(210,39,48,.52);
}

.economy-card__head{
  width:100%;
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  grid-template-areas:
    "tag cue"
    "title title"
    "range range";
  gap:8px 12px;
  min-height:112px;
  padding:14px 16px;
  border:0;
  background:transparent;
  color:inherit;
  text-align:left;
  cursor:pointer;
}

.economy-card__tag{
  grid-area:tag;
}

.economy-card__title{
  grid-area:title;
  font:740 clamp(1rem,1.15vw,1.16rem)/1.12 var(--display);
  color:var(--ink);
}

.economy-card__range{
  grid-area:range;
  color:var(--ink-mute);
  font:800 .78rem/1.2 var(--mono);
  overflow-wrap:anywhere;
}

.economy-card__cue{
  grid-area:cue;
  justify-self:end;
  align-self:start;
  color:var(--data);
  font:800 .62rem/1 var(--mono);
  text-transform:uppercase;
}

.economy-card.is-selected .economy-card__range,
.economy-card.is-open .economy-card__range{
  color:var(--accent-ink);
}

.panel__body[hidden]{
  display:none !important;
}

.economy-detail-stack{
  grid-area:detail;
}

.economy-detail,
.economy-card__body{
  padding:14px 16px 16px;
  border:1px solid rgba(210,39,48,.18);
  border-left:4px solid var(--accent);
  border-radius:8px;
  background:rgba(251,250,246,.9);
  box-shadow:var(--shadow-1);
}

.economy-card__body{
  border-top:1px solid var(--rule-soft);
  border-left:0;
  border-radius:0;
  box-shadow:none;
  background:rgba(239,235,225,.34);
}

.economy-detail__head{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:4px 18px;
  align-items:end;
  margin-bottom:12px;
}

.economy-detail__head h3{
  grid-column:1;
  margin:0;
  color:var(--ink);
  font:740 1.18rem/1.08 var(--display);
}

.economy-detail__head strong{
  grid-row:1 / span 2;
  grid-column:2;
  color:var(--accent-ink);
  font:900 .94rem/1.12 var(--mono);
  text-align:right;
  overflow-wrap:anywhere;
}

.economy-facts{
  display:grid;
  gap:10px;
  margin:0;
}

.economy-facts--grid{
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:12px 16px;
}

.economy-facts div,
.ecosystem-detail__facts div{
  display:grid;
  gap:3px;
}

.economy-facts dt,
.ecosystem-detail__facts dt{
  color:var(--ink-mute);
  font:700 .67rem/1 var(--mono);
  letter-spacing:0;
  text-transform:uppercase;
}

.economy-facts dd,
.ecosystem-detail__facts dd{
  margin:0;
  color:var(--ink-soft);
  font:500 .88rem/1.42 var(--sans);
}

.data-panel-row{
  grid-area:panels;
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:clamp(10px,1.5vw,16px);
}

.data-panel{
  border:1px solid var(--rule);
  border-radius:8px;
  background:var(--paper-2);
  overflow:hidden;
  box-shadow:var(--shadow-1);
}

.data-panel__toggle{
  width:100%;
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:16px;
  min-height:50px;
  padding:12px 16px;
  border:0;
  background:transparent;
  color:var(--ink);
  text-align:left;
  cursor:pointer;
  font:700 .98rem/1.2 var(--sans);
}

.data-panel__toggle strong{
  color:var(--data);
  font:800 .8rem/1.2 var(--mono);
  text-align:right;
}

.data-panel__body{
  padding:14px 16px 16px;
  border-top:1px solid var(--rule-soft);
  max-height:34vh;
  overflow:auto;
}

.phase-table{
  width:100%;
  border-collapse:collapse;
  color:var(--ink-soft);
  font:500 .78rem/1.35 var(--sans);
}

.phase-table th{
  color:var(--ink);
  font:800 .64rem/1 var(--mono);
  letter-spacing:0;
  text-transform:uppercase;
  text-align:left;
}

.phase-table th,
.phase-table td{
  padding:10px 8px;
  border-bottom:1px solid var(--rule-soft);
  vertical-align:top;
}

.phase-table td:first-child,
.phase-table td:nth-child(4){
  color:var(--data);
  font-family:var(--mono);
  font-weight:800;
}

.conversation-list{
  margin:0;
  padding-left:20px;
  color:var(--ink-soft);
  font:500 .9rem/1.45 var(--sans);
}

.conversation-list li + li{
  margin-top:8px;
}

.ecosystem-layout{
  grid-template-columns:minmax(0,1.25fr) minmax(280px,.58fr);
  align-items:start;
  gap:clamp(14px,2vw,26px);
}

.ecosystem-stage{
  position:relative;
  min-height:0;
  isolation:isolate;
}

#p-vision-ecosistema{
  display:grid;
  grid-template-columns:minmax(0,1fr);
  gap:14px;
  align-items:start;
  max-height:min(72vh,680px);
  overflow:auto;
  padding:clamp(14px,2vw,22px);
  border:1px solid var(--rule);
  border-radius:8px;
  background:var(--paper-2);
  box-shadow:var(--shadow-1);
  isolation:isolate;
}

#p-vision-ecosistema > h3{
  grid-column:1 / -1;
  margin-top:0;
}

#p-vision-ecosistema .ed-slot--mapa{
  grid-column:1;
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(250px,.42fr);
  gap:14px;
  align-items:start;
  padding:14px;
  border-radius:8px;
  background:var(--paper-2);
  overflow:hidden;
}

#p-vision-ecosistema .ed-slot--mapa .ecosystem-stage{
  grid-column:1;
}

#p-vision-ecosistema .ed-slot--mapa .ecosystem-detail{
  grid-column:2;
  grid-row:1;
}

#p-vision-ecosistema > p{
  grid-column:1 / -1;
  margin:0;
}

.ecosystem-figure{
  margin:0;
  position:relative;
  border:1px solid var(--rule);
  border-radius:8px;
  background:var(--paper-2);
  overflow:hidden;
  box-shadow:var(--shadow-1);
  isolation:isolate;
}

.ecosystem-map{
  position:relative;
  width:100%;
  aspect-ratio:1200 / 760;
  overflow:hidden;
  background:var(--paper-2);
}

.ecosystem-figure img,
.data-visual-strip img{
  display:block;
  width:100%;
  height:auto;
}

.ecosystem-map img{
  height:100%;
  object-fit:contain;
}

.ecosystem-figure figcaption,
.data-visual-strip figcaption{
  padding:10px 12px 12px;
  color:var(--ink-soft);
  font:500 .82rem/1.35 var(--sans);
}

.ecosystem-caption{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  flex-wrap:wrap;
}

.ecosystem-caption > span:first-child{
  flex:1 1 320px;
}

.ecosystem-legend{
  display:flex;
  align-items:center;
  gap:10px;
  flex:0 0 auto;
  color:var(--ink-mute);
  font:800 .66rem/1 var(--mono);
  letter-spacing:0;
  text-transform:uppercase;
}

.ecosystem-legend b{
  display:inline-flex;
  align-items:center;
  gap:5px;
  font:inherit;
}

.ecosystem-legend b::before{
  content:"";
  width:8px;
  height:8px;
  border-radius:999px;
  background:var(--node-color,var(--data));
}

#p-vision-ecosistema .ecosystem-figure figcaption:not(:has(.ecosystem-legend)){
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  flex-wrap:wrap;
}

#p-vision-ecosistema .ecosystem-figure figcaption:not(:has(.ecosystem-legend))::after{
  content:"MVP | Fase 2 | Horizonte";
  flex:0 0 auto;
  padding:6px 8px;
  border:1px solid var(--rule);
  border-radius:8px;
  background:rgba(251,250,246,.88);
  color:var(--ink-mute);
  font:800 .66rem/1 var(--mono);
  letter-spacing:0;
  text-transform:uppercase;
}

.ecosystem-hotspots{
  position:absolute;
  inset:0;
  pointer-events:none;
}

.ecosystem-stage > .ecosystem-hotspots{
  inset:0 auto auto 0;
  width:100%;
  aspect-ratio:1200 / 760;
}

.ecosystem-hotspot{
  --node-color:var(--data);
  position:absolute;
  left:var(--x);
  top:var(--y);
  transform:translate(-50%,-50%);
  width:clamp(34px,3.4vw,54px);
  height:clamp(34px,3.4vw,54px);
  min-width:0;
  max-width:none;
  min-height:0;
  padding:0;
  border:1.5px solid color-mix(in srgb, var(--node-color) 42%, transparent);
  border-radius:999px;
  background:rgba(251,250,246,.05);
  color:transparent;
  font-size:0;
  line-height:0;
  box-shadow:inset 0 0 0 1px rgba(251,250,246,.38);
  cursor:pointer;
  overflow:hidden;
  pointer-events:auto;
  transition:transform var(--dur-fast) var(--ease), border-color var(--dur-fast) var(--ease), background var(--dur-fast) var(--ease), color var(--dur-fast) var(--ease);
}

.ecosystem-hotspot span{
  position:absolute;
  width:1px;
  height:1px;
  padding:0;
  margin:-1px;
  overflow:hidden;
  clip-path:inset(50%);
  white-space:nowrap;
  border:0;
}

.ecosystem-hotspot.is-small{
  width:clamp(28px,2.8vw,44px);
  height:clamp(28px,2.8vw,44px);
}

.ecosystem-hotspot.is-center{
  width:clamp(58px,5.8vw,90px);
  height:clamp(58px,5.8vw,90px);
  border-color:rgba(210,39,48,.52);
  background:rgba(30,58,99,.04);
}

.ecosystem-hotspot.is-stage-mvp,
.ecosystem-hotspot[data-node="camara"],
.ecosystem-hotspot[data-node="corredores"],
.ecosystem-hotspot[data-node="propiedades"],
.ecosystem-hotspot[data-node="academia"],
.ecosystem-hotspot[data-node="datos"],
.ecosystem-legend .is-stage-mvp{
  --node-color:var(--accent);
}

.ecosystem-hotspot.is-stage-fase2,
.ecosystem-hotspot[data-node="agencias"],
.ecosystem-hotspot[data-node="inversionistas"],
.ecosystem-hotspot[data-node="abogados"],
.ecosystem-hotspot[data-node="valuadores"],
.ecosystem-hotspot[data-node="ia"],
.ecosystem-hotspot[data-node="servicios"],
.ecosystem-legend .is-stage-fase2{
  --node-color:var(--data);
}

.ecosystem-hotspot.is-stage-horizonte,
.ecosystem-hotspot[data-node="compradores"],
.ecosystem-hotspot[data-node="vendedores"],
.ecosystem-hotspot[data-node="bancos"],
.ecosystem-hotspot[data-node="notarias"],
.ecosystem-hotspot[data-node="aseguradoras"],
.ecosystem-legend .is-stage-horizonte{
  --node-color:var(--gold);
}

.ecosystem-hotspot:hover,
.ecosystem-hotspot:focus-visible,
.ecosystem-hotspot.is-active{
  border-color:var(--accent);
  background:rgba(210,39,48,.12);
  box-shadow:0 0 0 4px rgba(210,39,48,.12), inset 0 0 0 1px rgba(251,250,246,.62);
  outline:none;
  transform:translate(-50%,-50%) scale(1.06);
}

.ecosystem-detail{
  border:1px solid var(--rule);
  border-radius:8px;
  background:var(--paper-2);
  padding:clamp(18px,2vw,28px);
  box-shadow:var(--shadow-1);
  max-height:min(58vh,520px);
  overflow:auto;
  position:relative;
  z-index:1;
  isolation:isolate;
}

.ecosystem-detail h3{
  margin:.35rem 0 1rem;
  color:var(--ink);
  font:700 1.35rem/1.05 var(--display);
}

.ecosystem-detail__facts{
  display:grid;
  gap:14px;
  margin:0;
}

#p-vision-ecosistema .ecosystem-detail{
  grid-column:2;
  grid-row:2;
  margin-top:0;
}

#p-vision-ecosistema .ecosystem-detail.panel__body:not([hidden]){
  position:relative;
  inset:auto;
  display:block;
  max-block-size:min(58vh,520px);
  animation:none;
}

.data-visual-strip{
  grid-column:1 / -1;
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:14px;
}

.data-visual-strip figure{
  margin:0;
  border:1px solid var(--rule);
  border-radius:8px;
  background:var(--paper-2);
  overflow:hidden;
  box-shadow:var(--shadow-1);
}

@media (max-width:980px){
  .economy-layout,
  .economy-focus,
  .economy-summary,
  .economy-grid,
  .economy-path,
  .data-panel-row,
  .ecosystem-layout,
  .data-visual-strip{
    grid-template-columns:1fr;
  }

  .economy-layout{
    grid-template-areas:
      "toolbar"
      "focus"
      "path"
      "detail"
      "panels";
  }

  .data-toolbar,
  .economy-focus,
  .economy-summary{
    min-height:auto;
  }

  .economy-summary span:last-of-type{
    text-align:left;
  }

  .economy-detail__head,
  .economy-facts--grid{
    grid-template-columns:1fr 1fr;
  }

  .economy-detail__head strong{
    grid-row:auto;
    grid-column:auto;
    text-align:left;
  }

  .ecosystem-stage{
    min-height:440px;
  }

  #p-vision-ecosistema .ed-slot--mapa{
    grid-column:1;
    grid-template-columns:1fr;
  }

  #p-vision-ecosistema{
    grid-template-columns:1fr;
  }

  #p-vision-ecosistema .ed-slot--mapa .ecosystem-detail,
  #p-vision-ecosistema .ecosystem-detail{
    grid-column:1;
    grid-row:auto;
  }
}

@media (max-width:640px){
  .economy-module .scene__title{
    font-size:1.55rem;
    line-height:1.06;
  }

  .economy-module .scene__lead{
    display:none;
  }

  .data-toolbar{
    align-items:stretch;
    padding:10px;
    gap:8px;
  }

  .data-control{
    width:100%;
    flex-wrap:wrap;
    gap:5px;
  }

  .data-pill{
    min-width:38px;
    min-height:30px;
    font-size:.7rem;
  }

  .data-note{
    margin-left:0;
    font-size:.68rem;
    line-height:1.25;
    max-width:100%;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
  }

  .economy-layout{
    gap:10px;
  }

  .economy-focus{
    padding:10px;
    gap:8px;
  }

  .economy-focus__amount{
    padding:8px 10px;
  }

  .economy-focus__amount strong{
    font-size:1.1rem;
  }

  .economy-focus__text p{
    display:none;
  }

  .economy-focus__cohort{
    padding-top:7px;
    font-size:.75rem;
    line-height:1.25;
    display:-webkit-box;
    -webkit-line-clamp:2;
    -webkit-box-orient:vertical;
    overflow:hidden;
  }

  .economy-path,
  .economy-grid{
    grid-template-columns:repeat(3,minmax(190px,1fr));
    overflow-x:auto;
    padding-bottom:2px;
  }

  .economy-card__head{
    min-height:84px;
    padding:10px 12px;
    gap:5px 10px;
  }

  .economy-card__cue{
    display:none;
  }

  .economy-detail,
  .economy-card__body{
    padding:12px;
  }

  .economy-detail__head,
  .economy-facts--grid{
    grid-template-columns:1fr;
  }

  .data-panel-row{
    grid-template-columns:repeat(2,minmax(210px,1fr));
    overflow-x:auto;
    padding-bottom:2px;
  }

  .data-panel__toggle{
    min-height:40px;
    padding:8px 10px;
    font-size:.82rem;
  }

  .phase-table{
    display:block;
    overflow-x:auto;
    white-space:nowrap;
  }

  #p-vision-ecosistema{
    max-height:62vh;
    padding:12px;
  }

  .ecosystem-stage{
    min-height:0;
  }

  .ecosystem-caption{
    align-items:flex-start;
    gap:8px;
  }

  .ecosystem-legend{
    width:100%;
    justify-content:space-between;
    gap:6px;
  }

  #p-vision-ecosistema .ecosystem-figure figcaption:not(:has(.ecosystem-legend))::after{
    width:100%;
    box-sizing:border-box;
    text-align:center;
  }

  .ecosystem-hotspot{
    width:28px;
    height:28px;
    color:transparent;
    font-size:0;
  }

  .ecosystem-hotspot.is-small{
    width:24px;
    height:24px;
  }

  .ecosystem-hotspot.is-center{
    width:44px;
    height:44px;
  }

  .ecosystem-detail{
    max-height:36vh;
    padding:14px;
  }
}