.ppf{--c0:#4933D1;--c1:#0A6B43;--c2:#B4410E;--c3:#0B5CAD;--c4:#A21C5B;--c5:#0F6E73;--ppf-ink:#16161D;--ppf-pad:14px;width:100%;max-width:1200px;margin:0 auto;display:flex;flex-direction:column;gap:12px;color:var(--ppf-ink);font-size:15px;line-height:1.3}
.ppf *{box-sizing:border-box}
.ppf a,.ppf a:hover,.ppf a:focus{text-decoration:none}
.ppf-c0{--c:var(--c0)}.ppf-c1{--c:var(--c1)}.ppf-c2{--c:var(--c2)}.ppf-c3{--c:var(--c3)}.ppf-c4{--c:var(--c4)}.ppf-c5{--c:var(--c5)}
.ppf-ico{flex:0 0 auto;display:block}

.ppf-sec{padding:14px 0 16px;border-radius:14px;display:flex;flex-direction:column;gap:12px;min-width:0}
.ppf-sec--brands{background:#EEF0FF}
.ppf-sec--prices{background:#E9F7EF}
.ppf-sec--feats{background:#FFF1E8}

.ppf-head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:0 var(--ppf-pad)}
.ppf .ppf-h{margin:0;padding:0;font-size:18px;font-weight:700;line-height:1.2;color:var(--ppf-ink)}
.ppf .ppf-more{flex:0 0 auto;display:inline-flex;align-items:center;gap:2px;min-height:32px;padding:4px 6px 4px 10px;border-radius:999px;background:#fff;font-size:13px;font-weight:600;color:var(--ppf-ink);box-shadow:0 1px 3px rgba(22,22,29,.12)}
.ppf .ppf-more:hover,.ppf .ppf-more:focus{color:var(--c0)}
.ppf-more .ppf-ico{width:16px;height:16px}

.ppf-slider{position:relative;min-width:0}
.ppf-row{display:flex;gap:10px;padding:4px var(--ppf-pad);overflow-x:auto;scroll-snap-type:x proximity;scroll-padding-left:var(--ppf-pad);scrollbar-width:none;-webkit-overflow-scrolling:touch}
.ppf-row::-webkit-scrollbar{display:none}
.ppf .ppf-nav{position:absolute;top:50%;z-index:2;width:36px;height:36px;min-height:0;margin:-18px 0 0;padding:0;border:0;border-radius:999px;background:#fff;color:var(--ppf-ink);display:flex;align-items:center;justify-content:center;cursor:pointer;box-shadow:0 2px 8px rgba(22,22,29,.28)}
.ppf .ppf-nav[hidden]{display:none}
.ppf .ppf-nav:hover,.ppf .ppf-nav:focus{background:var(--ppf-ink);color:#fff}
.ppf-nav--prev{left:6px}
.ppf-nav--next{right:6px}

.ppf-brand{flex:0 0 76px;scroll-snap-align:start;display:flex;flex-direction:column;align-items:center;gap:6px;color:var(--ppf-ink)}
.ppf-brand__dot{width:64px;height:64px;border-radius:999px;background:#fff;border:3px solid var(--c);display:flex;align-items:center;justify-content:center;overflow:hidden;font-weight:700;font-size:22px;color:var(--c);box-shadow:0 2px 6px rgba(22,22,29,.12);transition:transform .15s ease,box-shadow .15s ease}
.ppf-brand__dot img{width:100%;height:100%;object-fit:cover;display:block}
.ppf-brand__dot--logo img{object-fit:contain;padding:10px}
.ppf-brand__name{width:100%;font-size:13px;font-weight:600;line-height:1.2;text-align:center;color:var(--ppf-ink);overflow-wrap:anywhere}
.ppf-brand:hover .ppf-brand__name,.ppf-brand:focus .ppf-brand__name{color:var(--c)}
.ppf-brand:hover .ppf-brand__dot,.ppf-brand:focus .ppf-brand__dot{transform:translateY(-2px);box-shadow:0 5px 12px rgba(22,22,29,.2)}

.ppf-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;padding:0 var(--ppf-pad)}
.ppf .ppf-tile{min-height:60px;padding:8px 10px;border-radius:12px;background:var(--c);background:linear-gradient(135deg,var(--c),color-mix(in srgb,var(--c) 72%,#000));color:#fff;display:flex;align-items:center;gap:8px;box-shadow:0 2px 6px rgba(22,22,29,.16);transition:transform .15s ease,box-shadow .15s ease}
.ppf .ppf-tile:hover,.ppf .ppf-tile:focus{color:#fff;transform:translateY(-2px);box-shadow:0 6px 14px rgba(22,22,29,.24)}
.ppf-tile__txt{flex:1 1 auto;min-width:0;display:flex;flex-direction:column;gap:2px}
.ppf-tile small{font-size:12px;font-weight:500;line-height:1.2;color:#fff;opacity:1}
.ppf-tile strong{font-size:14px;font-weight:700;line-height:1.2;color:#fff;white-space:nowrap}
.ppf-tile--price>.ppf-ico{width:16px;height:16px;display:none}
.ppf-tile__ico{flex:0 0 auto;width:34px;height:34px;border-radius:999px;background:rgba(255,255,255,.18);display:flex;align-items:center;justify-content:center}
.ppf-row .ppf-tile{flex:0 0 auto;min-width:132px;scroll-snap-align:start}

.ppf a:focus-visible,.ppf button:focus-visible{outline:3px solid var(--ppf-ink);outline-offset:2px}

@media (max-width:340px){.ppf-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (min-width:600px){
.ppf{--ppf-pad:18px;gap:14px}
.ppf-sec{padding:18px 0 20px}
.ppf .ppf-h{font-size:20px}
.ppf-grid{grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:10px}
.ppf .ppf-tile{min-height:66px;padding:10px 14px}
.ppf-tile strong{font-size:15px}
.ppf-tile--price>.ppf-ico{display:block}
.ppf-row{gap:14px}
.ppf-brand{flex-basis:92px}
.ppf-brand__dot{width:76px;height:76px}
.ppf-brand__name{font-size:14px}
.ppf-row .ppf-tile{min-width:156px}
}
@media (hover:none){.ppf .ppf-nav{display:none}}
@media (prefers-reduced-motion:reduce){.ppf .ppf-tile,.ppf-brand__dot{transition:none}.ppf .ppf-tile:hover,.ppf-brand:hover .ppf-brand__dot{transform:none}}