/* ============================================================
   Participant — figure & colour system
   Extends the core brand (pine / harvest gold / bone) with a
   disciplined accent set so diagrams can carry meaning by colour.
   ============================================================ */
:root{
  --f-pine:#143A2E;      --f-pine-t:#E8F0EB;
  --f-sage:#2E6F5E;      --f-sage-t:#E4F1EC;
  --f-gold:#B6892B;      --f-gold-t:#FAF0DC;
  --f-gold-d:#8A6716;
  --f-clay:#A65A3A;      --f-clay-t:#F8ECE6;
  --f-slate:#3F5E78;     --f-slate-t:#EAF0F5;
  --f-plum:#6B4A6B;      --f-plum-t:#F2EBF2;
  --f-line:#E7E0D0;
  --f-ink:#15352A;
  --f-body:#3d4741;
  --f-mut:#6F6959;
}

/* ---------- section rhythm (fixes cramped spacing) ---------- */
.fig-sec{padding:60px 0 8px}
.fig-sec + .fig-sec{padding-top:52px}
.fig-lead{max-width:62ch;font-size:16.5px;line-height:1.7;color:var(--f-body);margin-top:14px}
.fig-cap{font-size:12px;color:var(--f-mut);line-height:1.6;margin-top:16px;max-width:78ch}

