/* =========================================================
   EXTERNAL PRO — v160 (2026-10-03). Scoped to .ex-* ; reuses the Hot Deals (159) strip, command bar, summary row & tokens,
   so both pages look and behave like one product. Light + dark, RTL-safe, motion-safe.
   ========================================================= */
.ex-section [hidden]{display:none!important;}
.ex-section{padding-top:14px;}

/* ---------- command bar: tabs · search · area · sort · action — ONE row ---------- */
.ex-bar{gap:8px;}
.ex-tabs{display:inline-flex;flex:none;padding:3px;border-radius:12px;background:var(--dh-soft);gap:2px;}
.ex-tabs button{position:relative;display:inline-flex;align-items:center;gap:8px;height:36px;padding:0 13px;border:0;border-radius:10px;background:transparent;color:var(--dh-mute);font:700 13px var(--font-body,Inter,system-ui,sans-serif);cursor:pointer;transition:background .2s,color .2s,box-shadow .2s;}
.ex-tabs button i{font-size:12px;color:var(--dh-gold);}
.ex-tabs button b{min-width:20px;padding:1px 6px;border-radius:999px;background:rgba(127,140,160,.18);font-size:11px;font-weight:800;text-align:center;font-variant-numeric:tabular-nums;}
.ex-tabs button:hover{color:var(--dh-ink);}
.ex-tabs button.active{background:var(--dh-card);color:var(--dh-ink);box-shadow:0 2px 8px rgba(22,45,76,.14);}
.ex-tabs button.active b{background:var(--dh-gold);color:#162D4C;}
.ex-add{background:var(--dh-gold);border-color:transparent;color:#162D4C;transition:transform .18s,box-shadow .18s,filter .18s;}
.ex-add:hover{transform:translateY(-1px);box-shadow:0 8px 18px rgba(206,165,119,.45);filter:brightness(1.04);}
.ex-add.is-login{background:var(--dh-card);border-color:var(--dh-line);color:var(--dh-ink);}
.ex-add i{font-size:12px;}
#exAct{display:contents;}
.ex-summary{padding-top:12px;}

/* ---------- grid + cards ---------- */
.ex-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(290px,1fr));gap:16px;}
.ex-card{position:relative;display:flex;flex-direction:column;border-radius:var(--dh-r);background:var(--dh-card);border:1px solid var(--dh-line);overflow:hidden;color:var(--dh-ink);box-shadow:0 2px 10px rgba(22,45,76,.06);transition:transform .25s,box-shadow .25s,border-color .25s;animation:dhRise .5s cubic-bezier(.2,.7,.2,1) both;animation-delay:calc(var(--i,0)*55ms);}
.ex-card:hover{transform:translateY(-3px);border-color:rgba(206,165,119,.7);box-shadow:0 16px 34px rgba(22,45,76,.16);}
.ex-media{position:relative;aspect-ratio:16/10;background:var(--dh-navy);overflow:hidden;}
.ex-media img{width:100%;height:100%;object-fit:cover;transition:transform .6s;}
.ex-card:hover .ex-media img{transform:scale(1.07);}
.ex-media::after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(180deg,rgba(15,31,53,.35) 0%,transparent 35%,rgba(15,31,53,.82) 100%);}
.ex-noimg{width:100%;height:100%;display:grid;place-items:center;font-size:34px;color:rgba(255,255,255,.28);}
.ex-area{position:absolute;z-index:1;inset-block-start:10px;inset-inline-start:10px;display:inline-flex;align-items:center;gap:6px;padding:5px 10px;border-radius:999px;font-size:11px;font-weight:700;color:#fff;background:rgba(15,31,53,.68);border:1px solid rgba(206,165,119,.5);backdrop-filter:blur(5px);}
.ex-area i{color:var(--dh-gold2);font-size:10px;}
.ex-count{position:absolute;z-index:1;inset-block-start:10px;inset-inline-end:10px;display:inline-flex;align-items:center;gap:5px;padding:5px 9px;border-radius:999px;font-size:11px;font-weight:700;color:#fff;background:rgba(15,31,53,.68);backdrop-filter:blur(5px);}
.ex-price{position:absolute;z-index:1;inset-inline:12px;inset-block-end:10px;display:flex;align-items:baseline;gap:6px;color:#fff;}
.ex-price b{font-size:21px;font-weight:800;font-variant-numeric:tabular-nums;text-shadow:0 2px 10px rgba(0,0,0,.4);}
.ex-price small{font-size:11px;color:rgba(255,255,255,.8);}
.ex-body{display:flex;flex-direction:column;gap:8px;padding:13px 14px 4px;flex:1;}
.ex-body h4{margin:0;font-family:'Fraunces',Georgia,serif;font-size:18px;font-weight:600;line-height:1.2;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;}
.ex-specs{display:flex;flex-wrap:wrap;gap:6px 12px;font-size:12px;color:var(--dh-mute);}
.ex-specs span{display:inline-flex;align-items:center;gap:6px;}
.ex-specs i{color:var(--dh-gold);font-size:11px;}
.ex-notes{margin:0;font-size:12.5px;line-height:1.5;color:var(--dh-mute);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;}
.ex-notes.ex-strong{color:var(--dh-ink);-webkit-line-clamp:3;}
.ex-by{display:flex;align-items:center;gap:9px;margin-top:auto;padding-top:10px;border-top:1px dashed var(--dh-line);font-size:12px;min-width:0;}
.ex-av{flex:none;width:26px;height:26px;border-radius:50%;display:grid;place-items:center;font-size:12px;font-weight:800;background:var(--dh-navy);color:var(--dh-gold2);}
.ex-by-t{flex:1;min-width:0;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.ex-by-t em{font-style:normal;font-weight:500;color:var(--dh-mute);}
.ex-by small{flex:none;color:var(--dh-mute);font-size:11px;}
.ex-actions{display:flex;gap:8px;padding:10px 14px 14px;}
.ex-wa{flex:1;display:inline-flex;align-items:center;justify-content:center;gap:8px;height:40px;border-radius:12px;background:#1FA855;color:#fff;font:700 13px var(--font-body,Inter,system-ui,sans-serif);text-decoration:none;transition:transform .18s,box-shadow .18s,filter .18s;}
.ex-wa:hover{transform:translateY(-1px);box-shadow:0 8px 18px rgba(31,168,85,.35);filter:brightness(1.05);}
.ex-wa i{font-size:16px;}
.ex-wa.is-off{background:var(--dh-soft);color:var(--dh-mute);box-shadow:none;transform:none;pointer-events:none;}
.ex-ib{flex:none;width:40px;height:40px;display:grid;place-items:center;border-radius:12px;border:1px solid var(--dh-line);background:var(--dh-card);color:var(--dh-ink);cursor:pointer;text-decoration:none;transition:border-color .18s,color .18s,transform .18s;}
.ex-ib:hover{border-color:var(--dh-gold);color:var(--dh-gold);transform:translateY(-1px);}

/* ---------- "wanted" cards (client requests) ---------- */
.ex-req{border-inline-start:3px solid var(--dh-gold);background:linear-gradient(160deg,rgba(206,165,119,.12),transparent 45%),var(--dh-card);}
.ex-rtop{display:flex;align-items:center;gap:12px;padding:14px 14px 0;}
.ex-ricon{flex:none;width:44px;height:44px;border-radius:13px;display:grid;place-items:center;font-size:18px;background:var(--dh-navy);color:var(--dh-gold2);box-shadow:0 6px 14px rgba(22,45,76,.22);}
.ex-rtitle{min-width:0;}
.ex-wanted{display:inline-flex;align-items:center;gap:6px;font-size:9.5px;font-weight:800;letter-spacing:1.1px;text-transform:uppercase;color:#8C6A3F;}
[data-theme="dark"] .ex-wanted{color:var(--dh-gold2);}
.ex-rtitle h4{margin:2px 0 0;font-family:'Fraunces',Georgia,serif;font-size:18px;font-weight:600;line-height:1.15;}
.ex-rtitle h4 em{font-style:normal;font-weight:400;color:var(--dh-mute);font-size:15px;}
.ex-budget{display:flex;align-items:baseline;justify-content:space-between;gap:10px;padding:9px 12px;border-radius:12px;background:var(--dh-soft);}
.ex-budget small{font-size:10px;font-weight:800;letter-spacing:1px;text-transform:uppercase;color:var(--dh-mute);}
.ex-budget b{font-size:15px;font-weight:800;text-align:end;}
.ex-req .ex-wa{background:var(--dh-navy);}
.ex-req .ex-wa:hover{box-shadow:0 8px 18px rgba(22,45,76,.3);}
.ex-req .ex-wa i{color:#46d38d;}
.ex-req .ex-wa.is-off{background:var(--dh-soft);}

/* ---------- responsive: row 1 tabs + action, row 2 search, row 3 area + sort ---------- */
@media (max-width:1080px){
  .ex-bar{flex-wrap:wrap;}
  .ex-tabs{order:1;flex:1 1 0;min-width:0;} .ex-tabs button{flex:1;justify-content:center;}
  #exAct{display:contents;} #exAct .ex-add{order:2;flex:none;}
  .ex-bar .dh-search{order:3;flex:1 1 100%;}
  .ex-bar .dh-select{order:4;flex:1 1 0;min-width:0;} .ex-bar .dh-select select{width:100%;max-width:none;}
}
@media (max-width:760px){
  .ex-grid{grid-template-columns:1fr;gap:14px;}
  .ex-tabs button{padding:0 8px;gap:6px;} .ex-tabs button span{font-size:12.5px;} .ex-tabs button i{display:none;}
  .ex-add{padding:0 13px;} .ex-add span{display:none;} .ex-add.is-login span{display:none;}
  .ex-bar .dh-search kbd{display:none;}
}
@media (prefers-reduced-motion:reduce){ .ex-card{animation:none!important;} .ex-card,.ex-media img{transition:none;} }
html.bh-bg .ex-card{animation:none!important;}
@media print{ .ex-bar,.ex-actions{display:none!important;} }