/* /local-check funnel + pay pages on the canon kit (С4-В, 05.11.2026). The kit (canon-tokens / canon-kit / canon-kit-x /
   canon-m) owns the look; this file is only what the funnel adds. Prefix cc-; rules weigh like the kit's (":root .cz X").
   The old lc-* markup that stays (stepper, honeycomb picture, combo, steps, progress) follows the canon palette because the
   --lc-* tokens are re-pointed to the canon ones on body.cc below — one place, deleted together with the old markup. */
body.lc.cc{--lc-font:var(--f-body);--lc-bg:var(--canvas);--lc-card:var(--paper);--lc-surface-2:var(--lilac);--lc-line:var(--peri);--lc-line-strong:var(--peri);
  --lc-ink:var(--ink);--lc-ink-2:var(--ink2);--lc-mut:var(--ink2);--lc-primary:var(--violet);--lc-primary-deep:var(--violet);--lc-primary-soft:var(--lilac);
  --lc-primary-ring:rgba(126,120,255,.4);--lc-btn:var(--violet);--lc-btn-hover:var(--iris);--lc-chip-b-ink:var(--violet);--lc-you:var(--violet);
  --lc-field-line:var(--slate);--lc-pin:var(--chartreuse);--lc-pin-line:var(--midnight);
  --lc-good:var(--good);--lc-good-soft:var(--good-wash);--lc-good-ink:var(--good);--lc-bad:var(--bad);--lc-bad-soft:var(--bad-wash);--lc-bad-ink:var(--bad);
  background:var(--canvas);color:var(--ink);font-family:var(--f-body);color-scheme:light}
