/* Lending & fintech industry landing only. Every class is scoped with .pil- (loaded via extra: crm, p-ind-lending-fintech). */
:root { --pil-ink: #082238; --pil-body: #334155; --pil-muted: #64748B; --pil-line: #E2E8F0; --pil-paper: #F3F7F9; --pil-blue: #00A3D9; --pil-link: #0A6FA8; --pil-navy: #1D3F8F; --pil-green: #1E9E62; --pil-amber: #FFB81C; --pil-manila: #F6E7C1; --pil-manila-d: #E9D29A; }

/* ---------- 1. hero: loan file stack + borrower phone ---------- */
.pil-hero__grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(32px, 4.5vw, 64px); align-items: center; }
.pil-hero .pg-h1 { max-width: 19ch; font-size: clamp(34px, 1.1rem + 2.5vw, 52px); }
.pil-hero .pg-lead { font-size: 17px; }
.pil-desk { position: relative; margin: 0; padding: 18px 0 56px; min-width: 0; }
.pil-stack { position: relative; margin-right: 128px; padding-top: 34px; }
.pil-stack__back { position: absolute; left: 0; right: 0; top: 34px; bottom: 0; border-radius: 6px 18px 18px 18px; background: var(--pil-manila-d); box-shadow: 0 18px 30px -24px rgba(8,34,56,.6); }
.pil-stack__back--1 { transform: translate(10px, -10px) rotate(1.4deg); background: #EFDDAA; }
.pil-stack__back--2 { transform: translate(20px, -20px) rotate(2.6deg); background: #E3C98A; }
.pil-stack__back--3 { transform: translate(30px, -28px) rotate(3.8deg); background: #D9BC78; }
.pil-folder { position: relative; z-index: 1; padding: 14px; border-radius: 4px 18px 18px 18px; background: var(--pil-manila); box-shadow: 0 50px 90px -50px rgba(8,34,56,.55), 0 14px 30px -24px rgba(8,34,56,.35); }
.pil-tabs { position: absolute; left: 0; right: 0; bottom: 100%; display: flex; gap: 4px; margin: 0; padding: 0 0 0 0; list-style: none; }
.pil-tabs li { flex: 1 1 0; min-width: 0; padding: 7px 6px 6px; border-radius: 10px 10px 0 0; background: #EADBB0; font: 700 11px/1.1 var(--f-body); letter-spacing: .02em; text-align: center; color: #7A6534; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; transition: background-color .4s, color .4s, transform .4s; transform: translateY(5px); }
.pil-tabs li[data-pil-tab="0"] { flex-grow: 1.35; }
.pil-tabs li[data-pil-tab="2"] { flex-grow: 1.6; }
.pil-tabs li.is-done { background: color-mix(in srgb, var(--c) 18%, var(--pil-manila)); color: color-mix(in srgb, var(--c) 70%, #1a1a1a); transform: translateY(3px); }
.pil-tabs li.is-on { background: var(--c); color: #fff; transform: none; }
.pil-sheet { position: relative; margin: 0; padding: 16px 18px 18px; border-radius: 12px; background: #fff; box-shadow: 0 -2px 0 rgba(8,34,56,.04), 0 18px 30px -26px rgba(8,34,56,.6); overflow: hidden; }
.pil-sheet__head { display: flex; align-items: center; gap: 10px; padding-bottom: 12px; border-bottom: 2px solid var(--pil-ink); }
.pil-sheet__head img { flex: none; padding: 4px; border-radius: 8px; background: var(--pil-paper); }
.pil-sheet__head div { display: grid; min-width: 0; }
.pil-sheet__head b { font: 800 15px/1.2 var(--f-display); color: var(--pil-ink); }
.pil-sheet__head span { font-size: 12.5px; color: var(--pil-muted); }
.pil-sheet__head em { margin-left: auto; font-style: normal; font-size: 10.5px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; padding: 3px 8px; border-radius: 99px; background: #FFF4D6; color: #8A5A00; }
.pil-sheet__terms { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; margin: 12px 0 0; }
.pil-sheet__terms div { min-width: 0; }
.pil-sheet__terms dt { font: 600 10.5px/1.2 var(--f-body); letter-spacing: .06em; text-transform: uppercase; color: var(--pil-muted); }
.pil-sheet__terms dd { margin: 3px 0 0; font: 700 13.5px/1.25 var(--f-display); color: var(--pil-ink); font-variant-numeric: tabular-nums; }
.pil-sheet__terms [data-pil-status] { color: var(--pil-link); }
.pil-checks { display: grid; gap: 6px; margin: 14px 0 6px; padding: 0; list-style: none; }
.pil-checks li { position: relative; padding: 7px 10px 7px 32px; border-radius: 10px; background: var(--pil-paper); font-size: 13px; color: var(--pil-muted); transition: background-color .4s, color .4s; }
.pil-checks li::before { content: ""; position: absolute; left: 10px; top: 50%; width: 14px; height: 14px; margin-top: -7px; border-radius: 50%; border: 1.5px dashed #94A3B8; box-sizing: border-box; transition: all .35s; }
.pil-checks li.is-done { background: #E9F7EF; color: var(--pil-ink); }
.pil-checks li.is-done::before { border: 0; background: var(--pil-green) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M4 8.5l2.5 2.5L12 5.5' fill='none' stroke='%23fff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / 12px no-repeat; }
.pil-stamp { position: absolute; right: 18px; bottom: 26px; margin: 0; padding: 6px 14px; border: 3px solid var(--pil-green); border-radius: 10px; font: 800 22px/1 var(--f-display); letter-spacing: .12em; text-transform: uppercase; color: var(--pil-green); background: rgba(255,255,255,.8); transform: rotate(-12deg) scale(1.9); opacity: 0; transition: opacity .25s, transform .45s cubic-bezier(.2,1.6,.4,1); pointer-events: none; }
.pil-stamp.is-on { opacity: 1; transform: rotate(-12deg) scale(1); }

.pil-phone { position: absolute; right: 0; bottom: 0; z-index: 3; width: 176px; padding: 9px; border-radius: 30px; background: #0B1B2C; box-shadow: 0 40px 70px -30px rgba(8,34,56,.75), inset 0 0 0 1.5px #24394F; }
.pil-phone__notch { position: absolute; left: 50%; top: 14px; width: 54px; height: 14px; margin-left: -27px; border-radius: 99px; background: #0B1B2C; z-index: 2; }
.pil-phone__scr { position: relative; min-height: 300px; padding: 34px 12px 14px; border-radius: 22px; background: linear-gradient(180deg, #F4FAFD, #fff 40%); overflow: hidden; }
.pil-phone__brand { display: flex; align-items: center; gap: 6px; margin: 0; font: 700 10.5px/1 var(--f-body); letter-spacing: .06em; text-transform: uppercase; color: var(--pil-muted); }
.pil-phone__hi { margin: 8px 0 12px; font: 800 14.5px/1.25 var(--f-display); color: var(--pil-ink); }
.pil-phone__steps { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 3px; margin: 0; padding: 0; list-style: none; }
.pil-phone__steps li { position: relative; padding-top: 12px; font: 600 8px/1.1 var(--f-body); color: #94A3B8; overflow: hidden; text-overflow: clip; text-align: center; }
.pil-phone__steps li::before { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 5px; border-radius: 99px; background: #E2E8F0; transition: background-color .4s; }
.pil-phone__steps li.is-done { color: var(--pil-ink); }
.pil-phone__steps li.is-done::before { background: var(--pil-blue); }
.pil-phone__card { margin-top: 14px; padding: 11px; border-radius: 14px; background: #fff; border: 1px solid var(--pil-line); box-shadow: 0 14px 24px -20px rgba(8,34,56,.6); }
.pil-phone__card small { display: block; font: 700 9.5px/1 var(--f-body); letter-spacing: .07em; text-transform: uppercase; color: var(--pil-amber); color: #B07800; }
.pil-phone__card b { display: block; margin-top: 5px; font: 700 12.5px/1.3 var(--f-display); color: var(--pil-ink); min-height: 2.6em; }
.pil-phone__card.is-good small { color: var(--pil-green); }
.pil-phone__bar { display: block; height: 5px; margin-top: 9px; border-radius: 99px; background: #EEF2F6; overflow: hidden; }
.pil-phone__bar i { display: block; height: 100%; width: var(--w, 0%); border-radius: inherit; background: linear-gradient(90deg, #1D3F8F, #00A3D9, #00B2A9); transition: width .6s ease; }
.pil-phone__toast { position: absolute; left: 10px; right: 10px; bottom: 12px; margin: 0; padding: 8px 10px; border-radius: 12px; background: var(--pil-ink); color: #fff; font: 600 11px/1.3 var(--f-body); box-shadow: 0 12px 24px -12px rgba(8,34,56,.8); transition: opacity .35s, transform .35s; }
.pil-phone__toast { opacity: 0; transform: translateY(10px); }
.pil-phone__toast.is-on { opacity: 1; transform: none; }
.pil-replay { position: absolute; left: 0; bottom: 4px; padding: 8px 14px; border: 1px solid var(--pil-line); border-radius: 99px; background: #fff; font: 600 13px/1 var(--f-body); color: var(--pil-link); cursor: pointer; }
.pil-replay:hover { border-color: var(--pil-blue); }
.pil-replay:focus-visible, .pil-from__bar button:focus-visible, .pil-sw button:focus-visible, .pil-seg input:focus-visible + span, .pil-chk input:focus-visible + span { outline: 2px solid var(--pil-blue); outline-offset: 2px; }

/* ---------- 2. which one are you ---------- */
.pil-who__grid { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 14px; margin: 36px 0 0; padding: 0; list-style: none; }
.pil-who__grid a { position: relative; display: flex; flex-direction: column; gap: 8px; height: 100%; padding: 20px 18px 18px; border-radius: 20px; background: #fff; border: 1px solid var(--pil-line); text-decoration: none; color: var(--pil-body); box-shadow: 0 24px 50px -44px rgba(8,34,56,.6); transition: transform .25s, box-shadow .25s, border-color .25s; }
.pil-who__grid a:hover { transform: translateY(-4px); border-color: color-mix(in srgb, var(--c) 45%, transparent); box-shadow: 0 30px 50px -36px rgba(8,34,56,.55); }
.pil-who__grid a:focus-visible { outline: 2px solid var(--c); outline-offset: 3px; }
.pil-who__ic { display: grid; place-items: center; width: 44px; height: 44px; border-radius: 13px; background: var(--bg); color: var(--c); }
.pil-who__ic svg { width: 24px; height: 24px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.pil-who__grid b { font: 700 17px/1.25 var(--f-display); color: var(--pil-ink); }
.pil-who__grid span:not(.pil-who__ic) { font-size: 14.5px; line-height: 1.5; }
.pil-who__grid em { margin-top: auto; padding-top: 10px; border-top: 1px dashed var(--pil-line); font: 600 12.5px/1.3 var(--f-body); font-style: normal; color: var(--c); }

/* ---------- 3. stamped document trail ---------- */
.pil-trail { background: linear-gradient(180deg, var(--pil-paper), #fff); }
.pil-trail__list { position: relative; display: grid; gap: 22px; max-width: 980px; margin: 44px auto 0; padding: 0; list-style: none; }
.pil-trail__list::before { content: ""; position: absolute; left: 50%; top: 10px; bottom: 10px; width: 0; border-left: 2px dashed #B8C7D6; }
.pil-doc { position: relative; width: calc(50% - 34px); padding: 22px 24px 20px; border-radius: 6px; background: #fff; border: 1px solid var(--pil-line); box-shadow: 0 1px 0 #fff, 4px 4px 0 -1px #F7F9FB, 4px 4px 0 0 var(--pil-line), 0 26px 40px -34px rgba(8,34,56,.55); transition: transform .5s, opacity .5s; }
.pil-doc::before { content: ""; position: absolute; top: 28px; width: 14px; height: 14px; border-radius: 50%; background: var(--c); box-shadow: 0 0 0 5px color-mix(in srgb, var(--c) 18%, #fff); }
.pil-doc:nth-child(odd) { justify-self: start; transform: rotate(-.6deg); }
.pil-doc:nth-child(even) { justify-self: end; transform: rotate(.6deg); }
.pil-doc:nth-child(odd)::before { right: -42px; }
.pil-doc:nth-child(even)::before { left: -42px; }
.pil-doc + .pil-doc { margin-top: -96px; }
.pil-doc__n { margin: 0; font: 700 11.5px/1 var(--f-body); letter-spacing: .1em; text-transform: uppercase; color: var(--c); }
.pil-doc h3 { margin: 8px 0 8px; font: 700 19px/1.25 var(--f-display); color: var(--pil-ink); }
.pil-doc p { margin: 0; font-size: 15px; line-height: 1.6; }
.pil-doc__apps { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 14px !important; }
.pil-doc__apps a { display: inline-flex; align-items: center; gap: 6px; padding: 5px 10px 5px 6px; border-radius: 99px; background: var(--pil-paper); font: 600 13px/1.2 var(--f-body); color: var(--pil-link); text-decoration: none; }
.pil-doc__apps a:hover { background: #E3F4FB; }
.pil-doc__mono { display: grid; place-items: center; width: 20px; height: 20px; border-radius: 6px; background: var(--pil-ink); color: #fff; font: 800 7.5px/1 var(--f-body); }
.pil-doc__stamp { position: absolute; right: 18px; top: 16px; padding: 4px 10px; border: 2.5px solid var(--c); border-radius: 8px; font: 800 13px/1 var(--f-display); letter-spacing: .12em; text-transform: uppercase; color: var(--c); background: rgba(255,255,255,.85); transform: rotate(-9deg); opacity: .9; }
.pil-js .pil-doc__stamp { opacity: 0; transform: rotate(-9deg) scale(2.2); transition: opacity .2s .25s, transform .4s .25s cubic-bezier(.2,1.6,.4,1); }
.pil-js .pil-doc.is-stamped .pil-doc__stamp { opacity: .9; transform: rotate(-9deg) scale(1); }
.pil-doc h3 { padding-right: 108px; }

/* ---------- 4. pipeline builder (dark band) ---------- */
.pil-build__grid { display: grid; grid-template-columns: minmax(0, .82fr) minmax(0, 1.18fr); gap: clamp(18px, 2.4vw, 32px); margin-top: 36px; align-items: start; }
.pil-build__form, .pil-build__out { min-width: 0; padding: clamp(18px, 2vw, 26px); border-radius: 24px; background: rgba(255,255,255,.06); border: 1px solid rgba(255,255,255,.12); backdrop-filter: blur(6px); }
.pil-build__form fieldset { margin: 0 0 18px; padding: 0; border: 0; min-width: 0; }
.pil-build__form fieldset:last-child { margin-bottom: 0; }
.pil-build__form legend { margin-bottom: 10px; font: 700 12px/1 var(--f-body); letter-spacing: .08em; text-transform: uppercase; color: #9FC0D8; }
.pil-seg, .pil-chk { display: flex; flex-wrap: wrap; gap: 8px; }
.pil-seg label, .pil-chk label { position: relative; cursor: pointer; }
.pil-seg input, .pil-chk input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.pil-seg span, .pil-chk span { display: inline-flex; align-items: center; gap: 7px; padding: 8px 12px; border-radius: 99px; border: 1px solid rgba(255,255,255,.22); font: 600 13.5px/1.2 var(--f-body); color: #DCE8F1; transition: background-color .2s, border-color .2s, color .2s; }
.pil-chk span::before { content: ""; flex: none; width: 12px; height: 12px; border-radius: 4px; border: 1.5px solid rgba(255,255,255,.5); box-sizing: border-box; }
.pil-seg input:checked + span { background: var(--pil-amber); border-color: var(--pil-amber); color: var(--pil-ink); }
.pil-chk input:checked + span { background: rgba(95,211,243,.16); border-color: #5FD3F3; color: #fff; }
.pil-chk input:checked + span::before { border: 0; background: #5FD3F3 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M4 8.5l2.5 2.5L12 5.5' fill='none' stroke='%23082238' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / 11px no-repeat; }
.pil-seg label:hover span, .pil-chk label:hover span { border-color: rgba(255,255,255,.55); }
.pil-build__top { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; }
.pil-build__top p { margin: 0; font-size: 15px; color: #DCE8F1; }
.pil-build__top b { font: 800 22px/1 var(--f-display); color: #fff; font-variant-numeric: tabular-nums; }
.pil-build__top em { margin-left: auto; font-style: normal; font-size: 11px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; padding: 3px 9px; border-radius: 99px; background: rgba(255,184,28,.18); color: #FFD27A; }
.pil-build__scroll { margin-top: 16px; }
.pil-pipe { display: grid; grid-template-columns: repeat(auto-fill, minmax(148px, 1fr)); gap: 10px; margin: 0; padding: 0; list-style: none; }
.pil-pipe > li { position: relative; display: flex; flex-direction: column; gap: 6px; padding: 12px 12px 12px; border-radius: 16px; background: #fff; color: var(--pil-body); box-shadow: 0 18px 30px -22px rgba(0,0,0,.6); animation: pilIn .35s ease both; }
.pil-pipe__n { font: 700 10.5px/1 var(--f-body); letter-spacing: .08em; text-transform: uppercase; color: var(--pil-muted); }
.pil-pipe__h { display: flex; align-items: center; gap: 6px; font: 700 14px/1.25 var(--f-display); color: var(--pil-ink); }
.pil-pipe__h img { flex: none; }
.pil-pipe__docs { display: flex; flex-wrap: wrap; gap: 4px; margin: 2px 0 0; padding: 0; list-style: none; }
.pil-pipe__docs span { padding: 3px 7px; border-radius: 6px; background: #FFF4D6; font: 600 11px/1.2 var(--f-body); color: #7A5200; }
.pil-pipe__rule { margin-top: auto; padding-top: 7px; border-top: 1px dashed var(--pil-line); font-size: 11.5px; line-height: 1.4; color: var(--pil-muted); }
.pil-pipe > li.is-core { box-shadow: inset 0 3px 0 var(--pil-blue), 0 18px 30px -22px rgba(0,0,0,.6); }
.pil-pipe > li.is-end { box-shadow: inset 0 3px 0 var(--pil-green), 0 18px 30px -22px rgba(0,0,0,.6); }
@keyframes pilIn { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }
.pil-build__say { margin: 12px 0 0; min-height: 3em; font-size: 15px; line-height: 1.55; color: #DCE8F1; }
.pil-build__say b { color: #fff; }
.pil-build__apps p { margin: 14px 0 8px; font: 700 12px/1 var(--f-body); letter-spacing: .08em; text-transform: uppercase; color: #9FC0D8; }
.pil-build__apps ul { display: flex; flex-wrap: wrap; gap: 8px; margin: 0; padding: 0; list-style: none; }
.pil-build__apps li { display: inline-flex; align-items: center; gap: 6px; padding: 5px 11px 5px 6px; border-radius: 99px; background: rgba(255,255,255,.1); font: 600 13px/1.2 var(--f-body); color: #fff; }
.pil-build__apps li img { padding: 3px; border-radius: 6px; background: #fff; }
.pil-build__send { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 14px; margin-top: 20px; }
.pil-build__send span { font-size: 13.5px; color: #9FC0D8; }

/* ---------- 5. stack by size ---------- */
.pil-sizes { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; margin-top: 36px; align-items: start; }
.pil-size { position: relative; padding: 24px 22px 20px; border-radius: 22px; background: #fff; border: 1px solid var(--pil-line); box-shadow: 0 24px 50px -44px rgba(8,34,56,.6); }
.pil-size.is-pick { border-color: color-mix(in srgb, var(--c) 40%, transparent); box-shadow: 0 30px 60px -40px rgba(29,63,143,.55); }
.pil-size__tag { display: inline-block; margin: 0; padding: 4px 10px; border-radius: 99px; background: color-mix(in srgb, var(--c) 12%, #fff); font: 700 11.5px/1 var(--f-body); letter-spacing: .08em; text-transform: uppercase; color: var(--c); }
.pil-size h3 { margin: 12px 0 6px; font: 700 19px/1.25 var(--f-display); color: var(--pil-ink); }
.pil-size__who { margin: 0 0 14px; font-size: 14.5px; line-height: 1.5; color: var(--pil-muted); }
.pil-size ul { display: grid; gap: 8px; margin: 0; padding: 0; list-style: none; }
.pil-size li a { display: flex; align-items: center; gap: 10px; padding: 9px 10px; border-radius: 14px; background: var(--pil-paper); text-decoration: none; transition: background-color .2s; }
.pil-size li a:hover { background: #E3F4FB; }
.pil-size li img, .pil-mono { flex: none; width: 26px; height: 26px; }
.pil-mono { display: grid; place-items: center; border-radius: 8px; background: var(--pil-ink); color: #fff; font: 800 8.5px/1 var(--f-body); letter-spacing: .02em; }
.pil-size li span:not(.pil-mono) { display: grid; font-size: 13px; line-height: 1.35; color: var(--pil-muted); }
.pil-size li b { font: 700 14.5px/1.3 var(--f-display); color: var(--pil-ink); }

/* ---------- 6. compliance ---------- */
.pil-reg__grid { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, .85fr); gap: 18px; margin-top: 34px; }
.pil-reg__col { padding: 24px; border-radius: 22px; background: #fff; border: 1px solid var(--pil-line); }
.pil-reg__col.is-zoho { background: linear-gradient(160deg, #F2F7FD, #fff 60%); border-color: #CBD9F0; }
.pil-reg__col h3 { margin: 0 0 14px; font: 700 18px/1.25 var(--f-display); color: var(--pil-ink); }
.pil-reg__col ul { display: grid; gap: 10px; margin: 0; padding: 0; list-style: none; }
.pil-reg__col li { position: relative; padding-left: 22px; font-size: 15px; line-height: 1.55; }
.pil-reg__col li::before { content: ""; position: absolute; left: 0; top: .55em; width: 9px; height: 9px; border-radius: 3px; background: var(--pil-navy); }
.pil-reg__col:not(.is-zoho) li::before { background: #CBD5E1; border-radius: 50%; }
.pil-reg__col li b { color: var(--pil-ink); }

/* ---------- 7. moving from ---------- */
.pil-from { margin-top: 32px; padding: clamp(16px, 2.2vw, 26px); border-radius: 24px; background: #fff; border: 1px solid var(--pil-line); box-shadow: 0 30px 60px -54px rgba(8,34,56,.6); }
.pil-from__bar { display: flex; flex-wrap: wrap; gap: 8px; }
.pil-from__bar button { display: inline-flex; align-items: center; gap: 8px; padding: 8px 14px 8px 8px; border: 1px solid var(--pil-line); border-radius: 14px; background: #fff; font: 600 14.5px/1.2 var(--f-body); color: var(--pil-body); cursor: pointer; transition: border-color .2s, background-color .2s; }
.pil-from__bar button img { width: 28px; height: 28px; object-fit: contain; padding: 3px; border-radius: 8px; background: var(--pil-paper); }
.pil-from__bar button[aria-selected="true"] { border-color: var(--pil-navy); background: #EEF3FB; color: var(--pil-ink); box-shadow: inset 0 0 0 1px var(--pil-navy); }
.pil-from__tile { display: grid; place-items: center; width: 28px; height: 28px; border-radius: 8px; background: var(--pil-paper); font: 800 9px/1 var(--f-body); color: var(--pil-ink); }
.pil-from__p { margin-top: 18px; }
.pil-from__p dl { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; margin: 0; }
.pil-from__p dl div { padding: 16px; border-radius: 16px; background: var(--pil-paper); }
.pil-from__p dt { font: 700 11.5px/1 var(--f-body); letter-spacing: .08em; text-transform: uppercase; color: var(--pil-navy); }
.pil-from__p dd { margin: 8px 0 0; font-size: 15px; line-height: 1.55; }

/* ---------- 8. licence calculator ---------- */
.pil-calc { display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); gap: 20px; margin-top: 34px; padding: clamp(18px, 2.4vw, 28px); border-radius: 26px; background: #fff; border: 1px solid var(--pil-line); box-shadow: 0 34px 70px -56px rgba(8,34,56,.6); }
.pil-calc__in { display: grid; gap: 16px; align-content: start; min-width: 0; }
.pil-field { display: grid; gap: 8px; }
.pil-field span { display: flex; justify-content: space-between; gap: 10px; font: 600 14.5px/1.35 var(--f-body); color: var(--pil-ink); }
.pil-field output { flex: none; min-width: 2.6em; padding: 2px 8px; border-radius: 8px; background: var(--pil-paper); text-align: center; font: 800 15px/1.3 var(--f-display); font-variant-numeric: tabular-nums; }
.pil-field input[type="range"] { width: 100%; accent-color: var(--pil-navy); }
.pil-sw { display: inline-flex; flex-wrap: wrap; gap: 4px; padding: 4px; border-radius: 99px; background: var(--pil-paper); justify-self: start; }
.pil-sw button { padding: 8px 14px; border: 0; border-radius: 99px; background: transparent; font: 600 13.5px/1 var(--f-body); color: var(--pil-body); cursor: pointer; }
.pil-sw button[aria-pressed="true"] { background: var(--pil-ink); color: #fff; }
.pil-calc__out { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; align-content: start; min-width: 0; }
.pil-calc__col { position: relative; display: flex; flex-direction: column; padding: 18px; border-radius: 18px; background: var(--pil-paper); border: 2px solid transparent; transition: border-color .3s, background-color .3s; min-width: 0; }
.pil-calc__col.is-win { border-color: var(--pil-green); background: #F1FAF5; }
.pil-calc__h { margin: 0 0 10px; font: 700 15px/1.3 var(--f-display); color: var(--pil-ink); }
.pil-calc__col ul { display: grid; gap: 6px; margin: 0 0 12px; padding: 0; list-style: none; }
.pil-calc__col li { display: flex; justify-content: space-between; gap: 8px; font-size: 13px; line-height: 1.4; color: var(--pil-body); }
.pil-calc__col li b { flex: none; font-variant-numeric: tabular-nums; color: var(--pil-ink); }
.pil-calc__tot { display: flex; align-items: baseline; gap: 6px; margin: auto 0 0; padding-top: 10px; border-top: 1px solid var(--pil-line); }
.pil-calc__tot b { font: 800 28px/1 var(--f-display); color: var(--pil-ink); font-variant-numeric: tabular-nums; }
.pil-calc__tot span { font-size: 13px; color: var(--pil-muted); }
.pil-calc__yr { margin: 4px 0 0; font-size: 13px; color: var(--pil-muted); }
.pil-calc__win { position: absolute; right: 12px; top: -11px; padding: 4px 9px; border-radius: 99px; background: var(--pil-green); color: #fff; font: 700 11px/1 var(--f-body); font-style: normal; opacity: 0; transform: translateY(4px); transition: opacity .3s, transform .3s; }
.pil-calc__col.is-win .pil-calc__win { opacity: 1; transform: none; }
.pil-calc__note { grid-column: 1 / -1; margin: 4px 0 0; font-size: 14px; line-height: 1.5; color: var(--pil-body); }

/* ---------- 9. packages ---------- */
.pil-pk__list { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; margin: 36px 0 0; padding: 0; list-style: none; }
.pil-pk__card { position: relative; display: flex; flex-direction: column; padding: 24px 22px 20px; border-radius: 22px; background: #fff; border: 1px solid var(--pil-line); box-shadow: 0 24px 50px -44px rgba(8,34,56,.6); }
.pil-pk__card.is-pick { border: 2px solid var(--pil-navy); }
.pil-pk__flag { position: absolute; left: 22px; top: -12px; margin: 0; padding: 5px 10px; border-radius: 99px; background: var(--pil-amber); color: var(--pil-ink); font: 700 11.5px/1 var(--f-body); }
.pil-pk__trail { display: flex; gap: 5px; margin: 0 0 14px; }
.pil-pk__trail i { width: 18px; height: 22px; border-radius: 3px; background: var(--pil-line); clip-path: polygon(0 0, 70% 0, 100% 25%, 100% 100%, 0 100%); }
.pil-pk__trail i.is-on { background: var(--pil-navy); }
.pil-pk__card h3 { margin: 0; font: 700 21px/1.2 var(--f-display); color: var(--pil-ink); }
.pil-pk__for { margin: 6px 0 14px; font-size: 14.5px; color: var(--pil-muted); }
.pil-pk__card ul { display: grid; gap: 8px; margin: 0 0 16px; padding: 0; list-style: none; }
.pil-pk__card li { position: relative; padding-left: 20px; font-size: 14.5px; line-height: 1.5; }
.pil-pk__card li::before { content: ""; position: absolute; left: 2px; top: .5em; width: 8px; height: 8px; border-radius: 50%; background: var(--pil-blue); }
.pil-pk__fee { margin: auto 0 0; padding-top: 12px; border-top: 1px dashed var(--pil-line); font: 600 14px/1.45 var(--f-body); color: var(--pil-ink); }

/* ---------- 10. case mention ---------- */
.pil-case { padding-top: 0; }
.pil-case__card { display: flex; align-items: center; gap: clamp(18px, 3vw, 40px); margin-top: 16px; padding: 22px 26px; border-radius: 22px; background: var(--pil-paper); border: 1px solid var(--pil-line); }
.pil-case__logo { flex: none; width: 180px; height: auto; padding: 14px 16px; border-radius: 14px; background: #fff; box-sizing: content-box; }
.pil-case__card h2 { margin: 0 0 6px; }
.pil-case__card p { margin: 0; font-size: 15.5px; line-height: 1.55; }
.pil-case__card .pg-link { margin-top: 10px; }

/* ---------- 11. rollout ---------- */
.pil-roll__list { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; margin: 32px 0 0; padding: 0; list-style: none; counter-reset: pilr; }
.pil-roll__list li { position: relative; display: grid; align-content: start; gap: 6px; padding: 20px 18px 18px; border-radius: 18px; background: #fff; border: 1px solid var(--pil-line); counter-increment: pilr; }
.pil-roll__list li::before { content: counter(pilr, decimal-leading-zero); font: 800 13px/1 var(--f-display); color: var(--pil-blue); }
.pil-roll__list b { font: 700 16.5px/1.25 var(--f-display); color: var(--pil-ink); }
.pil-roll__list span { font-size: 14.5px; line-height: 1.5; }

/* ---------- responsive ---------- */
@media (max-width: 1100px) {
  .pil-who__grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .pil-build__grid { grid-template-columns: 1fr; }
}
@media (max-width: 960px) {
  .pil-hero__grid { grid-template-columns: 1fr; }
  .pil-desk { max-width: 560px; }
  .pil-sizes, .pil-pk__list { grid-template-columns: 1fr; }
  .pil-reg__grid, .pil-calc { grid-template-columns: 1fr; }
  .pil-roll__list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .pil-trail__list::before { left: 7px; }
  .pil-doc, .pil-doc:nth-child(odd), .pil-doc:nth-child(even) { width: auto; justify-self: stretch; margin-left: 34px; transform: none; }
  .pil-doc + .pil-doc { margin-top: 0; }
  .pil-doc:nth-child(odd)::before, .pil-doc:nth-child(even)::before { left: -34px; right: auto; }
}
@media (max-width: 720px) {
  .pil-who__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .pil-from__p dl { grid-template-columns: 1fr; }
  .pil-case__card { flex-direction: column; align-items: flex-start; }
}
@media (max-width: 560px) {
  .pil-who__grid, .pil-roll__list, .pil-calc__out { grid-template-columns: 1fr; }
  .pil-stack { margin-right: 0; margin-bottom: 0; }
  .pil-stack__back--1 { transform: translate(5px, -6px) rotate(1deg); }
  .pil-stack__back--2 { transform: translate(9px, -12px) rotate(1.6deg); }
  .pil-stack__back--3 { transform: translate(12px, -17px) rotate(2.2deg); }
  .pil-desk { padding-bottom: 0; }
  .pil-phone { position: relative; right: auto; bottom: auto; width: 168px; margin: -70px 0 0 auto; }
  .pil-phone__scr { min-height: 270px; }
  .pil-replay { position: static; margin-top: 12px; }
  .pil-tabs { gap: 3px; }
  .pil-tabs li { font-size: 9px; padding: 6px 1px 5px; letter-spacing: 0; }
  .pil-folder { padding: 10px; }
  .pil-sheet { padding: 14px 14px 16px; }
  .pil-sheet__terms { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .pil-stamp { font-size: 18px; bottom: 18px; right: 12px; }
  .pil-doc { padding: 18px 18px 16px; }
  .pil-doc h3 { padding-right: 0; margin-top: 30px; }
  .pil-doc__stamp { right: 14px; top: 12px; font-size: 11.5px; }
  .pil-pipe { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .pil-from__bar button { font-size: 13.5px; }
}
@media (prefers-reduced-motion: reduce) {
  .pil-tabs li, .pil-checks li, .pil-stamp, .pil-phone__toast, .pil-phone__bar i, .pil-doc, .pil-doc__stamp, .pil-who__grid a, .pil-calc__col, .pil-calc__win { transition: none !important; }
  .pil-pipe > li { animation: none; }
  .pil-js .pil-doc__stamp { opacity: .9; transform: rotate(-9deg); }
}
