/* =============================================================================
   JAVAHERIAN GALLERY — BAZAAR (a2-jwb) UI OVERRIDE  ·  v2 (premium)
   -----------------------------------------------------------------------------
   - Scope        : every rule nested inside .a2-jwb (marketplace root).
   - Direction    : RTL, mobile-first, light theme.
   - Font         : IRANYekan (+ Persian fallbacks).
   - Aesthetic    : premium luxury-watch marketplace — warm paper light theme,
                    gold used as a precious accent (not everywhere), generous
                    whitespace, layered depth, refined micro-interactions.
   - Class contract: BEM a2-jwb-*. Section 26 bridges the plugin's legacy
                    hyphen-style class names onto this system as a safety net.
   - Load order   : enqueue AFTER the plugin stylesheet so these win.
   ========================================================================== */

/* ---- 0. FONT (host IRANYekan in production; uncomment + point src) -------- */
/*
@font-face{ font-family:"IRANYekan";
  src:url("/wp-content/fonts/IRANYekanWeb.woff2") format("woff2");
  font-weight:300 800; font-display:swap; }
*/

/* =============================================================================
   1. DESIGN TOKENS  (scoped to .a2-jwb)
   ========================================================================== */
.a2-jwb{
  /* surfaces — warm paper light theme */
  --jwb-bg:            #FFFFFF;
  --jwb-surface:       #FFFFFF;
  --jwb-surface-soft:  #FBF8F1;   /* warm off-white section bg */
  --jwb-surface-sink:  #F3EFE6;   /* inset rows / track */
  --jwb-paper:         #FAF7F0;   /* page canvas tint */

  /* text */
  --jwb-text:          #16181A;
  --jwb-title:         #0B0B0C;
  --jwb-muted:         #6B7075;
  --jwb-faint:         #A0A39A;

  /* gold (precious accent) */
  --jwb-gold-grad:     linear-gradient(135deg,#D4B45F 0%,#F7E9B5 48%,#C29B43 100%);
  --jwb-gold-grad-hover:linear-gradient(135deg,#CBA94F 0%,#F1DE9C 48%,#B5882F 100%);
  --jwb-gold-solid:    #C29B43;
  --jwb-gold-deep:     #9A7A2E;
  --jwb-gold-soft:     #FBF4E0;   /* pale gold tint bg */
  --jwb-gold-text:     #181208;   /* text ON a gold pill */
  --jwb-gold-line:     #E7D7A8;   /* gold hairline accent */

  /* card */
  --jwb-card-bg:       #FFFFFF;
  --jwb-card-border:   #EFE6CF;
  --jwb-card-shadow:   0 1px 2px rgba(28,22,8,.04), 0 6px 16px -8px rgba(28,22,8,.10);
  --jwb-card-shadow-h: 0 2px 6px rgba(28,22,8,.06), 0 22px 40px -16px rgba(28,22,8,.22);

  /* semantics */
  --jwb-price:         #0CB85C;
  --jwb-price-deep:    #0A8C47;
  --jwb-accent:        #DE7B85;   /* rose */
  --jwb-accent-soft:   #FBEDEE;
  --jwb-accent-deep:   #C2535F;
  --jwb-ok:            #0CB85C; --jwb-ok-soft:#E5F7EE;
  --jwb-warn:          #B8860B; --jwb-warn-soft:#FBF3DC;
  --jwb-danger:        #D64550; --jwb-danger-soft:#FCE9EA;
  --jwb-info:          #2F6FBF; --jwb-info-soft:#E9F1FB;

  /* lines & radii */
  --jwb-line:          #ECEAE3;
  --jwb-line-strong:   #DED9CC;
  --jwb-r-pill:        30px;
  --jwb-r-card:        18px;
  --jwb-r-field:       12px;
  --jwb-r-chip:        999px;

  /* spacing */
  --jwb-s1:4px; --jwb-s2:8px; --jwb-s3:12px; --jwb-s4:16px;
  --jwb-s5:20px; --jwb-s6:24px; --jwb-s7:32px; --jwb-s8:48px; --jwb-s9:72px;

  /* layout */
  --jwb-container: 1240px;
  --jwb-focus:     0 0 0 3px rgba(194,155,67,.32);
  --jwb-ease:      cubic-bezier(.4,.14,.2,1);

  /* base */
  container-type:inline-size;          /* enables @container responsive layer */
  direction:rtl; text-align:right;
  font-family:"IRANYekan","Vazirmatn","Segoe UI",Tahoma,system-ui,sans-serif;
  color:var(--jwb-text);
  font-size:16px; line-height:1.75;
  font-feature-settings:"ss01","kern";
  -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility;
  background:var(--jwb-bg);
}

.a2-jwb *,.a2-jwb *::before,.a2-jwb *::after{ box-sizing:border-box; }
.a2-jwb img,.a2-jwb svg{ max-width:100%; }
.a2-jwb img{ display:block; }

/* tabular numerals for prices/stats/timers (Latin & helps alignment) */
.a2-jwb-watch-card__price,.a2-jwb-detail__price,.a2-jwb-stat__value,
.a2-jwb-countdown__num,.a2-jwb-summary,.a2-jwb-table td,.a2-jwb-num{ font-variant-numeric:tabular-nums; }

/* links — buttons excluded so .a2-jwb-btn--* color wins over .a2-jwb a */
.a2-jwb a:not([class*="a2-jwb-btn"]):not([class*="a2-jwb-button"]):not(.a2-jwb-bottomnav__item):not(.a2-jwb-secondary){ color:var(--jwb-gold-deep); text-decoration:none; transition:color .15s; }
.a2-jwb a:not([class*="a2-jwb-btn"]):not([class*="a2-jwb-button"]):not(.a2-jwb-bottomnav__item):not(.a2-jwb-secondary):hover{ color:var(--jwb-gold-solid); }
.a2-jwb a[class*="a2-jwb-btn"],.a2-jwb a[class*="a2-jwb-button"]{ text-decoration:none; }

.a2-jwb h1,.a2-jwb h2,.a2-jwb h3,.a2-jwb h4{ color:var(--jwb-title); line-height:1.3; margin:0 0 .5em; font-weight:800; letter-spacing:-.01em; }
.a2-jwb h1{ font-size:clamp(26px,4.4vw,42px); letter-spacing:-.02em; }
.a2-jwb h2{ font-size:clamp(21px,3vw,31px); letter-spacing:-.015em; }
.a2-jwb h3{ font-size:clamp(17px,2.2vw,22px); }
.a2-jwb p{ margin:0 0 1em; }

.a2-jwb-container{ width:100%; max-width:var(--jwb-container); margin-inline:auto; padding-inline:var(--jwb-s4); }
@container (min-width:768px){ .a2-jwb-container{ padding-inline:var(--jwb-s6); } }

/* small reusable "eyebrow" / label tag */
.a2-jwb-eyebrow{
  display:inline-flex; align-items:center; gap:7px;
  font-size:12px; font-weight:700; letter-spacing:.04em;
  color:var(--jwb-gold-deep);
  background:var(--jwb-gold-soft); border:1px solid var(--jwb-gold-line);
  padding:6px 13px; border-radius:var(--jwb-r-chip);
}

/* =============================================================================
   2. SUBNAV  (.a2-jwb-subnav) — slim tab strip under the real site header
   ========================================================================== */
.a2-jwb-subnav{
  position:sticky; top:0; z-index:40;
  display:flex; align-items:center; gap:4px;
  width:100%; max-width:var(--jwb-container); margin-inline:auto;
  padding:7px var(--jwb-s4);
  background:rgba(255,255,255,.88); backdrop-filter:saturate(1.4) blur(10px);
  border-bottom:1px solid var(--jwb-line);
  overflow-x:auto; scrollbar-width:none; white-space:nowrap; min-height:48px;
}
.a2-jwb-subnav::-webkit-scrollbar{ display:none; }
.a2-jwb-subnav a,.a2-jwb-subnav__item{
  position:relative; display:inline-flex; align-items:center; gap:6px;
  padding:9px 15px; border-radius:var(--jwb-r-chip);
  color:var(--jwb-muted); font-size:14px; font-weight:600; line-height:1;
  transition:background .18s var(--jwb-ease), color .18s var(--jwb-ease);
}
.a2-jwb-subnav a:hover,.a2-jwb-subnav__item:hover{ background:var(--jwb-surface-sink); color:var(--jwb-title); }
.a2-jwb-subnav a.is-active,.a2-jwb-subnav .current-menu-item a,.a2-jwb-subnav__item--active{
  color:var(--jwb-gold-deep); background:var(--jwb-gold-soft); font-weight:700;
}

/* =============================================================================
   3. BUTTONS
   ========================================================================== */
.a2-jwb-btn,
.a2-jwb button:not(.a2-jwb-icon-btn):not([class*="bottomnav"]):not(.a2-jwb-buybox__tab):not(.a2-jwb-wishlist),
.a2-jwb input[type="submit"],
.a2-jwb .button{
  position:relative; display:inline-flex; align-items:center; justify-content:center; gap:8px;
  padding:13px 28px; border-radius:var(--jwb-r-pill);
  border:1px solid transparent; font-family:inherit; font-size:15px; font-weight:700; line-height:1.2;
  cursor:pointer; overflow:hidden; isolation:isolate;
  transition:transform .14s var(--jwb-ease), box-shadow .22s var(--jwb-ease), background .22s var(--jwb-ease), filter .2s, border-color .2s;
  text-align:center; -webkit-tap-highlight-color:transparent;
}
.a2-jwb-btn:active,.a2-jwb button:active{ transform:translateY(1px); }
.a2-jwb-btn:focus-visible,.a2-jwb button:focus-visible{ outline:none; box-shadow:var(--jwb-focus); }

/* PRIMARY = gold pill with inner highlight + moving sheen on hover */
.a2-jwb-btn--primary,.a2-jwb-btn.is-primary,
.a2-jwb input[type="submit"],.a2-jwb .button.button-primary{
  background:var(--jwb-gold-grad); color:var(--jwb-gold-text);
  border-color:rgba(154,122,46,.4);
  box-shadow:0 4px 16px -4px rgba(194,155,67,.55), inset 0 1px 0 rgba(255,255,255,.45);
}
.a2-jwb-btn--primary::before,.a2-jwb input[type="submit"]::before{
  content:""; position:absolute; inset:0; z-index:-1; border-radius:inherit;
  background:linear-gradient(100deg,transparent 20%,rgba(255,255,255,.55) 50%,transparent 80%);
  transform:translateX(-120%); transition:transform .7s var(--jwb-ease);
}
.a2-jwb-btn--primary:hover,.a2-jwb input[type="submit"]:hover,.a2-jwb .button.button-primary:hover{
  background:var(--jwb-gold-grad-hover); box-shadow:0 8px 24px -4px rgba(194,155,67,.6), inset 0 1px 0 rgba(255,255,255,.5);
}
.a2-jwb-btn--primary:hover::before,.a2-jwb input[type="submit"]:hover::before{ transform:translateX(120%); }

/* SECONDARY = outlined gold */
.a2-jwb-btn--secondary,.a2-jwb-btn.is-secondary{
  background:var(--jwb-surface); color:var(--jwb-gold-deep); border-color:var(--jwb-gold-line);
}
.a2-jwb-btn--secondary:hover{ background:var(--jwb-gold-soft); border-color:var(--jwb-gold-solid); color:var(--jwb-gold-deep); }

/* GHOST */
.a2-jwb-btn--ghost{ background:transparent; color:var(--jwb-muted); border-color:var(--jwb-line-strong); }
.a2-jwb-btn--ghost:hover{ background:var(--jwb-surface-sink); color:var(--jwb-title); }

/* DANGER */
.a2-jwb-btn--danger{ background:var(--jwb-danger); color:#fff; }
.a2-jwb-btn--danger:hover{ filter:brightness(.94); }

.a2-jwb-btn--block{ width:100%; }
.a2-jwb-btn--sm{ padding:9px 17px; font-size:13px; }
.a2-jwb-btn--lg{ padding:16px 36px; font-size:17px; }

.a2-jwb-btn:disabled,.a2-jwb-btn.is-disabled,.a2-jwb button:disabled{
  opacity:.5; cursor:not-allowed; box-shadow:none; transform:none; filter:grayscale(.25);
}
.a2-jwb-btn:disabled::before,.a2-jwb-btn.is-disabled::before{ display:none; }

/* round icon button */
.a2-jwb-icon-btn{
  display:inline-flex; align-items:center; justify-content:center; width:42px; height:42px; border-radius:50%;
  background:var(--jwb-surface); border:1px solid var(--jwb-line-strong); color:var(--jwb-title);
  cursor:pointer; transition:background .15s, border-color .15s, transform .15s;
}
.a2-jwb-icon-btn:hover{ background:var(--jwb-surface-sink); border-color:var(--jwb-gold-solid); }

/* =============================================================================
   4. CARDS + WATCH CARD
   ========================================================================== */
.a2-jwb-card{
  background:var(--jwb-card-bg); border:1px solid var(--jwb-card-border);
  border-radius:var(--jwb-r-card); box-shadow:var(--jwb-card-shadow); padding:var(--jwb-s6);
}

.a2-jwb-watch-card{
  position:relative; display:flex; flex-direction:column;
  background:var(--jwb-card-bg); border:1px solid var(--jwb-card-border);
  border-radius:var(--jwb-r-card); box-shadow:var(--jwb-card-shadow); overflow:hidden;
  transition:box-shadow .3s var(--jwb-ease), transform .3s var(--jwb-ease), border-color .3s var(--jwb-ease);
}
.a2-jwb-watch-card:hover{ box-shadow:var(--jwb-card-shadow-h); transform:translateY(-4px); border-color:var(--jwb-gold-line); }
.a2-jwb-watch-card__media{
  position:relative; aspect-ratio:4/5;
  background:radial-gradient(120% 100% at 50% 0%, #FFFDF8 0%, var(--jwb-surface-soft) 70%);
  display:flex; align-items:center; justify-content:center; overflow:hidden;
}
.a2-jwb-watch-card__media img,.a2-jwb-watch-card__media svg{
  width:100%; height:100%; object-fit:cover; transition:transform .55s var(--jwb-ease);
}
.a2-jwb-watch-card:hover .a2-jwb-watch-card__media img,
.a2-jwb-watch-card:hover .a2-jwb-watch-card__media svg{ transform:scale(1.05); }
.a2-jwb-watch-card__body{ padding:var(--jwb-s4) var(--jwb-s5) var(--jwb-s5); display:flex; flex-direction:column; gap:7px; flex:1; }
.a2-jwb-watch-card__brand{ font-size:11px; color:var(--jwb-gold-deep); font-weight:800; letter-spacing:.12em; text-transform:uppercase; }
.a2-jwb-watch-card__title{
  font-size:15px; font-weight:700; color:var(--jwb-title); line-height:1.55; margin:0;
  display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; min-height:2.9em;
}
.a2-jwb-watch-card__title a{ color:inherit; }
.a2-jwb-watch-card__meta{ font-size:12.5px; color:var(--jwb-faint); }
.a2-jwb-watch-card__foot{
  margin-top:auto; padding-top:var(--jwb-s3);
  display:flex; align-items:center; justify-content:space-between; gap:8px; border-top:1px solid var(--jwb-line);
}
.a2-jwb-watch-card__price{ color:var(--jwb-price-deep); font-weight:800; font-size:16px; white-space:nowrap; }
.a2-jwb-watch-card__price span{ font-size:11.5px; font-weight:600; color:var(--jwb-muted); margin-inline-start:4px; }

/* badge top-start (RTL — right) */
.a2-jwb-watch-card__badge{ position:absolute; top:12px; inset-inline-start:12px; z-index:2; }
/* wishlist heart top-end (RTL — left) */
.a2-jwb-wishlist{
  position:absolute; top:10px; inset-inline-end:10px; z-index:2;
  width:38px; height:38px; border-radius:50%; border:none; cursor:pointer;
  background:rgba(255,255,255,.9); backdrop-filter:blur(4px); color:var(--jwb-muted);
  box-shadow:0 2px 8px rgba(28,22,8,.12); display:flex; align-items:center; justify-content:center;
  transition:color .18s, transform .18s, background .18s;
}
.a2-jwb-wishlist:hover{ color:var(--jwb-accent); transform:scale(1.08); }
.a2-jwb-wishlist.is-on{ color:var(--jwb-accent); background:#fff; }

/* =============================================================================
   5. STATUS BADGES
   ========================================================================== */
.a2-jwb-badge{
  display:inline-flex; align-items:center; gap:5px; padding:5px 11px; border-radius:var(--jwb-r-chip);
  font-size:11.5px; font-weight:700; line-height:1; border:1px solid transparent; white-space:nowrap; letter-spacing:.01em;
}
.a2-jwb-badge::before{ content:""; width:6px; height:6px; border-radius:50%; background:currentColor; opacity:.9; }
.a2-jwb-badge--authentic,.a2-jwb-badge--verified{
  background:var(--jwb-gold-grad); color:var(--jwb-gold-text); border-color:rgba(154,122,46,.4);
  box-shadow:0 2px 7px -1px rgba(194,155,67,.5), inset 0 1px 0 rgba(255,255,255,.4);
}
.a2-jwb-badge--authentic::before,.a2-jwb-badge--verified::before{ background:#6e5414; }
.a2-jwb-badge--pending{ background:var(--jwb-surface-sink); color:var(--jwb-muted); border-color:var(--jwb-line-strong); }
.a2-jwb-badge--sold{ background:#F1EBE9; color:#9B5A5E; border-color:#E6D4D2; }
.a2-jwb-badge--rejected,.a2-jwb-badge--danger{ background:var(--jwb-danger-soft); color:var(--jwb-danger); border-color:#F2C9CC; }
.a2-jwb-badge--active,.a2-jwb-badge--success{ background:var(--jwb-ok-soft); color:var(--jwb-price-deep); border-color:#BFE8D2; }
.a2-jwb-badge--auction{ background:var(--jwb-accent-soft); color:var(--jwb-accent-deep); border-color:#F3CDD1; }

/* Four authenticity labels — who judged the watch x what the judgement was.
   Each pair gets its own treatment so a buyer can tell them apart at a glance
   and never mistakes a seller's claim for our own verification. */
.a2-jwb-badge--verified-original{
  background:var(--jwb-gold-grad); color:var(--jwb-gold-text); border-color:rgba(154,122,46,.4);
  box-shadow:0 2px 7px -1px rgba(194,155,67,.5), inset 0 1px 0 rgba(255,255,255,.4);
}
.a2-jwb-badge--verified-original::before{ background:#6e5414; }
.a2-jwb-badge--verified-replica{ background:#E8EEF6; color:#2C4A73; border-color:#C4D5EA; }
.a2-jwb-badge--verified-replica::before{ background:#2C4A73; }
.a2-jwb-badge--declared-original{ background:var(--jwb-surface-sink); color:var(--jwb-muted); border-color:var(--jwb-line-strong); }
.a2-jwb-badge--declared-replica{ background:#FBF0DC; color:#8A5A12; border-color:#EFD7A9; }
.a2-jwb-badge--declared-replica::before{ background:#8A5A12; }
.a2-jwb-badge--undeclared{ background:var(--jwb-danger-soft); color:var(--jwb-danger); border-color:#F2C9CC; }

/* Plain-language explanation of the label on the detail page. */
.a2-jwb-authnote{
  border:1px solid var(--jwb-line-strong); border-radius:var(--jwb-r-card);
  padding:14px 16px; margin:0 0 16px; background:var(--jwb-surface-sink);
}
.a2-jwb-authnote__label{ display:block; font-size:14px; font-weight:800; margin-bottom:6px; }
.a2-jwb-authnote__meaning{ margin:0; font-size:13px; line-height:1.9; color:var(--jwb-muted); }
.a2-jwb-authnote__warning{
  margin:10px 0 0; padding-top:10px; border-top:1px dashed var(--jwb-line-strong);
  font-size:13px; line-height:1.9; font-weight:700; color:#8A5A12;
}
.a2-jwb-authnote--verified-original{ background:#FBF6EA; border-color:rgba(154,122,46,.32); }
.a2-jwb-authnote--verified-original .a2-jwb-authnote__label{ color:#6e5414; }
.a2-jwb-authnote--verified-replica{ background:#F2F6FB; border-color:#C4D5EA; }
.a2-jwb-authnote--verified-replica .a2-jwb-authnote__label{ color:#2C4A73; }
.a2-jwb-authnote--declared-replica{ background:#FDF7EC; border-color:#EFD7A9; }
.a2-jwb-authnote--declared-replica .a2-jwb-authnote__label{ color:#8A5A12; }

/* =============================================================================
   6. FORMS
   ========================================================================== */
.a2-jwb-field{ display:flex; flex-direction:column; gap:7px; margin-bottom:var(--jwb-s4); }
.a2-jwb-label,.a2-jwb-field > label{ font-size:13.5px; font-weight:700; color:var(--jwb-title); }
.a2-jwb-hint{ font-size:12px; color:var(--jwb-muted); }
.a2-jwb-required{ color:var(--jwb-accent); margin-inline-start:3px; }

.a2-jwb input[type="text"],.a2-jwb input[type="tel"],.a2-jwb input[type="email"],
.a2-jwb input[type="number"],.a2-jwb input[type="password"],.a2-jwb input[type="search"],
.a2-jwb select,.a2-jwb textarea,.a2-jwb .a2-jwb-input{
  width:100%; padding:12px 14px; font-family:inherit; font-size:15px; color:var(--jwb-text);
  background:var(--jwb-surface); border:1px solid var(--jwb-line-strong); border-radius:var(--jwb-r-field);
  transition:border-color .18s, box-shadow .18s, background .18s; text-align:right;
}
.a2-jwb textarea{ min-height:120px; resize:vertical; line-height:1.7; }
.a2-jwb input::placeholder,.a2-jwb textarea::placeholder{ color:var(--jwb-faint); }
.a2-jwb input:focus,.a2-jwb select:focus,.a2-jwb textarea:focus{
  outline:none; border-color:var(--jwb-gold-solid); box-shadow:var(--jwb-focus); background:#fff;
}
.a2-jwb input:disabled,.a2-jwb select:disabled,.a2-jwb textarea:disabled{ background:var(--jwb-surface-sink); color:var(--jwb-faint); cursor:not-allowed; }

.a2-jwb select{
  appearance:none; -webkit-appearance:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%236B7075' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");
  background-repeat:no-repeat; background-position:left 14px center; padding-left:38px;
}
.a2-jwb .is-invalid input,.a2-jwb input.is-invalid,.a2-jwb .a2-jwb-field--error input,.a2-jwb .a2-jwb-field--error select{
  border-color:var(--jwb-danger); box-shadow:0 0 0 3px rgba(214,69,80,.15);
}
.a2-jwb-error-text{ font-size:12px; color:var(--jwb-danger); }

.a2-jwb-upload{
  display:flex; flex-direction:column; align-items:center; justify-content:center; gap:8px;
  padding:var(--jwb-s7) var(--jwb-s4); border:1.5px dashed var(--jwb-gold-solid); border-radius:var(--jwb-r-card);
  background:linear-gradient(180deg,#FFFDF8,var(--jwb-gold-soft)); color:var(--jwb-muted); text-align:center; cursor:pointer;
  transition:background .18s, border-color .18s;
}
.a2-jwb-upload:hover{ background:var(--jwb-gold-soft); border-color:var(--jwb-gold-deep); }
.a2-jwb-upload__icon{ color:var(--jwb-gold-solid); }
.a2-jwb-upload__hint{ font-size:12px; color:var(--jwb-faint); }
.a2-jwb-upload-thumbs{ display:flex; flex-wrap:wrap; gap:10px; margin-top:12px; }
.a2-jwb-upload-thumb{ position:relative; width:84px; height:84px; border-radius:12px; overflow:hidden; border:1px solid var(--jwb-card-border); background:var(--jwb-surface-soft); }
.a2-jwb-upload-thumb img{ width:100%; height:100%; object-fit:cover; }
.a2-jwb-upload-thumb__remove{
  position:absolute; top:4px; inset-inline-start:4px; width:20px; height:20px; border-radius:50%; border:none;
  background:rgba(0,0,0,.55); color:#fff; cursor:pointer; font-size:12px; line-height:1; display:flex; align-items:center; justify-content:center;
}
.a2-jwb input[type="checkbox"],.a2-jwb input[type="radio"]{ accent-color:var(--jwb-gold-solid); width:18px; height:18px; }

/* =============================================================================
   7. OTP
   ========================================================================== */
.a2-jwb-otp{ display:flex; gap:10px; justify-content:center; direction:ltr; }
.a2-jwb-otp input{
  width:54px; height:62px; text-align:center; font-size:24px; font-weight:800;
  border:1px solid var(--jwb-line-strong); border-radius:14px; background:var(--jwb-surface); color:var(--jwb-title);
  transition:border-color .15s, box-shadow .15s, background .15s;
}
.a2-jwb-otp input:focus{ outline:none; border-color:var(--jwb-gold-solid); box-shadow:var(--jwb-focus); }
.a2-jwb-otp input.is-filled{ border-color:var(--jwb-gold-solid); background:var(--jwb-gold-soft); }
.a2-jwb-otp-resend{ text-align:center; margin-top:14px; font-size:13px; color:var(--jwb-muted); }
.a2-jwb-otp-resend button{ color:var(--jwb-gold-deep); font-weight:700; background:none; border:none; cursor:pointer; }
.a2-jwb-otp-resend .is-counting{ color:var(--jwb-faint); }

/* =============================================================================
   8. WIZARD / STEPPER + PROGRESS
   ========================================================================== */
.a2-jwb-steps{ display:flex; align-items:flex-start; gap:0; width:100%; margin-bottom:var(--jwb-s7); }
.a2-jwb-step{ display:flex; flex-direction:column; align-items:center; gap:8px; flex:1; position:relative; }
.a2-jwb-step__dot{
  width:40px; height:40px; border-radius:50%; display:flex; align-items:center; justify-content:center;
  font-weight:800; font-size:14px; background:var(--jwb-surface); color:var(--jwb-muted);
  border:1.5px solid var(--jwb-line-strong); z-index:1; transition:all .25s var(--jwb-ease);
}
.a2-jwb-step__label{ font-size:12.5px; color:var(--jwb-muted); font-weight:600; text-align:center; }
.a2-jwb-step::before{ content:""; position:absolute; top:20px; height:2px; background:var(--jwb-line-strong); inset-inline-start:50%; width:100%; z-index:0; }
.a2-jwb-step:last-child::before{ display:none; }
.a2-jwb-step.is-done .a2-jwb-step__dot{ background:var(--jwb-gold-grad); color:var(--jwb-gold-text); border-color:transparent; box-shadow:0 2px 8px -2px rgba(194,155,67,.6); }
.a2-jwb-step.is-done .a2-jwb-step__label{ color:var(--jwb-text); }
.a2-jwb-step.is-done::before{ background:var(--jwb-gold-solid); }
.a2-jwb-step.is-active .a2-jwb-step__dot{ background:#fff; color:var(--jwb-gold-deep); border-color:var(--jwb-gold-solid); box-shadow:var(--jwb-focus); }
.a2-jwb-step.is-active .a2-jwb-step__label{ color:var(--jwb-gold-deep); font-weight:800; }

.a2-jwb-progress{ height:8px; border-radius:999px; background:var(--jwb-surface-sink); overflow:hidden; }
.a2-jwb-progress__fill{ height:100%; border-radius:999px; background:var(--jwb-gold-grad); transition:width .5s var(--jwb-ease); }
.a2-jwb-wizard-actions{ display:flex; justify-content:space-between; gap:12px; margin-top:var(--jwb-s7); padding-top:var(--jwb-s5); border-top:1px solid var(--jwb-line); }

/* =============================================================================
   9. TABLES + STAT CARDS
   ========================================================================== */
.a2-jwb-table-wrap{ width:100%; overflow-x:auto; border:1px solid var(--jwb-card-border); border-radius:var(--jwb-r-card); background:#fff; box-shadow:var(--jwb-card-shadow); }
.a2-jwb-table{ width:100%; border-collapse:collapse; min-width:580px; }
.a2-jwb-table th,.a2-jwb-table td{ padding:14px 18px; text-align:right; font-size:14px; border-bottom:1px solid var(--jwb-line); }
.a2-jwb-table thead th{ background:var(--jwb-surface-soft); color:var(--jwb-muted); font-weight:700; font-size:11.5px; letter-spacing:.04em; text-transform:uppercase; white-space:nowrap; border-bottom:1px solid var(--jwb-card-border); }
.a2-jwb-table tbody tr{ transition:background .15s; }
.a2-jwb-table tbody tr:hover{ background:var(--jwb-surface-soft); }
.a2-jwb-table tbody tr:last-child td{ border-bottom:none; }
.a2-jwb-table td .a2-jwb-badge{ vertical-align:middle; }
/* product cell with thumb */
.a2-jwb-cell-product{ display:flex; align-items:center; gap:11px; }
.a2-jwb-cell-product__thumb{ width:44px; height:44px; border-radius:10px; overflow:hidden; flex:none; border:1px solid var(--jwb-card-border); background:var(--jwb-surface-soft); }
.a2-jwb-cell-product__thumb img,.a2-jwb-cell-product__thumb svg{ width:100%; height:100%; object-fit:cover; }
.a2-jwb-cell-product__name{ font-weight:700; color:var(--jwb-title); }

.a2-jwb-stats{ display:grid; grid-template-columns:repeat(2,1fr); gap:var(--jwb-s3); }
@container (min-width:768px){ .a2-jwb-stats{ grid-template-columns:repeat(4,1fr); gap:var(--jwb-s4); } }
.a2-jwb-stat{
  position:relative; background:#fff; border:1px solid var(--jwb-card-border); border-radius:var(--jwb-r-card);
  padding:var(--jwb-s5); box-shadow:var(--jwb-card-shadow); display:flex; flex-direction:column; gap:6px; overflow:hidden;
}
.a2-jwb-stat::after{ content:""; position:absolute; top:0; inset-inline-end:0; width:3px; height:100%; background:var(--jwb-gold-grad); opacity:0; transition:opacity .2s; }
.a2-jwb-stat:hover::after{ opacity:.9; }
.a2-jwb-stat__label{ font-size:12.5px; color:var(--jwb-muted); font-weight:600; }
.a2-jwb-stat__value{ font-size:27px; font-weight:800; color:var(--jwb-title); line-height:1.1; letter-spacing:-.01em; }
.a2-jwb-stat__value--price{ color:var(--jwb-price-deep); }
.a2-jwb-stat__icon{ width:38px; height:38px; border-radius:11px; display:flex; align-items:center; justify-content:center; background:var(--jwb-gold-soft); color:var(--jwb-gold-deep); margin-bottom:2px; }

/* =============================================================================
   10. EMPTY STATE
   ========================================================================== */
.a2-jwb-empty{ display:flex; flex-direction:column; align-items:center; justify-content:center; gap:13px; text-align:center; padding:var(--jwb-s9) var(--jwb-s5); color:var(--jwb-muted); }
.a2-jwb-empty__icon{ width:80px; height:80px; border-radius:50%; display:flex; align-items:center; justify-content:center; background:radial-gradient(circle at 50% 35%,#fff,var(--jwb-gold-soft)); border:1px solid var(--jwb-gold-line); color:var(--jwb-gold-solid); }
.a2-jwb-empty__title{ font-size:19px; font-weight:800; color:var(--jwb-title); }
.a2-jwb-empty__text{ font-size:14px; max-width:360px; }

/* =============================================================================
   11. FILTERS + CHIPS + COUNT BAR
   ========================================================================== */
.a2-jwb-filters{ background:var(--jwb-surface); border:1px solid var(--jwb-card-border); border-radius:var(--jwb-r-card); padding:var(--jwb-s5); box-shadow:var(--jwb-card-shadow); }
.a2-jwb-filters__group{ padding-block:var(--jwb-s4); border-bottom:1px solid var(--jwb-line); }
.a2-jwb-filters__group:first-child{ padding-top:0; }
.a2-jwb-filters__group:last-child{ border-bottom:none; padding-bottom:0; }
.a2-jwb-filters__title{ font-size:13px; font-weight:800; color:var(--jwb-title); margin-bottom:var(--jwb-s3); letter-spacing:.02em; }
.a2-jwb-filters__opt{ display:flex; align-items:center; gap:9px; padding:6px 0; font-size:14px; color:var(--jwb-text); cursor:pointer; transition:color .15s; }
.a2-jwb-filters__opt:hover{ color:var(--jwb-gold-deep); }
.a2-jwb-filters__opt .count{ margin-inline-start:auto; color:var(--jwb-faint); font-size:12.5px; }

.a2-jwb-countbar{ display:flex; align-items:center; justify-content:space-between; gap:12px; flex-wrap:wrap; margin-bottom:var(--jwb-s4); }
.a2-jwb-countbar__count{ font-size:14px; color:var(--jwb-muted); }
.a2-jwb-countbar__count b{ color:var(--jwb-title); font-weight:800; }

.a2-jwb-chips{ display:flex; flex-wrap:wrap; gap:8px; }
.a2-jwb-chip{ display:inline-flex; align-items:center; gap:6px; padding:6px 13px; border-radius:var(--jwb-r-chip); background:#fff; border:1px solid var(--jwb-card-border); font-size:13px; color:var(--jwb-text); font-weight:600; }
.a2-jwb-chip--active{ background:var(--jwb-gold-soft); border-color:var(--jwb-gold-line); color:var(--jwb-gold-deep); }
.a2-jwb-chip__x{ cursor:pointer; color:var(--jwb-faint); font-weight:700; }
.a2-jwb-chip__x:hover{ color:var(--jwb-danger); }

/* =============================================================================
   12. PAGINATION
   ========================================================================== */
.a2-jwb-pagination{ display:flex; align-items:center; justify-content:center; gap:6px; margin-top:var(--jwb-s8); }
.a2-jwb-pagination a,.a2-jwb-pagination span{
  min-width:42px; height:42px; padding:0 11px; display:inline-flex; align-items:center; justify-content:center;
  border-radius:12px; border:1px solid var(--jwb-card-border); background:#fff; color:var(--jwb-text); font-weight:700; font-size:14px;
  transition:background .15s, border-color .15s, color .15s;
}
.a2-jwb-pagination a:hover{ background:var(--jwb-gold-soft); border-color:var(--jwb-gold-line); color:var(--jwb-gold-deep); }
.a2-jwb-pagination .current,.a2-jwb-pagination .is-active{ background:var(--jwb-gold-grad); color:var(--jwb-gold-text); border-color:transparent; box-shadow:0 3px 10px -3px rgba(194,155,67,.6); }
.a2-jwb-pagination .is-disabled{ opacity:.4; pointer-events:none; }

/* =============================================================================
   13. BREADCRUMB
   ========================================================================== */
.a2-jwb-breadcrumb{ display:flex; flex-wrap:wrap; align-items:center; gap:7px; font-size:13px; color:var(--jwb-muted); margin-bottom:var(--jwb-s5); }
.a2-jwb-breadcrumb a{ color:var(--jwb-muted); }
.a2-jwb-breadcrumb a:hover{ color:var(--jwb-gold-deep); }
.a2-jwb-breadcrumb__sep{ color:var(--jwb-faint); }
.a2-jwb-breadcrumb__current{ color:var(--jwb-title); font-weight:700; }
/* legacy breadcrumb (ol/li + custom sep) */
.a2-jwb-breadcrumb ol{ display:flex; flex-wrap:wrap; align-items:center; gap:7px; list-style:none; margin:0; padding:0; }
.a2-jwb-breadcrumb-sep{ color:var(--jwb-faint); margin-inline:4px; }

/* =============================================================================
   14. TRUST BAR
   ========================================================================== */
.a2-jwb-trust{ display:grid; grid-template-columns:repeat(2,1fr); gap:var(--jwb-s3); }
@container (min-width:768px){ .a2-jwb-trust{ grid-template-columns:repeat(4,1fr); gap:var(--jwb-s4); } }
.a2-jwb-trust__item{ display:flex; align-items:center; gap:13px; padding:var(--jwb-s4) var(--jwb-s5); background:#fff; border:1px solid var(--jwb-card-border); border-radius:var(--jwb-r-card); box-shadow:var(--jwb-card-shadow); transition:transform .2s var(--jwb-ease), box-shadow .2s; }
.a2-jwb-trust__item:hover{ transform:translateY(-2px); box-shadow:var(--jwb-card-shadow-h); }
.a2-jwb-trust__icon{ flex:none; width:46px; height:46px; border-radius:13px; display:flex; align-items:center; justify-content:center; background:var(--jwb-gold-soft); color:var(--jwb-gold-deep); border:1px solid var(--jwb-gold-line); font-size:20px; }
.a2-jwb-trust__title{ font-size:14px; font-weight:800; color:var(--jwb-title); }
.a2-jwb-trust__text{ font-size:12.5px; color:var(--jwb-muted); }
.a2-jwb-trust--strip{ display:flex; flex-wrap:wrap; gap:8px; }
.a2-jwb-trust--strip .a2-jwb-trust__item{ flex:1 1 150px; padding:11px 14px; box-shadow:none; background:var(--jwb-surface-soft); border-color:var(--jwb-card-border); }
.a2-jwb-trust--strip .a2-jwb-trust__item:hover{ transform:none; box-shadow:none; }
.a2-jwb-trust--strip .a2-jwb-trust__icon{ width:34px; height:34px; border-radius:10px; background:#fff; }

/* =============================================================================
   15. COUNTDOWN
   ========================================================================== */
.a2-jwb-countdown{ display:flex; gap:10px; justify-content:center; direction:ltr; }
.a2-jwb-countdown__cell{ min-width:64px; padding:11px 8px; border-radius:14px; text-align:center; background:linear-gradient(160deg,#1b1c1e,#0b0b0c); color:#fff; box-shadow:0 6px 18px -8px rgba(0,0,0,.5); }
.a2-jwb-countdown__num{ font-size:27px; font-weight:800; line-height:1; }
.a2-jwb-countdown__unit{ font-size:11px; color:#B9BBBE; margin-top:5px; }
.a2-jwb-countdown.is-urgent .a2-jwb-countdown__cell{ background:linear-gradient(160deg,#E08D96,#C2535F); box-shadow:0 6px 18px -8px rgba(194,83,95,.6); }

/* =============================================================================
   16. HERO
   ========================================================================== */
.a2-jwb-hero{
  position:relative; border-radius:24px; overflow:hidden;
  background:
    radial-gradient(80% 120% at 88% -10%, var(--jwb-gold-soft) 0%, transparent 55%),
    radial-gradient(70% 90% at 5% 110%, #FCF6E8 0%, transparent 50%),
    linear-gradient(180deg,#FFFDF9,var(--jwb-surface-soft));
  border:1px solid var(--jwb-card-border);
  padding:var(--jwb-s8) var(--jwb-s5);
}
@container (min-width:992px){
  .a2-jwb-hero{ padding:var(--jwb-s9) var(--jwb-s9); display:grid; grid-template-columns:1.15fr .85fr; gap:var(--jwb-s8); align-items:center; }
}
/* decorative gold ring */
.a2-jwb-hero::after{ content:""; position:absolute; top:-90px; inset-inline-start:-90px; width:260px; height:260px; border-radius:50%; border:1px solid var(--jwb-gold-line); opacity:.6; pointer-events:none; }
.a2-jwb-hero__title{ font-size:clamp(28px,5vw,48px); font-weight:800; color:var(--jwb-title); margin:14px 0 var(--jwb-s4); letter-spacing:-.025em; line-height:1.18; }
.a2-jwb-hero__sub{ font-size:clamp(15px,2vw,18px); color:var(--jwb-muted); max-width:520px; margin:0 0 var(--jwb-s6); }
.a2-jwb-hero__cta{ display:flex; flex-wrap:wrap; gap:12px; }
/* featured watch panel inside hero */
.a2-jwb-hero__feature{ position:relative; }
.a2-jwb-hero__feature-card{
  position:relative; background:#fff; border:1px solid var(--jwb-card-border); border-radius:20px; overflow:hidden;
  box-shadow:0 30px 60px -24px rgba(28,22,8,.4); aspect-ratio:1/1;
  background-image:radial-gradient(120% 100% at 50% 0%, #FFFDF8, var(--jwb-surface-soft));
  display:flex; align-items:center; justify-content:center; font-size:84px; color:var(--jwb-gold-line);
}
.a2-jwb-hero__feature-card img,.a2-jwb-hero__feature-card svg{ width:100%; height:100%; object-fit:cover; }
.a2-jwb-hero__feature-tag{ position:absolute; top:14px; inset-inline-start:14px; z-index:2; }
.a2-jwb-hero__eyebrow{ display:inline-flex; align-items:center; gap:7px; font-size:12px; font-weight:700; letter-spacing:.04em; color:var(--jwb-gold-deep); background:#fff; border:1px solid var(--jwb-gold-line); padding:6px 13px; border-radius:var(--jwb-r-chip); }

/* "how it works" */
.a2-jwb-how{ display:grid; grid-template-columns:1fr; gap:var(--jwb-s4); }
@container (min-width:768px){ .a2-jwb-how{ grid-template-columns:repeat(4,1fr); } }
.a2-jwb-how__step{ position:relative; background:#fff; border:1px solid var(--jwb-card-border); border-radius:var(--jwb-r-card); padding:var(--jwb-s5); box-shadow:var(--jwb-card-shadow); transition:transform .2s var(--jwb-ease), box-shadow .2s; }
.a2-jwb-how__step:hover{ transform:translateY(-3px); box-shadow:var(--jwb-card-shadow-h); }
.a2-jwb-how__num{ width:40px; height:40px; border-radius:50%; display:flex; align-items:center; justify-content:center; background:var(--jwb-gold-grad); color:var(--jwb-gold-text); font-weight:800; margin-bottom:var(--jwb-s3); box-shadow:0 3px 10px -3px rgba(194,155,67,.6); }
.a2-jwb-how__title{ font-size:16px; font-weight:800; color:var(--jwb-title); margin-bottom:6px; }
.a2-jwb-how__text{ font-size:13.5px; color:var(--jwb-muted); }

/* =============================================================================
   17. PRODUCT GRID + SHOP LAYOUT
   ========================================================================== */
.a2-jwb-grid{ display:grid; grid-template-columns:repeat(2,1fr); gap:var(--jwb-s3); }
@container (min-width:600px){ .a2-jwb-grid{ grid-template-columns:repeat(3,1fr); gap:var(--jwb-s5); } }
@container (min-width:992px){ .a2-jwb-grid{ grid-template-columns:repeat(4,1fr); } }
.a2-jwb-shop{ display:grid; grid-template-columns:1fr; gap:var(--jwb-s5); }
@container (min-width:992px){ .a2-jwb-shop{ grid-template-columns:272px 1fr; gap:var(--jwb-s7); align-items:start; } .a2-jwb-shop > .a2-jwb-filters{ position:sticky; top:64px; } }

/* =============================================================================
   18. WATCH DETAIL
   ========================================================================== */
.a2-jwb-detail{ display:grid; grid-template-columns:1fr; gap:var(--jwb-s6); }
@container (min-width:992px){ .a2-jwb-detail{ grid-template-columns:minmax(0,1.1fr) minmax(0,1fr); gap:var(--jwb-s8); align-items:start; } }
.a2-jwb-gallery__main{ aspect-ratio:1/1; border-radius:20px; overflow:hidden; background:radial-gradient(120% 100% at 50% 0%, #FFFDF8, var(--jwb-surface-soft)); border:1px solid var(--jwb-card-border); box-shadow:var(--jwb-card-shadow); display:flex; align-items:center; justify-content:center; font-size:72px; color:var(--jwb-gold-line); }
.a2-jwb-gallery__main img,.a2-jwb-gallery__main svg{ width:100%; height:100%; object-fit:cover; }
.a2-jwb-gallery__thumbs{ display:flex; gap:10px; margin-top:12px; flex-wrap:wrap; }
.a2-jwb-gallery__thumb{ width:74px; height:74px; border-radius:12px; overflow:hidden; cursor:pointer; border:1px solid var(--jwb-card-border); background:var(--jwb-surface-soft); transition:border-color .15s, box-shadow .15s; }
.a2-jwb-gallery__thumb:hover{ border-color:var(--jwb-gold-line); }
.a2-jwb-gallery__thumb.is-active{ border-color:var(--jwb-gold-solid); box-shadow:var(--jwb-focus); }
.a2-jwb-detail__brand{ font-size:12px; color:var(--jwb-gold-deep); font-weight:800; letter-spacing:.12em; text-transform:uppercase; }
.a2-jwb-detail__title{ font-size:clamp(23px,3vw,32px); font-weight:800; color:var(--jwb-title); margin:6px 0 var(--jwb-s3); letter-spacing:-.015em; }
.a2-jwb-detail__price{ font-size:30px; font-weight:800; color:var(--jwb-price-deep); letter-spacing:-.01em; }
.a2-jwb-detail__price small{ font-size:14px; color:var(--jwb-muted); font-weight:600; }

.a2-jwb-specs{ border:1px solid var(--jwb-card-border); border-radius:var(--jwb-r-card); overflow:hidden; }
.a2-jwb-specs__row{ display:flex; justify-content:space-between; gap:12px; padding:12px 16px; font-size:14px; }
.a2-jwb-specs__row:nth-child(odd){ background:var(--jwb-surface-soft); }
.a2-jwb-specs__key{ color:var(--jwb-muted); }
.a2-jwb-specs__val{ color:var(--jwb-title); font-weight:700; }

.a2-jwb-seller-box{ background:linear-gradient(180deg,#FFFDF8,var(--jwb-gold-soft)); border:1px solid var(--jwb-gold-line); border-radius:var(--jwb-r-card); padding:var(--jwb-s5); display:flex; align-items:center; gap:14px; }
.a2-jwb-seller-box__avatar{ flex:none; width:50px; height:50px; border-radius:50%; background:var(--jwb-gold-grad); color:var(--jwb-gold-text); display:flex; align-items:center; justify-content:center; font-weight:800; box-shadow:0 3px 10px -3px rgba(194,155,67,.6); }
.a2-jwb-seller-box__label{ font-size:12px; color:var(--jwb-muted); }
.a2-jwb-seller-box__name{ font-size:15px; font-weight:800; color:var(--jwb-title); letter-spacing:.04em; }

.a2-jwb-buybox{ background:#fff; border:1px solid var(--jwb-card-border); border-radius:var(--jwb-r-card); box-shadow:var(--jwb-card-shadow); padding:var(--jwb-s5); display:flex; flex-direction:column; gap:var(--jwb-s3); }
@container (min-width:992px){ .a2-jwb-buybox{ position:sticky; top:64px; } }
.a2-jwb-buybox__tabs{ display:flex; gap:4px; background:var(--jwb-surface-sink); padding:4px; border-radius:var(--jwb-r-chip); }
.a2-jwb-buybox__tab{ flex:1; text-align:center; padding:10px; border-radius:var(--jwb-r-chip); font-size:13.5px; font-weight:700; color:var(--jwb-muted); cursor:pointer; border:none; background:transparent; transition:all .18s var(--jwb-ease); }
.a2-jwb-buybox__tab.is-active{ background:#fff; color:var(--jwb-gold-deep); box-shadow:0 2px 8px -2px rgba(28,22,8,.18); }

.a2-jwb-summary{ background:var(--jwb-surface-soft); border:1px solid var(--jwb-card-border); border-radius:var(--jwb-r-card); padding:var(--jwb-s4) var(--jwb-s5); }
.a2-jwb-summary__row{ display:flex; justify-content:space-between; padding:7px 0; font-size:14px; color:var(--jwb-text); }
.a2-jwb-summary__row--total{ border-top:1px dashed var(--jwb-line-strong); margin-top:6px; padding-top:13px; font-weight:800; color:var(--jwb-title); font-size:16px; }
.a2-jwb-summary__row--total .amount{ color:var(--jwb-price-deep); }

/* =============================================================================
   19. SERVICES
   ========================================================================== */
.a2-jwb-services{ display:grid; grid-template-columns:1fr; gap:var(--jwb-s4); }
@container (min-width:768px){ .a2-jwb-services{ grid-template-columns:repeat(3,1fr); gap:var(--jwb-s5); } }
.a2-jwb-service-card{ position:relative; background:#fff; border:1px solid var(--jwb-card-border); border-radius:var(--jwb-r-card); box-shadow:var(--jwb-card-shadow); padding:var(--jwb-s6); display:flex; flex-direction:column; gap:11px; transition:transform .2s var(--jwb-ease), box-shadow .2s; overflow:hidden; }
.a2-jwb-service-card::before{ content:""; position:absolute; top:0; inset-inline:0; height:3px; background:var(--jwb-gold-grad); transform:scaleX(0); transform-origin:right; transition:transform .3s var(--jwb-ease); }
.a2-jwb-service-card:hover{ transform:translateY(-3px); box-shadow:var(--jwb-card-shadow-h); }
.a2-jwb-service-card:hover::before{ transform:scaleX(1); }
.a2-jwb-service-card__icon{ width:54px; height:54px; border-radius:15px; display:flex; align-items:center; justify-content:center; background:var(--jwb-gold-soft); color:var(--jwb-gold-deep); border:1px solid var(--jwb-gold-line); }
.a2-jwb-service-card__title{ font-size:17px; font-weight:800; color:var(--jwb-title); }
.a2-jwb-service-card__text{ font-size:13.5px; color:var(--jwb-muted); flex:1; }
.a2-jwb-service-card__price{ font-size:18px; font-weight:800; color:var(--jwb-price-deep); }
.a2-jwb-service-card__price small{ font-size:12px; color:var(--jwb-muted); font-weight:600; }

/* =============================================================================
   20. ALERTS
   ========================================================================== */
.a2-jwb-alert{ display:flex; gap:10px; padding:14px 16px; border-radius:14px; font-size:14px; border:1px solid; align-items:flex-start; }
.a2-jwb-alert--info{ background:var(--jwb-info-soft); border-color:#CFE0F5; color:#23517F; }
.a2-jwb-alert--ok{ background:var(--jwb-ok-soft); border-color:#BFE8D2; color:var(--jwb-price-deep); }
.a2-jwb-alert--warn{ background:var(--jwb-warn-soft); border-color:#F0E0B4; color:#8A6608; }
.a2-jwb-alert--danger{ background:var(--jwb-danger-soft); border-color:#F2C9CC; color:#B5323C; }

/* =============================================================================
   21. BOTTOM NAV (mobile)
   ========================================================================== */
.a2-jwb-bottomnav{ display:none; }
@media (max-width:767px){
  body.a2-jwb-fullwidth-page .a2-bottom-nav,
  body.a2-jwb-fullwidth-page .a2-mobile-footer{ display:none!important; }
  body.a2-jwb-fullwidth-page{ padding-bottom:calc(74px + env(safe-area-inset-bottom))!important; }
  .a2-jwb-bottomnav{ display:flex; position:fixed; inset-inline:0; bottom:0; z-index:999998; background:rgba(255,255,255,.97); backdrop-filter:saturate(1.4) blur(10px); border-top:1px solid var(--jwb-card-border); padding:7px 4px calc(7px + env(safe-area-inset-bottom)); box-shadow:0 -3px 16px -6px rgba(28,22,8,.18); }
  .a2-jwb-bottomnav__item{ flex:1; display:flex; flex-direction:column; align-items:center; gap:3px; padding:6px 2px; font-size:10.5px; font-weight:700; color:var(--jwb-muted); background:none; border:none; cursor:pointer; text-decoration:none; transition:color .15s; }
  .a2-jwb-bottomnav__item svg{ width:23px; height:23px; }
  .a2-jwb-bottomnav__item.is-active{ color:var(--jwb-gold-deep); }
}

/* =============================================================================
   22. SECTION HEADERS / MISC
   ========================================================================== */
.a2-jwb-section{ padding-block:var(--jwb-s8); }
.a2-jwb-section__head{ display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:var(--jwb-s6); flex-wrap:wrap; }
.a2-jwb-section__title{ position:relative; font-size:clamp(20px,3vw,27px); font-weight:800; color:var(--jwb-title); padding-inline-start:14px; letter-spacing:-.015em; }
.a2-jwb-section__title::before{ content:""; position:absolute; inset-inline-start:0; top:50%; transform:translateY(-50%); width:5px; height:.85em; border-radius:3px; background:var(--jwb-gold-grad); }
.a2-jwb-section__more{ font-size:14px; color:var(--jwb-gold-deep); font-weight:700; white-space:nowrap; }
.a2-jwb-divider{ height:1px; background:var(--jwb-line); border:none; margin-block:var(--jwb-s5); }

.a2-jwb-skel{ background:linear-gradient(90deg,#F1ECE1 25%,#F8F4EA 37%,#F1ECE1 63%); background-size:400% 100%; animation:jwbSkel 1.3s ease infinite; border-radius:8px; }
@keyframes jwbSkel{ 0%{background-position:100% 0} 100%{background-position:-100% 0} }

/* =============================================================================
   23. RESPONSIVE — filter toggle (mobile drawer trigger)
   ========================================================================== */
@container (max-width:991px){
  .a2-jwb-filters-toggle{ display:inline-flex; align-items:center; gap:8px; padding:11px 18px; border-radius:var(--jwb-r-pill); border:1px solid var(--jwb-gold-line); background:var(--jwb-gold-soft); color:var(--jwb-gold-deep); font-weight:700; font-size:14px; cursor:pointer; }
}
@container (min-width:992px){ .a2-jwb-filters-toggle{ display:none; } }

/* =============================================================================
   24. MOBILE-FIRST PRO LAYER  (<=767px)  — touch ergonomics & native patterns
   ========================================================================== */
@container (max-width:767px){

  .a2-jwb-section{ padding-block:var(--jwb-s6); }
  .a2-jwb-section__head{ margin-bottom:var(--jwb-s4); align-items:center; }
  .a2-jwb-section__title{ font-size:19px; }

  /* 44px minimum hit targets */
  .a2-jwb-btn{ min-height:46px; padding-block:13px; }
  .a2-jwb-btn--sm{ min-height:40px; }
  .a2-jwb-subnav a,.a2-jwb-subnav__item{ min-height:38px; }
  .a2-jwb-filters__opt{ min-height:40px; }
  .a2-jwb-pagination a,.a2-jwb-pagination span{ min-width:44px; height:44px; }

  /* subnav: edge-to-edge scroll strip, snap */
  .a2-jwb-subnav{ padding-inline:var(--jwb-s4); gap:4px; scroll-snap-type:x proximity; -webkit-overflow-scrolling:touch; }
  .a2-jwb-subnav a,.a2-jwb-subnav__item{ scroll-snap-align:start; }

  /* HERO: tight, conversion-focused; feature image as a banner on top */
  .a2-jwb-hero{ padding:var(--jwb-s6) var(--jwb-s5); border-radius:20px; display:flex; flex-direction:column; }
  .a2-jwb-hero__feature{ order:-1; margin-bottom:var(--jwb-s5); }
  .a2-jwb-hero__feature-card{ aspect-ratio:16/10; box-shadow:0 16px 36px -20px rgba(28,22,8,.4); }
  .a2-jwb-hero__title{ font-size:clamp(25px,8vw,32px); margin-top:12px; }
  .a2-jwb-hero__sub{ font-size:15px; margin-bottom:var(--jwb-s5); }
  .a2-jwb-hero__cta{ display:grid; grid-template-columns:1fr; gap:10px; }
  .a2-jwb-hero__cta .a2-jwb-btn{ width:100%; }
  .a2-jwb-hero::after{ display:none; }

  /* product grid: 2-up, tighter */
  .a2-jwb-grid{ grid-template-columns:repeat(2,1fr); gap:12px; }
  .a2-jwb-watch-card__body{ padding:12px 13px 14px; gap:5px; }
  .a2-jwb-watch-card__title{ font-size:13.5px; -webkit-line-clamp:2; min-height:2.7em; }
  .a2-jwb-watch-card__foot .a2-jwb-btn{ display:none; }            /* tap card instead */
  .a2-jwb-watch-card__foot{ justify-content:flex-start; }
  .a2-jwb-watch-card__price{ font-size:15px; }

  /* horizontal scroll-snap rail (home "newest" etc.): add .is-rail */
  .a2-jwb-grid.is-rail{
    display:flex; gap:12px; overflow-x:auto; scroll-snap-type:x mandatory;
    -webkit-overflow-scrolling:touch; scrollbar-width:none;
    margin-inline:calc(-1 * var(--jwb-s4)); padding-inline:var(--jwb-s4); padding-bottom:4px;
  }
  .a2-jwb-grid.is-rail::-webkit-scrollbar{ display:none; }
  .a2-jwb-grid.is-rail > *{ flex:0 0 64%; max-width:240px; scroll-snap-align:start; }

  /* SHOP: filter rail hidden inline; opened as a bottom-sheet */
  .a2-jwb-shop{ display:block; }
  .a2-jwb-shop > .a2-jwb-filters{
    position:fixed; inset-inline:0; bottom:0; top:auto; z-index:60;
    max-height:82vh; overflow-y:auto;
    border-radius:22px 22px 0 0; border:none; box-shadow:0 -10px 40px -12px rgba(28,22,8,.35);
    transform:translateY(100%); transition:transform .32s var(--jwb-ease); padding:var(--jwb-s6) var(--jwb-s5) var(--jwb-s8);
  }
  .a2-jwb-shop.filters-open > .a2-jwb-filters{ transform:translateY(0); }
  .a2-jwb-shop > .a2-jwb-filters::before{
    content:""; display:block; width:42px; height:5px; border-radius:3px; background:var(--jwb-line-strong);
    margin:-6px auto var(--jwb-s4);
  }
  .a2-jwb-sheet-backdrop{ position:fixed; inset:0; z-index:59; background:rgba(20,16,8,.42); opacity:0; visibility:hidden; transition:opacity .3s, visibility .3s; }
  .a2-jwb-shop.filters-open ~ .a2-jwb-sheet-backdrop,
  .a2-jwb-shop.filters-open .a2-jwb-sheet-backdrop{ opacity:1; visibility:visible; }
  .a2-jwb-filters__apply{ position:sticky; bottom:0; margin:var(--jwb-s4) -4px -4px; padding-top:var(--jwb-s3); background:linear-gradient(180deg,transparent,#fff 30%); }

  /* count bar: filter + sort as two equal pills */
  .a2-jwb-countbar{ display:grid; grid-template-columns:1fr 1fr; gap:10px; position:sticky; top:48px; z-index:30; background:var(--jwb-bg); padding-block:10px; }
  .a2-jwb-countbar__count{ grid-column:1 / -1; }
  .a2-jwb-countbar select{ width:100%; }

  /* WATCH DETAIL: stack + sticky purchase bar */
  .a2-jwb-detail{ gap:var(--jwb-s5); }
  .a2-jwb-detail__price{ font-size:26px; }
  .a2-jwb-gallery__thumbs{ gap:8px; }
  .a2-jwb-gallery__thumb{ width:60px; height:60px; }
  .a2-jwb-mobilebar{
    display:flex; position:fixed; inset-inline:0; bottom:0; z-index:56;
    align-items:center; gap:12px; padding:10px var(--jwb-s4) calc(10px + env(safe-area-inset-bottom));
    background:rgba(255,255,255,.97); backdrop-filter:saturate(1.4) blur(10px);
    border-top:1px solid var(--jwb-card-border); box-shadow:0 -4px 20px -8px rgba(28,22,8,.22);
  }
  .a2-jwb-mobilebar__price{ display:flex; flex-direction:column; line-height:1.2; }
  .a2-jwb-mobilebar__price b{ font-size:17px; font-weight:800; color:var(--jwb-price-deep); }
  .a2-jwb-mobilebar__price small{ font-size:11px; color:var(--jwb-muted); }
  .a2-jwb-mobilebar .a2-jwb-btn{ flex:1; margin:0; }

  /* TABLES -> CARD LIST. Add .a2-jwb-table--cards + data-label on each td. */
  .a2-jwb-table--cards,
  .a2-jwb-table--cards thead,
  .a2-jwb-table--cards tbody,
  .a2-jwb-table--cards tr,
  .a2-jwb-table--cards td{ display:block; width:100%; }
  .a2-jwb-table--cards{ min-width:0; }
  .a2-jwb-table--cards thead{ position:absolute; clip:rect(0 0 0 0); height:1px; width:1px; overflow:hidden; }
  .a2-jwb-table--cards tr{
    background:#fff; border:1px solid var(--jwb-card-border); border-radius:var(--jwb-r-card);
    box-shadow:var(--jwb-card-shadow); padding:var(--jwb-s4); margin-bottom:12px;
  }
  .a2-jwb-table--cards td{ display:flex; align-items:center; justify-content:space-between; gap:12px; padding:7px 0; border:none; font-size:14px; text-align:start; }
  .a2-jwb-table--cards td::before{ content:attr(data-label); color:var(--jwb-muted); font-size:12.5px; font-weight:700; }
  .a2-jwb-table--cards td:first-child{ padding-top:0; border-bottom:1px solid var(--jwb-line); padding-bottom:11px; margin-bottom:5px; }
  .a2-jwb-table--cards td:first-child::before{ display:none; }
  .a2-jwb-table--cards td:last-child{ padding-bottom:0; }
  .a2-jwb-table--cards td:last-child .a2-jwb-btn{ width:100%; }
  .a2-jwb-table-wrap:has(.a2-jwb-table--cards){ border:none; background:transparent; box-shadow:none; overflow:visible; }

  .a2-jwb-stat__value{ font-size:23px; }

  /* wizard steps: labels can crowd — shrink */
  .a2-jwb-step__label{ font-size:11px; }
  .a2-jwb-step__dot{ width:36px; height:36px; }
  .a2-jwb-steps{ gap:0; }
  .a2-jwb-wizard-step{ font-size:11px; }

  /* OTP: fit five cells on narrow screens */
  .a2-jwb-otp{ gap:8px; }
  .a2-jwb-otp input{ width:100%; max-width:56px; height:58px; font-size:22px; }

  /* trust strip wraps to 2-up tiles */
  .a2-jwb-trust--strip .a2-jwb-trust__item{ flex:1 1 calc(50% - 4px); }

  /* countdown sizing */
  .a2-jwb-countdown__cell{ min-width:0; flex:1; }
  .a2-jwb-countdown{ width:100%; }
}

/* page that shows a sticky purchase bar instead of bottom nav */
.a2-jwb.has-mobilebar .a2-jwb-bottomnav{ display:none; }

/* hide mobile-only helpers on desktop */
@container (min-width:768px){
  .a2-jwb-mobilebar,.a2-jwb-sheet-backdrop{ display:none !important; }
  .a2-jwb-grid.is-rail{ display:grid; }
}

/* =============================================================================
   25. VIEWPORT-LEVEL CHROME  (real @media — fixed bars clear the page bottom)
   ========================================================================== */
@media (max-width:767px){
  .a2-jwb{ font-size:15.5px; padding-bottom:80px; }
}

/* =============================================================================
   26. BRIDGE — map the plugin's legacy hyphen-style class names onto the system
       above, so any template not yet converted to the BEM contract still
       adopts the premium look. (Converted templates use the BEM names directly.)
   ========================================================================== */
/* buttons */
.a2-jwb .a2-jwb-button,.a2-jwb a.a2-jwb-button,.a2-jwb .a2-jwb-primary,.a2-jwb a.a2-jwb-primary{
  position:relative; display:inline-flex; align-items:center; justify-content:center; gap:8px;
  padding:13px 28px; border-radius:var(--jwb-r-pill); border:1px solid transparent;
  font-family:inherit; font-size:15px; font-weight:700; line-height:1.2; cursor:pointer; text-align:center;
  transition:transform .14s var(--jwb-ease), box-shadow .22s var(--jwb-ease), background .22s var(--jwb-ease);
}
.a2-jwb .a2-jwb-button-primary,.a2-jwb a.a2-jwb-button-primary,.a2-jwb .a2-jwb-primary,.a2-jwb button.a2-jwb-button{
  background:var(--jwb-gold-grad); color:var(--jwb-gold-text); border-color:rgba(154,122,46,.4);
  box-shadow:0 4px 16px -4px rgba(194,155,67,.55), inset 0 1px 0 rgba(255,255,255,.45);
}
.a2-jwb .a2-jwb-button-primary:hover,.a2-jwb a.a2-jwb-button-primary:hover,.a2-jwb .a2-jwb-primary:hover,.a2-jwb button.a2-jwb-button:hover{
  background:var(--jwb-gold-grad-hover);
}
.a2-jwb .a2-jwb-button-secondary,.a2-jwb a.a2-jwb-button-secondary{
  background:var(--jwb-surface); color:var(--jwb-gold-deep); border-color:var(--jwb-gold-line);
}
.a2-jwb a.a2-jwb-secondary{ display:inline-flex; align-items:center; gap:6px; font-weight:700; font-size:14px; color:var(--jwb-gold-deep); }
.a2-jwb a.a2-jwb-secondary:hover{ color:var(--jwb-gold-solid); }
.a2-jwb .a2-jwb-button--sm{ padding:9px 17px; font-size:13px; }
.a2-jwb .a2-jwb-button--block{ width:100%; }

/* legacy status badges */
.a2-jwb .a2-jwb-status-badge{ display:inline-flex; align-items:center; gap:5px; padding:5px 11px; border-radius:var(--jwb-r-chip); font-size:11.5px; font-weight:700; line-height:1; border:1px solid transparent; white-space:nowrap; }
.a2-jwb .a2-jwb-status-badge::before{ content:""; width:6px; height:6px; border-radius:50%; background:currentColor; opacity:.9; }
.a2-jwb .a2-jwb-status-badge--verified{ background:var(--jwb-gold-grad); color:var(--jwb-gold-text); border-color:rgba(154,122,46,.4); }
.a2-jwb .a2-jwb-status-badge--warning{ background:var(--jwb-surface-sink); color:var(--jwb-muted); border-color:var(--jwb-line-strong); }
.a2-jwb .a2-jwb-status-badge--success{ background:var(--jwb-ok-soft); color:var(--jwb-price-deep); border-color:#BFE8D2; }
.a2-jwb .a2-jwb-status-badge--danger{ background:var(--jwb-danger-soft); color:var(--jwb-danger); border-color:#F2C9CC; }

/* legacy watch card inner */
.a2-jwb .a2-jwb-watch-card-media{ position:relative; display:block; aspect-ratio:4/5; background:radial-gradient(120% 100% at 50% 0%, #FFFDF8 0%, var(--jwb-surface-soft) 70%); overflow:hidden; }
.a2-jwb .a2-jwb-watch-card-media img{ width:100%; height:100%; object-fit:cover; }
.a2-jwb .a2-jwb-watch-card-placeholder{ display:flex; align-items:center; justify-content:center; height:100%; font-size:46px; color:var(--jwb-gold-line); }
.a2-jwb .a2-jwb-watch-card-flag{ position:absolute; top:12px; inset-inline-start:12px; z-index:2; }
.a2-jwb .a2-jwb-watch-card-body{ padding:var(--jwb-s4) var(--jwb-s5) var(--jwb-s5); display:flex; flex-direction:column; gap:7px; flex:1; }
.a2-jwb .a2-jwb-watch-card-body h3{ font-size:15px; font-weight:700; line-height:1.55; margin:0; }
.a2-jwb .a2-jwb-watch-card-body h3 a{ color:var(--jwb-title); }
.a2-jwb .a2-jwb-watch-card-en{ font-size:11px; color:var(--jwb-gold-deep); font-weight:800; letter-spacing:.1em; text-transform:uppercase; margin:0; }
.a2-jwb .a2-jwb-watch-card-meta{ font-size:12.5px; color:var(--jwb-muted); }
.a2-jwb .a2-jwb-watch-card-price{ color:var(--jwb-price-deep); font-weight:800; font-size:17px; }
.a2-jwb .a2-jwb-watch-card-foot{ margin-top:auto; padding-top:var(--jwb-s3); border-top:1px solid var(--jwb-line); }

/* legacy detail inner */
.a2-jwb .a2-jwb-gallery-main{ aspect-ratio:1/1; border-radius:20px; overflow:hidden; background:radial-gradient(120% 100% at 50% 0%, #FFFDF8, var(--jwb-surface-soft)); border:1px solid var(--jwb-card-border); box-shadow:var(--jwb-card-shadow); display:flex; align-items:center; justify-content:center; font-size:72px; color:var(--jwb-gold-line); }
.a2-jwb .a2-jwb-gallery-main img{ width:100%; height:100%; object-fit:cover; }
.a2-jwb .a2-jwb-gallery-thumbs{ display:flex; gap:10px; margin-top:12px; flex-wrap:wrap; }
.a2-jwb .a2-jwb-gallery-thumb{ width:74px; height:74px; border-radius:12px; overflow:hidden; cursor:pointer; border:1px solid var(--jwb-card-border); background:var(--jwb-surface-soft); }
.a2-jwb .a2-jwb-gallery-thumb--active{ border-color:var(--jwb-gold-solid); box-shadow:var(--jwb-focus); }
.a2-jwb .a2-jwb-detail-title{ font-size:clamp(23px,3vw,32px); font-weight:800; color:var(--jwb-title); margin:6px 0 var(--jwb-s3); }
.a2-jwb .a2-jwb-detail-en{ font-size:12px; color:var(--jwb-gold-deep); font-weight:800; letter-spacing:.1em; text-transform:uppercase; margin:0 0 10px; }
.a2-jwb .a2-jwb-detail-price{ font-size:30px; font-weight:800; color:var(--jwb-price-deep); margin-bottom:var(--jwb-s4); }
.a2-jwb .a2-jwb-spec-list{ border:1px solid var(--jwb-card-border); border-radius:var(--jwb-r-card); overflow:hidden; margin:0 0 var(--jwb-s4); }
.a2-jwb .a2-jwb-spec-list > div{ display:flex; justify-content:space-between; gap:12px; padding:12px 16px; font-size:14px; }
.a2-jwb .a2-jwb-spec-list > div:nth-child(odd){ background:var(--jwb-surface-soft); }
.a2-jwb .a2-jwb-spec-list dt{ color:var(--jwb-muted); margin:0; }
.a2-jwb .a2-jwb-spec-list dd{ color:var(--jwb-title); font-weight:700; margin:0; }
.a2-jwb .a2-jwb-seller-avatar{ flex:none; width:50px; height:50px; border-radius:50%; background:var(--jwb-gold-grad); color:var(--jwb-gold-text); display:flex; align-items:center; justify-content:center; font-weight:800; }

/* legacy cards / fields / notices */
.a2-jwb .a2-jwb-card:has(> .a2-jwb-card-body){ padding:0; }
.a2-jwb .a2-jwb-card-body{ padding:var(--jwb-s6); }
.a2-jwb .a2-jwb-notice{ display:flex; gap:10px; padding:14px 16px; border-radius:14px; font-size:14px; background:var(--jwb-info-soft); border:1px solid #CFE0F5; color:#23517F; margin-block:var(--jwb-s4); }
.a2-jwb .a2-jwb-check{ display:flex; align-items:flex-start; gap:9px; font-size:14px; }

/* legacy subnav (-inner/-list/-label) */
.a2-jwb .a2-jwb-subnav-inner{ display:flex; align-items:center; gap:var(--jwb-s2); max-width:var(--jwb-container); margin-inline:auto; padding:7px var(--jwb-s4); overflow-x:auto; white-space:nowrap; min-height:48px; }
.a2-jwb .a2-jwb-subnav-list{ display:flex; align-items:center; gap:4px; list-style:none; margin:0; padding:0; }
.a2-jwb .a2-jwb-subnav-list a{ display:inline-flex; align-items:center; gap:6px; padding:9px 15px; border-radius:var(--jwb-r-chip); color:var(--jwb-muted); font-size:14px; font-weight:600; line-height:1; }
.a2-jwb .a2-jwb-subnav-list a:hover{ background:var(--jwb-surface-sink); color:var(--jwb-title); }
.a2-jwb .a2-jwb-subnav-list .current-menu-item a,.a2-jwb .a2-jwb-subnav-list a.is-active{ color:var(--jwb-gold-deep); background:var(--jwb-gold-soft); }
.a2-jwb .a2-jwb-subnav-label{ font-size:13px; font-weight:700; color:var(--jwb-title); }

/* legacy hero / stat / wizard / empty / countdown */
.a2-jwb .a2-jwb-hero-eyebrow{ display:inline-flex; align-items:center; gap:7px; font-size:12px; font-weight:700; letter-spacing:.04em; color:var(--jwb-gold-deep); background:#fff; border:1px solid var(--jwb-gold-line); padding:6px 13px; border-radius:var(--jwb-r-chip); margin-bottom:var(--jwb-s4); }
.a2-jwb .a2-jwb-hero-actions{ display:flex; flex-wrap:wrap; gap:12px; margin-top:var(--jwb-s5); }
.a2-jwb .a2-jwb-stat-grid{ display:grid; grid-template-columns:repeat(2,1fr); gap:var(--jwb-s3); }
@container (min-width:768px){ .a2-jwb .a2-jwb-stat-grid{ grid-template-columns:repeat(4,1fr); gap:var(--jwb-s4); } }
.a2-jwb .a2-jwb-stat-label{ font-size:12.5px; color:var(--jwb-muted); font-weight:600; }
.a2-jwb .a2-jwb-stat-value{ font-size:27px; font-weight:800; color:var(--jwb-title); line-height:1.1; }
.a2-jwb .a2-jwb-wizard-steps{ display:flex; align-items:flex-start; gap:0; width:100%; margin-bottom:var(--jwb-s7); }
.a2-jwb-auth-feedback:empty{ display:none; }
.a2-jwb-auth-feedback:not(:empty){ margin-bottom:var(--jwb-s4); }
.a2-jwb-auth-form button[aria-busy="true"]{ cursor:wait; opacity:.72; }
.a2-jwb-auth-code{ direction:ltr; text-align:center; letter-spacing:.28em!important; font-variant-numeric:tabular-nums; }
.a2-jwb .a2-jwb-wizard-step{ display:flex; flex-direction:column; align-items:center; gap:8px; flex:1; position:relative; font-size:12.5px; color:var(--jwb-muted); font-weight:600; }
.a2-jwb .a2-jwb-wizard-step.is-active{ color:var(--jwb-gold-deep); font-weight:800; }
.a2-jwb .a2-jwb-wizard-step.is-done{ color:var(--jwb-text); }
.a2-jwb .a2-jwb-wizard-nav{ display:flex; justify-content:space-between; gap:12px; margin-top:var(--jwb-s7); padding-top:var(--jwb-s5); border-top:1px solid var(--jwb-line); }
.a2-jwb .a2-jwb-empty-state,.a2-jwb .a2-jwb-empty{ display:flex; flex-direction:column; align-items:center; justify-content:center; gap:13px; text-align:center; padding:var(--jwb-s9) var(--jwb-s5); color:var(--jwb-muted); }
.a2-jwb .a2-jwb-empty-state-icon,.a2-jwb .a2-jwb-empty-icon{ width:80px; height:80px; border-radius:50%; display:flex; align-items:center; justify-content:center; font-size:30px; background:radial-gradient(circle at 50% 35%,#fff,var(--jwb-gold-soft)); border:1px solid var(--jwb-gold-line); color:var(--jwb-gold-solid); }
.a2-jwb .a2-jwb-empty-title{ font-size:19px; font-weight:800; color:var(--jwb-title); }
.a2-jwb .a2-jwb-empty-text{ font-size:14px; max-width:360px; }
.a2-jwb .a2-jwb-countdown-time{ font-size:27px; font-weight:800; color:var(--jwb-title); }
.a2-jwb .a2-jwb-countdown-label{ font-size:12px; color:var(--jwb-muted); }
.a2-jwb .a2-jwb-alert-success{ background:var(--jwb-ok-soft); border:1px solid #BFE8D2; color:var(--jwb-price-deep); padding:14px 16px; border-radius:14px; }
.a2-jwb .a2-jwb-ico{ color:var(--jwb-gold-deep); }

/* ---- Product detail: tabbed information panel ------------------------- */
.a2-jwb .a2-jwb-tabs{ margin-top:var(--jwb-s6); background:var(--jwb-card-bg); border:1px solid var(--jwb-card-border); border-radius:var(--jwb-r-card); box-shadow:var(--jwb-card-shadow); overflow:hidden; }
.a2-jwb .a2-jwb-tabs__nav{ display:flex; gap:4px; padding:6px; background:var(--jwb-surface-soft); border-bottom:1px solid var(--jwb-card-border); overflow-x:auto; scrollbar-width:none; }
.a2-jwb .a2-jwb-tabs__nav::-webkit-scrollbar{ display:none; }
.a2-jwb .a2-jwb-tabs__tab{ flex:1 1 auto; min-width:max-content; appearance:none; border:0; background:transparent; cursor:pointer; padding:12px 20px; border-radius:12px; font-family:inherit; font-size:14px; font-weight:800; color:var(--jwb-muted); white-space:nowrap; transition:color .15s var(--jwb-ease), background .15s var(--jwb-ease), box-shadow .15s; }
.a2-jwb .a2-jwb-tabs__tab:hover{ color:var(--jwb-title); }
.a2-jwb .a2-jwb-tabs__tab:focus-visible{ outline:none; box-shadow:var(--jwb-focus); }
.a2-jwb .a2-jwb-tabs__tab.is-active{ background:var(--jwb-card-bg); color:var(--jwb-gold-deep); box-shadow:0 1px 3px rgba(28,22,8,.10); }
.a2-jwb .a2-jwb-tabs__panels{ padding:var(--jwb-s6); }
.a2-jwb .a2-jwb-tabs__panel[hidden]{ display:none; }
.a2-jwb .a2-jwb-tabs__panel > *:first-child{ margin-top:0; }
.a2-jwb .a2-jwb-tabs__panel > *:last-child{ margin-bottom:0; }
.a2-jwb .a2-jwb-spec-grid{ display:grid; grid-template-columns:1fr; gap:0; border:1px solid var(--jwb-line); border-radius:var(--jwb-r-field); overflow:hidden; }
@container (min-width:640px){ .a2-jwb .a2-jwb-spec-grid{ grid-template-columns:1fr 1fr; } }
.a2-jwb .a2-jwb-spec-grid__row{ display:flex; justify-content:space-between; gap:12px; padding:13px 16px; border-bottom:1px solid var(--jwb-line); }
.a2-jwb .a2-jwb-spec-grid__row:nth-child(odd){ background:var(--jwb-surface-soft); }
.a2-jwb .a2-jwb-spec-grid__key{ color:var(--jwb-muted); font-size:13.5px; font-weight:700; }
.a2-jwb .a2-jwb-spec-grid__val{ color:var(--jwb-title); font-size:14px; font-weight:800; text-align:left; }
.a2-jwb .a2-jwb-detail__cta{ margin:var(--jwb-s4) 0 var(--jwb-s5); }
.a2-jwb .a2-jwb-detail__cta .a2-jwb-btn{ width:100%; padding:15px 20px; font-size:15.5px; }
/* ---- Detail hero polish: fix trust-strip stacking + gallery void -------- */
/* Each trust item's text was inline (title+subtitle ran together); stack it. */
.a2-jwb .a2-jwb-trust__item > div{ display:flex; flex-direction:column; gap:1px; min-width:0; }
.a2-jwb .a2-jwb-trust__title,.a2-jwb .a2-jwb-trust__text{ display:block; line-height:1.35; }
.a2-jwb .a2-jwb-trust--strip{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }
.a2-jwb .a2-jwb-trust--strip .a2-jwb-trust__item{ flex:initial; padding:12px 14px; gap:11px; }
.a2-jwb .a2-jwb-trust--strip .a2-jwb-trust__icon{ width:40px; height:40px; border-radius:11px; font-size:18px; }
@media (max-width:480px){ .a2-jwb .a2-jwb-trust--strip{ grid-template-columns:1fr; } }
/* Keep the gallery from becoming a giant empty void; give the empty state a
   deliberate, centered placeholder instead of a lost little glyph. */
.a2-jwb .a2-jwb-gallery__main{ max-height:520px; }
.a2-jwb .a2-jwb-gallery__placeholder{ display:flex; flex-direction:column; align-items:center; justify-content:center; gap:14px; color:var(--jwb-faint); }
.a2-jwb .a2-jwb-gallery__placeholder-icon{ width:104px; height:104px; border-radius:50%; display:flex; align-items:center; justify-content:center; font-size:48px; background:#fff; border:1px solid var(--jwb-gold-line); color:var(--jwb-gold-solid); box-shadow:var(--jwb-card-shadow); }
.a2-jwb .a2-jwb-gallery__placeholder-text{ font-size:13.5px; font-weight:700; }

/* Buy-box placed full-width below the hero: a tab bar over self-contained
   action panels (deposit / offer bring their own boxes — no card-in-card). */
.a2-jwb .a2-jwb-buybox--block{ position:static; margin-top:var(--jwb-s6); background:transparent; border:0; box-shadow:none; padding:0; gap:var(--jwb-s4); }
.a2-jwb .a2-jwb-buybox--block .a2-jwb-buybox__tabs{ margin-bottom:0; max-width:420px; }
.a2-jwb .a2-jwb-buybox__panel{ min-width:0; }
.a2-jwb .a2-jwb-buybox__panel[hidden]{ display:none; }