/* Unequal product panels, informed by Notion and Attio, in Financial Clarity. */
.financial-workspace { padding:84px 0 62px;scroll-margin-top:78px;background:#F5F8FB;position:relative;color:#1A355E;font-family:Inter,system-ui,sans-serif; }
.financial-workspace * { box-sizing:border-box; }
.wsk-shell { width:min(1180px,calc(100% - 96px));margin:auto; }
.wsk-heading { max-width:820px;margin-bottom:38px; }
.wsk-eyebrow { font-size:13px;line-height:1.5;color:#536A83;margin:0 0 18px; }
.wsk-heading h2 { font:500 50px/1.12 'Space Grotesk',sans-serif;letter-spacing:-1.7px;margin:0;color:#1A355E;text-wrap:balance; }
.wsk-keep { white-space:nowrap; }
.wsk-intro { font-size:16px;line-height:1.75;color:#536A83;max-width:660px;margin:21px 0 0;text-wrap:pretty; }
.wsk-showcase { margin:0; }
.wsk-grid { display:grid;grid-template-columns:minmax(0,1.42fr) minmax(0,1fr);gap:22px; }
.wsk-panel { position:relative;isolation:isolate;overflow:hidden;min-width:0;border:1px solid #C8D9E3;border-radius:18px;min-height:537px;box-shadow:inset 0 1px 0 #FFFFFFE6,0 12px 20px -22px #294B62; }
.wsk-panel--work { background:radial-gradient(ellipse at 43% 76%,#CEE7E2B3,transparent 63%),linear-gradient(135deg,#EFF7F6,#DFEDF0 67%,#D7E6ED); }
.wsk-panel--records { background:radial-gradient(ellipse at 87% 83%,#ABCFD57A,transparent 68%),linear-gradient(145deg,#E7EFF7,#D3E1EC); }
.wsk-panel::after { content:'';position:absolute;inset:0;pointer-events:none;border-radius:inherit;box-shadow:inset 0 1px 0 #FFF,inset -1px 0 0 #FFFFFF80; }
.wsk-feature-copy { padding:30px 31px 0; }
.wsk-feature-copy h3 { margin:0;color:#1A355E;font:500 25px/1.2 'Space Grotesk',sans-serif;letter-spacing:-.6px; }
.wsk-feature-copy>p { margin:10px 0 0;color:#527186;font-size:14px;line-height:1.7;max-width:450px;text-wrap:pretty; }
.wsk-work-media { position:relative;height:394px;margin:16px 0 0; }
.wsk-client-card { position:absolute;top:17px;left:30px;z-index:1;width:256px;padding:19px 22px 20px;border:1px solid #CCDCE3;border-radius:11px;background:#FFFFFF;transform:rotate(-1.2deg);box-shadow:0 12px 20px -16px #244B6259,0 1px 1px #193D4C08; }
.wsk-client-top { display:flex;align-items:center;gap:9px;color:#698398;font-size:12px;line-height:1.5; }
.wsk-client-icon { display:grid;place-items:center;width:31px;height:31px;flex:none;border-radius:7px;border:1px solid #D3E4E3;background:#F2F8F7;color:#397A72; }.wsk-client-icon svg { width:24px;height:24px;stroke:currentColor;stroke-width:1.2;stroke-linecap:round;stroke-linejoin:round; }
.wsk-client-card h4 { margin:12px 0 8px;color:#1A355E;font:500 23px/1.2 'Space Grotesk',sans-serif;letter-spacing:-.6px; }
.wsk-client-card>p { color:#5B758B;font-size:12px;line-height:1.6;margin:0 0 3px; }.wsk-client-card>p>span { padding:0 3px;color:#88A2B4; }.wsk-client-email { display:block;color:#6A8497;font-size:12px;line-height:1.6;overflow-wrap:anywhere; }
.wsk-client-connection { position:absolute;inset:0;width:100%;height:100%;z-index:0;pointer-events:none; }.wsk-client-connection path { stroke:#669C9D;stroke-width:1.3;stroke-dasharray:3 5; }.wsk-client-connection circle { fill:#82B7AC;stroke:#E6F2EF;stroke-width:3; }
.wsk-project-card { position:absolute;top:169px;left:92px;right:27px;min-width:0;padding:21px 24px 22px;background:linear-gradient(130deg,#FFF,#FBFDFE);border:1px solid #CADCE5;border-radius:12px;transform:rotate(.7deg);box-shadow:0 20px 30px -17px #23495D4D,0 2px 3px #15384B0A; }
.wsk-project-card::before { content:'';position:absolute;inset:-7px 9px 7px -9px;border:1px solid #91B6BA4D;border-radius:12px;z-index:-1;pointer-events:none; }
.wsk-project-top { display:flex;justify-content:space-between;align-items:center;gap:15px;font-size:12px;line-height:1.5;color:#678399; }
.wsk-project-status { display:flex;align-items:center;gap:5px;white-space:nowrap;font-size:12px; }.wsk-project-status i { width:5px;height:5px;border:1px solid #648DA2;border-radius:50%; }
.wsk-project-card h4 { font:500 24px/1.2 'Space Grotesk',sans-serif;letter-spacing:-.65px;color:#1A355E;margin:12px 0 8px;text-wrap:balance; }
.wsk-linked-client { display:flex;align-items:center;gap:6px;color:#548273;font-size:12px;line-height:1.5;margin:0; }.wsk-linked-client svg { width:15px;height:15px;stroke:currentColor;stroke-width:1.2;stroke-linecap:round;stroke-linejoin:round; }
.wsk-task-heading { margin:20px 0 5px;color:#718A9D;font-size:12px;line-height:1.6; }
.wsk-tasks { list-style:none;padding:0;margin:0; }.wsk-tasks li { display:flex;align-items:center;gap:9px;border-top:1px solid #E0EAF0;padding:11px 0;color:#3B5872;font-size:13px;line-height:1.5; }.wsk-tasks li:last-child { padding-bottom:0; }.wsk-tasks li>span:nth-child(2) { min-width:0;flex:1; }.wsk-task-state { font-size:12px;color:#748D9F;margin-left:8px;white-space:nowrap; }.wsk-task-mark { display:grid;place-items:center;width:17px;height:17px;border:1px solid #ADC0CC;border-radius:4px;flex:none; }.wsk-task-mark--done { color:#2C806C;border-color:#A4CEBE;background:#EDF7F2; }.wsk-task-mark svg { width:13px;height:13px;stroke:currentColor;stroke-width:1.3;stroke-linecap:round;stroke-linejoin:round; }
.wsk-record-media { position:relative;height:394px;margin:16px 0 0; }
.wsk-time-card { position:absolute;top:18px;left:30px;right:35px;padding:20px 23px 24px;border:1px solid #CEDDE7;border-radius:11px;background:#FFF;transform:rotate(-.8deg);box-shadow:0 12px 20px -16px #26485E4D; }
.wsk-time-top { display:flex;align-items:center;gap:7px;font-size:12px;line-height:1.5;color:#607D92; }.wsk-time-top svg { width:18px;height:18px;stroke:#5A8294;stroke-width:1.25;stroke-linecap:round;stroke-linejoin:round; }
.wsk-time-total { color:#1A355E;font:500 35px/1.1 'Space Grotesk',sans-serif;letter-spacing:-.9px;margin:14px 0 16px; }.wsk-time-total>span { font:400 13px/1.6 Inter,sans-serif;color:#607E94;letter-spacing:0;margin-left:8px; }
.wsk-hours { margin:0; }.wsk-hours>div { display:flex;justify-content:space-between;align-items:center;gap:14px;padding:9px 0;border-top:1px solid #E0EAF0;font-size:13px;line-height:1.5; }.wsk-hours dt { color:#4C6C84;display:flex;gap:7px;align-items:center; }.wsk-hours dd { margin:0;font-weight:500;color:#23445F;white-space:nowrap; }.wsk-hour-dot { width:5px;height:5px;flex:none;border-radius:50%; }.wsk-hour-dot--delivery { background:#235677; }.wsk-hour-dot--calls { background:#6D9EA6; }.wsk-hour-dot--admin { background:#B3CCD5; }
.wsk-invoice-card { position:absolute;top:253px;left:50px;right:20px;padding:19px 23px 20px;background:linear-gradient(125deg,#355B681F,transparent),#1B3D55;border:1px solid #92AFBC80;border-top-color:#D1E6EC99;border-radius:11px;transform:rotate(1.2deg);color:#F2F8FC;box-shadow:inset 0 1px 0 #E8F7FF1A,0 17px 25px -18px #102B45A6; }
.wsk-invoice-card::before { content:'';position:absolute;inset:-7px 8px 7px -8px;border:1px solid #7FA5B83D;border-radius:11px;z-index:-1;pointer-events:none; }
.wsk-invoice-top { display:flex;justify-content:space-between;gap:10px;align-items:center;font-size:12px;line-height:1.5;color:#C5DAE5; }.wsk-invoice-top>span:first-child { display:flex;gap:7px;align-items:center; }.wsk-invoice-top svg { width:17px;height:17px;stroke:currentColor;stroke-width:1.25;stroke-linecap:round;stroke-linejoin:round; }.wsk-invoice-status { display:flex;align-items:center;gap:5px;color:#F0BFCD;white-space:nowrap; }.wsk-invoice-status i { width:4px;height:4px;background:#DCA6B6;border-radius:50%; }
.wsk-invoice-amount { color:#F5FAFD;font:500 32px/1.1 'Space Grotesk',sans-serif;letter-spacing:-.9px;margin:12px 0 8px; }.wsk-invoice-client { margin:0;color:#BED3E0;font-size:12px;line-height:1.6; }.wsk-invoice-client>span { padding:0 4px;color:#83A6BB; }
.wsk-showcase figcaption { color:#687E91;text-align:center;font-size:12px;line-height:1.7;margin:18px auto 0;text-wrap:pretty; }
.wsk-details-link { display:table;margin:14px auto 0;min-height:44px;padding:12px 0 8px;color:#15806D;font-size:14px;font-weight:500;line-height:1.6;text-decoration:underline;text-underline-offset:5px;text-decoration-thickness:1px;text-decoration-color:#78B5A8; }.wsk-details-link:hover { color:#106351;text-decoration-color:currentColor;text-decoration-thickness:2px; }.wsk-details-link:focus-visible { outline:2px solid #15806D;outline-offset:5px;border-radius:2px; }
@media(max-width:1100px) {
  .wsk-shell { width:calc(100% - 64px); }.wsk-heading h2 { font-size:46px; }.wsk-grid { gap:18px;grid-template-columns:minmax(0,1.35fr) minmax(0,1fr); }.wsk-feature-copy { padding:27px 25px 0; }.wsk-client-card { left:23px;width:230px; }.wsk-project-card { left:52px;right:23px;padding:21px; }.wsk-project-card h4 { font-size:22px; }.wsk-time-card { left:25px;right:28px;padding:20px; }.wsk-invoice-card { left:36px;right:20px;padding:19px 20px; }.wsk-invoice-client>span { padding:0 2px; }
}
@media(max-width:850px) {
  .financial-workspace { padding:66px 0 54px; }.wsk-shell { width:calc(100% - 40px); }.wsk-heading h2 { font-size:42px; }.wsk-grid { grid-template-columns:1fr;gap:23px; }.wsk-panel { min-height:520px; }.wsk-feature-copy { padding:28px 30px 0; }.wsk-work-media,.wsk-record-media { max-width:650px;margin:16px auto 0; }.wsk-client-card { left:34px;width:256px; }.wsk-project-card { left:130px;right:34px;padding:22px 25px; }.wsk-project-card h4 { font-size:24px; }.wsk-record-media { max-width:480px; }.wsk-time-card { left:32px;right:55px;padding:20px 24px 24px; }.wsk-invoice-card { left:75px;right:24px;padding:20px 24px; }.wsk-feature-copy>p { max-width:none; }
}
@media(min-width:601px) and (max-width:850px) {
  .wsk-panel--work { min-height:554px; }
}
@media(max-width:600px) {
  .wsk-heading h2 { font-size:38px;letter-spacing:-1.3px; }.wsk-intro { font-size:15px; }.wsk-panel { min-height:0; }.wsk-feature-copy { padding:25px 25px 0; }.wsk-work-media { height:auto;margin:25px 24px 29px;display:flex;flex-direction:column;gap:22px; }.wsk-client-card { position:relative;top:auto;left:auto;width:calc(100% - 25px);align-self:flex-start;transform:rotate(-.8deg);padding:20px 22px; }.wsk-project-card { position:relative;top:auto;left:auto;right:auto;width:calc(100% - 12px);align-self:flex-end;transform:rotate(.4deg);padding:22px; }.wsk-client-connection { display:none; }.wsk-project-card h4 { font-size:23px; }.wsk-record-media { height:auto;margin:25px 24px 29px;display:flex;flex-direction:column;gap:0; }.wsk-time-card { position:relative;top:auto;left:auto;right:auto;align-self:flex-start;width:calc(100% - 20px);padding:21px 23px 31px; }.wsk-invoice-card { position:relative;top:auto;left:auto;right:auto;align-self:flex-end;width:calc(100% - 15px);margin-top:-8px;padding:21px 23px; }.wsk-tasks li { font-size:13px;gap:8px; }.wsk-task-state { margin-left:4px; }
}
@media(max-width:440px) {
  .financial-workspace { padding:54px 0 43px; }.wsk-shell { width:calc(100% - 36px); }.wsk-heading { margin-bottom:29px; }.wsk-heading h2 { font-size:34px;letter-spacing:-1.15px; }.wsk-intro { font-size:14px;line-height:1.75; }.wsk-eyebrow { font-size:12px;margin-bottom:15px; }.wsk-grid { gap:22px; }.wsk-panel { border-radius:14px; }.wsk-feature-copy { padding:24px 23px 0; }.wsk-feature-copy h3 { font-size:24px; }.wsk-feature-copy>p { font-size:13px; }.wsk-work-media,.wsk-record-media { margin:22px 20px 27px; }.wsk-client-card { width:calc(100% - 10px);padding:19px 20px; }.wsk-client-card h4 { font-size:23px; }.wsk-project-card { width:100%;padding:21px 19px; }.wsk-project-card h4 { font-size:22px; }.wsk-tasks li { align-items:flex-start;font-size:13px;gap:7px; }.wsk-task-mark { margin-top:2px; }.wsk-task-state { font-size:12px;margin-top:1px; }.wsk-time-card { width:calc(100% - 10px);padding:20px 21px 30px; }.wsk-invoice-card { width:calc(100% - 6px);padding:20px; }.wsk-invoice-client { max-width:210px; }.wsk-showcase figcaption { max-width:290px;margin-top:17px; }
}
@media(max-width:350px) {
  .wsk-shell { width:calc(100% - 28px); }.wsk-heading h2 { font-size:31px;letter-spacing:-1px; }.wsk-feature-copy { padding-inline:20px; }.wsk-work-media,.wsk-record-media { margin-inline:17px; }.wsk-project-card { padding:20px 16px; }.wsk-project-card h4 { font-size:21px; }.wsk-tasks li { gap:7px;flex-wrap:wrap; }.wsk-tasks li>span:nth-child(2) { flex:1; }.wsk-task-state { width:100%;margin-left:24px;margin-top:0; }.wsk-project-top { gap:8px; }.wsk-time-card { padding-inline:19px; }.wsk-invoice-card { padding-inline:18px; }.wsk-invoice-top { gap:8px; }.wsk-invoice-amount { font-size:30px; }
}
