.cpe{--p:#7c3aed;--s:#ec4899;--a:#f59e0b;--d:#1f2937;color:var(--d)}
.cpe-wrap{width:min(1240px,92%);margin:auto;padding:44px 0}
.cpe-title{text-align:center;margin:0 0 24px}.cpe-title small,.cpe-hero small,.cpe-mega small{letter-spacing:.14em;color:var(--p);font-weight:800}
.cpe-title h2{font-size:clamp(34px,4vw,48px);margin:8px 0}.cpe-title p{max-width:720px;margin:0 auto}
.cpe-btn{display:inline-block;background:var(--p);color:#fff;padding:14px 22px;border-radius:10px;text-decoration:none;font-weight:800}
.cpe-hero{width:min(1240px,92%);margin:auto;min-height:480px;display:grid;grid-template-columns:1.2fr 1fr;align-items:center;gap:50px;padding:35px 0}
.cpe-hero h1{font-size:clamp(46px,6vw,76px);line-height:1;margin:16px 0}.cpe-hero p{font-size:18px;line-height:1.65}
.cpe-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:18px}.cpe-actions a{margin:0}.cpe-actions .secondary{background:#fff;color:var(--p);border:1px solid #c4b5fd}
.cpe-hero-media{height:390px;border-radius:24px;background:#f5f3ff;display:flex;flex-direction:column;align-items:center;justify-content:center;overflow:hidden;box-shadow:0 20px 50px #1112;padding:18px}
.cpe-hero-media img{width:100%;height:100%;object-fit:contain;border-radius:16px}.cpe-hero-media span{letter-spacing:.12em;font-weight:800;color:var(--p);margin-top:10px}
.cpe-cats,.cpe-products{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}.cpe-cat{padding:24px;border:1px solid #ede9fe;border-radius:16px;text-decoration:none;color:var(--d);display:flex;flex-direction:column;box-shadow:0 8px 25px #1111}
.cpe-cat{background:var(--card-bg,#fff);color:var(--card-text,var(--d));border-color:var(--card-border,#ede9fe);overflow:hidden}
.cpe-cat i{font-size:28px;color:var(--card-accent,var(--p));font-style:normal}.cpe-cat b{font-size:18px;margin:18px 0 8px;color:var(--card-text,var(--d))}.cpe-cat span{color:var(--card-accent,var(--p))}
.cpe-cat-media{margin:-24px -24px 4px;aspect-ratio:1.65;overflow:hidden}.cpe-cat-media img{display:block;width:100%;height:100%;object-fit:cover}.cpe-cat-content{display:flex;flex-direction:column}.cpe-cat--image .cpe-cat-content{padding-top:4px}
.cpe-rowhead{display:flex;justify-content:space-between;align-items:end;margin-bottom:22px}.cpe-rowhead h2{font-size:clamp(32px,4vw,46px);margin:7px 0}.cpe-rowhead>a{color:var(--p);font-weight:800}
.cpe-mega{padding:65px max(5%,calc((100% - 1160px)/2));background:#111827;color:#fff;display:grid;grid-template-columns:1.4fr .7fr;gap:40px;align-items:center;background-size:cover;background-position:center}
.cpe-mega h2{font-size:clamp(38px,5vw,58px);line-height:1.06;margin:12px 0}.cpe-mega strong{font-size:44px;color:#fbbf24;margin-left:12px}.cpe-mega img{width:100%;aspect-ratio:1;object-fit:cover;background:#fff;border-radius:20px;padding:12px}
.cpe-features{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}.cpe-feature{text-align:center;padding:32px;background:#f9fafb;border-radius:16px;font-size:27px}.cpe-feature h3{font-size:18px}.cpe-feature p{font-size:14px}
.cpe-promos,.cpe-reviews{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.cpe-promo{min-height:220px;padding:28px;background:#7c3aed;color:#fff;text-decoration:none;border-radius:18px;font-size:25px;font-weight:800;display:flex;flex-direction:column;justify-content:end;background-size:cover;background-position:center}
.cpe-promo span{font-size:14px;margin-top:8px}.cpe-review{margin:0;padding:28px;border:1px solid #e5e7eb;border-radius:16px;line-height:1.7}.cpe-review b{display:block;color:var(--p);margin-top:15px}
@media(max-width:850px){.cpe-hero{grid-template-columns:1fr;text-align:center;padding:28px 0}.cpe-actions{justify-content:center}.cpe-hero-media{height:auto;aspect-ratio:1.15}.cpe-cats,.cpe-products{grid-template-columns:repeat(2,1fr)}.cpe-rowhead{display:block}.cpe-mega{grid-template-columns:1fr;text-align:center;padding:44px 6%}.cpe-mega img{width:min(100%,420px);margin:auto}.cpe-features{grid-template-columns:repeat(2,1fr)}.cpe-promos,.cpe-reviews{grid-template-columns:1fr}}
@media(max-width:520px){.cpe-wrap{width:94%;padding:34px 0}.cpe-hero h1{font-size:40px}.cpe-actions a{display:block;width:100%}.cpe-cats,.cpe-products{gap:12px}.cpe-cat{padding:15px}.cpe-cat-media{margin:-15px -15px 2px}.cpe-cat b{font-size:15px}.cpe-features{grid-template-columns:1fr}.cpe-mega strong{display:block;margin:6px 0}.cpe-promo{min-height:170px}}
.cpe-cats{gap:28px}
.cpe-cat{border-radius:20px;box-shadow:0 2px 8px rgba(17,17,17,.06);transition:transform .45s cubic-bezier(.22,1,.36,1),box-shadow .45s cubic-bezier(.22,1,.36,1),border-color .45s ease;will-change:transform}
.cpe-cat:hover{transform:translateY(-10px);box-shadow:0 24px 48px rgba(17,17,17,.16);border-color:var(--card-accent,var(--p))}
.cpe-cat-media{border-radius:16px 16px 0 0;position:relative}
.cpe-cat i{transition:transform .4s cubic-bezier(.34,1.56,.64,1)}
.cpe-cat:hover i{transform:scale(1.15) rotate(-6deg)}
.cpe-cat b{transition:color .3s ease}
.cpe-cat:hover b{color:var(--card-accent,var(--p))}
.cpe-cat-media img{transition:transform .6s cubic-bezier(.22,1,.36,1)}
.cpe-cat:hover .cpe-cat-media img{transform:scale(1.08)}
.cpe-cat span{display:inline-flex;align-items:center;gap:6px;transition:gap .3s ease,color .3s ease}
.cpe-cat:hover span{gap:10px;color:var(--card-accent,var(--p))}
.cpe-cats.cpe-anim .cpe-cat{opacity:0;transform:translateY(36px) scale(.98)}
.cpe-cats.cpe-anim .cpe-cat.cpe-in-view{animation:cpeCardIn .7s cubic-bezier(.22,1,.36,1) forwards}
.cpe-cats.cpe-anim .cpe-cat:nth-child(1).cpe-in-view{animation-delay:0s}
.cpe-cats.cpe-anim .cpe-cat:nth-child(2).cpe-in-view{animation-delay:.06s}
.cpe-cats.cpe-anim .cpe-cat:nth-child(3).cpe-in-view{animation-delay:.12s}
.cpe-cats.cpe-anim .cpe-cat:nth-child(4).cpe-in-view{animation-delay:.18s}
.cpe-cats.cpe-anim .cpe-cat:nth-child(5).cpe-in-view{animation-delay:.24s}
.cpe-cats.cpe-anim .cpe-cat:nth-child(6).cpe-in-view{animation-delay:.3s}
.cpe-cats.cpe-anim .cpe-cat:nth-child(7).cpe-in-view{animation-delay:.36s}
.cpe-cats.cpe-anim .cpe-cat:nth-child(8).cpe-in-view{animation-delay:.42s}
@keyframes cpeCardIn{from{opacity:0;transform:translateY(36px) scale(.98)}to{opacity:1;transform:translateY(0) scale(1)}}
@media (prefers-reduced-motion: reduce){.cpe-cats.cpe-anim .cpe-cat{opacity:1;transform:none;animation:none}}
@media (max-width:640px){.cpe-cats{grid-template-columns:repeat(2,1fr);gap:16px}}