/* «منتجات مقترحة» — warm gold + cream, from the Offers / Countdown designs. Prefix z- */
.z-sec{display:flex;flex-direction:column;gap:12px}
.z-hd{display:flex;align-items:flex-end;justify-content:space-between;gap:10px}
.z-hd h2{margin:0;font-size:18px;font-weight:900;display:flex;align-items:center;gap:8px}
.z-sp{display:grid;place-items:center;flex-shrink:0;width:30px;height:30px;border-radius:10px;color:#fff;background:linear-gradient(160deg,#C9973E,#8C6020);box-shadow:0 6px 14px rgba(140,96,32,.3)}
.z-hd p{margin:2px 0 0;font-size:13px;color:var(--wn);font-weight:700}
.z-all{font-size:14px;font-weight:800;color:#8C6020;text-decoration:none;white-space:nowrap;min-height:44px;display:flex;align-items:center}
.z-all:hover{color:#6E4B16}
.z-rail{display:flex;gap:12px;overflow-x:auto;scrollbar-width:none;margin:0 -20px;padding:4px 20px 14px;scroll-snap-type:x mandatory}
.z-rail::-webkit-scrollbar{display:none}
.z-card{flex:0 0 200px;scroll-snap-align:start;display:flex;flex-direction:column;border-radius:22px;overflow:hidden;background:#FFFCF5;border:1px solid #EFD9A9;box-shadow:0 10px 26px rgba(140,96,32,.14);text-decoration:none;color:var(--ink)}
.z-card:hover{color:var(--ink)}
.z-img{position:relative;display:block;height:150px;background:#fff;border-bottom:1px solid #F3E4C2}
.z-img img{width:100%;height:100%;object-fit:contain;padding:14px 14px 10px;box-sizing:border-box;display:block}
.z-ad{position:absolute;bottom:10px;left:10px;z-index:1;display:inline-flex;align-items:center;min-height:22px;padding:0 8px;border-radius:7px;background:rgba(43,33,48,.55);color:#fff;font-size:11px;font-weight:700}
.z-bd{display:flex;flex-direction:column;gap:4px;padding:12px 14px 14px}
.z-n{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;min-height:45px;font-size:15px;font-weight:800;line-height:1.5;color:var(--ink)}
.z-pr{display:flex;align-items:baseline;gap:8px}
.z-pr b{font-size:19px;font-weight:900;color:#8C6020}
.z-pr s{font-size:13px;color:#9A8F96}
.z-shop{display:flex;align-items:center;gap:6px;font-size:12px;color:var(--mu)}
.z-st{display:inline-flex;align-items:center;min-height:24px;padding:0 9px;border-radius:7px;font-family:Arial,Helvetica,sans-serif;font-size:13px;font-weight:800;letter-spacing:-.2px;direction:ltr}
.z-st.amz{background:#232F3E;color:#fff;box-shadow:inset 0 -3px 0 #FF9900}
.z-st.noon{background:#FEEE00;color:#000}
.z-st.jum{background:#F68B1E;color:#fff}

/* the page */
.z-hero{position:relative;overflow:hidden;border-radius:26px;padding:22px 20px;color:#fff;background:linear-gradient(160deg,#B4802E,#8C6020);box-shadow:0 14px 30px rgba(140,96,32,.28)}
.z-hero p{margin:0;position:relative}
.z-hero .z-big{font-size:28px;font-weight:900;margin:4px 0}
.z-hero::before{content:"";position:absolute;width:180px;height:180px;border-radius:50%;left:-60px;top:-70px;background:rgba(255,255,255,.08)}
.z-item{display:flex;flex-direction:column;border-radius:24px;overflow:hidden;background:#FFFCF5;border:1px solid #EFD9A9;box-shadow:0 12px 30px rgba(140,96,32,.14);scroll-margin-top:16px}
.z-item .z-img{height:170px}
.z-item .z-n{min-height:0;font-size:17px}
.z-cmp{display:flex;align-items:center;gap:10px;min-height:60px;padding:8px 14px;text-decoration:none;color:var(--ink);border-top:1px solid #F3E4C2;transition:background-color .15s}
.z-cmp:hover{color:var(--ink);background:#FFF7E6}
.z-cmp:hover .z-p b{text-decoration:underline;text-underline-offset:4px}
.z-cmp .z-p{flex:1;min-width:0;display:flex;flex-direction:column}
.z-cmp .z-p b{font-size:17px;font-weight:900;white-space:nowrap}
.z-cur{font-size:13px;font-weight:700;color:var(--mu)}
.z-cmp .z-p s{font-size:12px;color:#9A8F96}
.z-arr{flex-shrink:0;color:#B4802E}
.z-low{display:inline-flex;align-items:center;gap:4px;min-height:26px;padding:0 10px;border-radius:999px;background:var(--ok);color:#fff;font-size:12px;font-weight:800;white-space:nowrap;box-shadow:0 4px 10px rgba(47,106,76,.25)}
.z-cmp.z-win{background:linear-gradient(90deg,#F2FAF5,#E3F2E9);box-shadow:inset -4px 0 0 var(--ok)}
.z-cmp.z-win:hover{background:#DDF0E4}
.z-cmp.z-win .z-p b{font-size:20px;color:var(--ok)}
.z-cmp.z-win .z-cur{color:var(--ok)}
.z-cmp.z-win .z-arr{color:var(--ok)}
.z-honest{margin:0;font-size:13px;line-height:1.8;color:var(--mu);text-align:center}