/* Gemini for Zoho (/ai/gemini/) page only. Prefix pw22-. Loaded via `extra: crm, mid, p-ai-gemini`. */

/* ---------- 1. hero: Workspace inbox + Zoho CRM side panel + Gemini summary ---------- */
.pw22-hero__grid { grid-template-columns: minmax(0, 1fr) minmax(0, 1.04fr); align-items: center; }
.pw22-mail { margin: 0; min-width: 0; }
.pw22-mail__win { border-radius: 22px; background: #fff; border: 1px solid #E2E8F0; box-shadow: 0 40px 80px -48px rgba(8,34,56,.55), 0 2px 0 rgba(8,34,56,.03); overflow: hidden; }
.pw22-mail__bar { display: flex; align-items: center; gap: 10px; padding: 12px 16px; border-bottom: 1px solid #E2E8F0; background: #F8FAFC; }
.pw22-mail__bar span { display: grid; line-height: 1.2; }
.pw22-mail__bar b { font: 700 14px var(--f-display); color: #082238; }
.pw22-mail__bar small { font-size: 12px; color: #5B6B7F; }
.pw22-mail__bar em { margin-left: auto; padding: 4px 9px; border-radius: 99px; background: #FFF4D6; color: #6B4E00; font: 700 11px/1.2 var(--f-body); letter-spacing: .06em; text-transform: uppercase; font-style: normal; }
.pw22-mail__body { display: grid; grid-template-columns: minmax(0, .66fr) minmax(0, 1.12fr) minmax(0, 1.22fr); min-height: 330px; }
.pw22-mail__list { list-style: none; margin: 0; padding: 8px; border-right: 1px solid #EEF2F6; display: grid; align-content: start; gap: 4px; }
.pw22-mail__list li { display: grid; gap: 2px; padding: 9px 10px; border-radius: 10px; font-size: 12px; line-height: 1.35; color: #475569; }
.pw22-mail__list li b { font-size: 12.5px; color: #082238; }
.pw22-mail__list li small { color: #5B6B7F; font-size: 11px; }
.pw22-mail__list li.is-open { background: #E8F0FE; box-shadow: inset 3px 0 0 #1A62D0; }
.pw22-mail__read { padding: 16px; border-right: 1px solid #EEF2F6; font-size: 13px; line-height: 1.55; color: #334155; }
.pw22-mail__read p { margin: 0 0 10px; }
.pw22-mail__subj { font: 700 15px/1.3 var(--f-display) !important; color: #082238; }
.pw22-mail__from { font-size: 12px; color: #5B6B7F; }
.pw22-mail__fade { color: #5B6B7F; }
.pw22-side { padding: 12px; background: linear-gradient(180deg, #F5F9FC, #fff); display: grid; align-content: start; gap: 8px; }
.pw22-side__top { display: flex; align-items: center; gap: 7px; margin: 0; font-size: 13px; color: #082238; }
.pw22-side__top span { margin-left: auto; padding: 2px 8px; border-radius: 99px; background: #DCFCE7; color: #14532D; font: 700 11px/1.4 var(--f-body); }
.pw22-side__rec { padding: 9px 10px; border-radius: 12px; background: #fff; border: 1px solid #E2E8F0; display: grid; gap: 2px; font-size: 12px; color: #475569; }
.pw22-side__rec b { font-size: 13px; color: #082238; }
.pw22-side__lab { margin: 0; font: 700 10.5px/1.2 var(--f-body); letter-spacing: .08em; text-transform: uppercase; color: #5B6B7F; }
.pw22-side__rec span { display: flex; flex-wrap: wrap; align-items: center; gap: 3px 6px; }
.pw22-side__stage { display: inline-block; padding: 1px 7px; border-radius: 99px; background: #E0F2FE; color: #0B4F7C; font-style: normal; font-weight: 600; }
.pw22-gem { padding: 10px; border-radius: 12px; background: linear-gradient(135deg, #EEF3FF, #F5EFFF); border: 1px solid #D9D2FA; }
.pw22-gem__h { display: flex; align-items: center; gap: 6px; margin: 0 0 6px; font: 700 12px/1.2 var(--f-body); color: #3B2A8C; }
.pw22-gem ul { margin: 0; padding: 0 0 0 16px; display: grid; gap: 4px; font-size: 12px; line-height: 1.45; color: #2E3A4D; }
.pw22-side__btns { display: flex; gap: 6px; margin: 0; flex-wrap: wrap; }
.pw22-side__btns span { padding: 6px 10px; border-radius: 99px; border: 1px solid #CBD5E1; font: 600 12px/1.2 var(--f-body); color: #334155; background: #fff; transition: background .3s, color .3s, border-color .3s; }
.pw22-side__btns .pw22-side__save { background: #FFB81C; border-color: #FFB81C; color: #082238; }
.pw22-side__btns .pw22-side__save.is-done { background: #14532D; border-color: #14532D; color: #fff; }
.pw22-side__btns .pw22-side__save.is-done::before { content: "✓ "; }
.pw22-mail.is-arm [data-s] { opacity: 0; transform: translateY(6px); }
.pw22-mail [data-s] { transition: opacity .45s ease, transform .45s ease; }
.pw22-mail.is-arm [data-s].is-in { opacity: 1; transform: none; }
@media (max-width: 1100px) { .pw22-mail__body { grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); } .pw22-mail__list { display: none; } }
@media (max-width: 980px) { .pw22-hero__grid { grid-template-columns: minmax(0, 1fr); } }
@media (max-width: 560px) {
  .pw22-mail__body { grid-template-columns: minmax(0, 1fr); min-height: 0; }
  .pw22-mail__read { border-right: 0; border-bottom: 1px solid #EEF2F6; }
  .pw22-mail__fade { display: none; }
}

/* ---------- 2. three bridges ---------- */
.pw22-br { list-style: none; margin: 34px 0 0; padding: 0; display: grid; gap: 14px; }
.pw22-br__row { display: grid; grid-template-columns: 220px minmax(0, 1fr) 190px; gap: clamp(16px, 2.4vw, 32px); align-items: center; padding: 20px 24px; border-radius: 22px; background: #fff; border: 1px solid #E2E8F0; border-left: 5px solid var(--c); }
.pw22-br__ends { display: flex; align-items: center; margin: 0; }
.pw22-br__ends span { display: grid; place-items: center; width: 52px; height: 52px; border-radius: 16px; background: #F3F7F9; border: 1px solid #E2E8F0; flex: none; }
.pw22-br__ends i { flex: 1; min-width: 14px; height: 3px; margin: 0 4px; border-radius: 3px; background: repeating-linear-gradient(90deg, var(--c) 0 7px, transparent 7px 12px); background-size: 24px 3px; animation: pw22-flow 1.6s linear infinite; }
@keyframes pw22-flow { to { background-position: 24px 0; } }
.pw22-br__row h3 { margin: 0 0 6px; font: 700 19px/1.3 var(--f-display); color: #082238; }
.pw22-br__row h3 span { display: block; margin-bottom: 4px; font: 800 11.5px/1.2 var(--f-body); letter-spacing: .1em; text-transform: uppercase; color: var(--c); }
.pw22-br__row p { margin: 0; font-size: 15.5px; line-height: 1.6; color: #334155; }
.pw22-br__key { padding: 12px 14px; border-radius: 14px; background: #F3F7F9; font-size: 14px !important; color: #082238 !important; }
.pw22-br__key b { display: block; margin-bottom: 2px; font: 700 11px/1.2 var(--f-body); letter-spacing: .08em; text-transform: uppercase; color: #5B6B7F; }
.pw22-what__no { margin: 22px 0 0; max-width: 92ch; font-size: 15.5px; line-height: 1.6; color: #334155; }
@media (max-width: 980px) { .pw22-br__row { grid-template-columns: minmax(0, 1fr); } .pw22-br__ends { max-width: 260px; } }
@media (prefers-reduced-motion: reduce) { .pw22-br__ends i { animation: none; } }

/* ---------- 3. strip icons ---------- */
.pw22-strip__ic { display: flex; gap: 6px; margin: 2px 0 2px; }
.pw22-strip__ic img { width: 30px; height: 30px; padding: 5px; border-radius: 10px; background: #F3F7F9; border: 1px solid #E2E8F0; box-sizing: content-box; }

/* ---------- 4. scroll-story J5: working-day dial ---------- */
.pw22-dl { padding: 0; background: radial-gradient(900px 520px at 8% 0%, rgba(76,141,246,.24), transparent 62%), radial-gradient(760px 520px at 100% 100%, rgba(242,154,92,.14), transparent 60%), #0B1530; color: #C9D8E6; overflow-x: clip; }
.pw22-dl__stage { padding-top: clamp(64px, 8vw, 104px); padding-bottom: clamp(64px, 8vw, 104px); }
.pw22-dl__head .pg-answer { margin-bottom: 0; }
.pw22-dl__jump { display: none; }
.pw22-dl__grid { display: grid; grid-template-columns: minmax(0, .95fr) minmax(0, 1fr); gap: clamp(28px, 4vw, 64px); align-items: start; margin-top: 36px; }
.pw22-dl__art { position: relative; }
.pw22-dl__dial { display: block; width: 100%; max-width: 520px; height: auto; margin: 0 auto; overflow: visible; }
.pw22-dl__face { fill: rgba(255,255,255,.035); }
.pw22-dl__tick { stroke: rgba(255,255,255,.32); stroke-width: 3; stroke-linecap: round; }
.pw22-dl__hr { fill: #9DB2C7; font: 700 18px var(--f-body); letter-spacing: .04em; text-anchor: middle; }
.pw22-dl__trk { fill: none; stroke: rgba(255,255,255,.1); stroke-width: 14; stroke-linecap: round; }
.pw22-dl__arc { fill: none; stroke: url(#pw22-dg); stroke-width: 14; stroke-linecap: round; }
.pw22-dl__node circle { fill: var(--c); stroke: var(--c); stroke-width: 3; }
.pw22-dl__nn { fill: #fff; font: 700 16px var(--f-body); text-anchor: middle; }
.pw22-dl__nl { fill: #C3D3E2; font: 600 22px var(--f-body); }
.pw22-dl__cl { fill: #CFE0EE; font: 600 19px var(--f-body); text-anchor: middle; }
.pw22-dl__cn { fill: #fff; font: 800 84px var(--f-display); letter-spacing: -.03em; text-anchor: middle; }
.pw22-dl__cs { fill: #FFD08A; font: 700 20px var(--f-body); letter-spacing: .1em; text-transform: uppercase; text-anchor: middle; }
.pw22-dl__cd { fill: #B9CCDD; font: 600 17px var(--f-body); text-anchor: middle; }
.pw22-dl__bar { display: none; }
.pw22-dl__list { list-style: none; margin: 0; padding: 0; display: grid; gap: 14px; }
.pw22-dl__st { padding: 22px 24px; border-radius: 20px; background: rgba(255,255,255,.06); border: 1px solid rgba(255,255,255,.12); border-top: 4px solid var(--c); outline: none; }
.pw22-dl__st:focus-visible { box-shadow: 0 0 0 3px #FFB81C; }
.pw22-dl__when { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin: 0 0 10px; }
.pw22-dl__n { padding: 4px 10px; border-radius: 99px; background: var(--c); color: #fff; font: 800 12.5px/1.3 var(--f-body); letter-spacing: .06em; text-transform: uppercase; }
.pw22-dl__dir { padding: 3px 10px; border-radius: 99px; border: 1px solid rgba(255,208,138,.6); color: #FFD08A; font: 700 12.5px/1.3 var(--f-body); letter-spacing: .04em; }
.pw22-dl__st h3 { margin: 0 0 8px; font: 700 clamp(21px, 1rem + .8vw, 27px)/1.25 var(--f-display); letter-spacing: -.02em; color: #fff; }
.pw22-dl__st > p:not([class]) { margin: 0; font-size: 16.5px; line-height: 1.6; color: #D3E0EC; }
.pw22-dl__apps { display: flex; flex-wrap: wrap; gap: 6px; margin: 14px 0 0; }
.pw22-dl__apps a, .pw22-dl__apps span { display: inline-flex; align-items: center; gap: 6px; min-height: 30px; padding: 5px 11px 5px 7px; border-radius: 99px; background: rgba(255,255,255,.95); font: 600 13px/1.2 var(--f-body); color: #082238; text-decoration: none; transition: box-shadow .2s; box-sizing: border-box; }
.pw22-dl__apps a:hover, .pw22-dl__apps a:focus-visible { box-shadow: 0 0 0 2px #FFB81C; outline: none; }
.pw22-dl__note { color: #A9BCCE; max-width: 80ch; }

.pw22-dl--live .pw22-dl__track { height: calc(100vh + 7 * 52vh); }
.pw22-dl--live .pw22-dl__stage { position: sticky; top: 0; height: 100vh; min-height: 600px; display: flex; flex-direction: column; justify-content: center; padding-top: 92px; padding-bottom: 24px; }
.pw22-dl--live .pg-h2 { font-size: clamp(26px, 1rem + 1.2vw, 36px); max-width: none; }
.pw22-dl--live .pg-answer { margin-top: 10px; font-size: 16px; max-width: 104ch; }
.pw22-dl--live .pw22-dl__jump { display: flex; flex-wrap: wrap; gap: 6px; list-style: none; margin: 14px 0 0; padding: 0; }
.pw22-dl__jump button { display: inline-flex; align-items: center; gap: 7px; min-height: 32px; font: 600 13px/1.2 var(--f-body); color: #D5E3EF; background: rgba(255,255,255,.06); border: 1px solid rgba(255,255,255,.22); padding: 6px 12px 6px 6px; border-radius: 99px; cursor: pointer; transition: background .3s, color .3s, border-color .3s; }
.pw22-dl__jump button span { display: grid; place-items: center; width: 20px; height: 20px; border-radius: 50%; background: rgba(255,255,255,.14); font-size: 11.5px; font-weight: 700; }
.pw22-dl__jump button.is-past { border-color: rgba(255,208,138,.55); }
.pw22-dl__jump button[aria-current="true"] { background: #FFB81C; color: #082238; border-color: #FFB81C; }
.pw22-dl__jump button[aria-current="true"] span { background: #082238; color: #fff; }
.pw22-dl__jump button:focus-visible { outline: 2px solid #FFB81C; outline-offset: 2px; }
.pw22-dl--live .pw22-dl__grid { margin-top: 16px; align-items: center; }
.pw22-dl--live .pw22-dl__dial { max-height: min(46vh, 430px); width: auto; max-width: 100%; }
.pw22-dl--live .pw22-dl__arc { transition: stroke-dashoffset .9s cubic-bezier(.6,0,.2,1); }
.pw22-dl--live .pw22-dl__node { cursor: pointer; }
.pw22-dl--live .pw22-dl__node circle { fill: #0B1530; stroke: rgba(255,255,255,.38); transition: fill .3s, stroke .3s, r .3s, stroke-width .3s; }
.pw22-dl--live .pw22-dl__node .pw22-dl__nl { fill: #9DB2C7; transition: fill .3s; }
.pw22-dl--live .pw22-dl__node.is-past circle { fill: var(--c); stroke: var(--c); }
.pw22-dl--live .pw22-dl__node.is-past .pw22-dl__nl { fill: #C3D3E2; }
.pw22-dl--live .pw22-dl__node.is-on circle { r: 21; fill: #fff; stroke: #FFB81C; stroke-width: 5; }
.pw22-dl--live .pw22-dl__node.is-on .pw22-dl__nn { fill: #082238; }
.pw22-dl--live .pw22-dl__node.is-on .pw22-dl__nl { fill: #fff; font-weight: 800; }
.pw22-dl--live .pw22-dl__bar { display: flex; justify-content: center; gap: 6px; margin-top: 12px; }
.pw22-dl__bar i { width: 26px; height: 5px; border-radius: 4px; background: rgba(255,255,255,.14); transition: background .4s; }
.pw22-dl__bar i.on { background: #FFB81C; }
.pw22-dl--live .pw22-dl__list { display: block; position: relative; min-height: 340px; }
.pw22-dl--live .pw22-dl__st { position: absolute; left: 0; right: 0; top: 50%; opacity: 0; pointer-events: none; transform: translateY(-44%) scale(.97); background: rgba(255,255,255,.07); transition: opacity .2s, transform .3s; }
.pw22-dl--live .pw22-dl__st.is-on { opacity: 1; pointer-events: auto; transform: translateY(-50%); transition: opacity .45s .12s, transform .6s .12s cubic-bezier(.2,.8,.2,1); }
.pw22-dl--live .pw22-dl__note { margin-top: 10px; font-size: 13px; max-width: none; }
@media (max-width: 900px) { .pw22-dl__grid { grid-template-columns: minmax(0, 1fr); } .pw22-dl__dial { max-width: 380px; } }
@media (max-width: 480px) { .pw22-dl__st { padding: 18px; } }
@media (max-height: 780px) {
  .pw22-dl--live .pw22-dl__stage { padding-top: 82px; padding-bottom: 14px; }
  .pw22-dl--live .hp-kick { display: none; }
  .pw22-dl--live .pg-answer { font-size: 15px; line-height: 1.5; }
  .pw22-dl--live .pw22-dl__jump { margin-top: 10px; }
  .pw22-dl--live .pw22-dl__grid { margin-top: 8px; }
  .pw22-dl--live .pw22-dl__dial { max-height: 37vh; }
  .pw22-dl--live .pw22-dl__st { padding: 18px 20px; }
  .pw22-dl--live .pw22-dl__st > p:not([class]) { font-size: 15.5px; }
  .pw22-dl--live .pw22-dl__note { margin-top: 6px; }
}

/* ---------- 5. versus stepper: larger tap targets on the kit's dots (page scope only) ---------- */
.pw22-vs .mk-versus { margin-top: 30px; }
.pw22-vs .mk-versus__dots { gap: 2px; }
.pw22-vs .mk-versus__dots button { position: relative; width: 24px; height: 24px; background: transparent !important; }
.pw22-vs .mk-versus__dots button::before { content: ""; position: absolute; left: 8px; top: 8px; width: 8px; height: 8px; border-radius: 99px; background: #94A3B8; transition: width .3s, left .3s, background .3s; }
.pw22-vs .mk-versus__dots button[aria-current="true"] { width: 34px; }
.pw22-vs .mk-versus__dots button[aria-current="true"]::before { left: 4px; width: 26px; background: #082238; }

/* ---------- 6. signature: data-flow picker ---------- */
.pw22-pick__grid { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); gap: clamp(22px, 3vw, 44px); margin-top: 34px; align-items: start; }
.pw22-pick__q { display: flex; align-items: center; gap: 10px; margin: 0 0 12px; font: 700 17px/1.3 var(--f-display); color: #fff; }
.pw22-pick__q span { display: grid; place-items: center; width: 26px; height: 26px; border-radius: 50%; background: #FFB81C; color: #082238; font: 800 13px var(--f-body); }
.pw22-pick__srcs { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; margin-bottom: 26px; }
.pw22-pick__srcs button { position: relative; display: flex; align-items: center; gap: 10px; min-height: 56px; padding: 12px 14px; border-radius: 16px; border: 1px solid rgba(255,255,255,.24); background: rgba(255,255,255,.06); color: #E2ECF5; font: 600 15px/1.2 var(--f-body); text-align: left; cursor: pointer; transition: background .25s, border-color .25s, color .25s; }
.pw22-pick__srcs button img { padding: 4px; border-radius: 9px; background: #fff; box-sizing: content-box; }
.pw22-pick__srcs button::after { content: ""; margin-left: auto; width: 20px; height: 20px; border-radius: 6px; border: 2px solid rgba(255,255,255,.5); box-sizing: border-box; }
.pw22-pick__srcs button[aria-pressed="true"] { background: #fff; border-color: #fff; color: #082238; }
.pw22-pick__srcs button[aria-pressed="true"]::after { border-color: #0E7C66; background: #0E7C66 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7.5' fill='none' stroke='%23fff' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / 14px no-repeat; }
.pw22-pick__apps { display: flex; flex-wrap: wrap; gap: 8px; }
.pw22-pick__apps button { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; padding: 8px 14px 8px 10px; border-radius: 99px; border: 1px solid rgba(255,255,255,.24); background: rgba(255,255,255,.06); color: #E2ECF5; font: 600 14.5px/1.2 var(--f-body); cursor: pointer; transition: background .25s, color .25s, border-color .25s; }
.pw22-pick__apps button[aria-checked="true"] { background: #FFB81C; border-color: #FFB81C; color: #082238; }
.pw22-pick__srcs button:focus-visible, .pw22-pick__apps button:focus-visible { outline: 2px solid #FFB81C; outline-offset: 3px; }
.pw22-pick__tip { margin: 18px 0 0; font-size: 14px; line-height: 1.5; color: #B9CCDD; }
.pw22-pick__out { min-width: 0; padding: 22px 24px 24px; border-radius: 24px; background: #fff; color: #334155; box-shadow: 0 40px 70px -44px rgba(0,0,0,.6); }
.pw22-pick__flag { display: inline-block; margin: 0 0 8px; padding: 4px 10px; border-radius: 99px; background: #FFF4D6; color: #6B4E00; font: 700 11.5px/1.2 var(--f-body); letter-spacing: .08em; text-transform: uppercase; }
.pw22-pick__out h3 { margin: 0 0 10px; font: 800 22px/1.25 var(--f-display); color: #082238; }
.pw22-pick__route { display: grid; gap: 2px; margin: 0 0 14px; padding: 10px 14px; border-radius: 14px; background: #F3F7F9; font-size: 14.5px; line-height: 1.5; color: #334155; }
.pw22-pick__route b, .pw22-pick__check b { font: 700 11.5px/1.2 var(--f-body); letter-spacing: .08em; text-transform: uppercase; color: #5B6B7F; }
.pw22-pick__flows { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; counter-reset: pf; }
.pw22-pick__flows > li { counter-increment: pf; padding: 14px 16px; border-radius: 16px; border: 1px solid #E2E8F0; animation: pw22-in .4s ease both; }
.pw22-pick__fh { display: flex; align-items: center; gap: 8px; margin: 0 0 8px; font: 700 15.5px/1.3 var(--f-display); color: #082238; }
.pw22-pick__fh img { flex: none; }
.pw22-pick__fh em { margin-left: auto; padding: 2px 8px; border-radius: 99px; background: #E0F2FE; color: #0B4F7C; font: 700 11px/1.4 var(--f-body); font-style: normal; letter-spacing: .04em; text-transform: uppercase; white-space: nowrap; }
.pw22-pick__flows dl { display: grid; grid-template-columns: 120px minmax(0, 1fr); gap: 4px 12px; margin: 0; font-size: 14px; line-height: 1.5; }
.pw22-pick__flows dt { font-weight: 700; color: #475569; }
.pw22-pick__flows dd { margin: 0; color: #334155; }
.pw22-pick__none { padding: 14px 16px; border-radius: 16px; background: #F3F7F9; font-size: 14.5px; color: #475569; }
@keyframes pw22-in { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }
.pw22-pick__check { margin: 14px 0 0; padding: 12px 14px; border-radius: 14px; background: #FFF7E0; border-left: 3px solid #FFB81C; }
.pw22-pick__check ul { margin: 6px 0 0; padding-left: 18px; display: grid; gap: 4px; font-size: 14px; line-height: 1.5; color: #4A3700; }
.pw22-pick__send { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; margin-top: 18px; }
.pw22-pick__send span { font-size: 13.5px; color: #475569; }
.pw22-pick__foot { margin: 22px 0 0; font-size: 13.5px; color: #B9CCDD; max-width: 90ch; }
@media (max-width: 1000px) { .pw22-pick__grid { grid-template-columns: minmax(0, 1fr); } }
@media (max-width: 560px) { .pw22-pick__flows dl { grid-template-columns: minmax(0, 1fr); } .pw22-pick__out { padding: 18px; } .pw22-pick__srcs { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); } .pw22-pick__srcs button { padding: 10px; gap: 8px; font-size: 14px; } }
@media (prefers-reduced-motion: reduce) { .pw22-pick__flows > li { animation: none; } }

/* ---------- 7. pricing: bills + packages ---------- */
.pw22-bills { list-style: none; margin: 30px 0 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.pw22-bills li { padding: 22px; border-radius: 22px; background: #fff; border: 1px solid #E2E8F0; border-top: 4px solid var(--c); }
.pw22-bills__who { display: inline-flex; align-items: center; gap: 8px; font: 700 12.5px/1.2 var(--f-body); letter-spacing: .06em; text-transform: uppercase; color: var(--c); }
.pw22-bills h3 { margin: 12px 0 8px; font: 700 19px/1.3 var(--f-display); color: #082238; }
.pw22-bills p { margin: 0; font-size: 15px; line-height: 1.6; color: #334155; }
.pw22-pk__h { margin: 40px 0 14px; font: 700 21px/1.3 var(--f-display); color: #082238; }
.pw22-pk { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.pw22-pk li { padding: 22px; border-radius: 22px; background: #F3F7F9; border: 1px solid #E2E8F0; }
.pw22-pk li.pw22-pk--mid { background: #082238; border-color: #082238; }
.pw22-pk__tag { margin: 0 0 8px; font: 800 11.5px/1.2 var(--f-body); letter-spacing: .1em; text-transform: uppercase; color: #0B5E8C; }
.pw22-pk--mid .pw22-pk__tag { color: #FFD08A; }
.pw22-pk h4 { margin: 0 0 8px; font: 700 19px/1.3 var(--f-display); color: #082238; }
.pw22-pk--mid h4 { color: #fff; }
.pw22-pk li p:not(.pw22-pk__tag) { margin: 0; font-size: 15px; line-height: 1.6; color: #334155; }
.pw22-pk--mid p:not(.pw22-pk__tag) { color: #D3E0EC !important; }
@media (max-width: 900px) { .pw22-bills, .pw22-pk { grid-template-columns: minmax(0, 1fr); } }

/* ---------- 8. proof ---------- */
.pw22-proof__grid { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, .9fr); gap: clamp(24px, 4vw, 56px); align-items: center; }
.pw22-case { display: grid; gap: 10px; padding: 24px; border-radius: 24px; background: #fff; border: 1px solid #E2E8F0; text-decoration: none; color: #334155; box-shadow: 0 30px 60px -46px rgba(8,34,56,.55); transition: transform .3s, box-shadow .3s; }
.pw22-case:hover, .pw22-case:focus-visible { transform: translateY(-3px); box-shadow: 0 36px 60px -40px rgba(8,34,56,.6); }
.pw22-case__logo img { width: 150px; height: auto; }
.pw22-case__ind { font: 700 12px/1.3 var(--f-body); letter-spacing: .06em; text-transform: uppercase; color: #5B6B7F; }
.pw22-case b { font: 700 19px/1.35 var(--f-display); color: #082238; }
.pw22-case__apps { display: flex; gap: 6px; }
.pw22-case__go { font-weight: 700; color: #0A6FA8; }
@media (max-width: 900px) { .pw22-proof__grid { grid-template-columns: minmax(0, 1fr); } }