/* the map script reads its band colours from <html>: violet scale on every funnel page, the dark canon map while waiting */
html:has(body.cc){--lc-band-top3:#4823ff;--lc-band-mid:#7e78ff;--lc-band-low:#d9d2ff;--lc-band-top3-ink:#fff;--lc-band-mid-ink:#18161a;--lc-band-low-ink:#18161a;
  --lc-glow:rgba(126,120,255,.55);--lc-pin:#e7ff6e;--lc-pin-line:#1e1b22}
html:has(body.cc[data-lc-mode="wait"]){--lc-map-scheme:dark;--lc-map-ground:#413b5c;--lc-map-base:#5a5478;--lc-map-hl:#e7ff6e;--lc-map-hover:#413b5c;--lc-map-hex-opacity:.92;
  --lc-band-top3:#e7ff6e;--lc-band-top3-ink:#18161a;--lc-band-mid:#9a94ff;--lc-band-mid-ink:#18161a;--lc-band-low:#8a84b4;--lc-band-low-ink:#18161a;--lc-band-none:#a39ec0;--lc-band-none-soft:#413b5c;--lc-band-none-ink:#ece9f5;--lc-band-failed:#cfcae0;
  --lc-band-failed-ink:#ece9f5;--lc-band-water:#2c2840;--lc-band-you-line:#e7ff6e;--lc-band-you-halo:#1e1b22;--lc-street:#7f78a3;--lc-street-2:#6a6390;--lc-map-label:#f1eefa}
body.lc.cc .lc-wrap{max-width:1200px}

/* ── funnel type + buttons (the old classes that remain) ── */
:root .cz .lc-fh1{font:700 clamp(28px,6vw,44px)/1.05 var(--f-disp);letter-spacing:-.035em;text-wrap:balance;max-width:20ch;margin:0}
:root .cz .lc-fh1 em{color:var(--violet);font-style:normal}
:root .cz .lc-cta,:root .cz .lc-btn{border-radius:100px;font:600 16px/1.2 var(--f-body);min-height:48px}
:root .cz .lc-fcard,:root .cz .lc-card{border-radius:20px;border-color:var(--peri)}
:root .cz .lc-flow .lc-badge{background:var(--chartreuse);color:var(--ink);border:0}
:root .cz :focus-visible{outline:3px solid var(--violet-mid);outline-offset:3px}

/* ── П1 «Це ваш бізнес?» (С5 П-2): the candidate is a Google Maps place card — map tile, ★ rating, address, the pick ── */
:root .cz .cc-cands{list-style:none;margin:20px 0 0;padding:0;display:flex;flex-direction:column;gap:12px}
:root .cz .cc-gm.is-pick{border-color:var(--violet);box-shadow:0 0 0 3px var(--lilac)}
:root .cz .cc-gm.is-dim{opacity:.6}
@media (prefers-reduced-motion:no-preference){:root .cz .cc-gm{transition:opacity var(--t-small,300ms),border-color var(--t-small,300ms),box-shadow var(--t-small,300ms)}}
:root .cz .cc-gm-defs{position:absolute;width:0;height:0}
:root .cz .cc-gm{display:grid;grid-template-columns:72px minmax(0,1fr);gap:4px 14px;align-items:start;background:var(--paper);border:1.5px solid var(--peri);border-radius:18px;padding:14px}
:root .cz .cc-gm.lc-cand-only{border-color:var(--violet)}
:root .cz .cc-gm-ph{position:relative;width:72px;height:72px;border-radius:14px;overflow:hidden;background:var(--lilac)}
:root .cz .cc-gm-ph svg{width:100%;height:100%;display:block}
:root .cz .cc-gm-st path{fill:none;stroke:var(--peri);stroke-width:12;stroke-linecap:round}
:root .cz .cc-gm-dot{fill:var(--violet);opacity:.22}
:root .cz .cc-gm-dot2{fill:var(--violet);stroke:var(--paper);stroke-width:7}
:root .cz .cc-gm-ini{fill:var(--violet);font:800 190px var(--f-disp);text-anchor:middle;dominant-baseline:central}
:root .cz .cc-gm .cc-tel-n{position:absolute;left:4px;top:4px;width:22px;height:22px;border-radius:50%;background:var(--violet);color:var(--paper);display:grid;place-items:center;font:800 11px var(--f-disp)}
:root .cz .cc-gm-body{display:flex;flex-direction:column;gap:3px;min-width:0}
:root .cz .cc-gm-t{font:700 17px/1.25 var(--f-disp);letter-spacing:-.02em;margin:0;overflow-wrap:anywhere}
:root .cz .cc-gm-rate{display:flex;flex-wrap:wrap;align-items:center;gap:6px;font-size:14px;color:var(--ink2)}
:root .cz .cc-gm-rate b{color:var(--ink);font-weight:700}
:root .cz .cc-gm-stars{display:inline-flex;gap:1px;color:var(--violet)}
:root .cz .cc-gm-stars svg{width:14px;height:14px;fill:var(--peri)}
:root .cz .cc-gm-stars svg.on{fill:currentColor}
:root .cz .cc-gm-stars svg.half{fill:url(#cc-gm-half);stroke:none}
:root .cz .cc-gm-line{font-size:14px;color:var(--ink2);line-height:1.35;overflow-wrap:anywhere}
:root .cz .cc-gm-act{grid-column:1 / -1;display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin-top:8px}
:root .cz .cc-gm-act .lc-cta{flex:1 1 180px}
:root .cz .cc-gm-act a.lc-cand-map{display:inline-flex;align-items:center;min-height:44px;color:var(--violet);font-weight:500}
@media (min-width:720px){:root .cz .cc-gm{grid-template-columns:72px minmax(0,1fr) auto;align-items:center}
  :root .cz .cc-gm-act{grid-column:auto;margin-top:0;flex-direction:column;align-items:stretch}:root .cz .cc-gm-act .lc-cta{flex:none}}
@media (max-width:559px){:root .cz .cc-gm-act .lc-cta{flex:1 1 100%}}
@media print{:root .cz .cc-gm-act{display:none}}

/* ── П3 waiting: the honeycomb sits in a dark canon block; the tally under it ── */
:root .cz .cc-dark{background:var(--midnight);color:var(--m-text);border-radius:22px;padding:14px;display:flex;flex-direction:column;gap:12px}
:root .cz .cc-dark .lc-mapbox{border:0;border-radius:16px;height:300px}
:root .cz .cc-dark .lc-legend,:root .cz .cc-dark .lc-note,:root .cz .cc-dark .lc-legend li{color:var(--m-text)}
:root body.cc[data-lc-mode="wait"] .lc-tally{background:var(--midnight);color:var(--m-text);border-radius:14px;padding:10px 14px}
:root body.cc[data-lc-mode="wait"] .lc-tally li,:root body.cc[data-lc-mode="wait"] .lc-tally b{color:var(--m-text)}
:root .cz .cc-dark .lc-map-count{background:var(--m-cell);color:var(--paper);border-color:var(--m-line)}
:root .cz .lc-steps li{font-size:15px;min-height:44px;font-weight:500}
:root .cz .lc-steps li[data-state=run],:root .cz .lc-steps li[data-state=done]{font-weight:600}
:root .cz .lc-progress{height:8px;background:var(--lilac);border:0;margin-top:14px}
:root .cz .lc-progress i{background:var(--violet)}
:root .cz .lc-found{background:var(--lilac);border:0;border-radius:16px}
@media (min-width:960px){:root .cz .cc-dark{padding:18px}:root .cz .cc-dark .lc-mapbox{height:440px}}
@media (max-width:959px){:root .cz .lc-wait{display:flex;flex-direction:column;gap:16px}:root .cz .lc-wait-txt{display:contents}
  :root .cz .lc-wait-txt>*{order:3}:root .cz .lc-wait-txt>.lc-stepper,:root .cz .lc-wait-txt>.lc-fh1,:root .cz .lc-wait-txt>.lc-lead,:root .cz .lc-wait-txt>.lc-progress{order:1}
  :root .cz .lc-wait-viz{order:2}}

/* ── states: the kit's card + the page's own lines ── */
:root .cz .cc-st{margin-top:28px}
:root .cz .cz-state p{margin:0;font-size:16px;line-height:1.55;color:var(--ink2)}
:root .cz .cz-state .btn{align-self:stretch}
:root .cz .cz-state .lc-link,:root .cz .cz-state a.lc-link{display:inline-flex;align-items:center;min-height:44px;color:var(--violet);font-weight:600}
:root .cz .cz-state .lc-pay-refund{margin:0;border-radius:14px;padding:10px 14px}
:root .cz .cz-state form{width:100%;display:flex;flex-direction:column;gap:12px}
@media (min-width:640px){:root .cz .cz-state .btn{align-self:flex-start}}

/* ── pay (О1): form + receipt; steps after payment; sticky pay bar on phones ── */
:root .cz .lc-pay{max-width:none;margin:28px 0 0;padding:0;background:none;border:0;box-shadow:none}
:root .cz .cc-pay{display:grid;grid-template-columns:minmax(0,1fr);gap:16px;max-width:1100px}
:root .cz .cc-pay>*{grid-column:1;min-width:0}
:root .cz .cc-pay h1{font:700 clamp(26px,5vw,38px)/1.1 var(--f-disp);letter-spacing:-.03em;margin:0;text-wrap:balance;max-width:24ch}
:root .cz .lc-pay-f{background:var(--paper);border:1px solid var(--peri);border-radius:20px;padding:18px;display:flex;flex-direction:column;flex-wrap:nowrap;align-items:stretch;gap:12px;margin:0}
:root .cz .lc-pay-f>*{flex:none;min-width:0;max-width:100%}
:root .cz .lc-pay-f label:not(.lc-pay-period-o):not(.lc-pay-agree){display:flex;flex-direction:column;gap:6px;font-size:14px;font-weight:600;color:var(--ink2)}
:root .cz .lc-pay-f .lc-pay-period-o{flex-direction:row;align-items:center;gap:10px;font-size:15px;font-weight:400;color:var(--ink)}
:root .cz .lc-pay-f .lc-pay-agree{flex-direction:row;align-items:flex-start;gap:10px;min-height:44px;padding:4px 0;font-size:14px;font-weight:400;color:var(--ink)}
:root .cz .lc-pay-f .lc-pay-agree a{display:inline-block;min-height:44px;line-height:44px}
:root .cz .cc-rc-d{display:none;gap:12px}
:root .cz .cc-rc-map{margin:6px 0 0;display:grid;gap:8px;justify-items:center;text-align:center}
:root .cz .cc-rc-map .lc-minimap{width:100%;max-width:200px;height:auto}
:root .cz .cc-rc-dark{display:block;width:100%;max-width:260px;background:var(--midnight);border-radius:18px;padding:8px}:root .cz .cc-rc-dark .mapsvg{width:100%;height:auto;display:block}
:root .cz .cc-rc-map figcaption{font-size:14px;line-height:1.4;color:var(--ink2)}
:root .cz .cc-rc-b{margin:0;display:flex;flex-direction:column;gap:8px}
:root .cz .cc-rc-b div{display:flex;justify-content:space-between;gap:16px;font-size:15px}
:root .cz .cc-rc-b dt{color:var(--ink2)}:root .cz .cc-rc-b dd{margin:0;font-weight:600;text-align:right}
:root .cz .cc-steps{list-style:none;counter-reset:cc;margin:0;padding:0;display:flex;flex-direction:column;gap:10px;width:100%}
:root .cz .cc-steps li{counter-increment:cc;display:flex;gap:12px;align-items:flex-start;background:var(--lilac);border-radius:16px;padding:12px 14px;font-size:15px;line-height:1.45}
:root .cz .cc-steps li::before{content:counter(cc);flex:none;width:26px;height:26px;border-radius:50%;background:var(--violet);color:var(--paper);display:grid;place-items:center;font:800 13px var(--f-disp)}
:root .cz .cc-steps li:first-child{outline:2px solid var(--chartreuse);outline-offset:-2px}
@media (min-width:900px){:root .cz .cc-pay{grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);column-gap:48px;align-items:start}
  :root .cz .cc-pay>.cc-rc-d{display:flex;grid-column:2;grid-row:1 / span 8;position:sticky;top:20px}:root .cz .cc-pay>.cc-rc-m{display:none}
  :root .cz .cc-pay-1{grid-template-columns:minmax(0,640px)}}
@media (max-width:899px){
  /* fixed to the viewport, not sticky inside the card: the card keeps its own shape, the page leaves room under the last row */
  :root .cz .cc-mbar{position:fixed;left:0;right:0;bottom:0;z-index:20;margin:0;padding:10px 16px calc(10px + env(safe-area-inset-bottom));background:var(--paper);border-top:1px solid var(--peri);box-shadow:0 -8px 24px -12px rgba(24,22,26,.25)}
  :root .cz .cc-mbar .btn{width:100%;max-width:560px;margin:0 auto;display:flex}
  /* two separate rules on purpose: a selector list with an unsupported :has() is dropped whole (Firefox <121) */
  body.cc-hasbar{padding-bottom:calc(84px + env(safe-area-inset-bottom))}
  body.cc:has(.cc-mbar){padding-bottom:calc(84px + env(safe-area-inset-bottom))}
  html:has(.cc-mbar){scroll-padding-bottom:104px}}
@media print{:root .cz .cc-mbar{position:static;border:0;margin:0;padding:0}}

/* ── fields with a leading icon (П0, П2): the kit's input padding must not cover the icon ── */
:root .cz .lc-in input:not([type="checkbox"]):not([type="radio"]){padding-left:46px}
:root .cz .lc-in .lc-i{position:absolute;left:14px;width:20px;height:20px;color:var(--ink2);pointer-events:none}
/* header links of the funnel: the kit's quiet nav link, not a default underlined anchor */
:root .cz.cz-nav nav a{color:var(--ink2);font:600 14px/1.2 var(--f-body);text-decoration:none;min-height:44px;display:inline-flex;align-items:center}
:root .cz.cz-nav nav a:hover{color:var(--violet)}
:root .cz.cz-foot a{color:var(--ink2)}
/* body copy under the heading: breathing room the old shell had from lc.css */
:root .cz .lc-fh1+.lc-lead,:root .cz .lc-fh1+.lc-note{margin-top:12px}
:root .cz.cz-foot{margin-top:48px}

/* ── П0: the example map is the canon's dark honeycomb block, compact on a phone; the list of what the check shows is a fold ── */
:root .cz .lc-exmap.cc-dark1{background:var(--midnight);border:0;border-radius:22px;padding:44px 14px 14px;
  --lc-street:#3a3548;--lc-street-2:#4a4560;--lc-band-low:#4a4560;--lc-band-none:#5b5670;--lc-band-none-soft:#2a2631;--lc-map-ground:#1e1b22}
:root .cz .lc-exmap .lc-tag-ex{border:0;background:var(--chartreuse);color:var(--ink);font-weight:600}
:root .cz .lc-exmap .lc-hx.low polygon{stroke:var(--m-line)}
:root .cz .cc-feats{margin-top:16px;max-width:none}
:root .cz .cc-feats ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:14px}
:root .cz .cc-feats li{display:grid;grid-template-columns:28px minmax(0,1fr);gap:10px;font-size:15px;line-height:1.45}
:root .cz .cc-feats li svg{width:26px;height:26px;stroke-width:1.6;color:var(--violet)}
@media (min-width:641px){:root .cz .cc-feats>summary{display:none}}
@media (max-width:640px){:root .cz .lc-exmap.cc-dark1 .lc-hexmap{max-height:210px}:root .cz .lc-exmap.cc-dark1{padding-top:40px}}

/* OSM licence: the credit is always open and readable. MapLibre still draws its toggle («i» icons) on a <details open>; with nothing to toggle it only covers the text */
:root body.cc .maplibregl-ctrl-attrib .maplibregl-ctrl-attrib-button{display:none}
:root body.cc .maplibregl-ctrl-attrib{max-width:calc(100% - 16px);margin:0 8px 8px 0;border-radius:10px}
:root body.cc .maplibregl-ctrl-attrib .maplibregl-ctrl-attrib-inner{padding:3px 8px;font-size:11px;line-height:16px;white-space:normal}

/* ── P2 polish (05.11): review-reply / review landing / touch targets ── */
:root .cz .lc-card>h1+.lc-lead,:root .cz .lc-card>h1+.lc-muted,:root .cz .lc-card>h2+.lc-muted{margin-top:12px}
:root .cz button.lc-btn,:root .cz button.lc-cta{border:0;cursor:pointer;-webkit-appearance:none;appearance:none}
:root .cz .lc-pow{margin:24px 0 0;padding-bottom:8px;text-align:center;font-size:13px}
:root .cz.cz-foot a,:root .cz a.lc-lang{display:inline-flex;align-items:center;min-height:44px}
/* the consent link's 44 px target is the .lc-pay-f rule above (inline-block, line-height 44px); a padding extension on top of it
   made a 70 px box that reached into the label's first line — a tap meant to tick the box opened the Terms (release18 audit) */
