/* NINJA STRONG / FEATURED DROPS — scoped to .ns-drop; safe for Flatsome custom CSS */
.ns-drop {
  --ns-orange: #f77c0d;
  --ns-hero-bg: none;
  --ns-black: #111112;
  --ns-paper: #f4f3f0;
  --ns-border: rgba(255,255,255,.15);
  width: 100%;
  isolation: isolate;
  overflow: hidden;
  color: var(--ns-black);
  font-family: Arial, Helvetica, sans-serif;
}
.ns-drop, .ns-drop * { box-sizing: border-box; }
.ns-drop button, .ns-drop a { -webkit-tap-highlight-color: transparent; }
.ns-drop a:focus-visible, .ns-drop button:focus-visible { outline: 3px solid var(--ns-orange); outline-offset: 4px; }
.ns-drop__showcase { display: grid; grid-template-columns: minmax(0, 46%) minmax(0,54%); min-height: 610px; background-image: var(--ns-hero-bg); background-size:cover; background-position:center center; }
.ns-drop__copy {
  position: relative; display: flex; flex-direction: column; justify-content: center;
  align-items: flex-start; padding: clamp(40px,5.4vw,86px) clamp(25px,5vw,90px);
  overflow: hidden;
  background-color: rgba(244,243,240,.89);
  background-image: repeating-linear-gradient(35deg, transparent 0 40px, rgba(0,0,0,.018) 40px 41px);
}
.ns-drop__copy::before { content:""; position:absolute; inset:-45% -50%; pointer-events:none; opacity:.18;
  background: repeating-radial-gradient(ellipse at 78% 38%, transparent 0 28px, #999 29px, transparent 30px 48px);
  transform: rotate(-13deg); }
.ns-drop__copy > * { position:relative; z-index:1; }
.ns-drop__eyebrow, .ns-drop__micro, .ns-drop__promise, .ns-drop__badge,
.ns-drop__stage-foot, .ns-drop__vertical-copy, .ns-drop__selector-heading { font-weight:800; letter-spacing:.12em; }
.ns-drop__eyebrow { display:flex; gap:12px; align-items:center; font-size:11px; line-height:1.4; color:#a74c08; }
.ns-drop__eyebrow-line { width:23px; height:2px; background:var(--ns-orange); }
.ns-drop__headline { margin:20px 0 4px !important; display:flex; flex-direction:column; font-family: Impact,'Arial Narrow',Arial,sans-serif !important;
  color:#111 !important; font-size:clamp(63px,6.3vw,110px) !important; font-stretch:condensed; letter-spacing:-.035em !important;
  line-height:.93 !important; font-weight:900 !important; text-transform:uppercase; }
.ns-drop__headline > span:last-child { color:var(--ns-orange); }
.ns-drop__dot { color:#111; }
.ns-drop__promise { margin:10px 0 30px !important; color:#202020; font-size:clamp(10px, .93vw,14px); line-height:1.5; }
.ns-drop__product-copy { border-left:3px solid var(--ns-orange); padding-left:16px; max-width:455px; margin-bottom:25px; }
.ns-drop__badge { display:inline-block; background:#171717; padding:5px 8px; color:#fff; font-size:9px; }
.ns-drop__product-name { margin:10px 0 5px !important; font-weight:900; font-size:clamp(22px,2.1vw,32px); line-height:1.1; color:#141414; }
.ns-drop__description { margin:0 !important; max-width:410px; line-height:1.52; font-size:clamp(13px,1vw,16px); color:#484848; }
.ns-drop__cta { display:inline-flex; min-height:56px; align-items:center; justify-content:space-between; gap:28px; padding:0 23px;
  background:var(--ns-orange) !important; color:#101010 !important; clip-path:polygon(0 0,100% 0,96% 100%,0% 100%);
  text-decoration:none !important; font-weight:900; letter-spacing:.04em; font-size:15px; line-height:1; transition:filter .2s,transform .2s; }
.ns-drop__cta:hover { filter:brightness(1.09); transform:translateY(-2px); }
.ns-drop__cta > span[aria-hidden="true"] { font-size:23px; }
.ns-drop__micro { margin:22px 0 0 !important; font-size:10px; color:#777; }
.ns-drop__stage { position:relative; overflow:hidden; min-height:610px; background:#202022;
  background-image:radial-gradient(circle at 55% 42%, #3a393a 0, #1f1f20 48%, #111 100%); }
.ns-drop__stage::before { content:""; z-index:0; position:absolute; height:160%; width:18%; top:-30%; right:8%; transform:skewX(-27deg); background:var(--ns-orange); }
.ns-drop__stage::after { content:""; position:absolute; inset:0; pointer-events:none; opacity:.22;
  background-image:linear-gradient(90deg,transparent 98%,rgba(255,255,255,.10) 100%),linear-gradient(transparent 98%,rgba(255,255,255,.10) 100%); background-size:58px 58px; }
.ns-drop__topographic { position:absolute; width:100%; height:100%; opacity:.12; background:repeating-radial-gradient(ellipse at 55% 50%,transparent 0 30px,#b2b2b2 31px,transparent 32px 52px); }
.ns-drop__stage-number { font-family:Impact,'Arial Narrow',Arial,sans-serif; color:transparent; -webkit-text-stroke:2px rgba(255,255,255,.16);
  font-size:clamp(190px,29vw,470px); line-height:1; position:absolute; right:-1.2%; bottom:0; z-index:1; pointer-events:none; }
.ns-drop__vertical-copy { position:absolute; right:15px; top:25px; writing-mode:vertical-rl; font-size:10px; color:rgba(255,255,255,.62); z-index:3; }
.ns-drop__image-wrap { position:relative; display:flex; align-items:center; justify-content:center; z-index:2;
  width:100%; min-height:610px; padding:50px 54px 70px 40px; }
.ns-drop__hero-image { display:block; max-width:min(100%,700px); width:100%; height:auto; max-height:535px; object-fit:contain; filter:drop-shadow(12px 20px 14px rgba(0,0,0,.35)); transition:opacity .22s, transform .33s; }
.ns-drop__hero-image.is-changing { opacity:.45; transform:scale(.97); }
.ns-drop__stage-foot { position:absolute; bottom:30px; left:36px; right:28px; z-index:3; display:flex; align-items:center; gap:12px; color:#fff; font-size:11px; }
.ns-drop__stage-accent { display:block; width:38px; height:3px; background:var(--ns-orange); }
.ns-drop__crosshair { margin-left:auto; font-size:26px; line-height:1; color:var(--ns-orange); }
.ns-drop__mobile-action { display:none; }
.ns-drop__selector { background:#111; color:#fff; padding:0 clamp(18px,3vw,50px) 18px; }
.ns-drop__selector-heading { display:flex; justify-content:space-between; padding:14px 0 11px; font-size:10px; color:var(--ns-orange); }
.ns-drop__selector-hint { color:#909090; }
.ns-drop__buttons { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; }
.ns-drop__option { border:1px solid #454545 !important; border-top:3px solid transparent !important; border-radius:0 !important;
  padding:11px 13px !important; min-height:95px; display:flex; align-items:center; gap:12px; background:#1d1d1d !important;
  color:#fff !important; cursor:pointer; text-align:left; font-family:inherit; width:100%; transition:background .2s, border-color .2s; box-shadow:none !important; text-shadow:none !important; line-height:1.3; }
.ns-drop__option:hover { background:#292929 !important; }
.ns-drop__option[aria-pressed="true"] { border-top-color:var(--ns-orange) !important; border-right-color:#6d4a2e !important; background:#29221c !important; }
.ns-drop__option-image { display:block; width:65px; height:65px; object-fit:contain; flex:none; }
.ns-drop__option-count { color:var(--ns-orange); font-family:Impact,'Arial Narrow',Arial,sans-serif; font-size:26px; flex:none; }
.ns-drop__option-text { min-width:0; display:flex; flex-direction:column; gap:4px; }
.ns-drop__option-name { color:#fff; font-size:clamp(12px,1.05vw,16px); font-weight:900; text-transform:uppercase; line-height:1.18; }
.ns-drop__option-tag { color:#adadad; font-size:10px; letter-spacing:.03em; line-height:1.3; }
.ns-drop__fallback { color:#fff !important; }
.ns-drop__noscript { margin:10px 0 0; color:#fff; }
.ns-drop__noscript a { color:var(--ns-orange); }
@media (max-width:1100px) {
  .ns-drop__showcase { grid-template-columns:48% 52%; min-height:530px; }
  .ns-drop__copy { padding:38px 28px; }
  .ns-drop__headline { font-size:clamp(54px,6.7vw,75px) !important; }
  .ns-drop__stage, .ns-drop__image-wrap { min-height:530px; }
  .ns-drop__image-wrap { padding:42px 24px 58px; }
  .ns-drop__option { gap:8px; padding:9px !important; }
  .ns-drop__option-image { width:46px; height:46px; }
}
@media (max-width:767px) {
  .ns-drop__showcase { display:flex; flex-direction:column; min-height:0; background-image:none; }
  .ns-drop__copy { background-color: #f4f3f0; }
  .ns-drop__stage { background-image:linear-gradient(rgba(15,15,16,.28),rgba(15,15,16,.46)),var(--ns-hero-bg); background-position:right center; background-size:cover; }
  .ns-drop__copy { padding:27px 21px 18px; }
  .ns-drop__headline { font-size:clamp(58px,14vw,91px) !important; margin:13px 0 0 !important; }
  .ns-drop__promise { margin:9px 0 0 !important; font-size:10px; }
  .ns-drop__product-copy, .ns-drop__copy .ns-drop__cta, .ns-drop__micro { display:none !important; }
  .ns-drop__stage { min-height:0; padding:0; }
  .ns-drop__image-wrap { min-height:0; height:clamp(290px,86vw,470px); padding:15px 30px 54px; }
  .ns-drop__hero-image { max-height:100%; }
  .ns-drop__stage-number { font-size:72vw; }
  .ns-drop__vertical-copy { top:12px; right:7px; font-size:8px; }
  .ns-drop__stage-foot { left:21px; right:15px; bottom:13px; font-size:9px; }
  .ns-drop__mobile-action { display:flex; flex-direction:column; align-items:stretch; gap:5px; padding:12px 21px 18px; background:#202022; color:#fff; }
  .ns-drop__mobile-name { margin:0 !important; color:#fff; font-size:25px; font-weight:900; line-height:1.14; }
  .ns-drop__mobile-tagline { margin:0 0 12px !important; color:#c0c0c0; font-size:10px; letter-spacing:.075em; font-weight:800; }
  .ns-drop__cta--mobile { width:100%; clip-path:none; }
  .ns-drop__selector { padding:0 14px 17px; }
  .ns-drop__selector-heading { padding:14px 0 10px; }
  .ns-drop__selector-hint { font-size:9px; }
  .ns-drop__buttons { display:flex; overflow-x:auto; scroll-snap-type:x mandatory; gap:8px; padding:0 1px 5px; scrollbar-width:thin; }
  .ns-drop__option { flex:0 0 min(76vw,280px); min-height:80px; scroll-snap-align:start; }
  .ns-drop__option-name { font-size:14px; }
}
@media (prefers-reduced-motion:reduce) {
  .ns-drop__hero-image, .ns-drop__option, .ns-drop__cta { transition:none !important; }
}

/* When a WordPress background is supplied, reveal it across the showcase. */
.ns-drop[style*="--ns-hero-bg"] .ns-drop__stage { background-color:rgba(15,15,16,.08); background-image:linear-gradient(90deg,rgba(0,0,0,.05),rgba(0,0,0,.2)); }
@media (max-width:767px) { .ns-drop[style*="--ns-hero-bg"] .ns-drop__stage { background-image:linear-gradient(rgba(12,12,12,.35),rgba(12,12,12,.55)),var(--ns-hero-bg); background-position:right center; background-size:cover; } }
