/* TechBites+ Offers page (new UI, "B · Posters"): title + timer, one members-only bar for visitors, cover-first grid.
   Builds on plus.css (.plus-page fonts, .p-num, .p-skel). Arabic, RTL. */
.tbo { --s1:#151518; --s2:#1A1A1E; --line:rgba(255,255,255,.08); --line2:rgba(255,255,255,.14); --brand:#F39125; --gold:#FFC857; --green:#19E68C;
  --tx:#F4F4F5; --tx2:#B4B4BD; --tx3:#85858F; --spring:cubic-bezier(.34,1.56,.64,1); color:var(--tx); padding-top:8px; }
.tbo .ico { width:1em; height:1em; flex:none; }
.tbo-head { display:flex; align-items:center; justify-content:space-between; gap:12px 16px; flex-wrap:wrap; }
.tbo-head h1 { font-weight:900; font-size:clamp(30px,4vw,44px); line-height:1.35; }
.tbo-head h1 em { font-style:normal; color:var(--gold); }
.tbo-drop { margin-top:26px; } .tbo-drop + .tbo-drop { margin-top:40px; }
.tbo-drop-head { display:flex; align-items:center; justify-content:space-between; gap:10px 16px; flex-wrap:wrap; }
.tbo-drop-head h2 { font-size:20px; font-weight:900; }
.tbo-timer { display:inline-flex; align-items:center; gap:10px; padding:8px 16px; border-radius:999px; background:rgba(255,200,87,.08); border:1px solid rgba(255,200,87,.35); color:var(--gold); font-weight:800; font-size:14px; }
.tbo-timer .p-num { font-size:18px; font-weight:800; letter-spacing:.04em; }
.tbo-timer.hot { color:#fb7185; border-color:rgba(251,113,133,.45); background:rgba(251,113,133,.08); }
.tbo-gate { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-top:18px; padding:12px 12px 12px 16px; border-radius:16px; background:var(--s1); border:1px solid var(--line2); font-weight:700; color:var(--tx2); flex-wrap:wrap; }
.tbo-gate b { color:var(--tx); } .tbo-gate > span .ico { color:var(--gold); margin-inline-end:4px; vertical-align:-2px; }

.tbo-btn { display:inline-flex; align-items:center; justify-content:center; gap:8px; min-height:44px; padding:0 18px; border-radius:999px; border:0; cursor:pointer; font:900 14.5px Cairo, sans-serif; background:var(--brand); color:#0b0b0d; transition:transform .2s var(--spring), box-shadow .2s; white-space:nowrap; text-decoration:none; }
.tbo-btn:hover { transform:translateY(-2px); box-shadow:0 10px 26px rgba(243,145,37,.4); color:#0b0b0d; }
.tbo-btn.gold { background:var(--gold); }
.tbo-btn.ghost { background:rgba(255,255,255,.06); color:#fff; border:1px solid var(--line2); box-shadow:none; }
.tbo-btn.lock { background:rgba(255,255,255,.05); color:var(--tx3); border:1px solid var(--line); }
.tbo-btn.lock:hover { transform:none; box-shadow:none; color:var(--tx2); }
.tbo-btn:disabled { cursor:not-allowed; opacity:.6; transform:none; box-shadow:none; }
.tbo-btn:focus-visible, .tbo-cv:focus-visible { outline:2px solid #fff; outline-offset:3px; }

.tbo-grid { margin-top:18px; display:grid; grid-template-columns:repeat(4,1fr); gap:16px; }
.tbo-card { position:relative; border-radius:20px; overflow:hidden; background:var(--s1); border:1px solid var(--line); display:flex; flex-direction:column; transition:transform .3s var(--spring), border-color .2s, box-shadow .3s; }
.tbo-card:hover { transform:translateY(-6px); border-color:rgba(255,200,87,.4); box-shadow:0 24px 50px rgba(0,0,0,.5), 0 0 30px rgba(255,200,87,.12); }
.tbo-card.is-off { opacity:.55; } .tbo-card.is-off:hover { transform:none; box-shadow:none; border-color:var(--line); }
.tbo-cv { position:relative; display:block; aspect-ratio:2/3; overflow:hidden; background:var(--s2); }
.tbo-cv img { width:100%; height:100%; object-fit:cover; display:block; transition:transform .6s; }
.tbo-card:hover .tbo-cv img { transform:scale(1.05); }
.tbo-cv::after { content:""; position:absolute; inset:45% 0 0; background:linear-gradient(transparent, rgba(11,11,13,.95)); }
.tbo-save { position:absolute; top:10px; inset-inline-start:10px; z-index:1; direction:ltr; unicode-bidi:isolate; font-size:12px; font-weight:900; padding:2px 9px; border-radius:99px; background:var(--green); color:#04190f; }
.tbo-left { position:absolute; top:10px; inset-inline-end:10px; z-index:1; font-size:12px; font-weight:800; color:#fb7185; background:rgba(11,11,13,.8); padding:2px 8px; border-radius:99px; }
.tbo-info { position:absolute; z-index:1; left:0; right:0; bottom:0; padding:12px 14px; }
.tbo-info h3 { font-size:15px; font-weight:800; line-height:1.35; color:#fff; }
.tbo-pr { display:flex; align-items:baseline; gap:8px; margin-top:4px; flex-wrap:wrap; }
.tbo-pr b { font-size:21px; color:var(--gold); font-weight:800; } .tbo-pr b small { font-size:11px; color:var(--tx2); margin-inline-start:3px; }
.tbo-pr s { color:var(--tx3); font-size:14px; }
.tbo-foot { padding:10px; } .tbo-foot .tbo-btn { width:100%; }

.tbo-empty { margin-top:26px; padding:40px 20px; text-align:center; border-radius:22px; border:1px dashed var(--line2); color:var(--tx2); font-weight:700; }
.tbo-empty h2 { color:var(--tx); font-size:22px; margin-bottom:6px; } .tbo-empty .tbo-btn { margin-top:16px; }

.o-toast { position:fixed; z-index:10000; left:50%; bottom:24px; transform:translateX(-50%); padding:12px 18px; border-radius:14px; background:#1A1A1E; border:1px solid rgba(255,255,255,.14); color:#fff; font:700 14px Cairo, sans-serif; box-shadow:0 20px 50px rgba(0,0,0,.5); }
.o-toast.err { border-color:rgba(251,113,133,.5); }

@media (max-width:960px) { .tbo-grid { grid-template-columns:repeat(3,1fr); } }
@media (max-width:640px) { .tbo-grid { grid-template-columns:repeat(2,1fr); gap:10px; } .tbo-pr b { font-size:18px; } .tbo-foot .tbo-btn { font-size:13.5px; padding:0 10px; } }
@media (prefers-reduced-motion:reduce) { .tbo * { transition:none !important; } }