/* Three picture surfaces; keep typography and colors inherited from the shop. */
.amh {
  --amh-height:460px; --amh-mobile-height:300px; --amh-gap:10px; --amh-radius:18px; --amh-max-width:1440px;
  --amh-control:var(--color-primary,#138dbb);
  box-sizing:border-box; display:grid; grid-template-columns:minmax(0,3fr) minmax(0,1fr);
  gap:var(--amh-gap); width:100%; max-width:var(--amh-max-width); height:var(--amh-height);
  margin:0 auto; direction:rtl; font:inherit; isolation:isolate;
}
.amh *, .amh *::before, .amh *::after { box-sizing:border-box; }
.amh[hidden], .amh [hidden] { display:none !important; }
.amh__main, .amh__banner { position:relative; overflow:hidden; border-radius:var(--amh-radius); background:#f1f1f1; min-width:0; min-height:0; }
.amh__main { direction:rtl; touch-action:pan-y pinch-zoom; }
.amh__slides, .amh__slide, .amh__asset, .amh__link { position:absolute; inset:0; }
.amh__slide { opacity:0; visibility:hidden; pointer-events:none; transition:opacity .45s ease; }
.amh__slide.is-active { opacity:1; visibility:visible; pointer-events:auto; z-index:1; }
/* The SSR picture is already visible; preserve its first presentation through
   the client handoff. Later slide changes keep the usual opacity transition. */
.amh__slide.is-initial-presentation { transition:none; }
.amh__asset { overflow:hidden; }
.amh__asset picture { display:block; width:100%; height:100%; }
.amh__asset img, .amh__asset video { display:block; width:100%; height:100%; max-width:none; margin:0; object-fit:var(--amh-fit,cover); object-position:center; }
.amh__asset video { position:absolute; inset:0; opacity:0; pointer-events:none; }
.amh__asset video.is-playing { opacity:1; }
.amh__link { z-index:2; display:block; color:inherit; text-decoration:none; }
.amh__banners { display:grid; grid-template-rows:minmax(0,1fr) minmax(0,1fr); gap:var(--amh-gap); min-width:0; min-height:0; }
.amh__banners.is-single { grid-template-rows:minmax(0,1fr); }
.amh.is-no-banners { grid-template-columns:minmax(0,1fr); }
.amh.is-no-slides { grid-template-columns:minmax(0,1fr); }
.amh.is-no-slides .amh__banners { grid-template-columns:repeat(2,minmax(0,1fr)); grid-template-rows:minmax(0,1fr); }
.amh button { font:inherit; cursor:pointer; border:0; margin:0; -webkit-tap-highlight-color:transparent; }
.amh .amh__arrow { position:absolute; z-index:4; top:50%; transform:translateY(-50%); width:44px; height:44px; border-radius:50%; display:grid; place-items:center; background:var(--amh-control); color:#fff; padding:0; box-shadow:0 2px 8px #0002; }
.amh__arrow span { direction:ltr; font:32px/1 Arial,sans-serif; transform:translateY(-2px); }
.amh__prev { right:10px; }
.amh__next { left:10px; }
.amh__dots { position:absolute; z-index:4; bottom:4px; left:50%; transform:translateX(-50%); display:flex; direction:rtl; }
.amh .amh__dot { width:32px; height:44px; padding:0; background:transparent; display:grid; place-items:center; }
.amh__dot::after { content:""; display:block; width:7px; height:7px; border-radius:50%; background:#ffffffb3; border:1px solid #0003; box-shadow:0 0 0 1px #ffffff8c; }
.amh__dot[aria-current="true"]::after { background:#171717; border-color:#fff; }
.amh .amh__motion { position:absolute; z-index:5; bottom:10px; right:10px; width:44px; height:36px; border-radius:18px; background:#161616b8; color:white; font:16px/1 Arial,sans-serif; padding:0; }
.amh button:focus-visible { outline:3px solid #fff; outline-offset:-5px; box-shadow:0 0 0 3px #136fa0; }
.amh__link:focus-visible { outline:3px solid #136fa0; outline-offset:-5px; }
.amh__status { 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:767px) {
  .amh { grid-template-columns:minmax(0,1fr); height:auto; }
  .amh__main { height:var(--amh-mobile-height); }
  .amh__banners { grid-template-columns:repeat(2,minmax(0,1fr)); grid-template-rows:auto; }
  .amh__banner { height:clamp(130px,40vw,240px); }
  .amh__banners.is-single { grid-template-columns:minmax(0,1fr); grid-template-rows:auto; }
  .amh .amh__arrow { width:40px; height:44px; }
}
@media(prefers-reduced-motion:reduce) { .amh__slide { transition:none; } }