diff --git a/blocks/commerce-cart/commerce-cart.js b/blocks/commerce-cart/commerce-cart.js
index 9c6fc6792a..66ae0aaad8 100644
--- a/blocks/commerce-cart/commerce-cart.js
+++ b/blocks/commerce-cart/commerce-cart.js
@@ -1,3 +1,4 @@
+/* eslint-disable import/no-unresolved */
 /* eslint-disable import/no-extraneous-dependencies */
 
 // Drop-in Tools
diff --git a/blocks/commerce-order-confirmation/commerce-order-confirmation.js b/blocks/commerce-order-confirmation/commerce-order-confirmation.js
index baae8b8b2b..57e6cc792d 100644
--- a/blocks/commerce-order-confirmation/commerce-order-confirmation.js
+++ b/blocks/commerce-order-confirmation/commerce-order-confirmation.js
@@ -17,6 +17,7 @@ export default async function decorate(block) {
 
   orderConfirmationRenderer.render(OrderConfirmation, {
     orderRef,
+    // eslint-disable-next-line no-console
     onContinueShopping: () => console.log('continue shopping'),
   })(block);
 }
diff --git a/blocks/header/header.css b/blocks/header/header.css
index 2d992e3d7c..98b2947d9a 100644
--- a/blocks/header/header.css
+++ b/blocks/header/header.css
@@ -331,7 +331,7 @@ header .minicart-panel {
   display: none;
 }
 
