@layer sections{
  [ui-section=product-showcase]{
    --per-page:1;
    --item-size:75%;
    display:grid;
    grid-gap:var(--spacing-48);
    gap:var(--spacing-48);
    padding-top:var(--top-spacing) !important;
    padding-bottom:var(--bottom-spacing) !important;
  }
  [ui-section=product-showcase] [ui-slot=head]{
    justify-content:space-between;
    gap:var(--spacing-24);
    width:100%;
    padding-left:8%;
    padding-right:8%;
  }
  [ui-section=product-showcase] [ui-slot=head] .content{
    display:grid;
    grid-gap:var(--spacing-16);
    gap:var(--spacing-16);
  }
  [ui-section=product-showcase] [ui-slot=head] .actions{
    display:flex;
    gap:var(--spacing-16);
  }
  [ui-section=product-showcase] .items-area{
    padding-left:8%;
    padding-right:8%;
  }
  [ui-section=product-showcase] .items-area [ui-block=showcase]{
    display:grid;
    grid-template-columns:repeat(2, 1fr);
  }
  [ui-section=product-showcase] .items-area [ui-block=showcase] .media{
    overflow:hidden;
    border-radius:var(--radius-20);
  }
  [ui-section=product-showcase] .items-area [ui-block=showcase] .media[data-image-ratio=square]{
    aspect-ratio:1/1;
  }
  [ui-section=product-showcase] .items-area [ui-block=showcase] .media[data-image-ratio=portrait]{
    aspect-ratio:3/4;
  }
  [ui-section=product-showcase] .items-area [ui-block=showcase] .media[data-image-ratio=landscape]{
    aspect-ratio:4/3;
  }
  [ui-section=product-showcase] .items-area [ui-block=showcase] .media > img{
    -o-object-fit:cover;
       object-fit:cover;
  }
  [ui-section=product-showcase] .items-area [ui-block=showcase] .content{
    display:flex;
    flex-direction:column;
    justify-content:center;
    padding:var(--spacing-0) var(--spacing-48);
    gap:var(--spacing-24);
  }
  [ui-section=product-showcase] .items-area [ui-block=showcase] .content .title{
    justify-content:flex-start;
    width:-moz-fit-content;
    width:fit-content;
    font:var(--font-display-sm);
  }
  [ui-section=product-showcase] .items-area [ui-block=showcase] .content .price{
    font:var(--font-title-md);
  }
  [ui-section=product-showcase] .items-area [ui-block=showcase] .content .price .compare-at-price{
    opacity:0.5;
  }
  [ui-section=product-showcase] .items-area [ui-block=showcase] .content .description{
    max-height:500px;
    overflow:hidden;
    color:var(--color-on-surface-variant);
    font:var(--font-body-lg);
    text-wrap:balance;
  }
  [ui-section=product-showcase] .items-area [ui-block=showcase] .content .cta{
    width:-moz-fit-content;
    width:fit-content;
    min-width:180px;
    margin-top:var(--spacing-16);
  }
  @media (max-width: 1280px){
    [ui-section=product-showcase]{
      --item-size:85%;
    }
  }
  @media (max-width: 1028px){
    [ui-section=product-showcase]{
      --item-size:100%;
    }
    [ui-section=product-showcase][data-orientation=horizontal]{
      grid-template-columns:1fr;
    }
    [ui-section=product-showcase] [ui-slot=head]{
      flex-direction:column;
      justify-content:center;
      text-align:center;
    }
    [ui-section=product-showcase] [ui-slot=head] .actions{
      justify-content:center;
    }
  }
  @media (max-width: 769px){
    [ui-section=product-showcase] [ui-slot=head]{
      padding-left:var(--spacing-0);
      padding-right:var(--spacing-0);
    }
    [ui-section=product-showcase] .items-area{
      padding-left:var(--spacing-0);
      padding-right:var(--spacing-0);
    }
    [ui-section=product-showcase] .items-area [ui-block=showcase]{
      grid-template-columns:1fr;
    }
    [ui-section=product-showcase] .items-area [ui-block=showcase] .content{
      padding:var(--spacing-48) var(--spacing-0);
    }
    [ui-section=product-showcase] .items-area [ui-block=showcase] .content .title{
      font:var(--font-headline-md);
    }
  }
}