/* Offer discovery: image-led selectors, category navigation and responsive reflow. */
.offer-gallery { display:grid; grid-template-columns:repeat(auto-fill,minmax(180px,1fr)); gap:28px 20px; }
.offer-poster-card { all:unset; box-sizing:border-box; display:block; width:100%; min-width:0; cursor:pointer; border-radius:8px; }
.offer-poster { aspect-ratio:3/4; position:relative; overflow:hidden; border-radius:8px; border:1px solid #ffffff24; transition:transform 180ms ease,border-color 180ms ease; }
.offer-poster img { width:100%; height:100%; display:block; }
.offer-poster-fallback { height:100%; display:flex; flex-direction:column; justify-content:center; align-items:center; gap:20px; padding:20px; text-align:center; font-weight:800; color:#f1ece7; }
.offer-poster-tags { position:absolute; top:12px; left:12px; right:12px; display:flex; gap:6px; flex-wrap:wrap; }
.offer-poster-action { position:absolute; bottom:0; left:0; right:0; padding:32px 12px 12px; background:linear-gradient(transparent,#060d18e6); color:#fff; font-size:.75rem; display:flex; justify-content:space-between; font-weight:700; }
.offer-poster-caption { padding:12px 0 0; }
.offer-poster-caption h3 { font-family:'Barlow Condensed',sans-serif; font-size:1.4rem; line-height:1.15; color:#f1ece7; overflow-wrap:anywhere; }
.offer-poster-caption p { font-size:.75rem; color:#bdc7d7; margin-top:5px; overflow-wrap:anywhere; }
.offer-poster-price { display:flex; align-items:baseline; flex-wrap:wrap; gap:8px; margin-top:8px; }
.offer-poster-price strong { font-size:.95rem; } .offer-poster-price del { font-size:.75rem; color:#bdc7d7; }
.offer-poster-card[aria-pressed="true"] .offer-poster { border-color:#84e3f3; box-shadow:0 0 0 2px #84e3f3; }
.offer-poster-card:focus-visible { outline:3px solid #84e3f3; outline-offset:6px; }
@media(hover:hover) { .offer-poster-card:hover .offer-poster { transform:translateY(-4px); border-color:#84e3f3; } }
.offer-categories { order:0; overflow-y:auto; padding:28px 16px 28px 20px; border-right:1px solid #ffffff18; }
.offer-categories h2 { font-size:.9rem; margin-bottom:20px; color:#f1ece7; }
.offer-categories button { display:block; text-align:left; width:100%; min-height:44px; padding:10px 12px; color:#bdc7d7; font-size:.82rem; border-radius:6px; margin-bottom:4px; }
.offer-categories button[aria-pressed="true"] { background:#84e3f31a; color:#84e3f3; font-weight:800; }
.offer-categories button:hover { background:#ffffff0d; }
.offer-categories button:focus-visible,.offer-search input:focus-visible,.offer-mobile-category select:focus-visible { outline:2px solid #84e3f3; outline-offset:3px; }
.offer-gallery-header { display:flex; justify-content:space-between; align-items:center; gap:20px; margin-bottom:28px; flex-wrap:wrap; }
.offer-gallery-header h1 { font-family:'Barlow Condensed',sans-serif; font-size:2.4rem; line-height:1.1; }
.offer-gallery-header p { color:#bdc7d7; font-size:.8rem; margin-top:8px; }
.offer-search { flex:0 1 300px; min-width:0; } .offer-search input { width:100%; min-height:44px; border:1px solid #ffffff30; border-radius:6px; background:#ffffff08; color:#f1ece7; padding:10px 12px; font-size:.85rem; }
.offer-search input::placeholder { color:#bdc7d7; }
.offer-mobile-category { display:grid; gap:8px; font-size:.8rem; color:#bdc7d7; margin-bottom:24px; }
.offer-mobile-category select { width:100%; min-height:44px; font-size:1rem; background:#132237; color:#f1ece7; border:1px solid #ffffff30; border-radius:6px; padding:10px 12px; }
.sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
@media(max-width:600px) { .offer-gallery { grid-template-columns:repeat(2,minmax(0,1fr)); gap:24px 12px; } .offer-gallery-header { gap:16px; margin-bottom:20px; } .offer-search { flex:1 1 100%; } .offer-poster-tags { top:8px; left:8px; right:8px; } .offer-poster-caption h3 { font-size:1.2rem; } .offer-poster-price strong { font-size:.85rem; } }
@media(prefers-reduced-motion:reduce) { .offer-poster { transition:none; } .offer-poster-card:hover .offer-poster { transform:none; } }