-header .minicart-panel--visible {
+header .minicart-panel-visible {
   display: block;
 }
 
diff --git a/blocks/header/header.js b/blocks/header/header.js
index cbc3ed0e44..3778456bd5 100644
--- a/blocks/header/header.js
+++ b/blocks/header/header.js
@@ -1,3 +1,5 @@
+/* eslint-disable import/no-unresolved */
+
 import { events } from '@dropins/elsie/event-bus.js';
 import { getMetadata } from '../../scripts/aem.js';
 import { loadFragment } from '../fragment/fragment.js';
@@ -140,12 +142,12 @@ export default async function decorate(block) {
 
   navTools.append(minicartButton);
 
-  // TODO: Toggle Mini Cart - Mini Cart Drop-in is not yet available, go to Cart page instead.
+  // TODO: Toggle Mini Cart; Mini Cart Drop-in is not yet available, go to Cart page instead.
   // const minicartPanel = navTools.querySelector('.minicart-panel');
   // let cartVisible = false;
   navTools.querySelector('.nav-cart-button').addEventListener('click', async () => {
   //   cartVisible = !cartVisible;
-  //   minicartPanel.classList.toggle('minicart-panel--visible', cartVisible);
+  //   minicartPanel.classList.toggle('minicart-panel-visible', cartVisible);
     window.location.href = '/cart';
   });
 
diff --git a/blocks/product-details-custom/Icon.js b/blocks/product-details-custom/Icon.js
deleted file mode 100644
index 4506b6a18c..0000000000
--- a/blocks/product-details-custom/Icon.js
+++ /dev/null
@@ -1,43 +0,0 @@
-import {
-  h, Component, Fragment,
-  // eslint-disable-next-line import/no-unresolved,import/extensions
-} from '../../scripts/preact.js';
-// eslint-disable-next-line import/no-unresolved,import/extensions
-import htm from '../../scripts/htm.js';
-
-const html = htm.bind(h);
-
-export default class Icon extends Component {
-  constructor(props) {
-    super();
-
-    this.iconName = props.name;
-  }
-
-  async componentDidMount() {
-    const resp = await fetch(`${window.hlx.codeBasePath}/icons/${this.iconName}.svg`);
-    if (resp.ok) {
-      const iconHTML = await resp.text();
-      this.setState({ iconHTML });
-    }
-  }
-
-  render() {
-    if (!this.state.iconHTML) {
-      return null;
-    }
-
-    if (this.state.iconHTML.match(/<style/i)) {
-      const src = `data:image/svg+xml,${encodeURIComponent(this.state.iconHTML)}`;
-      return html`
-        <span class=${`icon icon${this.iconName}`}><img src=${src} /></span>
-      `;
-    }
-
-    return html`<${Fragment}>
-        <span class=${`icon icon${this.iconName}`} dangerouslySetInnerHTML=${{ __html: this.state.iconHTML }}>
-        </span>
-    </Fragment>
-    `;
-  }
-}
diff --git a/blocks/product-details-custom/ProductDetailsCarousel.js b/blocks/product-details-custom/ProductDetailsCarousel.js
deleted file mode 100644
index 22414fe7a1..0000000000
--- a/blocks/product-details-custom/ProductDetailsCarousel.js
+++ /dev/null
@@ -1,166 +0,0 @@
-import {
-  h, Component, Fragment,
-} from '../../scripts/preact.js';
-import htm from '../../scripts/htm.js';
-import Icon from './Icon.js';
-import { getSkuFromUrl } from '../../scripts/commerce.js';
-
-const html = htm.bind(h);
-
-function OptimizedSources({
-  src,
-  sizes,
-  width,
-  height,
-  loading = 'lazy',
-}) {
-  const createUrlForWidth = (url, w, useWebply = true) => {
-    const newUrl = new URL(url);
-    if (useWebply) {
-      newUrl.searchParams.set('format', 'webply');
-      newUrl.searchParams.set('optimize', 'medium');
-    } else {
-      newUrl.searchParams.delete('format');
-    }
-    newUrl.searchParams.set('width', w);
-    newUrl.searchParams.delete('quality');
-    newUrl.searchParams.delete('dpr');
-    newUrl.searchParams.delete('bg-color');
-    return newUrl.toString();
-  };
-
-  const createUrlForDpi = (url, w, useWebply = true) => `${createUrlForWidth(url, w, useWebply)} 1x, ${createUrlForWidth(url, w * 2, useWebply)} 2x, ${createUrlForWidth(url, w * 3, useWebply)} 3x`;
-
-  return html`<${Fragment}>
-    ${sizes.map((size) => {
-    const webpUrl = createUrlForDpi(src, size.width || width, true);
-    const jpgUrl = createUrlForDpi(src, size.width || width, false);
-    const mediaAttribute = {};
-    if (size.media) {
-      mediaAttribute.media = `(max-width: ${size.media}px)`;
-    }
-    const jpgTag = html`<source ...${mediaAttribute} srcset=${jpgUrl} />`;
-    const webpTag = html`<source ...${mediaAttribute} srcset=${webpUrl}/>`;
-    return html`${webpTag}\n${jpgTag}`;
-  })}
-    <img height=${height} width=${width} src=${createUrlForWidth(src, width, false)} loading=${loading} />
-  <//>`;
-}
-
-export default class Carousel extends Component {
-  constructor(props) {
-    super(props);
-    this.state = {
-      slide: 0,
-      thumbnailSlide: 0,
-    };
-  }
-
-  getImages() {
-    const productImages = this.props.product?.images.map((i) => {
-      const url = new URL(i.url);
-      url.protocol = window.location.protocol;
-      return url.toString();
-    });
-
-    if (productImages) {
-      this.thumbnailImages = productImages.map((image) => `${image}?quality=100&bg-color=255,255,255`);
-      this.images = productImages.map((image) => `${image}?width=700&quality=100&bg-color=255,255,255`);
-    }
-  }
-
-  static negativeModulo(i, mod) {
-    return ((i % mod) + mod) % mod;
-  }
-
-  updateThumbnailSlide(getNextIndex) {
-    const nextIndex = getNextIndex(this.state.thumbnailSlide);
-    const limitedIndex = Math.min(Math.max(nextIndex, 0), this.thumbnailImages.length - 1);
-    this.setState({ thumbnailSlide: limitedIndex });
-  }
-
-  updateSlide(getNextIndex) {
-    const nextIndex = getNextIndex(this.state.slide);
-    const correctedNextIndex = Carousel.negativeModulo(nextIndex, this.images.length);
-    this.setState({
-      slide: correctedNextIndex,
-      thumbnailSlide: correctedNextIndex,
-    });
-  }
-
-  renderLabel() {
-    const amasty = this.props.product?.amasty;
-    if (!amasty) {
-      return null;
-    }
-    return html`<div class="amasty-wrapper">
-      <div class=${amasty.position} style=${amasty.style} dangerouslySetInnerHTML=${{ __html: amasty.txt }} />
-    </div>`;
-  }
-
-  static getDerivedStateFromProps(nextProps, state) {
-    if (state.slide >= nextProps.product?.productImages?.length ?? 0) {
-      return {
-        ...state,
-        slide: 0,
-        thumbnailSlide: 0,
-      };
-    }
-    return null;
-  }
-
-  render() {
-    this.getImages();
-
-    if (!this.images || !this.thumbnailImages) {
-      this.images = [`${window.origin}/${this.props.productImageFolder}/${getSkuFromUrl().toLowerCase()}.jpg`];
-      this.thumbnailImages = [];
-    }
-
-    return html`
-        <div class="product-detail-carousel">
-            <div class="carousel-thumbnails-wrapper">
-                <div class="thumbnail-controls">
-                    <button name="thumbnail-prev" disabled=${this.props.shimmer} onClick=${() => this.updateThumbnailSlide((index) => index - 1)}><${Icon} name="caret-up-fill" /></button>
-                    <button name="thumbnail-next" disabled=${this.props.shimmer} onClick=${() => this.updateThumbnailSlide((index) => index + 1)}><${Icon} name="caret-down-fill" /></button>
-                </div>
-                <ul class="carousel-thumbnails" style="transform: translateY(-${(this.state.thumbnailSlide === 0 ? 0 : 1) * -252.7 + (this.state.thumbnailSlide) * 322.6}px)">
-                    ${!this.props.loading && this.thumbnailImages.map((image, i) => html`
-                          <li key=${image} onClick=${() => this.setState({ slide: i, thumbnailSlide: i })}>
-                              <picture>
-                                  <${OptimizedSources} src=${image} height="313" width="247" loading=${'lazy'} sizes=${[]} />
-                              </picture>
-                          </li>`)}
-                    ${this.props.loading && [1, 2, 3].map(() => html`
-                        <li><picture class="shimmer"><img height="313" width="247" /></picture></li>
-                    `)}
-                </ul>
-            </div>
-            <div class="carousel-stage-wrapper">
-                ${this.renderLabel()}
-                ${!this.props.loading && html`
-                    <div class="main-controls">
-                        <button name="stage-prev" onClick=${() => this.updateSlide((index) => index - 1)}><${Icon} name="caret-left-fill" /></button>
-                        <button name="stage-next" onClick=${() => this.updateSlide((index) => index + 1)}><${Icon} name="caret-right-fill" /></button>
-                    </div>
-                `}
-                <ul
-                        class="carousel-stage"
-                        style="transform: translateX(-${this.state.slide * 100}%)"
-                >
-                    ${!this.props.loading && this.images.map((image, i) => html`
-                        <li key=${image} active=${i === this.state.slide ? 'true' : 'false'}>
-                            <picture>
-                                <${OptimizedSources} src=${image} width="700" height="888" loading=${i === 0 ? 'eager' : 'lazy'} sizes=${[{ media: 450, width: 450 }, { width: 700 }]} />
-                            </picture>
-                        </li>
-                    `)}
-                    ${this.props.loading && html`
-                        <li><picture class="shimmer"><img width="700" height="888" /></picture></li>
-                    `}
-                </ul>
-            </div>
-        </div>
-    `;
-  }
-}
diff --git a/blocks/product-details-custom/ProductDetailsShimmer.js b/blocks/product-details-custom/ProductDetailsShimmer.js
deleted file mode 100644
index f6b5e73cfa..0000000000
--- a/blocks/product-details-custom/ProductDetailsShimmer.js
+++ /dev/null
@@ -1,17 +0,0 @@
-import {
-  h, Fragment,
-} from '../../scripts/preact.js';
-import htm from '../../scripts/htm.js';
-import Sidebar from './ProductDetailsSidebar.js';
-import Carousel from './ProductDetailsCarousel.js';
-
-const html = htm.bind(h);
-
-export default function ProductDetailsShimmer() {
-  return html`<${Fragment}>
-      <div class="title-shimmer shimmer desktop-hidden"></div>
-      <${Carousel} loading />
-      <${Sidebar} loading />
-      <div class="detail-shimmer shimmer mobile-hidden"></div>
-  <//>`;
-}
diff --git a/blocks/product-details-custom/ProductDetailsSidebar.js b/blocks/product-details-custom/ProductDetailsSidebar.js
deleted file mode 100644
index fe934ddaf4..0000000000
--- a/blocks/product-details-custom/ProductDetailsSidebar.js
+++ /dev/null
@@ -1,131 +0,0 @@
-import { Component, Fragment, h } from '../../scripts/preact.js';
-import htm from '../../scripts/htm.js';
-import Icon from './Icon.js';
-import { renderPrice } from '../../scripts/commerce.js';
-
-const html = htm.bind(h);
-
-function QuantitySelector({ onChange }) {
-  const options = Array.from({ length: 15 }, (_, index) => index + 1);
-  return html`<div class="sidebar-section quantity-select">
-      <h4 class="selection">Quantity</h4>
-      <select onchange=${(event) => onChange?.(Number.parseInt(event.target.value, 10))}>
-        ${options.map((value) => html`<option key=${value} value=${value}>${value}</option>`)}
-      </select>
-    </div>`;
-}
-
-function NameAndPriceShimmer() {
-  return html`
-      <div class="desktop-hidden title-shimmer">
-          <div class="heading-shimmer shimmer"></div>
-          <div class="price-shimmer shimmer"></div>
-      </div>
-  `;
-}
-
-function NameAndPrice({ shimmer, product }) {
-  const {
-    priceRange, price, name, sku,
-  } = product;
-
-  if (shimmer || !(priceRange || price)) {
-    return html`<${NameAndPriceShimmer} />`;
-  }
-
-  const priceFormatter = new Intl.NumberFormat('en-US', {
-    style: 'currency',
-    currency: 'USD',
-  });
-
-  const priceHtml = renderPrice(product, priceFormatter.format, html, Fragment);
-  return html`<${Fragment}>
-    <h1 dangerouslySetInnerHTML=${{ __html: name }}></h1>
-    <div class="price" >${priceHtml}</div>
-    <div class="style-id">SKU: ${sku}</div>
-  <//>`;
-}
-
-function Options({ product, updateSelection, selection }) {
-  const options = product?.options;
-  if (!options) {
-    return null;
-  }
-
-  const renderSwatches = (option) => {
-    const { values } = option;
-    const selectedValue = selection?.[option.id]?.id;
-
-    return values.map((value) => {
-      const attr = {};
-      if (value.type === 'COLOR_HEX') {
-        attr.style = {
-          backgroundColor: value.value,
-        };
-      }
-
-      return html`<li key=${value.id} class="swatch">
-          <button
-            ...${attr}
-            aria-selected=${value.id === selectedValue}
-            disabled=${!value.inStock}
-            onClick=${() => updateSelection({ [option.id]: value })}>${value.title}</button>
-        </li>`;
-    });
-  };
-
-  return options.map((option) => {
-    const selectedTitle = selection?.[option.id]?.title;
-    return html`<div class=${`sidebar-section ${option.id === 'color' ? 'color-selector' : 'sizes-selector'}`}>
-      <h4>${selectedTitle ? `${option.title}: ${selectedTitle}` : option.title}</h4>
-      <ul class="swatches swatches-regular">${renderSwatches(option)}</ul>
-    </div>`;
-  });
-}
-
-function CartSection({ onAddToCart, canAddToCart, onAddToWishlist }) {
-  return html`<div class="sidebar-section cart">
-    <button disabled=${!canAddToCart()} onclick=${onAddToCart} class="button primary cart-button">Add to Bag</button>
-    <button onclick=${onAddToWishlist} class="button secondary secondary-action"><${Icon} name="heart" />Add to Favorites</button>
-  </div>`;
-}
-
-export default class ProductDetailsSidebar extends Component {
-  constructor(props) {
-    super(props);
-
-    this.updateSelection = this.updateSelection.bind(this);
-    this.canAddToCart = this.canAddToCart.bind(this);
-  }
-
-  updateSelection(fragment) {
-    this.props.onSelectionChanged?.(fragment);
-  }
-
-  canAddToCart() {
-    return Object.keys(this.props.selection).length === (this.props.product.options?.length || 0);
-  }
-
-  render() {
-    const { product, loading, selection } = this.props;
-    if (loading) {
-      return html`<div class="sidebar shimmer"></div>`;
-    }
-
-    return html`<${Fragment}>
-      <div class="product-title desktop-hidden">
-        <${NameAndPrice} shimmer=${this.props.shimmer} product=${product} />
-      </div>
-      <div class=${`sidebar ${this.props.shimmer ? 'shimmer' : ''}`}>
-          ${this.props.shimmer || html`
-          <div class="product-title sidebar-section mobile-hidden">
-            <${NameAndPrice} product=${product} />
-          </div>
-          <${Options} product=${product} updateSelection=${this.updateSelection} selection=${selection} />
-          <${QuantitySelector} onChange=${this.props.onQuantityChanged} />
-          <${CartSection} onAddToWishlist=${this.props.onAddToWishlist} onAddToCart=${this.props.onAddToCart} canAddToCart=${this.canAddToCart} />
-        `}
-      </div>
-    <//>`;
-  }
-}
diff --git a/blocks/product-details-custom/product-details.css b/blocks/product-details-custom/product-details.css
deleted file mode 100644
index aea4bbb74a..0000000000
--- a/blocks/product-details-custom/product-details.css
+++ /dev/null
@@ -1,562 +0,0 @@
-/* stylelint-disable comment-empty-line-before */
-/* stylelint-disable no-descending-specificity */
-/* stylelint-disable declaration-block-no-redundant-longhand-properties */
-.product-details {
-  display: grid !important;
-  grid-template: 'product-title' 'carousel';
-}
-
-.product-details>div.full-height {
-  height: 100vh;
-}
-
-.product-details>*:not(.product-detail-carousel) {
-  padding: 8px 25px 25px;
-}
-
-.product-details .product-detail-description {
-  font: var(--type-body-2-default-font);
-  letter-spacing: var(--type-body-2-default-letter-spacing);
-}
-
-.product-details .product-detail-description h3 {
-  margin: 0 0 16px;
-}
-
-.product-details .product-detail-description ul {
-  margin: 1.6rem 0;
-  padding: 0 0 0 38px;
-}
-
-.product-details .product-detail-description ul li {
-  margin: 0 0 16px;
-}
-
-.product-details .product-title h1 {
-  font: var(--type-headline-1-font);
-  letter-spacing: var(--type-headline-1-letter-spacing);
-  margin: 0 0 16px;
-}
-
-.product-details .sidebar-section {
-  border-bottom: 1px solid #c2c2c2;
-  padding: 0 0 2rem;
-  margin: 0 0 2rem;
-}
-
-.product-details .sidebar-section:last-child {
-  margin: 0;
-}
-
-.product-details .sidebar-section .social-links {
-  margin: 2rem 0 0;
-  display: grid;
-  justify-content: center;
-  text-align: center;
-  gap:16px 0;
-  grid-template: 'favorites favorites' 'email help' /1fr 1fr;
-}
-
-.product-details .sidebar-section .social-links .favorites {
-  grid-area: favorites;
-}
-
-.product-details .sidebar-section .social-links .email {
-  grid-area: email;
-}
-
-.product-details .sidebar-section .social-links .help {
-  grid-area: help;
-}
-
-.product-details .product-title .price {
-  display: flex;
-  flex-direction: column;
-}
-
-.product-details .sidebar-section h4 {
-  margin: 0;
-}
-
-.product-details .sidebar-section.quantity-select {
-  display: flex;
-  gap: 25px;
-  align-items: center;
-}
-
-.product-details .sidebar-section.cart button {
-  max-width: 100%;
-}
-
-.product-details .product-title .price .price-regular {
-  font: var(--type-headline-2-default-font);
-  letter-spacing: var(--type-headline-2-default-letter-spacing);
-  color: var(--color-neutral-600);
-  text-decoration: line-through;
-  order: -1;
-}
-
-.product-details .product-title .price .price-range {
-  display: flex;
-  align-items: baseline;
-  flex-wrap: wrap;
-}
-
-.product-details .product-title .price .price-range .price-regular {
-  flex: 0 1 100%;
-  order: -1;
-}
-
-.product-details .product-title .price .price-range .price-from {
-  font: var(--type-headline-2-strong-font);
-  letter-spacing: var(--type-headline-2-strong-letter-spacing);
-}
-
-.product-details .product-title .price .price-range .price-from:first-child::after {
-  content: "-";
-  padding: 0 8px;
-}
-
-.product-details .product-title .price .price-final {
-  font: var(--type-headline-2-strong-font);
-  letter-spacing: var(--type-headline-2-strong-letter-spacing);
-}
-
-.product-details .product-title .style-id {
-  font: var(--type-headline-2-default-font);
-  letter-spacing: var(--type-headline-2-default-letter-spacing);
-  text-align: right;
-}
-
-.product-details .product-title.desktop-hidden {
-  grid-area: product-title;
-  display: grid;
-  grid-template: 'title title' 'price style';
-  align-items: flex-end;
-}
-
-.product-details .product-title.desktop-hidden h1 {
-  grid-area: title;
-}
-
-.product-details .product-title.desktop-hidden .price {
-  grid-area: price;
-}
-
-.product-details .product-title.desktop-hidden .style-id {
-  grid-area: style;
-}
-
-.product-details .mobile-hidden {
-  display: none;
-}
-
-.product-details .swatches .swatch-spacer {
-  width: 64px;
-}
-
-.product-details .sidebar .sidebar-section.color-selector {
-  padding-bottom: 80px;
-}
-
-.product-details .sidebar .sidebar-section.color-selector button {
-  font-size: 0;
-}
-
-.product-details .selected-color {
-  text-overflow: ellipsis;
-  overflow: hidden;
-  white-space: nowrap;
-  max-width: 34rem;
-}
-
-.product-details .swatches {
-  will-change: height;
-  list-style: none;
-  padding: 0;
-  display: flex;
-  gap: 8px;
-  flex-wrap: wrap;
-  margin: 12px 0 0;
-}
-
-.product-details .swatches li {
-  display: flex;
-}
-
-.product-details .swatch>button {
-  width: 36px;
-  height: 36px;
-  background-size: initial;
-  border-radius: var(--shape-border-radius-3);
-  border: var(--shape-border-width-3) solid var(--color-neutral-50);
-  display: inline;
-  margin: 0;
-  padding: 0;
-  outline: var(--shape-border-width-1) solid var(--color-neutral-300);
-}
-
-.product-details .swatch>button[aria-selected="true"] {
-  outline: var(--shape-border-width-2) solid var(--color-neutral-900);
-}
-
-.product-details .swatch>button[disabled] {
-  cursor: not-allowed;
-  color: var(--color-neutral-500);
-}
-
-.product-details .cart .secondary-action {
-  margin: 1.6rem auto;
-  display: flex;
-  align-items: center;
-  gap: 12px;
-  justify-content: center;
-}
-
-.product-details .cart .secondary-action svg {
-  width: 22px;
-  height: 22px;
-  fill: currentcolor;
-  stroke: currentcolor;
-}
-
-.product-details .cart .cart-button {
-  margin: 1.6rem auto;
-  display: block;
-}
-
-.product-details .product-detail-carousel {
-  position: relative;
-  overflow: hidden;
-}
-
-.product-details .product-detail-carousel .carousel-stage-wrapper {
-  display: grid;
-  overflow: hidden;
-  min-width: 100%;
-}
-
-.product-details picture.shimmer img {
-  visibility: hidden;
-}
-
-.product-details picture.shimmer {
-  display: block;
-  max-width: 700px;
-  margin: auto;
-}
-
-.product-details .product-detail-carousel .carousel-stage-wrapper img {
-  aspect-ratio: 800 / 1014;
-  width: 100vw;
-  height: auto;
-  object-fit: contain;
-  display: block;
-  margin: auto;
-}
-
-.product-details .product-detail-carousel ul {
-  list-style: none;
-  padding: 0;
-  margin: 0;
-}
-
-.product-details .sizes-selector h4 {
-  display: inline-block;
-  margin: 0;
-}
-
-.product-details .sizes-selector span {
-  float: right;
-  margin-top: 1.4rem;
-}
-
-.product-details .sizes-selector ul {
-  flex-wrap: wrap;
-  display: flex;
-  list-style: none;
-  padding: 0;
-  gap: 12px;
-  margin: 32px 0 16px;
-}
-
-.product-details .sizes-selector ul li button {
-  background: none;
-  margin: 0;
-  padding: 10px;
-  color: var(--color-brand-700);
-  border-radius: 4px;
-  border: var(--shape-border-width-3) solid var(--color-neutral-500);
-  display: flex;
-  justify-content: center;
-  align-items: center;
-  cursor: pointer;
-  width: auto;
-  height: auto;
-}
-
-.product-details .sizes-selector ul li button[aria-selected="true"],
-.product-details .sizes-selector ul li button:hover,
-.product-details .sizes-selector ul li button:focus {
-  border-color: var(--color-brand-500);
-  background-color: var(--color-neutral-50);
-  text-decoration: none;
-}
-
-.product-details .sizes-selector ul li button[disabled] {
-  cursor: not-allowed;
-  color: var(--color-neutral-500);
-}
-
-.product-details .product-detail-carousel .carousel-thumbnails-wrapper {
-  display: none;
-}
-
-.product-details .product-detail-carousel .carousel-stage {
-  grid-area: 1 / 1 / 1 / 1;
-  display: flex;
-  transition: transform 200ms;
-  min-width: 100%;
-}
-
-.product-details .product-detail-carousel .carousel-stage li {
-  width: 100%;
-  flex-shrink: 0;
-}
-
-.product-details .sidebar .variant-selection span:nth-child(2) {
-  text-transform: none;
-}
-
-.product-details .product-detail-carousel .main-controls {
-  grid-area: 1 / 1 / 1 / 1;
-  z-index: 2;
-  position: absolute;
-  right: 40px;
-  left: 40px;
-  top: 0;
-  bottom: 0;
-  display: flex;
-  justify-content: space-between;
-  align-items: center;
-}
-
-.product-details .product-detail-carousel .carousel-thumbnails>li {
-  cursor: pointer;
-}
-
-.product-details .product-detail-carousel div:is(.main-controls, .thumbnail-controls) button {
-  color: black;
-  padding: 0;
-  margin: 0;
-  background: white;
-  width: 30px;
-  height: 30px;
-  border-radius: 15px;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-}
-
-.product-details .title-shimmer .heading-shimmer {
-  height: 19.8px;
-  width: 100%;
-  max-width: 500px;
-  margin-top: 18px;
-  margin-bottom: 9px;
-}
-
-.product-details .title-shimmer .price-shimmer {
-  height: 72px;
-  width: 25%;
-}
-
-.product-details .title-shimmer {
-  height: calc(165px - 2 * 18px);
-  width: calc(100% - 32px);
-  box-sizing: border-box;
-  display: block;
-  margin: 18px 16px;
-}
-
-.product-details .detail-shimmer {
-  height: 500px;
-  width: 60%;
-  margin-top: 28px;
-}
-
-.product-details .shimmer {
-  background-color: #f8f8f8;
-}
-
-.product-details .sidebar.shimmer {
-  min-height: 800px;
-  margin-top: 34px;
-  margin-left: 32px;
-  margin-right: 32px;
-}
-
-@keyframes loading {
-  to {
-    background-position-x: -20%;
-  }
-}
-
-@media (width >= 600px) {
-  .product-details>*:not(.product-detail-carousel) {
-    padding: 0 32px;
-  }
-
-  .product-details .product-detail-carousel .carousel-stage-wrapper img {
-    aspect-ratio: 700 / 888;
-    width: auto;
-  }
-
-  .product-details .product-detail-carousel {
-    margin: 25px 0;
-  }
-}
-
-@media (width >= 1024px) {
-  .product-details .product-title .style-id {
-    text-align: right;
-    position: absolute;
-    right: 25px;
-    bottom: 25px;
-  }
-
-  .product-details .sidebar.shimmer {
-    margin: 0;
-    border: none;
-  }
-
-  .product-details {
-    display: grid;
-    grid-template-columns: auto 30%;
-    grid-auto-flow: column;
-  }
-
-  .product-details>*:not(.product-detail-carousel) {
-    padding: 0;
-  }
-
-  .product-details .product-detail-carousel .carousel-stage>li {
-    display: flex;
-    justify-content: center;
-  }
-
-  .product-details .product-detail-carousel .main-controls {
-    left: 80px;
-    right: 80px;
-  }
-
-  .product-details .mobile-hidden {
-    display: block;
-  }
-
-  .product-details .product-title.desktop-hidden {
-    display: none;
-  }
-
-  .product-details .sidebar {
-    grid-column: 2;
-    grid-row: 1 / 3;
-    border: 1px solid #c2c2c2;
-    height: max-content;
-  }
-
-  .product-details .sidebar .sidebar-section {
-    padding: 25px;
-    margin: 0;
-    position: relative;
-  }
-
-  .product-details .product-detail-description {
-    grid-column: 1;
-    padding-left: 10px;
-  }
-
-  .product-details .product-detail-carousel {
-    display: flex;
-    grid-column: 1;
-  }
-
-  .product-details .sidebar h4 {
-    margin-bottom: 0;
-  }
-
-  .product-details .sizes-selector span {
-    margin: 0;
-  }
-}
-
-/* Full desktop product page */
-@media (width >= 1280px) {
-  :root {
-    --carousel-control-height: 30px;
-    --pdp-max-width: 1400px;
-  }
-
-  .product-details-wrapper {
-    max-width: var(--pdp-max-width) !important;
-  }
-
-  .product-details .product-detail-carousel {
-    overflow: hidden;
-    height: 888px;
-  }
-
-  .product-details .product-detail-carousel .carousel-stage-wrapper {
-    margin-left: 27%;
-    position: relative;
-    height: 888px;
-    min-width: unset;
-  }
-
-  .product-details .product-detail-carousel .carousel-thumbnails {
-    display: flex;
-    flex-direction: column;
-    transition: transform 200ms;
-    gap: 20px;
-  }
-
-  .product-details .product-detail-carousel .thumbnail-controls {
-    position: absolute;
-    z-index: 3;
-    left: 0;
-    right: 0;
-    bottom: 0;
-    top: 0;
-    display: flex;
-    justify-content: space-between;
-    flex-direction: column;
-    pointer-events: none;
-  }
-
-  .product-details .product-detail-carousel div.thumbnail-controls button {
-    width: 100%;
-    border-radius: 0;
-    height: var(--carousel-control-height);
-    pointer-events: all;
-  }
-
-  .product-details .product-detail-carousel .carousel-thumbnails-wrapper {
-    display: initial;
-    padding-top: var(--carousel-control-height);
-    position: absolute;
-    left: 0;
-    z-index: 1;
-    background: white;
-    height: calc(100% - var(--carousel-control-height));
-  }
-
-  .product-details .product-detail-carousel .carousel-thumbnails img {
-    aspect-ratio: 247/313;
-    width: 247px;
-    height: 313px;
-  }
-
-  .product-details .product-detail-carousel .carousel-thumbnails picture {
-    display: block;
-  }
-}
diff --git a/blocks/product-details-custom/product-details.js b/blocks/product-details-custom/product-details.js
deleted file mode 100644
index a761343e97..0000000000
--- a/blocks/product-details-custom/product-details.js
+++ /dev/null
@@ -1,194 +0,0 @@
-/* eslint-disable class-methods-use-this */
-import {
-  Component, Fragment, h, render,
-} from '../../scripts/preact.js';
-
-import htm from '../../scripts/htm.js';
-import Carousel from './ProductDetailsCarousel.js';
-import Sidebar from './ProductDetailsSidebar.js';
-import ProductDetailsShimmer from './ProductDetailsShimmer.js';
-import {
-  getProduct,
-  getSkuFromUrl,
-  performCatalogServiceQuery,
-  refineProductQuery,
-  setJsonLd,
-} from '../../scripts/commerce.js';
-
-const html = htm.bind(h);
-
-export function errorGettingProduct(code = 404) {
-  fetch(`/${code}.html`).then((response) => {
-    if (response.ok) {
-      return response.text();
-    }
-    throw new Error(`Error getting ${code} page`);
-  }).then((htmlText) => {
-    const parser = new DOMParser();
-    const doc = parser.parseFromString(htmlText, 'text/html');
-    document.body.innerHTML = doc.body.innerHTML;
-    document.head.innerHTML = doc.head.innerHTML;
-  });
-  document.body.innerHTML = '';
-}
-
-async function getVariantDetails(variantIds, sku) {
-  const result = await performCatalogServiceQuery(
-    refineProductQuery,
-    {
-      sku: sku.toUpperCase(),
-      variantIds,
-    },
-  );
-  return {
-    images: result.refineProduct?.images,
-    price: result.refineProduct?.price,
-  };
-}
-
-async function setJsonLdProduct(product) {
-  const {
-    name, inStock, description, sku, urlKey, price, priceRange, images, attributes,
-  } = product;
-  const amount = priceRange?.minimum?.final?.amount || price?.final?.amount;
-  const brand = attributes.find((attr) => attr.name === 'brand');
-
-  setJsonLd({
-    '@context': 'http://schema.org',
-    '@type': 'Product',
-    name,
-    description,
-    image: images[0]?.url,
-    offers: [{
-      '@type': 'http://schema.org/Offer',
-      price: amount?.value,
-      priceCurrency: amount?.currency,
-      availability: inStock ? 'http://schema.org/InStock' : 'http://schema.org/OutOfStock',
-    }],
-    productID: sku,
-    brand: {
-      '@type': 'Brand',
-      name: brand?.value,
-    },
-    url: new URL(`/products/${urlKey}/${sku.toLowerCase()}`, window.location),
-    sku,
-    '@id': new URL(`/products/${urlKey}/${sku.toLowerCase()}`, window.location),
-  }, 'product');
-}
-
-class ProductDetailPage extends Component {
-  constructor(props) {
-    super(props);
-
-    this.state = {
-      loading: true,
-    };
-
-    this.onSelectionChanged = this.onSelectionChanged.bind(this);
-    this.onAddToCart = this.onAddToCart.bind(this);
-    this.onQuantityChanged = this.onQuantityChanged.bind(this);
-    this.onAddToWishlist = this.onAddToWishlist.bind(this);
-  }
-
-  async componentDidMount() {
-    const product = await getProduct(getSkuFromUrl());
-
-    if (!product) {
-      errorGettingProduct();
-    }
-
-    this.setState({
-      product,
-      loading: false,
-      selection: {},
-    });
-  }
-
-  onAddToCart = async () => {
-    if (Object.keys(this.state.selection).length === (this.state.product.options?.length || 0)) {
-      const optionsUIDs = Object.values(this.state.selection).map((option) => option.id);
-      const { cartApi } = await import('../../scripts/minicart/api.js');
-      console.debug('onAddToCart', {
-        sku: this.state.product.sku, optionsUIDs, quantity: this.state.selectedQuantity ?? 1,
-      });
-      cartApi.addToCart(this.state.product.sku, optionsUIDs, this.state.selectedQuantity ?? 1);
-    }
-  };
-
-  onAddToWishlist = async () => {
-    console.debug('onAddToWishlist', this.state.product.sku);
-  };
-
-  onQuantityChanged = (quantity) => {
-    this.setState({ selectedQuantity: quantity });
-  };
-
-  onSelectionChanged = (fragment) => {
-    // update selection value
-    this.setState((oldState) => ({
-      selection: {
-        ...oldState.selection,
-        ...fragment,
-      },
-    }));
-
-    // fetch new images and prices
-    const variantIds = Object.values({ ...this.state.selection, ...fragment })
-      .map((selection) => selection.id);
-    getVariantDetails(variantIds, this.state.product.sku).then(({ images, price }) => {
-      this.setState((oldState) => ({
-        product: {
-          ...oldState.product,
-          images,
-          price,
-        },
-      }));
-    });
-  };
-
-  async componentDidUpdate() {
-    const { loading, product } = this.state;
-    if (!loading && product) {
-      setJsonLdProduct(product);
-      // TODO: productId not exposed by catalog service as number
-      window.adobeDataLayer.push({ productContext: { productId: 0, ...product } }, { event: 'product-page-view' });
-    }
-  }
-
-  render() {
-    if (this.state.loading) {
-      return html`<${ProductDetailsShimmer} />`;
-    }
-
-    return html`
-      <${Fragment} >
-        <${Carousel} product=${this.state.product} />
-        <${Sidebar}
-          product=${this.state.product}
-          selection=${this.state.selection}
-          onSelectionChanged=${this.onSelectionChanged}
-          onAddToCart=${this.onAddToCart}
-          onAddToWishlist=${this.onAddToWishlist}
-          onQuantityChanged=${this.onQuantityChanged}
-        />
-        <div class="product-detail-description">
-          <h3>Product Details</h3>
-          <div dangerouslySetInnerHTML=${{ __html: this.state.product.description }}></div>
-        </div>
-      <//>
-    `;
-  }
-}
-
-export default async function decorate($block) {
-  $block.innerHTML = '<div class="full-height"></div>';
-
-  const skuFromUrl = getSkuFromUrl();
-  if (!skuFromUrl) {
-    errorGettingProduct();
-  }
-
-  const app = html`<${ProductDetailPage} sku=${skuFromUrl} />`;
-
-  render(app, $block);
-}
diff --git a/blocks/product-details/product-details.js b/blocks/product-details/product-details.js
index e1941c562c..02cc1778dd 100644
--- a/blocks/product-details/product-details.js
+++ b/blocks/product-details/product-details.js
@@ -1,3 +1,4 @@
+/* eslint-disable import/no-unresolved */
 /* eslint-disable import/no-extraneous-dependencies */
 
 // Drop-in Tools
diff --git a/scripts/commerce.js b/scripts/commerce.js
index 55cd9a263a..6d0499b0fa 100644
--- a/scripts/commerce.js
+++ b/scripts/commerce.js
@@ -412,6 +412,7 @@ export async function loadCategory(state) {
       facets: response.productSearch.facets.filter((facet) => facet.attribute !== 'categories'),
     };
   } catch (e) {
+    // eslint-disable-next-line no-console
     console.error('Error loading products', e);
     return {
       pages: 1,
diff --git a/scripts/minicart.js b/scripts/minicart.js
index 4e9159d0ea..8adbd1d477 100644
--- a/scripts/minicart.js
+++ b/scripts/minicart.js
@@ -1,3 +1,4 @@
+/* eslint-disable import/no-unresolved */
 /* eslint-disable import/no-extraneous-dependencies */
 
 // TODO: Pending MiniCart Container from Drop-ins
diff --git a/scripts/scripts.js b/scripts/scripts.js
index ce2e58c582..da883b7095 100644
--- a/scripts/scripts.js
+++ b/scripts/scripts.js
@@ -30,6 +30,7 @@ const LCP_BLOCKS = [
  */
 function loadDropins() {
   if (document.readyState === 'complete') {
+    // eslint-disable-next-line no-console
     console.log('document already loaded');
     initializers.mount();
   } else {