/* Zoho Finance Plus page only. Loaded via `extra: crm, mid, p-finplus`. Every class is scoped with .pfp- */
.pfp-hero, .pfp-what, .pfp-ss, .pfp-pick, .pfp-cost, .pfp-fit, .pfp-scope, .pfp-access, .pfp-connect, .pfp-pkg, .pfp-roll, .pfp-ind { --pfp-ink: #082238; --pfp-body: #334155; --pfp-muted: #64748B; --pfp-line: #E2E8F0; --pfp-paper: #F3F7F9; --pfp-green: #1E9E62; --pfp-amber: #FFB81C; --pfp-blue: #0A6FA8; }

/* ---------- hero: month-end close board ---------- */
.pfp-hero .pfp-hero__grid { grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr); }
.pfp-hero .crm-sub { max-width: 40ch; }
.pfp-tops { display: flex; flex-wrap: wrap; gap: 8px; margin: 22px 0 0; padding: 0; list-style: none; max-width: 580px; }
.pfp-tops li { display: inline-flex; align-items: center; gap: 8px; padding: 8px 13px 8px 9px; border-radius: 999px; background: #fff; border: 1px solid #DCE7EF; font: 600 13.5px/1.3 var(--f-body); color: var(--pfp-ink); box-shadow: 0 10px 20px -16px rgba(8,34,56,.5); }
.pfp-tops svg { flex: none; width: 22px; height: 22px; padding: 3px; border-radius: 7px; background: #E6F0FA; fill: none; stroke: #226DB4; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }

.pfp-board { position: relative; margin: 0; padding: 18px 8px 22px; }
.pfp-board__card { position: relative; padding: 20px 20px 18px; border-radius: 22px; background: #fff; border: 1px solid #E2EBF2; box-shadow: 0 50px 90px -48px rgba(8,34,56,.55), 0 0 0 6px rgba(255,255,255,.6); }
.pfp-board__top { display: flex; align-items: flex-end; justify-content: space-between; gap: 12px; }
.pfp-board__top p { margin: 0; display: grid; gap: 4px; }
.pfp-board__top p b { font: 800 20px/1.2 var(--f-display); letter-spacing: -.02em; color: var(--pfp-ink); }
.pfp-board__top p span { font: 600 12px/1.2 var(--f-body); color: var(--pfp-muted); }
.pfp-board__count { padding: 6px 11px; border-radius: 999px; background: var(--pfp-paper); font: 600 12.5px/1.2 var(--f-body); color: var(--pfp-body); white-space: nowrap; }
.pfp-board__count b { font-weight: 800; color: var(--pfp-ink); font-variant-numeric: tabular-nums; }
.pfp-board__bar { height: 6px; margin: 14px 0 14px; border-radius: 6px; background: #EDF2F6; overflow: hidden; }
.pfp-board__bar i { display: block; height: 100%; width: 0; border-radius: 6px; background: linear-gradient(90deg, #1D3F8F, #00A3D9 45%, #00B2A9 70%, #3FB97A); transition: width .7s cubic-bezier(.2,.8,.2,1); }
.pfp-tiles { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.pfp-tile { position: relative; display: grid; grid-template-columns: 30px minmax(0, 1fr) auto; align-items: center; gap: 12px; padding: 10px 12px; border-radius: 14px; border: 1px solid var(--pfp-line); background: #FBFDFE; transition: border-color .4s, background .4s, box-shadow .4s, transform .4s; }
.pfp-tile img { width: 30px; height: 30px; }
.pfp-tile p { margin: 0; min-width: 0; display: grid; gap: 2px; }
.pfp-tile p b { font: 700 14.5px/1.3 var(--f-display); color: var(--pfp-ink); }
.pfp-tile p b small { margin-left: 6px; padding: 2px 7px; border-radius: 99px; background: #EEF2F6; font: 600 10.5px/1.4 var(--f-body); color: var(--pfp-muted); vertical-align: 1px; }
.pfp-tile p span { font: 500 12.5px/1.4 var(--f-body); color: var(--pfp-muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pfp-st { display: inline-flex; align-items: center; gap: 6px; min-width: 92px; justify-content: center; padding: 6px 10px; border-radius: 999px; background: #EEF2F6; font: 700 11.5px/1.2 var(--f-body); font-style: normal; color: var(--pfp-muted); transition: background .35s, color .35s; }
.pfp-st i { width: 8px; height: 8px; border-radius: 50%; background: #94A3B8; transition: background .35s; }
.pfp-tile.is-work { border-color: #F5D37A; background: #FFFBEF; }
.pfp-tile.is-work .pfp-st { background: #FFF1CC; color: #92400E; }
.pfp-tile.is-work .pfp-st i { background: #F0A400; animation: pfpBlink .7s ease-in-out infinite alternate; }
.pfp-tile.is-done { border-color: color-mix(in srgb, var(--c) 35%, #fff); background: #fff; box-shadow: 0 14px 26px -22px rgba(8,34,56,.6); }
.pfp-tile.is-done .pfp-st { background: #DDF4E6; color: #166534; }
.pfp-tile.is-done .pfp-st i { width: 12px; height: 12px; background: #1E9E62 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath d='M3 6.2l2 2 4-4.3' fill='none' stroke='%23fff' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / 12px no-repeat; }
.pfp-board__done { display: flex; align-items: center; gap: 12px; margin: 12px 0 0; padding: 12px 14px; border-radius: 14px; background: #082238; color: #fff; opacity: .18; transform: translateY(4px); transition: opacity .5s, transform .5s cubic-bezier(.2,1.3,.4,1); }
.pfp-board__done svg { flex: none; width: 26px; height: 26px; padding: 4px; border-radius: 8px; background: var(--pfp-amber); fill: none; stroke: #082238; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.pfp-board__done span { display: grid; gap: 2px; font: 500 12.5px/1.3 var(--f-body); color: #BFD3E2; }
.pfp-board__done b { font: 800 15px/1.2 var(--f-display); color: #fff; }
.pfp-board.is-closed .pfp-board__done { opacity: 1; transform: none; }
.pfp-float { position: absolute; z-index: 2; display: inline-flex; align-items: center; gap: 8px; padding: 9px 14px; border-radius: 999px; background: #fff; border: 1px solid #DCE7EF; font: 600 12.5px/1.2 var(--f-body); color: var(--pfp-ink); box-shadow: 0 18px 30px -18px rgba(8,34,56,.55); }
.pfp-float i { width: 8px; height: 8px; border-radius: 50%; background: #00A3D9; box-shadow: 0 0 0 4px rgba(0,163,217,.18); }
.pfp-float--a { right: -6px; top: -2px; }
.pfp-float--b { left: -8px; bottom: 2px; background: var(--pfp-amber); border-color: var(--pfp-amber); }
.pfp-float--b i { background: #082238; box-shadow: none; }
@keyframes pfpBlink { from { opacity: .35; } to { opacity: 1; } }

/* ---------- what's in the plan: statement ---------- */
.pfp-what__grid { display: grid; grid-template-columns: minmax(0, 1.55fr) minmax(0, 1fr); gap: clamp(22px, 3vw, 40px); margin-top: 34px; align-items: start; }
.pfp-stmt { border-radius: 20px; background: #fff; border: 1px solid #DCE7EF; box-shadow: 0 40px 70px -50px rgba(8,34,56,.5); overflow: hidden; }
.pfp-stmt__head, .pfp-stmt__row { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, .8fr) minmax(0, 1.6fr); gap: 14px; padding: 12px 20px; align-items: center; }
.pfp-stmt__head { background: #082238; font: 700 11.5px/1.2 var(--f-body); letter-spacing: .08em; text-transform: uppercase; color: #BFD3E2; }
.pfp-stmt__row { border-top: 1px solid var(--pfp-line); font: 500 14.5px/1.45 var(--f-body); color: var(--pfp-body); box-shadow: inset 4px 0 0 var(--c); }
.pfp-stmt__row > span:first-child { display: flex; align-items: center; gap: 10px; font: 700 15px/1.3 var(--f-display); color: var(--pfp-ink); }
.pfp-stmt__row > span:first-child a { color: var(--pfp-ink); text-decoration: none; background: linear-gradient(currentColor, currentColor) 0 100% / 0 1.5px no-repeat; transition: background-size .25s; }
.pfp-stmt__row > span:first-child a:hover { background-size: 100% 1.5px; }
.pfp-stmt__row img { flex: none; width: 26px; height: 26px; }
.pfp-stmt__ic svg { display: block; width: 26px; height: 26px; padding: 4px; border-radius: 7px; background: #DDF4EF; fill: none; stroke: #0D9488; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.pfp-stmt__row > span:nth-child(2) { font: 700 13px/1.35 var(--f-body); color: var(--c); }
.pfp-stmt__foot { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 10px; padding: 14px 20px; border-top: 2px solid #082238; background: #F7FAFC; font: 500 14.5px/1.4 var(--f-body); color: var(--pfp-body); }
.pfp-stmt__foot b { font: 800 16px/1.2 var(--f-display); color: var(--pfp-ink); }
.pfp-notes { list-style: none; margin: 0; padding: 0; display: grid; gap: 12px; }
.pfp-notes li { position: relative; padding: 16px 18px 16px 50px; border-radius: 16px; background: #fff; border: 1px solid #E2EBF2; font-size: 15.5px; line-height: 1.55; color: var(--pfp-body); }
.pfp-notes li::before { content: ""; position: absolute; left: 16px; top: 18px; width: 22px; height: 22px; border-radius: 7px; background: #E6F0FA url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 22 22'%3E%3Cpath d='M6 11.5l3 3 7-7' fill='none' stroke='%23226DB4' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / 22px no-repeat; }
.pfp-notes li:last-child::before { background: #FFF1CC url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 22 22'%3E%3Cpath d='M11 6v6M11 15.5v.5' fill='none' stroke='%2392400E' stroke-width='2.2' stroke-linecap='round'/%3E%3C/svg%3E") center / 22px no-repeat; }
.pfp-notes b { color: var(--pfp-ink); }

/* ---------- scroll-story J2: one close card ---------- */
.pfp-ss { padding: 0; background: linear-gradient(180deg, #F3F7F9 0%, #EAF4F8 100%); overflow-x: clip; }
.pfp-ss__stage { padding-top: clamp(64px, 8vw, 104px); padding-bottom: clamp(64px, 8vw, 104px); }
.pfp-ss__head .pg-answer { margin-bottom: 0; }
.pfp-ss__board { position: relative; margin-top: 28px; }
.pfp-ss__cols { display: none; }
.pfp-ss__card { position: relative; max-width: 340px; padding: 14px 14px 12px; border-radius: 16px; background: #fff; border-top: 4px solid var(--c, #B7791F); box-shadow: 0 26px 44px -22px rgba(8,34,56,.38), 0 0 0 1px rgba(8,34,56,.06); }
.pfp-ss__ch { display: flex; align-items: center; gap: 8px; margin: 0; }
.pfp-ss__ch b { font: 800 14px/1.25 var(--f-display); color: var(--pfp-ink); }
.pfp-ss__cs { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin: 4px 0 10px; font-size: 12px; color: var(--pfp-muted); }
.pfp-ss__cs em { font: 700 10.5px/1 var(--f-body); font-style: normal; letter-spacing: .06em; text-transform: uppercase; padding: 4px 7px; border-radius: 99px; background: color-mix(in srgb, var(--c, #B7791F) 14%, #fff); color: var(--c, #B7791F); transition: background .4s, color .4s; }
.pfp-ss__fields { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; }
.pfp-ss__fields li { display: flex; gap: 7px; align-items: flex-start; padding: 2px 3px; border-radius: 5px; font: 500 12.5px/1.4 var(--f-body); color: var(--pfp-body); }
.pfp-ss__fields li::before { content: ""; flex: none; width: 14px; height: 14px; margin-top: 1px; border-radius: 4px; background: var(--pfp-green) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14 14'%3E%3Cpath d='M3.5 7.2l2.3 2.3 4.7-4.9' fill='none' stroke='%23fff' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / 14px no-repeat; }
.pfp-ss__fields li.pfp-ss__more { color: var(--pfp-muted); font-weight: 600; }
.pfp-ss__fields li.pfp-ss__more::before { background: #CBD5E1 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14 14'%3E%3Cpath d='M7 3.5v7M3.5 7h7' stroke='%23fff' stroke-width='1.8' stroke-linecap='round'/%3E%3C/svg%3E") center / 14px no-repeat; }
.pfp-ss__fields li[hidden] { display: none; }
.pfp-ss__list { list-style: none; margin: 22px 0 0; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.pfp-ss__st { background: #fff; border-radius: 20px; padding: 20px 22px; box-shadow: 0 30px 60px -44px rgba(8,34,56,.45); border-top: 5px solid var(--c); }
.pfp-ss__n { display: inline-block; margin: 0 0 8px; padding: 4px 9px; border-radius: 99px; background: var(--c); color: #fff; font: 800 12px/1.3 var(--f-body); letter-spacing: .06em; text-transform: uppercase; }
.pfp-ss__st h3 { margin: 0 0 8px; font: 700 clamp(20px, 1rem + .6vw, 24px)/1.25 var(--f-display); letter-spacing: -.02em; color: var(--pfp-ink); }
.pfp-ss__st > p:not([class]) { margin: 0; font-size: 16px; line-height: 1.6; color: var(--pfp-body); }
.pfp-ss__ok { margin: 12px 0 0; padding: 8px 10px; border-radius: 10px; background: #EEF9F2; font-size: 13.5px; line-height: 1.45; color: #146C43; font-weight: 600; }
.pfp-ss__apps { display: flex; flex-wrap: wrap; gap: 6px; margin: 12px 0 0; }
.pfp-ss__apps a { display: inline-flex; align-items: center; gap: 6px; padding: 6px 11px 6px 7px; border-radius: 99px; background: var(--pfp-paper); border: 1px solid var(--pfp-line); font: 600 13px/1.2 var(--f-body); color: var(--pfp-ink); text-decoration: none; transition: border-color .2s, background .2s; }
.pfp-ss__apps a:hover { border-color: var(--c); background: #fff; }
.pfp-ss__apps a:focus-visible, .pfp-ss__cols button:focus-visible { outline: 2px solid var(--pfp-amber); outline-offset: 2px; }
.pfp-ss__bar { display: none; }
@media (max-width: 760px) { .pfp-ss__list { grid-template-columns: 1fr; } .pfp-ss__card { max-width: none; } }

/* live (pinned) version: JS adds .pfp-ss--live on wide, tall screens with motion allowed */
.pfp-ss--live .pfp-ss__track { position: relative; height: calc(100vh + 6 * 52vh); }
.pfp-ss--live .pfp-ss__stage { position: sticky; top: 0; height: 100vh; min-height: 600px; display: flex; flex-direction: column; justify-content: center; padding-top: 92px; padding-bottom: 22px; }
.pfp-ss--live .pg-h2 { font-size: clamp(26px, 1rem + 1.2vw, 36px); margin-bottom: 8px; max-width: none; }
.pfp-ss--live .pg-answer { font-size: 16px; max-width: 100ch; }
.pfp-ss--live .pfp-ss__board { margin-top: 16px; }
.pfp-ss--live .pfp-ss__cols { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 10px; list-style: none; margin: 0; padding: 0; }
.pfp-ss__cols li { position: relative; height: clamp(236px, 34vh, 290px); border-radius: 14px; background: #E3ECF2; padding: 6px; transition: background .4s, box-shadow .4s; }
.pfp-ss__cols li.is-on { background: #fff; box-shadow: inset 0 0 0 2px var(--c); }
.pfp-ss__cols li.is-past::after { content: "Reconciled"; position: absolute; left: 13px; bottom: 12px; font: 700 11px/1.2 var(--f-body); color: #146C43; padding: 5px 8px; border-radius: 99px; background: #EEF9F2; }
.pfp-ss__cols button { display: block; width: 100%; padding: 6px 7px; border: 0; border-radius: 9px; background: transparent; text-align: left; cursor: pointer; font: 700 13px/1.25 var(--f-body); color: var(--pfp-ink); }
.pfp-ss__cols button small { display: block; margin-bottom: 3px; font: 700 10.5px/1.2 var(--f-body); letter-spacing: .08em; text-transform: uppercase; color: var(--c); }
.pfp-ss__cols button:hover { background: rgba(255,255,255,.7); }
.pfp-ss--live .pfp-ss__card { position: absolute; top: 52px; left: 6px; width: calc((100% - 50px) / 6 - 12px); max-width: none; padding: 11px 10px 10px; z-index: 2; transition: transform .8s cubic-bezier(.6,0,.2,1), border-color .4s; }
.pfp-ss--live .pfp-ss__ch img { display: none; }
.pfp-ss--live .pfp-ss__ch b { font-size: 13px; }
.pfp-ss--live .pfp-ss__cs { margin-bottom: 8px; font-size: 11px; gap: 4px; }
.pfp-ss--live .pfp-ss__fields { gap: 4px; }
.pfp-ss--live .pfp-ss__fields li { font-size: 11.5px; line-height: 1.35; }
.pfp-ss__fields li.is-new { background: #FFF6DB; animation: pfpss-in .5s both; }
@keyframes pfpss-in { from { opacity: 0; transform: translateY(8px); } }
.pfp-ss--live .pfp-ss__list { display: grid; grid-template-columns: 1fr; margin-top: 16px; }
.pfp-ss--live .pfp-ss__st { grid-area: 1 / 1; display: grid; grid-template-columns: minmax(0, .85fr) minmax(0, 1.3fr); column-gap: 28px; align-content: start; padding: 16px 22px; opacity: 0; pointer-events: none; transform: translateY(10px); transition: opacity .2s, transform .2s; }
.pfp-ss--live .pfp-ss__st.is-on { opacity: 1; pointer-events: auto; transform: none; transition: opacity .4s .12s, transform .5s .12s cubic-bezier(.2,.8,.2,1); }
.pfp-ss--live .pfp-ss__st > * { grid-column: 1; }
.pfp-ss--live .pfp-ss__st > p:not([class]), .pfp-ss--live .pfp-ss__apps { grid-column: 2; }
.pfp-ss--live .pfp-ss__st > p:not([class]) { grid-row: 1 / span 3; font-size: 15.5px; line-height: 1.55; }
.pfp-ss--live .pfp-ss__n { justify-self: start; }
.pfp-ss--live .pfp-ss__st h3 { font-size: 21px; }
.pfp-ss--live .pfp-ss__ok { margin-top: 6px; font-size: 13px; }
.pfp-ss--live .pfp-ss__apps { margin-top: 10px; }
.pfp-ss--live .pfp-ss__bar { display: flex; justify-content: center; gap: 6px; margin-top: 14px; }
.pfp-ss__bar i { width: 26px; height: 5px; border-radius: 4px; background: rgba(8,34,56,.14); transition: background .4s; }
.pfp-ss__bar i.on { background: var(--pfp-amber); }
@media (max-height: 780px) {
  .pfp-ss--live .pfp-ss__stage { padding-top: 86px; padding-bottom: 14px; }
  .pfp-ss--live .pfp-ss__head .hp-kick { display: none; }
  .pfp-ss--live .pg-h2 { font-size: 28px; }
  .pfp-ss--live .pg-answer { font-size: 15px; line-height: 1.5; max-width: none; }
  .pfp-ss--live .pfp-ss__board, .pfp-ss--live .pfp-ss__list { margin-top: 12px; }
  .pfp-ss--live .pfp-ss__cols li { height: 228px; }
  .pfp-ss--live .pfp-ss__card { top: 48px; padding: 9px 9px 8px; }
  .pfp-ss--live .pfp-ss__fields { gap: 2px; }
  .pfp-ss--live .pfp-ss__fields li { font-size: 11px; }
  .pfp-ss--live .pfp-ss__st { padding: 12px 20px 14px; }
  .pfp-ss--live .pfp-ss__st h3 { font-size: 19px; margin-bottom: 4px; }
  .pfp-ss--live .pfp-ss__n { margin-bottom: 6px; }
  .pfp-ss--live .pfp-ss__st > p:not([class]) { font-size: 14.5px; line-height: 1.5; }
  .pfp-ss--live .pfp-ss__ok { font-size: 12.5px; padding: 6px 9px; }
  .pfp-ss--live .pfp-ss__apps { margin-top: 8px; }
  .pfp-ss--live .pfp-ss__bar { margin-top: 10px; }
}

/* ---------- signature interactive: what Finance Plus replaces ---------- */
.pfp-pk { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); gap: clamp(18px, 3vw, 36px); margin-top: 34px; align-items: start; }
.pfp-pk__in { display: grid; gap: 14px; }
.pfp-pk__grp { margin: 0; padding: 14px 16px 16px; border: 1px solid rgba(159,192,216,.22); border-radius: 18px; background: rgba(255,255,255,.04); display: flex; flex-wrap: wrap; gap: 8px; }
.pfp-pk__grp legend { padding: 0 6px; font: 700 11.5px/1.3 var(--f-body); letter-spacing: .1em; text-transform: uppercase; color: #9FC0D8; }
.pfp-chip { display: inline-flex; align-items: center; gap: 8px; padding: 8px 13px 8px 9px; border-radius: 999px; border: 1px solid rgba(255,255,255,.2); background: rgba(255,255,255,.08); color: #fff; font: 600 13.5px/1.3 var(--f-body); cursor: pointer; transition: background .2s, border-color .2s, color .2s, transform .2s; }
.pfp-chip img, .pfp-chip svg { flex: none; width: 22px; height: 22px; padding: 2px; border-radius: 6px; background: #fff; }
.pfp-chip svg { fill: none; stroke: #0A3A63; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; padding: 3px; }
.pfp-chip:hover { background: rgba(255,255,255,.16); }
.pfp-chip[aria-pressed="true"] { background: #FFB81C; border-color: #FFB81C; color: #082238; transform: translateY(-1px); }
.pfp-chip:focus-visible, .pfp-pk__reset:focus-visible, .pfp-calc button:focus-visible { outline: 2px solid #FFB81C; outline-offset: 2px; }
.pfp-pk__out { position: sticky; top: 96px; padding: 20px 20px 18px; border-radius: 22px; background: #fff; color: var(--pfp-body); box-shadow: 0 40px 70px -40px rgba(0,0,0,.6); }
.pfp-pk__lbl { display: flex; justify-content: space-between; gap: 8px; margin: 0 0 6px; font: 700 12px/1.3 var(--f-body); letter-spacing: .08em; text-transform: uppercase; color: var(--pfp-muted); }
.pfp-pk__lbl em { font-style: normal; letter-spacing: 0; text-transform: none; padding: 2px 8px; border-radius: 99px; background: var(--pfp-paper); }
.pfp-pk__sum { margin: 0 0 12px; font: 700 18px/1.4 var(--f-display); color: var(--pfp-ink); }
.pfp-pk__tally { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; margin-bottom: 12px; }
.pfp-pk__tally span { display: grid; gap: 2px; padding: 10px; border-radius: 12px; font: 600 12px/1.3 var(--f-body); }
.pfp-pk__tally b { font: 800 22px/1.1 var(--f-display); font-variant-numeric: tabular-nums; }
.pfp-pk__tally .is-rep { background: #E8F5FC; color: #0A6FA8; }
.pfp-pk__tally .is-keep { background: #EEF9F2; color: #146C43; }
.pfp-pk__tally .is-out { background: #FFF1EC; color: #B4442A; }
.pfp-pk__list { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; max-height: 360px; overflow: auto; }
.pfp-pk__list li { display: grid; grid-template-columns: minmax(0, 1fr); gap: 3px; padding: 10px 12px; border-radius: 12px; border: 1px solid var(--pfp-line); border-left: 4px solid var(--k, #0A84C1); animation: pfpss-in .35s both; }
.pfp-pk__list li[data-k="keep"] { --k: #1E9E62; }
.pfp-pk__list li[data-k="out"] { --k: #E0623F; }
.pfp-pk__list p { margin: 0; display: flex; flex-wrap: wrap; align-items: center; gap: 6px; font: 700 14px/1.35 var(--f-display); color: var(--pfp-ink); }
.pfp-pk__list p img { width: 18px; height: 18px; }
.pfp-pk__list p i { font-style: normal; color: var(--pfp-muted); font-weight: 600; }
.pfp-pk__list small { font: 500 13px/1.5 var(--f-body); color: var(--pfp-body); }
.pfp-pk__btns { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; margin-top: 14px; }
.pfp-pk__btns .btn[disabled] { opacity: .5; cursor: not-allowed; }
.pfp-pk__reset { border: 0; background: none; font: 600 14px/1.2 var(--f-body); color: var(--pfp-muted); text-decoration: underline; cursor: pointer; padding: 6px 2px; }

/* ---------- pricing ---------- */
.pfp-cost__grid { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); gap: clamp(24px, 4vw, 56px); align-items: start; }
.pfp-addons th small, .pfp-addons td small { display: block; font-weight: 500; }
.pfp-calc { padding: 24px; border-radius: 24px; background: #fff; border: 1px solid #DCE7EF; box-shadow: 0 40px 70px -48px rgba(8,34,56,.55); }
.pfp-calc__h { margin: 0 0 14px; font: 800 19px/1.3 var(--f-display); color: var(--pfp-ink); }
.pfp-calc__bill { display: inline-flex; padding: 4px; border-radius: 999px; background: var(--pfp-paper); margin-bottom: 18px; }
.pfp-calc__bill button { padding: 8px 14px; border: 0; border-radius: 999px; background: transparent; font: 600 13.5px/1.2 var(--f-body); color: var(--pfp-body); cursor: pointer; }
.pfp-calc__bill button.is-on { background: #082238; color: #fff; }
.pfp-calc__users { display: grid; gap: 10px; font: 600 14px/1.3 var(--f-body); color: var(--pfp-body); }
.pfp-calc__users span { display: flex; justify-content: space-between; }
.pfp-calc__users b { font: 800 18px/1 var(--f-display); color: var(--pfp-ink); }
.pfp-calc__users input { width: 100%; accent-color: #0A84C1; }
.pfp-calc__out { margin-top: 18px; padding: 16px 18px; border-radius: 16px; background: linear-gradient(135deg, #061A2E, #0A3A63 55%, #07605E); color: #fff; }
.pfp-calc__big { margin: 0; display: flex; align-items: baseline; gap: 8px; }
.pfp-calc__big b { font: 800 34px/1.15 var(--f-display); letter-spacing: -.02em; font-variant-numeric: tabular-nums; }
.pfp-calc__big span { font: 500 14px/1.3 var(--f-body); color: #BFD3E2; }
.pfp-calc__small { margin: 4px 0 0; font: 500 13.5px/1.45 var(--f-body); color: #BFD3E2; }
.pfp-calc__note { margin: 14px 0 0; font-size: 13.5px; line-height: 1.55; color: var(--pfp-muted); }

/* ---------- scope: three cards ---------- */
.pfp-scope .pfp-scope__grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }

/* ---------- responsive ---------- */
@media (max-width: 1100px) {
  .pfp-what__grid { grid-template-columns: 1fr; }
  .pfp-notes { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 980px) {
  .pfp-hero .pfp-hero__grid { grid-template-columns: 1fr; }
  .pfp-board { max-width: 560px; }
  .pfp-pk, .pfp-cost__grid { grid-template-columns: 1fr; }
  .pfp-pk__out { position: static; }
  .pfp-scope .pfp-scope__grid { grid-template-columns: 1fr; }
}
@media (max-width: 640px) {
  .pfp-notes { grid-template-columns: 1fr; }
  .pfp-stmt__head { display: none; }
  .pfp-stmt__row { grid-template-columns: 1fr; gap: 4px; padding: 14px 16px; }
  .pfp-stmt__row > span:nth-child(2)::before { content: "In the plan: "; color: var(--pfp-muted); font-weight: 600; }
  .pfp-tile { grid-template-columns: 26px minmax(0, 1fr); gap: 10px; }
  .pfp-tile img { width: 26px; height: 26px; }
  .pfp-tile .pfp-st { grid-column: 2; justify-self: start; min-width: 0; }
  .pfp-tile p span { white-space: normal; }
  .pfp-float--a { right: 0; top: -8px; }
  .pfp-board__top { flex-wrap: wrap; }
  .pfp-pk__tally b { font-size: 19px; }
  .pfp-calc { padding: 18px; }
}
@media (prefers-reduced-motion: reduce) {
  .pfp-tile, .pfp-st, .pfp-board__bar i, .pfp-board__done, .pfp-chip { transition: none; }
  .pfp-tile.is-work .pfp-st i, .pfp-ss__fields li.is-new, .pfp-pk__list li { animation: none; }
}

/* ---------- mid kit tweaks scoped to this page ---------- */
.pfp-fit .mk-wipe { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.pfp-fit .mk-wipe__item { min-height: 200px; }
.pfp-cost .pfp-addons { min-width: 0; }
@media (max-width: 760px) { .pfp-fit .mk-wipe { grid-template-columns: 1fr; } .pfp-fit .mk-wipe__item { min-height: 260px; } }
@media (max-width: 760px) { .pfp-fit .mk-wipe__a, .pfp-fit .mk-wipe__b { padding-top: 76px; } .pfp-fit .mk-wipe__item { min-height: 300px; } }

/* ---------- who sees what ---------- */
.pfp-access__roles { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 28px; }
.pfp-access__roles button { padding: 9px 15px; border-radius: 99px; border: 1.5px solid #CFE2EE; background: #fff; font: 600 14px/1 var(--f-body); color: var(--pfp-ink); cursor: pointer; transition: background-color .2s, color .2s, border-color .2s; }
.pfp-access__roles button[aria-pressed="true"] { background: var(--pfp-ink); border-color: var(--pfp-ink); color: #fff; }
.pfp-access__roles button:focus-visible, .pfp-tabs__bar button:focus-visible, .pfp-access__wrap:focus-visible { outline: 2px solid var(--pfp-blue); outline-offset: 2px; }
.pfp-access__say { min-height: 1.6em; margin: 14px 0 0; font-size: 15.5px; color: var(--pfp-ink); }
.pfp-access__wrap { margin-top: 12px; overflow-x: auto; border-radius: 20px; box-shadow: 0 0 0 1px var(--pfp-line), 0 26px 50px -44px rgba(8,34,56,.55); background: #fff; }
.pfp-access__t { width: 100%; min-width: 760px; border-collapse: collapse; font-size: 14px; }
.pfp-access__t th, .pfp-access__t td { padding: 12px 14px; text-align: left; border-bottom: 1px solid var(--pfp-line); transition: background-color .25s, opacity .25s; }
.pfp-access__t thead th { font: 700 12.5px/1.2 var(--f-body); letter-spacing: .04em; text-transform: uppercase; color: var(--pfp-muted); background: var(--pfp-paper); }
.pfp-access__t tbody th { font: 600 14.5px/1.3 var(--f-display); color: var(--pfp-ink); white-space: nowrap; }
.pfp-access__t tbody tr:last-child > * { border-bottom: 0; }
.pfp-access__t td { font-weight: 600; white-space: nowrap; }
.pfp-access__t td::before { content: ""; display: inline-block; width: 10px; height: 10px; margin-right: 7px; border-radius: 3px; vertical-align: -1px; }
.pfp-access__t td[data-v="full"]::before { background: #0A6FA8; }
.pfp-access__t td[data-v="view"]::before { background: #7CC6E6; }
.pfp-access__t td[data-v="team"]::before { background: #3FB97A; }
.pfp-access__t td[data-v="self"]::before { background: #FFB81C; }
.pfp-access__t td[data-v="none"] { color: #94A3B8; font-weight: 500; }
.pfp-access__t td[data-v="none"]::before { background: #E2E8F0; }
.pfp-access__t.has-role td:not(.is-col), .pfp-access__t.has-role thead th:not(.is-col):not(:first-child) { opacity: .38; }
.pfp-access__t .is-col { background: #EEF8FD; opacity: 1; }
.pfp-access__t thead .is-col { background: #DDF0FA; color: var(--pfp-ink); }

/* ---------- connections + moving from ---------- */
.pfp-connect__cards { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; margin: 34px 0 0; padding: 0; list-style: none; }
.pfp-connect__cards li { padding: 22px; border-radius: 20px; background: #fff; border: 1px solid var(--pfp-line); }
.pfp-connect__cards img, .pfp-connect__mono { width: 34px; height: 34px; }
.pfp-connect__mono { display: grid; place-items: center; border-radius: 10px; background: #E9F7EF; color: var(--pfp-green); }
.pfp-connect__mono svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.pfp-connect__cards h3 { margin: 12px 0 6px; font: 700 18px/1.3 var(--f-display); color: var(--pfp-ink); }
.pfp-connect__cards h3 a { color: inherit; text-decoration: none; }
.pfp-connect__cards h3 a:hover { color: var(--pfp-blue); }
.pfp-connect__cards p { margin: 0; font-size: 15px; line-height: 1.6; }
.pfp-from { margin-top: 36px; padding: clamp(20px, 2.6vw, 28px); border-radius: 24px; background: linear-gradient(140deg, #F0F7FD, #F6FBF8); border: 1px solid #DCEBF3; }
.pfp-from__q { margin: 0 0 10px; font: 700 13px/1.2 var(--f-body); letter-spacing: .07em; text-transform: uppercase; color: var(--pfp-muted); }
.pfp-tabs__bar { display: flex; flex-wrap: wrap; gap: 6px; padding: 5px; border-radius: 16px; background: #fff; border: 1px solid var(--pfp-line); width: fit-content; max-width: 100%; }
.pfp-tabs__bar button { padding: 10px 16px; border: 0; border-radius: 12px; background: transparent; font: 600 14.5px/1 var(--f-body); color: var(--pfp-body); cursor: pointer; transition: background-color .2s, color .2s; }
.pfp-tabs__bar button[aria-selected="true"] { background: var(--pfp-ink); color: #fff; }
.pfp-from__p { margin-top: 16px; }
.pfp-from__p[hidden] { display: none; }
.pfp-from__p dl { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; margin: 0 0 14px; }
.pfp-from__p dl div { padding: 16px; border-radius: 14px; background: #fff; border: 1px solid var(--pfp-line); }
.pfp-from__p dt { font: 700 11.5px/1.2 var(--f-body); letter-spacing: .07em; text-transform: uppercase; color: var(--pfp-blue); }
.pfp-from__p dd { margin: 6px 0 0; font-size: 15px; line-height: 1.5; color: var(--pfp-ink); }

/* ---------- packages ---------- */
.pfp-pkg__list { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; margin: 40px 0 0; padding: 0; list-style: none; align-items: stretch; }
.pfp-pkg__card { position: relative; display: flex; flex-direction: column; padding: 26px 24px; border-radius: 22px; background: #fff; border: 1px solid var(--pfp-line); box-shadow: 0 24px 50px -42px rgba(8,34,56,.55); }
.pfp-pkg__card.is-pick { border: 0; box-shadow: 0 0 0 2px var(--pfp-blue), 0 34px 60px -36px rgba(10,111,168,.55); }
.pfp-pkg__flag { position: absolute; top: -13px; left: 22px; margin: 0; padding: 5px 12px; border-radius: 99px; background: var(--pfp-amber); color: var(--pfp-ink); font: 700 12px/1.2 var(--f-body); }
.pfp-pkg__lanes { display: grid; grid-template-columns: repeat(4, 1fr); gap: 5px; margin: 0 0 16px; }
.pfp-pkg__lanes i { height: 6px; border-radius: 3px; background: var(--c); }
.pfp-pkg__lanes i.is-off { background: #E2E8F0; }
.pfp-pkg__card h3 { margin: 0; font: 700 21px/1.25 var(--f-display); color: var(--pfp-ink); }
.pfp-pkg__for { margin: 6px 0 0; font-size: 14.5px; color: var(--pfp-muted); }
.pfp-pkg__card ul { display: grid; gap: 8px; margin: 16px 0 0; padding: 16px 0 0; border-top: 1px dashed var(--pfp-line); list-style: none; flex: 1; align-content: start; }
.pfp-pkg__card li { position: relative; padding-left: 22px; font-size: 15px; line-height: 1.45; }
.pfp-pkg__card li::before { content: ""; position: absolute; left: 2px; top: 5px; width: 10px; height: 5px; border-left: 2px solid var(--pfp-blue); border-bottom: 2px solid var(--pfp-blue); transform: rotate(-45deg); }
.pfp-pkg__fee { margin: 18px 0 0; padding: 12px 14px; border-radius: 12px; background: var(--pfp-paper); font: 600 14.5px/1.45 var(--f-body); color: var(--pfp-ink); }

/* ---------- rollout ---------- */
.pfp-roll__list { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 10px; margin: 36px 0 18px; padding: 0; list-style: none; counter-reset: pfp; }
.pfp-roll__list li { position: relative; display: grid; gap: 6px; align-content: start; padding: 46px 14px 16px; border-radius: 16px; background: #fff; border: 1px solid var(--pfp-line); counter-increment: pfp; }
.pfp-roll__list li::before { content: counter(pfp, decimal-leading-zero); position: absolute; left: 14px; top: 14px; font: 800 15px/1 var(--f-display); color: var(--pfp-blue); }
.pfp-roll__list li.is-key { background: #F0FAF5; border-color: #A9DCC1; }
.pfp-roll__list li.is-key::before { color: var(--pfp-green); }
.pfp-roll__list b { font: 700 15px/1.3 var(--f-display); color: var(--pfp-ink); }
.pfp-roll__list span { font-size: 13.5px; line-height: 1.5; }

/* ---------- industries ---------- */
.pfp-ind__list { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; margin: 34px 0 0; padding: 0; list-style: none; }
.pfp-ind__list a { display: grid; gap: 6px; height: 100%; box-sizing: border-box; padding: 20px 22px; border-radius: 18px; background: #fff; border: 1px solid var(--pfp-line); border-left: 4px solid var(--c); text-decoration: none; transition: transform .25s, box-shadow .25s, background-color .25s; }
.pfp-ind__list a:hover { transform: translateY(-3px); box-shadow: 0 20px 40px -30px rgba(8,34,56,.55); background: var(--bg); }
.pfp-ind__list b { font: 700 17px/1.3 var(--f-display); color: var(--pfp-ink); }
.pfp-ind__list span { font-size: 14.5px; line-height: 1.55; color: var(--pfp-body); }

@media (max-width: 1100px) { .pfp-roll__list { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
@media (max-width: 980px) {
  .pfp-pkg__list { grid-template-columns: minmax(0, 1fr); max-width: 560px; }
  .pfp-connect__cards { grid-template-columns: minmax(0, 1fr); }
  .pfp-ind__list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 640px) {
  .pfp-from__p dl, .pfp-ind__list { grid-template-columns: minmax(0, 1fr); }
  .pfp-roll__list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .pfp-tabs__bar button { padding: 9px 12px; font-size: 14px; }
}
@media (prefers-reduced-motion: reduce) {
  .pfp-ind__list a, .pfp-access__t th, .pfp-access__t td, .pfp-access__roles button { transition: none !important; }
}