/* Custom order banner — single canonical layout */
html body .custom3dBanner{
  position:relative!important;
  isolation:isolate!important;
  display:block!important;
  box-sizing:border-box!important;
  width:min(calc(100vw - 40px),800px)!important;
  max-width:800px!important;
  aspect-ratio:1672/941!important;
  height:auto!important;
  margin:24px auto!important;
  padding:0!important;
  overflow:hidden!important;
  border:1px solid rgba(205,143,89,.52)!important;
  border-radius:24px!important;
  background:#23140c!important;
  box-shadow:0 18px 48px rgba(45,25,14,.22)!important;
  line-height:0!important;
}
html body .custom3dBanner,
html body .custom3dBanner *{box-sizing:border-box!important}
html body .custom3dBanner img{
  position:absolute!important;
  inset:0!important;
  display:block!important;
  width:100%!important;
  height:100%!important;
  max-width:none!important;
  margin:0!important;
  border:0!important;
  border-radius:inherit!important;
  object-fit:contain!important;
  object-position:center!important;
  transform:none!important;
}
html body .custom3dBanner .custom3dFeatureMask{
  position:absolute!important;
  z-index:5!important;
  right:2.2%!important;
  bottom:31.7%!important;
  width:48.2%!important;
  height:16.5%!important;
  border-radius:24px!important;
  background:#3a2115!important;
  box-shadow:none!important;
  pointer-events:none!important;
}
html body .custom3dBanner .custom3dFeatureButtons{
  position:absolute!important;
  z-index:7!important;
  right:3.2%!important;
  bottom:34.2%!important;
  width:46.2%!important;
  display:grid!important;
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  gap:6px!important;
  align-items:stretch!important;
  direction:ltr!important;
}
html body .custom3dBanner .custom3dFeature{
  min-width:0!important;
  min-height:40px!important;
  padding:7px 8px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:6px!important;
  border:1px solid rgba(220,153,91,.82)!important;
  border-radius:999px!important;
  background:linear-gradient(180deg,rgba(64,38,23,.98),rgba(44,26,17,.97))!important;
  color:#fff4e7!important;
  -webkit-text-fill-color:#fff4e7!important;
  text-decoration:none!important;
  box-shadow:0 6px 14px rgba(25,14,8,.20),inset 0 1px 0 rgba(255,235,215,.10)!important;
  font:inherit!important;
  font-size:clamp(9px,.9vw,11px)!important;
  font-weight:900!important;
  line-height:1.1!important;
  white-space:nowrap!important;
  cursor:pointer!important;
  direction:rtl!important;
}
html body .custom3dBanner .custom3dFeature span{
  min-width:0!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
  white-space:nowrap!important;
}
html body .custom3dBanner .custom3dFeature i{
  flex:0 0 21px!important;
  width:21px!important;
  height:21px!important;
  display:grid!important;
  place-items:center!important;
  border-radius:50%!important;
  background:rgba(213,143,78,.13)!important;
  color:#e7a25f!important;
  -webkit-text-fill-color:#e7a25f!important;
  font-style:normal!important;
  font-size:14px!important;
}
html body .custom3dBanner .custom3dCtaMask{
  position:absolute!important;
  z-index:4!important;
  right:3.2%!important;
  bottom:3.7%!important;
  width:45.2%!important;
  height:17%!important;
  border-radius:22px!important;
  background:linear-gradient(118deg,rgba(57,33,20,.97),rgba(43,25,16,.96))!important;
  box-shadow:0 0 22px 10px rgba(49,28,17,.30)!important;
  pointer-events:none!important;
}
html body .custom3dBanner .custom3dAction{
  position:absolute!important;
  z-index:8!important;
  right:4.2%!important;
  bottom:5.1%!important;
  width:42.8%!important;
  min-width:0!important;
  min-height:58px!important;
  height:auto!important;
  display:flex!important;
  align-items:center!important;
  justify-content:flex-start!important;
  gap:9px!important;
  padding:8px 10px!important;
  border:1px solid rgba(255,255,255,.20)!important;
  border-radius:17px!important;
  background:linear-gradient(135deg,rgba(72,46,32,.96),rgba(42,26,18,.94))!important;
  box-shadow:0 10px 26px rgba(31,18,11,.30),inset 0 1px 0 rgba(255,255,255,.09)!important;
  color:#fffaf5!important;
  text-decoration:none!important;
  line-height:1.15!important;
  overflow:hidden!important;
}
html body .custom3dBanner .custom3dWhatsIcon{
  flex:0 0 40px!important;
  width:40px!important;
  height:40px!important;
  display:grid!important;
  place-items:center!important;
  border-radius:13px!important;
  background:linear-gradient(145deg,#31d56f,#1fac58)!important;
}
html body .custom3dBanner .custom3dWhatsIcon svg{width:24px!important;height:24px!important;display:block!important;fill:none!important;stroke:#fff!important;stroke-width:1.8!important}
html body .custom3dBanner .custom3dActionCopy{
  display:grid!important;
  gap:3px!important;
  min-width:0!important;
  text-align:right!important;
  line-height:1.15!important;
}
html body .custom3dBanner .custom3dActionCopy b{
  margin:0!important;
  color:#fffaf5!important;
  -webkit-text-fill-color:#fffaf5!important;
  font-size:clamp(13px,1.25vw,17px)!important;
  font-weight:950!important;
  white-space:nowrap!important;
}
html body .custom3dBanner .custom3dActionCopy small{
  margin:0!important;
  color:#e7cdb9!important;
  -webkit-text-fill-color:#e7cdb9!important;
  font-size:clamp(8px,.82vw,11px)!important;
  font-weight:700!important;
  white-space:nowrap!important;
}
html body .custom3dBanner .custom3dActionArrow{
  margin-inline-start:auto!important;
  flex:0 0 26px!important;
  width:26px!important;
  height:26px!important;
  display:grid!important;
  place-items:center!important;
  border-radius:50%!important;
  background:rgba(255,255,255,.09)!important;
  color:#f6dcc8!important;
  -webkit-text-fill-color:#f6dcc8!important;
  font-size:18px!important;
}
html body .custom3dBanner .custom3dFeature:hover,
html body .custom3dBanner .custom3dAction:hover{transform:translateY(-1px)!important}
@media(max-width:640px){
  html body .custom3dBanner{
    width:calc(100vw - 20px)!important;
    max-width:none!important;
    margin:12px 10px!important;
    border-radius:16px!important;
  }
  html body .custom3dBanner .custom3dFeatureMask{
    right:1.8%!important;bottom:29.3%!important;width:96.4%!important;height:19%!important;border-radius:18px!important
  }
  html body .custom3dBanner .custom3dFeatureButtons{
    right:3%!important;bottom:33.1%!important;width:94%!important;gap:4px!important
  }
  html body .custom3dBanner .custom3dFeature{
    min-height:32px!important;padding:5px 4px!important;gap:3px!important;font-size:8px!important
  }
  html body .custom3dBanner .custom3dFeature i{
    flex-basis:17px!important;width:17px!important;height:17px!important;font-size:11px!important
  }
  html body .custom3dBanner .custom3dCtaMask{
    right:2%!important;bottom:2.4%!important;width:96%!important;height:24%!important;border-radius:18px!important;box-shadow:none!important
  }
  html body .custom3dBanner .custom3dAction{
    right:4%!important;
    left:4%!important;
    bottom:4%!important;
    width:auto!important;
    min-height:50px!important;
    padding:6px 8px!important;
    border-radius:14px!important;
  }
  html body .custom3dBanner .custom3dWhatsIcon{flex-basis:34px!important;width:34px!important;height:34px!important;border-radius:10px!important}
  html body .custom3dBanner .custom3dWhatsIcon svg{width:21px!important;height:21px!important}
  html body .custom3dBanner .custom3dActionCopy b{font-size:12px!important}
  html body .custom3dBanner .custom3dActionCopy small{font-size:8px!important}
  html body .custom3dBanner .custom3dActionArrow{flex-basis:22px!important;width:22px!important;height:22px!important;font-size:15px!important}
}


/* 2026-09-30: show the banner artwork cleanly; controls are transparent hit areas only. */
html body .custom3dBanner{
  width:min(calc(100vw - 32px),920px)!important;
  max-width:920px!important;
  aspect-ratio:1672/941!important;
  margin:20px auto!important;
  border:0!important;
  border-radius:24px!important;
  background:#23140c!important;
  box-shadow:none!important;
}
html body .custom3dBanner img{
  object-fit:contain!important;
  object-position:center!important;
  transform:none!important;
}
html body .custom3dBanner .custom3dFeatureMask,
html body .custom3dBanner .custom3dCtaMask{
  display:none!important;
}
html body .custom3dBanner .custom3dFeatureButtons{
  right:2.7%!important;
  bottom:34.2%!important;
  width:48.2%!important;
  gap:2%!important;
  background:transparent!important;
}
html body .custom3dBanner .custom3dFeature{
  min-height:44px!important;
  padding:0!important;
  border:0!important;
  border-radius:999px!important;
  background:transparent!important;
  box-shadow:none!important;
  color:transparent!important;
  -webkit-text-fill-color:transparent!important;
  opacity:0!important;
  transform:none!important;
  filter:none!important;
}
html body .custom3dBanner .custom3dFeature *{
  opacity:0!important;
  color:transparent!important;
  -webkit-text-fill-color:transparent!important;
}
html body .custom3dBanner .custom3dAction{
  right:5.8%!important;
  bottom:13.4%!important;
  width:33.5%!important;
  height:13%!important;
  min-width:0!important;
  min-height:0!important;
  padding:0!important;
  border:0!important;
  border-radius:20px!important;
  background:transparent!important;
  box-shadow:none!important;
  backdrop-filter:none!important;
  -webkit-backdrop-filter:none!important;
  color:transparent!important;
  opacity:0!important;
  overflow:hidden!important;
  transform:none!important;
  filter:none!important;
  pointer-events:auto!important;
}
html body .custom3dBanner .custom3dAction *{
  opacity:0!important;
  color:transparent!important;
  -webkit-text-fill-color:transparent!important;
}
html body .custom3dBanner .custom3dFeature:hover,
html body .custom3dBanner .custom3dFeature:active,
html body .custom3dBanner .custom3dAction:hover,
html body .custom3dBanner .custom3dAction:active{
  transform:none!important;
  box-shadow:none!important;
  filter:none!important;
}
@media(max-width:640px){
  html body .custom3dBanner{
    width:calc(100vw - 20px)!important;
    max-width:none!important;
    margin:12px 10px!important;
    border-radius:16px!important;
  }
  html body .custom3dBanner .custom3dFeatureButtons{
    right:2.5%!important;
    bottom:34%!important;
    width:95%!important;
    gap:1.4%!important;
  }
  html body .custom3dBanner .custom3dFeature{
    min-height:34px!important;
  }
  html body .custom3dBanner .custom3dAction{
    right:5.8%!important;
    left:auto!important;
    bottom:13.4%!important;
    width:33.5%!important;
    height:13%!important;
    min-height:0!important;
  }
}

/* Sharp SVG copies of the existing artwork icons; button geometry is unchanged. */
html body .custom3dBanner .custom3dSharpIcons{position:absolute;inset:0;z-index:6;pointer-events:none}
html body .custom3dBanner .custom3dSharpIcon{position:absolute;top:62.6%;width:2.8%;height:5.1%;display:grid;place-items:center;color:#daa665;line-height:0}
html body .custom3dBanner .custom3dSharpCube{left:63.7%;background:#281608}
html body .custom3dBanner .custom3dSharpLayers{left:77.2%;background:#25140a}
html body .custom3dBanner .custom3dSharpPencil{left:93.1%;background:#251208}
html body .custom3dBanner .custom3dSharpIcon svg{width:100%;height:100%;display:block;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}

/* Keep the supplied artwork complete; controls follow its coordinates. */
html body .custom3dBanner{aspect-ratio:1672/941!important;width:min(calc(100% - 32px),920px)!important;max-width:920px!important}
html body .custom3dBanner img{object-fit:contain!important;transform:none!important}