/* A compact, working interface rather than a decorative marketing card. */
.portal-scroll-track { min-width:0; position:relative; align-self:start; }
.portals-solution { align-items:start; }
.portal-pin { position:relative; }
.portal-visual { container-type:inline-size; position:relative; isolation:isolate; }
.portal-visual::before { display:none; }
/* Two scroll phases: straighten, then reveal the document page underneath. */
.portal-workspace { transform-origin:50% 50%; }
.portal-visual > [data-portal-demo] { position:relative; z-index:1; }
.portal-visual > .portal-underlay { position:absolute; inset:0; z-index:0; opacity:0; pointer-events:none; background:#f3f6f2; }
.portal-underlay .workspace-panel { min-height:0; flex:1; overflow:hidden; }
.portal-underlay .workspace-footer { justify-content:flex-end; gap:12px; color:#64756a; background:#f3f6f2; }
.workspace-underlay-nav { display:grid; gap:7px; }
.workspace-underlay-nav > span { display:flex; align-items:center; gap:10px; padding:10px; color:#bac7bf; }
.workspace-underlay-nav > span:nth-child(2) { background:#415248; color:#fff; border-radius:6px; }
.workspace-underlay-nav svg { width:18px; height:18px; flex-shrink:0; }
@media (prefers-reduced-motion:no-preference) {
 .portal-scroll-track[data-portal-pinned] { height:calc(var(--portal-stage-height) + var(--portal-pin-distance)); }
 .portal-scroll-track[data-portal-pinned] > .portal-pin { position:sticky; top:var(--portal-pin-top); height:var(--portal-stage-height); }
 .portal-scroll-track[data-portal-pinned] > .portal-pin > .portal-visual { position:absolute; inset-inline:0; top:var(--portal-headroom); transform-origin:50% 0; }
 /* Keep layers ready as the scene approaches, including its fully straight state. */
 .portal-visual[data-portal-active],
 .portal-visual[data-portal-active] > [data-portal-demo] { will-change:transform; }
 .portal-visual[data-portal-active] > .portal-underlay { will-change:opacity; }
}
.portal-workspace { display:grid; grid-template-columns:180px minmax(0,1fr); overflow:hidden; border:1px solid #d9ddd8; border-radius:12px; background:#fff; box-shadow:0 24px 55px -30px #1c2d2b55,0 2px 5px #1c2d2b08; color:#25312e; font-size:14px; line-height:1.5; letter-spacing:-.01em; }
.workspace-sidebar { display:flex; flex-direction:column; padding:24px 12px 18px; background:#25332e; color:#edf2ee; }
.workspace-brand { display:flex; align-items:center; gap:10px; padding:0 8px 30px; font-weight:650; font-size:16px; }
.workspace-mark { display:grid; place-items:center; width:31px; height:31px; border-radius:8px; background:#f5ece1; color:#25332e; font-size:23px; font-weight:700; line-height:1; }
.workspace-brand small { display:block; font-size:12px; color:#afbbb3; font-weight:400; margin-top:1px; }
.workspace-tabs { display:grid; gap:7px; }
.workspace-tabs button { display:flex; align-items:center; gap:10px; min-height:42px; padding:10px; border-radius:6px; background:transparent; color:#bac7bf; text-align:left; font-size:14px; }
.workspace-tabs svg,.workspace-file svg { width:18px; height:18px; flex-shrink:0; }
.workspace-tabs button[aria-selected=true] { color:#fff; background:#415248; box-shadow:inset 0 0 0 1px #ffffff10; }
.workspace-tabs button:hover { background:#36463e; color:#fff; }
.workspace-tabs button:focus-visible { outline-color:#ffab75; outline-offset:1px; }
.workspace-count { margin-left:auto; font-size:12px; color:#d3ddd7; }
.workspace-profile { display:flex; align-items:center; gap:8px; margin-top:auto; padding:36px 8px 0; font-size:13px; }
.workspace-profile small { display:block; font-size:12px; color:#b0bcb4; }
.workspace-avatar { display:inline-grid; place-items:center; width:28px; height:28px; flex-shrink:0; border-radius:50%; background:#e7ece8; color:#415449; font-size:12px; font-weight:600; }
.workspace-profile .workspace-avatar { background:#d5bca5; color:#3d342b; }
.workspace-main { min-width:0; display:flex; flex-direction:column; }
.workspace-toolbar { display:flex; align-items:center; justify-content:space-between; gap:15px; min-height:57px; padding:16px 26px; border-bottom:1px solid #e8ebe7; color:#727b76; font-size:12px; }
.workspace-toolbar strong { color:#46564c; font-weight:500; }
.workspace-toolbar > span > span { margin-inline:9px; color:#bcc4bd; }
.workspace-demo-label { padding:2px 7px; border:1px solid #e2e7e1; border-radius:4px; color:#737e76; font-size:12px; }
.workspace-panel { padding:26px; min-height:470px; outline-offset:-4px; }
.workspace-page-heading { display:flex; align-items:center; justify-content:space-between; gap:20px; margin-bottom:29px; }
.workspace-page-heading p { color:#7a847e; font-size:13px; }
.workspace-page-heading h3 { margin:6px 0; color:#29372e; font-size:23px; font-weight:600; line-height:1.3; letter-spacing:-.045em; }
.workspace-team { display:flex; padding-left:8px; }
.workspace-team .workspace-avatar { margin-left:-8px; width:32px; height:32px; border:2px solid white; }
.workspace-team .workspace-avatar:nth-child(2) { background:#e8dbc9; }
.workspace-team .workspace-avatar:nth-child(3) { background:#d9e3ec; }
.workspace-task-heading { display:flex; align-items:center; justify-content:space-between; padding-bottom:13px; }
.workspace-task-heading h4,.workspace-activity h4 { font-size:14px; font-weight:600; letter-spacing:-.015em; }
.workspace-task-heading > span { font-size:12px; color:#818981; }
.workspace-table-wrap { overflow:auto; }
.portal-workspace table { width:100%; border-collapse:collapse; text-align:left; font-size:14px; white-space:nowrap; }
.portal-workspace th { padding:10px 12px; color:#7c857e; font-size:12px; font-weight:400; background:#f7f9f6; border-block:1px solid #e8ece6; }
.portal-workspace td { padding:13px 12px; border-bottom:1px solid #edf0eb; }
.portal-workspace td:first-child,.portal-workspace th:first-child { padding-left:0; }
.portal-workspace th:first-child { padding-left:10px; }
.portal-workspace td strong { display:block; font-size:14px; font-weight:500; }
.portal-workspace td small { display:block; margin-top:4px; font-size:12px; color:#859087; }
.workspace-person { display:flex; align-items:center; gap:7px; }
.workspace-status { display:inline-block; padding:3px 7px; border-radius:4px; font-size:12px; }
.workspace-status-active { background:#edf2ec; color:#486445; }
.workspace-status-review { background:#fbefdf; color:#936424; }
.workspace-status-planned { background:#eef0f7; color:#606b87; }
.workspace-activity { margin-top:25px; }
.workspace-activity ul { display:grid; grid-template-columns:repeat(3,1fr); gap:16px; margin-top:15px; }
.workspace-activity li { display:flex; align-items:flex-start; gap:8px; }
.workspace-activity li .workspace-avatar { width:24px; height:24px; }
.workspace-activity p { font-size:12px; line-height:1.55; color:#536157; }
.workspace-activity small { display:block; font-size:12px; color:#8c958e; line-height:1.5; margin-top:4px; }
.workspace-file { display:flex; align-items:center; gap:10px; }
.workspace-file svg { color:#869487; }
.workspace-footer { display:flex; align-items:center; gap:6px; padding:12px 26px; margin-top:auto; border-top:1px solid #edf0eb; color:#869086; font-size:12px; }
.workspace-footer svg { width:14px; height:14px; }
.workspace-schedule { margin:0; padding:0; list-style:none; }
.workspace-schedule li { display:grid; grid-template-columns:42px 48px 1fr; gap:20px; align-items:center; padding:14px 0; border-top:1px solid #e8ece6; }
.workspace-day { text-align:center; padding:6px 4px; background:#f3f6f1; border-radius:5px; }
.workspace-day span { display:block; font-size:12px; color:#7f8c7f; }
.workspace-day strong { font-size:20px; font-weight:500; }
.workspace-schedule time { font-size:13px; color:#7b887c; }
.workspace-schedule h4 { font-size:14px; font-weight:500; }
.workspace-schedule p { margin-top:3px; font-size:12px; color:#859187; }
body[data-page=portals] .service-hero.has-visual { grid-template-columns:1fr; gap:45px; }
body[data-page=portals] .service-hero > div:not(.portal-scroll-track) { display:grid; grid-template-columns:1.2fr 1fr; column-gap:9%; align-items:start; }
body[data-page=portals] .service-hero h1 { grid-row:1 / 3; max-width:650px; }
body[data-page=portals] .service-lead { margin:4px 0 22px; max-width:420px; }
body[data-page=portals] .service-hero .button { justify-self:start; align-self:start; }



@container (max-width:850px) {
 .portal-workspace { grid-template-columns:145px minmax(0,1fr); }
 .workspace-brand { font-size:14px; gap:7px; padding-inline:0; }
 .workspace-sidebar { padding-inline:10px; }
 .workspace-panel { padding:22px 20px; }
 .workspace-team { display:none; }
 .workspace-activity ul { grid-template-columns:1fr; gap:12px; }
 .workspace-activity li:nth-child(3) { display:none; }
 .workspace-person > span:last-child { display:none; }
 .workspace-toolbar { padding-inline:20px; }
}
@container (max-width:620px) {
 .workspace-underlay-nav > span > span { display:none; }
 .workspace-underlay-nav > span { justify-content:center; padding:10px 8px; }
 .portal-workspace { grid-template-columns:50px minmax(0,1fr); }
 .workspace-sidebar { padding:20px 7px; }
 .workspace-brand { padding:0 2px 24px; }
 .workspace-brand > span:last-child,.workspace-tabs button > span,.workspace-profile { display:none; }
 .workspace-tabs button { padding:10px 8px; justify-content:center; }
 .workspace-panel { padding:21px 18px; min-height:470px; }
 .workspace-page-heading h3 { font-size:21px; }
 .workspace-tasks td:nth-child(2),.workspace-tasks th:nth-child(2) { display:none; }
 .workspace-tasks td:nth-child(3),.workspace-tasks th:nth-child(3) { display:none; }
 .workspace-tasks td strong { white-space:normal; }
 .workspace-documents td:nth-child(2),.workspace-documents th:nth-child(2) { display:none; }
 .workspace-documents strong { white-space:normal; overflow-wrap:anywhere; }
 .workspace-schedule li { gap:10px; }
 .workspace-toolbar { padding-inline:18px; }
}
@media (max-width:760px) {
 body[data-page=portals] .service-hero > div:not(.portal-scroll-track) { grid-template-columns:1fr; }
 body[data-page=portals] .service-hero h1 { grid-row:auto; }
 body[data-page=portals] .service-lead { margin:23px 0 25px; }
 body[data-page=portals] .service-hero.has-visual { gap:35px; }


}
@media (max-width:550px) {
 .portal-visual > .portal-underlay { display:flex; flex-direction:column; }
 .portal-underlay .workspace-main { flex:1; min-height:0; }
 .workspace-underlay-nav { display:flex; gap:5px; }
 .workspace-underlay-nav > span { flex:1; font-size:14px; }
 .workspace-underlay-nav > span > span { display:inline; }
 .workspace-underlay-nav svg { display:none; }
 .portal-workspace { display:block; }
 .workspace-sidebar { padding:14px 14px 0; }
 .workspace-brand { display:none; }
 .workspace-tabs { display:flex; gap:5px; }
 .workspace-tabs button { flex:1; justify-content:center; gap:6px; padding:10px 6px; min-width:0; font-size:14px; border-radius:5px 5px 0 0; }
 .workspace-tabs button > span:not(.workspace-count) { display:inline; }
 .workspace-tabs svg { display:none; }
 .workspace-toolbar { padding:13px 15px; font-size:12px; min-height:45px; }
 .workspace-panel { padding:20px 15px; min-height:490px; }
 .workspace-page-heading { margin-bottom:24px; }
 .workspace-page-heading h3 { font-size:22px; }
 .portal-workspace td { padding:13px 6px; }
 .portal-workspace td strong { font-size:13px; }
 .workspace-status { padding-inline:5px; font-size:12px; }
 .workspace-activity { margin-top:24px; }
 .workspace-footer { padding:12px 15px; }
 .workspace-schedule li { grid-template-columns:38px 41px 1fr; }
}

/* A quiet introduction to the work, without client names or logos. */
.practice-section { display:grid; grid-template-columns:.8fr 1fr; align-items:center; gap:10%; padding-block:52px; border-bottom:1px solid var(--line); }
.practice-section h2 { font-size:clamp(26px,2.6vw,36px); font-weight:500; line-height:1.2; letter-spacing:-.045em; }
.practice-section p { max-width:45ch; font-size:16px; line-height:1.85; color:var(--muted); }
@media (max-width:760px) {
 .practice-section { grid-template-columns:1fr; gap:16px; padding-block:36px; }
 .practice-section h2 { font-size:28px; }
}

/* Consistent portraits in tasks, document owners, activity and the profile. */
.workspace-avatar { overflow:hidden; }
.workspace-avatar img { display:block; width:100%; height:100%; object-fit:cover; }

@container (max-width:850px) {
 .workspace-tasks th:nth-child(2),.workspace-documents th:nth-child(2) { position:relative; width:44px; }
 .workspace-tasks th:nth-child(2) > span,.workspace-documents th:nth-child(2) > span { position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap; }
}
@container (max-width:620px) {
 .workspace-tasks td:nth-child(2),.workspace-tasks th:nth-child(2),.workspace-documents td:nth-child(2),.workspace-documents th:nth-child(2) { display:table-cell; }
 .workspace-tasks td:nth-child(2),.workspace-documents td:nth-child(2) { padding-inline:8px; }
}
