/*
 * Desktop hero v85.
 * Brings the editorial composition and concise copy from the mobile carousel
 * to large screens without changing the mobile experience or other sections.
 */
@media (min-width: 881px) {
  .pc-hero-slider,
  .pc-hero-slider__track,
  .pc-hero-slide {
    height: clamp(620px, 41.66vw, 760px) !important;
    min-height: 620px !important;
  }

  .pc-hero-slide {
    overflow: hidden !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
    background-size: cover !important;
  }

  .pc-hero-slide.pc-hero-slide--all-in-one-campaign {
    background-color: #f7eee7 !important;
    background-image: url("assets/hero-desktop-all-in-one-editorial-v85.webp") !important;
  }

  .pc-hero-slide.pc-hero-slide--latitude-campaign {
    background-color: #01050c !important;
    background-image: url("assets/hero-desktop-latitude-7420-editorial-v85.webp") !important;
  }

  .pc-hero-slide.pc-hero-slide--corporate {
    background-color: #eff1f4 !important;
    background-image: url("assets/hero-desktop-optiplex-7000-editorial-v85.webp") !important;
  }

  /*
   * The desktop header and hero share one continuous background through the
   * body pseudo-element. Override that legacy layer as well as the slides.
   */
  body.home::before {
    height: clamp(620px, 41.66vw, 760px) !important;
    background-color: #f7eee7 !important;
    background-image:
      linear-gradient(180deg, rgba(2,7,12,.96) 0, rgba(2,7,12,.75) 120px, rgba(2,7,12,.2) 220px, transparent 300px),
      url("assets/hero-desktop-all-in-one-editorial-v85.webp") !important;
    background-repeat: no-repeat !important;
    background-position: center top, center !important;
    background-size: 100% 300px, cover !important;
  }

  body.home:has(.pc-hero-slide--latitude-campaign.is-active)::before {
    background-color: #01050c !important;
    background-image:
      linear-gradient(180deg, rgba(2,7,12,.42) 0, transparent 300px),
      url("assets/hero-desktop-latitude-7420-editorial-v85.webp") !important;
  }

  body.home:has(.pc-hero-slide--corporate.is-active)::before {
    background-color: #eff1f4 !important;
    background-image:
      linear-gradient(180deg, rgba(2,7,12,.96) 0, rgba(2,7,12,.75) 120px, rgba(2,7,12,.2) 220px, transparent 300px),
      url("assets/hero-desktop-optiplex-7000-editorial-v85.webp") !important;
  }

  .pc-hero-slide::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 0;
    pointer-events: none;
    background: linear-gradient(90deg, transparent 0 54%, rgba(1,5,12,.06) 64%, rgba(1,5,12,.3) 100%);
  }

  .pc-hero-slide--all-in-one-campaign::after,
  .pc-hero-slide--corporate::after {
    background: linear-gradient(90deg, transparent 0 54%, rgba(255,255,255,.12) 64%, rgba(255,255,255,.42) 100%);
  }

  .pc-hero-slide__inner,
  .pc-hero-slide--all-in-one-campaign .pc-hero-slide__inner,
  .pc-hero-slide--latitude-campaign .pc-hero-slide__inner {
    position: relative !important;
    z-index: 1 !important;
    display: grid !important;
    grid-template-columns: minmax(0, 57%) minmax(380px, 43%) !important;
    gap: 0 !important;
    height: 100% !important;
    padding-top: clamp(145px, 10vw, 190px) !important;
  }

  .pc-hero-slide__product,
  .pc-hero-slide--all-in-one-campaign .pc-hero-slide__product,
  .pc-hero-slide--latitude-campaign .pc-hero-slide__product,
  .pc-hero-slide--corporate .pc-hero-slide__product {
    grid-column: 1 !important;
    width: 100% !important;
    height: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    opacity: 1 !important;
    transform: none !important;
  }

  .pc-hero-slide .pc-hero-slide__product img {
    display: none !important;
  }

  .pc-hero-slide__copy,
  .pc-hero-slide--all-in-one-campaign .pc-hero-slide__copy,
  .pc-hero-slide--latitude-campaign .pc-hero-slide__copy,
  .pc-hero-slide--corporate .pc-hero-slide__copy {
    grid-column: 2 !important;
    align-self: center !important;
    justify-self: center !important;
    width: min(470px, calc(100% - 40px)) !important;
    margin: 0 !important;
    padding: 24px !important;
    text-align: center !important;
    background: transparent !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    opacity: 0 !important;
    transform: translateY(18px) !important;
    transition: opacity .38s ease .1s, transform .5s cubic-bezier(.2,.8,.2,1) .1s !important;
  }

  .pc-hero-slide.is-active .pc-hero-slide__copy {
    opacity: 1 !important;
    transform: none !important;
  }

  .pc-hero-desktop-text {
    display: none !important;
  }

  .pc-hero-mobile-text {
    display: inline !important;
  }

  .pc-hero-slide__tag.pc-hero-mobile-text {
    display: inline-flex !important;
  }

  .pc-hero-slide__tag {
    align-items: center !important;
    justify-content: center !important;
    min-height: 29px !important;
    margin: 0 auto 13px !important;
    padding: 0 14px !important;
    color: #ffd7bd !important;
    background: rgba(250,100,1,.11) !important;
    border-color: rgba(250,100,1,.38) !important;
    font-size: 10px !important;
    font-weight: 850 !important;
    letter-spacing: .11em !important;
    line-height: 1 !important;
    white-space: nowrap !important;
  }

  .pc-hero-slide h2 {
    max-width: 460px !important;
    margin: 0 auto 12px !important;
    color: #fff !important;
    font-size: clamp(36px, 3.1vw, 52px) !important;
    font-weight: 900 !important;
    line-height: 1.02 !important;
    letter-spacing: -.04em !important;
    text-wrap: balance;
  }

  .pc-hero-slide p,
  .pc-hero-slide--all-in-one-campaign .pc-hero-slide__copy p {
    max-width: 420px !important;
    margin: 0 auto 17px !important;
    color: rgba(255,255,255,.78) !important;
    font-size: 15px !important;
    line-height: 1.45 !important;
  }

  .pc-hero-slide__price {
    margin: 0 0 18px !important;
    color: #fff !important;
    font-size: clamp(28px, 2.5vw, 39px) !important;
    font-weight: 950 !important;
    line-height: 1.05 !important;
    letter-spacing: -.025em !important;
  }

  .pc-hero-slide .pc-button {
    min-width: 142px !important;
    min-height: 48px !important;
    margin: 0 auto !important;
    padding: 0 24px !important;
    background: linear-gradient(135deg, #ff7a24, #ed5600) !important;
    border-color: rgba(255,255,255,.14) !important;
    border-radius: 999px !important;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.24), 0 12px 28px rgba(250,100,1,.28) !important;
    font-size: 13px !important;
    font-weight: 850 !important;
  }

  .pc-hero-slide--all-in-one-campaign h2,
  .pc-hero-slide--all-in-one-campaign .pc-hero-slide__price,
  .pc-hero-slide--corporate h2,
  .pc-hero-slide--corporate .pc-hero-slide__price {
    color: #17191d !important;
  }

  .pc-hero-slide--all-in-one-campaign p,
  .pc-hero-slide--all-in-one-campaign .pc-hero-slide__copy p,
  .pc-hero-slide--corporate p {
    color: rgba(23,25,29,.7) !important;
  }

  .pc-hero-slide--all-in-one-campaign .pc-hero-slide__tag,
  .pc-hero-slide--corporate .pc-hero-slide__tag {
    color: #8a3d0c !important;
    background: rgba(250,100,1,.1) !important;
    border-color: rgba(220,83,0,.3) !important;
  }

  .pc-slider-dots {
    bottom: 19px !important;
    gap: 7px !important;
  }

  .pc-slider-dots button {
    width: 9px !important;
    height: 9px !important;
    background: rgba(64,67,72,.46) !important;
    box-shadow: none !important;
    opacity: .75 !important;
  }

  .pc-slider-dots button.is-active {
    width: 30px !important;
    background: linear-gradient(90deg, #ff7a24, #ed5600) !important;
    box-shadow: 0 6px 16px rgba(250,100,1,.3) !important;
    opacity: 1 !important;
  }

  body.home:has(.pc-hero-slide--latitude-campaign.is-active) .pc-slider-dots button:not(.is-active) {
    background: rgba(255,255,255,.72) !important;
  }
}

@media (min-width: 881px) and (max-width: 1100px) {
  .pc-hero-slide__inner,
  .pc-hero-slide--all-in-one-campaign .pc-hero-slide__inner,
  .pc-hero-slide--latitude-campaign .pc-hero-slide__inner {
    grid-template-columns: minmax(0, 53%) minmax(380px, 47%) !important;
  }

  .pc-hero-slide__copy {
    width: min(430px, calc(100% - 28px)) !important;
    padding-right: 14px !important;
    padding-left: 14px !important;
  }
}