/* ---------- ownership chain ---------- */
.chain{margin-top:34px}
.chain-row{display:grid;grid-template-columns:186px 1fr;gap:26px;align-items:stretch}
.chain-tier{display:flex;flex-direction:column;align-items:center;justify-content:center;
  border-radius:18px;padding:20px 16px;text-align:center;color:#fff;position:relative;min-height:120px}
.chain-tier .lv{font-family:'IBM Plex Mono',monospace;font-size:10.5px;letter-spacing:.09em;
  text-transform:uppercase;opacity:.8;margin-bottom:7px}
.chain-tier .nm{font-size:16.5px;font-weight:800;line-height:1.25}
.chain-tier .sub{font-size:11.5px;opacity:.88;margin-top:5px;line-height:1.45}
.t-you{background:linear-gradient(150deg,#3F5E78,#4E7391)}
.t-unit{background:linear-gradient(150deg,#B6892B,#CBA24C)}
.t-fund{background:linear-gradient(150deg,#143A2E,#1F5544)}
.t-spv{background:linear-gradient(150deg,#2E6F5E,#3C8A75)}
.t-asset{background:linear-gradient(150deg,#A65A3A,#C0714E)}
.chain-body{background:#fff;border:1.5px solid var(--f-line);border-radius:18px;padding:20px 24px}
.chain-body h4{font-size:15.5px;font-weight:800;color:var(--f-ink);margin-bottom:7px}
.chain-body p{font-size:13.5px;color:var(--f-body);line-height:1.65}
.chain-body .instr{display:inline-block;font-family:'IBM Plex Mono',monospace;font-size:10.5px;
  letter-spacing:.05em;text-transform:uppercase;padding:4px 10px;border-radius:999px;margin-top:11px}
.i-you{background:var(--f-slate-t);color:var(--f-slate)}
.i-unit{background:var(--f-gold-t);color:var(--f-gold-d)}
.i-fund{background:var(--f-pine-t);color:var(--f-pine)}
.i-spv{background:var(--f-sage-t);color:var(--f-sage)}
.i-asset{background:var(--f-clay-t);color:var(--f-clay)}
.chain-link{display:grid;grid-template-columns:186px 1fr;gap:26px;align-items:center;padding:9px 0}
.chain-link .arr{display:flex;align-items:center;justify-content:center;gap:9px;color:var(--f-mut);
  font-size:12px;font-weight:700}
.chain-link .arr .bar{width:2px;height:24px;background:var(--f-line);border-radius:2px}
.chain-link .txt{font-size:12.5px;color:var(--f-mut);font-weight:600}
.chain-back{margin-top:26px;background:var(--f-sage-t);border:1.5px solid #CFE3DA;border-radius:16px;
  padding:18px 22px;font-size:13.5px;color:var(--f-ink);line-height:1.65}
.chain-back b{color:var(--f-sage)}

/* ---------- own / don't own ---------- */
.own2{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-top:30px}
.ownc{border-radius:18px;padding:24px 26px;border:1.5px solid}
.ownc.yes{background:var(--f-sage-t);border-color:#CFE3DA}
.ownc.no{background:var(--f-clay-t);border-color:#EED9CE}
.ownc h4{font-size:16.5px;font-weight:800;margin-bottom:4px}
.ownc.yes h4{color:var(--f-sage)}.ownc.no h4{color:var(--f-clay)}
.ownc .hint{font-size:12px;color:var(--f-mut);margin-bottom:14px}
.ownc ul{list-style:none;margin:0;padding:0}
.ownc li{display:flex;gap:10px;padding:9px 0;border-top:1px solid rgba(0,0,0,.06);font-size:13.5px;
  color:var(--f-body);line-height:1.55}
.ownc li:first-child{border-top:none}
.ownc li i{font-style:normal;font-weight:800;flex:none}
.ownc.yes li i{color:var(--f-sage)}.ownc.no li i{color:var(--f-clay)}

/* ---------- money flow ---------- */
.flow{display:grid;grid-template-columns:repeat(4,1fr);gap:0;margin-top:32px;align-items:stretch}
.flow-n{background:#fff;border:1.5px solid var(--f-line);border-radius:16px;padding:20px 18px;position:relative}
.flow-n .cap{font-family:'IBM Plex Mono',monospace;font-size:10px;letter-spacing:.08em;text-transform:uppercase;
  margin-bottom:8px;display:block}
.flow-n h4{font-size:15px;font-weight:800;color:var(--f-ink);margin-bottom:6px}
.flow-n p{font-size:12.5px;color:var(--f-body);line-height:1.55}
.flow-n.c1{border-color:#EED9CE}.flow-n.c1 .cap{color:var(--f-clay)}
.flow-n.c2{border-color:#CFE3DA}.flow-n.c2 .cap{color:var(--f-sage)}
.flow-n.c3{border-color:#CBDCE9}.flow-n.c3 .cap{color:var(--f-slate)}
.flow-n.c4{border-color:#E8D5AC}.flow-n.c4 .cap{color:var(--f-gold-d)}
.flow-a{display:flex;align-items:center;justify-content:center;padding:0 6px}
.flow-a span{display:flex;flex-direction:column;align-items:center;gap:4px;color:var(--f-mut);
  font-size:10.5px;font-weight:700;text-align:center}
.flow-a b{font-size:19px;color:var(--f-gold);line-height:1}
.flow-wrap{display:grid;grid-template-columns:1fr auto 1fr auto 1fr auto 1fr;gap:0;margin-top:32px;align-items:stretch}

/* ---------- comparison table ---------- */
.cmp{margin-top:30px;border:1.5px solid var(--f-line);border-radius:18px;overflow:hidden;background:#fff}
.cmp-r{display:grid;grid-template-columns:1.15fr 1fr 1fr 1fr;border-top:1px solid var(--f-line)}
.cmp-r:first-child{border-top:none}
.cmp-r > div{padding:15px 18px;font-size:13.5px;color:var(--f-body);line-height:1.5}
.cmp-r.hd > div{font-size:12px;font-weight:800;letter-spacing:.05em;text-transform:uppercase;color:#fff}
.cmp-r.hd > div:nth-child(1){background:#2B3B34}
.cmp-r.hd > div:nth-child(2){background:#5F6B62}
.cmp-r.hd > div:nth-child(3){background:#3F5E78}
.cmp-r.hd > div:nth-child(4){background:var(--f-pine)}
.cmp-r .rl{font-weight:800;color:var(--f-ink);background:#FBF8F1}
.cmp-r > div:nth-child(4){background:#F7FAF8;font-weight:700;color:var(--f-ink)}
.cmp-r:nth-child(even) > div:nth-child(2),.cmp-r:nth-child(even) > div:nth-child(3){background:#FCFBF7}

/* ---------- anatomy figure ---------- */
.anat{margin-top:30px;background:#fff;border:1.5px solid var(--f-line);border-radius:18px;padding:28px}
.anat svg{width:100%;height:auto;display:block}
.anat-list{display:none;margin-top:4px}
.anat-list .ai{display:flex;gap:13px;padding:13px 0;border-top:1px solid var(--f-line)}
.anat-list .ai:first-child{border-top:none}
.anat-list .dotc{width:13px;height:13px;border-radius:50%;flex:none;margin-top:4px}
.anat-list h5{font-size:14px;font-weight:800;color:var(--f-ink)}
.anat-list p{font-size:12.5px;color:var(--f-body);line-height:1.55;margin-top:2px}

/* ---------- classification banner ---------- */
.classif{margin-top:30px;display:grid;grid-template-columns:1fr 1fr;gap:0;border-radius:18px;overflow:hidden;
  border:1.5px solid var(--f-line)}
.classif .side{padding:26px 28px}
.classif .is{background:linear-gradient(150deg,#143A2E,#1F5544);color:#fff}
.classif .isnt{background:#FBF8F1}
.classif h4{font-size:11px;font-weight:800;letter-spacing:.09em;text-transform:uppercase;margin-bottom:14px}
.classif .is h4{color:#CBA24C}
.classif .isnt h4{color:var(--f-clay)}
.classif ul{list-style:none;margin:0;padding:0}
.classif li{display:flex;gap:10px;padding:8px 0;font-size:13.5px;line-height:1.55}
.classif .is li{color:#E4EDE8}
.classif .isnt li{color:var(--f-body)}
.classif li i{font-style:normal;font-weight:800;flex:none}
.classif .is li i{color:#7FD4A8}
.classif .isnt li i{color:var(--f-clay)}

/* ---------- colour-coded step cards (how it works) ---------- */
.steps-c{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:32px}
.stepc{background:#fff;border:1.5px solid var(--f-line);border-radius:18px;padding:0;overflow:hidden;
  display:flex;flex-direction:column}
.stepc .bar{height:5px}
.stepc .in{padding:22px 24px 24px}
.stepc .n{font-family:'IBM Plex Mono',monospace;font-size:11px;font-weight:600;letter-spacing:.06em}
.stepc h4{font-size:17px;font-weight:800;color:var(--f-ink);margin:8px 0 8px;line-height:1.25}
.stepc p{font-size:13.5px;color:var(--f-body);line-height:1.65}
.stepc .tagl{display:inline-block;font-size:11px;font-weight:700;padding:5px 11px;border-radius:999px;margin-top:14px}
.s-1 .bar{background:var(--f-slate)} .s-1 .n{color:var(--f-slate)} .s-1 .tagl{background:var(--f-slate-t);color:var(--f-slate)}
.s-2 .bar{background:var(--f-gold)} .s-2 .n{color:var(--f-gold-d)} .s-2 .tagl{background:var(--f-gold-t);color:var(--f-gold-d)}
.s-3 .bar{background:var(--f-pine)} .s-3 .n{color:var(--f-pine)} .s-3 .tagl{background:var(--f-pine-t);color:var(--f-pine)}
.s-4 .bar{background:var(--f-sage)} .s-4 .n{color:var(--f-sage)} .s-4 .tagl{background:var(--f-sage-t);color:var(--f-sage)}
.s-5 .bar{background:var(--f-clay)} .s-5 .n{color:var(--f-clay)} .s-5 .tagl{background:var(--f-clay-t);color:var(--f-clay)}
.s-6 .bar{background:var(--f-plum)} .s-6 .n{color:var(--f-plum)} .s-6 .tagl{background:var(--f-plum-t);color:var(--f-plum)}

/* ---------- responsive ---------- */
@media(max-width:900px){
  .chain-row,.chain-link{grid-template-columns:1fr;gap:12px}
  .chain-link{padding:2px 0}
  .chain-link .arr{flex-direction:row;justify-content:flex-start;padding-left:4px}
  .chain-link .arr .bar{width:24px;height:2px}
  .own2{grid-template-columns:1fr}
  .flow-wrap{grid-template-columns:1fr}
  .flow-a{padding:8px 0}
  .flow-a span{flex-direction:row;gap:8px}
  .flow-a b{transform:rotate(90deg)}
  .cmp-r{grid-template-columns:1fr}
  .cmp-r.hd{display:none}
  .cmp-r > div{padding:9px 16px}
  .cmp-r .rl{padding-top:15px;font-size:14px}
  .cmp-r > div:nth-child(2)::before{content:'Direct purchase — ';color:var(--f-mut);font-weight:700}
  .cmp-r > div:nth-child(3)::before{content:'Listed REIT — ';color:var(--f-mut);font-weight:700}
  .cmp-r > div:nth-child(4)::before{content:'Participant unit — ';color:var(--f-mut);font-weight:700}
  .classif{grid-template-columns:1fr}
  .steps-c{grid-template-columns:1fr}
  .anat svg{display:none}
  .anat-list{display:block}
  .anat{padding:20px}
  .fig-sec{padding:44px 0 6px}
}
@media(max-width:620px){
  .chain-tier{min-height:96px}
}

/* ============================================================
   Consumer-facing components (What you own)
   ============================================================ */
.atg{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:32px}
.atg .t{background:#fff;border:1.5px solid var(--f-line);border-radius:18px;padding:24px 26px;position:relative;overflow:hidden}
.atg .t::before{content:'';position:absolute;left:0;top:0;bottom:0;width:5px}
.atg .t1::before{background:var(--f-gold)}
.atg .t2::before{background:var(--f-sage)}
.atg .t3::before{background:var(--f-slate)}
.atg .t .k{font-family:'IBM Plex Mono',monospace;font-size:10.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--f-mut)}
.atg .t h4{font-size:19px;font-weight:800;color:var(--f-ink);margin:8px 0 8px;line-height:1.25;font-family:'Playfair Display',Georgia,serif;font-weight:600}
.atg .t p{font-size:13.5px;color:var(--f-body);line-height:1.65}

/* benefit cards */
.bens{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:32px}
.ben{background:#fff;border:1.5px solid var(--f-line);border-radius:18px;padding:24px 26px}
.ben .ic{width:44px;height:44px;border-radius:13px;display:flex;align-items:center;justify-content:center;
  font-size:19px;margin-bottom:14px}
.ben h4{font-size:16.5px;font-weight:800;color:var(--f-ink);margin-bottom:7px;line-height:1.3}
.ben p{font-size:13.5px;color:var(--f-body);line-height:1.65}
.b1 .ic{background:var(--f-sage-t);color:var(--f-sage)}
.b2 .ic{background:var(--f-gold-t);color:var(--f-gold-d)}
.b3 .ic{background:var(--f-slate-t);color:var(--f-slate)}
.b4 .ic{background:var(--f-pine-t);color:var(--f-pine)}
.b5 .ic{background:var(--f-clay-t);color:var(--f-clay)}
.b6 .ic{background:var(--f-plum-t);color:var(--f-plum)}

/* rights list (positive) */
.rights{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:30px}
.right-i{display:flex;gap:14px;background:#fff;border:1.5px solid var(--f-line);border-radius:16px;padding:19px 21px}
.right-i .tick{width:26px;height:26px;border-radius:50%;background:var(--f-sage-t);color:var(--f-sage);
  display:flex;align-items:center;justify-content:center;font-size:13px;font-weight:800;flex:none;margin-top:1px}
.right-i h5{font-size:15px;font-weight:800;color:var(--f-ink);margin-bottom:4px}
.right-i p{font-size:13px;color:var(--f-body);line-height:1.6}

/* good to know */
.gtk{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:30px}
.gtk-i{background:#FBF8F1;border:1.5px solid var(--f-line);border-radius:16px;padding:22px 24px}
.gtk-i .n{font-family:'IBM Plex Mono',monospace;font-size:11px;color:var(--f-gold-d);font-weight:600}
.gtk-i h5{font-size:16px;font-weight:800;color:var(--f-ink);margin:7px 0 7px;line-height:1.3}
.gtk-i p{font-size:13.5px;color:var(--f-body);line-height:1.65}
.gtk-i p + p{margin-top:8px;color:var(--f-mut);font-size:12.5px}

@media(max-width:900px){
  .atg,.bens,.rights,.gtk{grid-template-columns:1fr}
}