/* Client portal demo */
.portal{background:var(--white);border:1px solid var(--line);box-shadow:0 40px 80px -50px rgba(30,30,25,.45)}
.portal-hd{display:flex;justify-content:space-between;align-items:end;gap:24px;padding:22px 24px;background:var(--slab);color:var(--on-slab);flex-wrap:wrap}
.portal-hd .mono{display:block;color:var(--on-slab-2);margin-bottom:4px}
.portal-hd b{font:700 1.6rem/1.1 var(--display)}
.portal-prog{min-width:min(320px,100%)}
.pbar{display:block;height:8px;background:var(--slab-2);margin-top:8px}
.pbar i{display:block;height:100%;background:var(--oak-pale)}
.portal .tabs{padding:0 16px}
.tabp{padding:24px}
.tabp:focus-visible{outline-offset:-4px}
.feed{list-style:none;margin:0;padding:0;display:grid;gap:22px}
.feed li{display:grid;grid-template-columns:320px minmax(0,1fr);gap:24px;align-items:start;padding-bottom:22px;border-bottom:1px solid var(--line)}
.feed li:last-child{border-bottom:0;padding-bottom:0;opacity:.75}
.feed-img{aspect-ratio:4/3;overflow:hidden;background:var(--concrete-2)}
.feed-img img{width:100%;height:100%;object-fit:cover}
.feed .mono{color:var(--ink-2)}
.feed h3{margin:8px 0 8px;font-size:1.4rem}
.feed p{color:var(--ink-2);margin:0;max-width:40em}
@media (max-width:760px){.feed li{grid-template-columns:1fr;gap:12px}}
.sched{overflow-x:auto}
.sc-weeks{display:grid;grid-template-columns:repeat(16,1fr);margin-left:230px;min-width:480px;color:var(--ink-2);font-size:.72rem;padding-bottom:8px;border-bottom:1px solid var(--line)}
.sc-weeks span{text-align:center}
.sc-rows{list-style:none;margin:0 0 12px;padding:0;min-width:710px}
.sc-rows li{display:grid;grid-template-columns:230px 1fr;align-items:center;border-bottom:1px solid var(--line-2);min-height:54px}
.sc-n{display:flex;flex-direction:column;font-weight:600;font-size:.9375rem;padding-right:12px}
.sc-n small{font-weight:400;color:var(--ink-2);font-size:.72rem;margin-top:2px}
.sc-t{position:relative;height:100%;min-height:54px;background:repeating-linear-gradient(90deg,transparent 0,transparent calc(100%/16 - 1px),var(--line-2) calc(100%/16 - 1px),var(--line-2) calc(100%/16))}
.sc-t i{position:absolute;top:18px;height:18px;background:var(--concrete-2);border:1.5px solid var(--ink-2)}
.sc-t i.done{background:var(--forest);border-color:var(--forest)}
.sc-t i.in-progress{background:repeating-linear-gradient(135deg,var(--forest) 0 6px,var(--forest-2) 6px 12px);border-color:var(--forest)}
.sc-t b{position:absolute;top:0;bottom:0;width:2px;background:#9B2C1F}
.paylist,.docs{list-style:none;margin:0 0 18px;padding:0;border-top:1px solid var(--line)}
.paylist li{display:grid;grid-template-columns:1fr 120px 1fr;gap:12px;padding:13px 0;border-bottom:1px solid var(--line);font-size:.9688rem;align-items:center}
.paylist .st{color:var(--ink-2);text-align:right}
.paylist .paid .st{color:var(--forest);font-weight:600}
.paylist .due{background:#F3EFE7}
.paylist .due .st{color:var(--ink);font-weight:600}
@media (max-width:560px){.paylist li{grid-template-columns:1fr auto}.paylist .st{grid-column:1/-1;text-align:left}}
.docs li{display:flex;justify-content:space-between;gap:16px;padding:13px 0;border-bottom:1px solid var(--line);font-size:.9688rem}
.docs .mono{color:var(--ink-2)}