@font-face {
  font-family: "Saira Expanded Light";
  src: url("https://cwsmgmt.corsair.com/fonts/saira/Saira_Expanded-Light.woff2")
    format("woff2");
  font-display: block;
}

@font-face {
  font-family: "Saira Expanded Regular";
  src: url("https://cwsmgmt.corsair.com/fonts/saira/Saira_Expanded-Regular.woff2")
    format("woff2");
  font-display: block;
}

/* STYLES */
:root {
  --corsair-yellow: #ece81a;
  --megamenu-height: 60px;
  --panel-padding: 4rem 1rem;
  --panel-max-width: none;
}

.padding-panel {
  padding: var(--panel-padding);
}

.width-restrict-panel {
  max-width: var(--panel-max-width);
  margin: 0 auto;
}

.tlc-content img {
  user-select: none;
  pointer-events: none;
}

.tlc-content :is(h1, h2, h3, h4, h5, h6) {
  font-weight: 600;
  line-height: 1.1;
  letter-spacing: 0.04em;
  color: #fff;
}

.tlc-content h2 {
  font-size: 2.25rem;
  font-family: "Saira Expanded Light";
  font-weight: 300;
}

.tlc-content ul {
  list-style-type: disc;
  list-style-position: inside;
}

.tlc-content p,
.tlc-content li,
.tlc-content td {
  font-weight: 400;
  font-size: 1rem;
  line-height: 1.5;
  color: #fff;
}

.tlc-content .block-subtitle {
  letter-spacing: 0.15em;
  color: #ece81a;
  font-weight: 500;
  font-size: 0.875rem;
}

.tlc-content .block-cta {
  color: black;
  background-color: #ece81a;
  padding: 0.75rem 2rem;
  font-weight: 600;
  width: fit-content;
  font-size: 1rem;
  display: block;
  margin: 0 auto;
}

@media screen and (min-width: 768px) {
  :root {
    --panel-padding: 4rem 3rem;
  }

  .tlc-content h2 {
    font-size: 3.25rem;
  }

  .tlc-content p,
  .tlc-content li {
    font-size: 1.125rem;
  }

  .tlc-content .block-subtitle {
    font-size: 1rem;
  }
}

@media screen and (min-width: 912px) {
  :root {
    --megamenu-height: 100px;
  }
}

@media screen and (min-width: 1024px) {
  :root {
    --panel-padding: 4rem 10rem;
  }

  .tlc-content h2 {
    font-size: 3.75rem;
    margin-bottom: 1rem;
  }
}

@media screen and (min-width: 2048px) {
  :root {
    --panel-max-width: 2100px;
  }
}

/* HERO */
.block-hero {
  background-image: url("https://assets.corsair.com/image/upload/v1756134749/pages/gaming-gear/hero-mobile-v2.png");
  background-position: center;
  background-size: cover;

  min-height: 500px;
  height: calc(100svh - var(--megamenu-height));
  position: relative;

  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  align-items: center;
}

.block-hero::before {
  background: radial-gradient(
    50% 50% at 50% 50%,
    rgba(0, 0, 0, 0) 0%,
    rgba(0, 0, 0, 0.5) 100%
  );

  content: "";
  display: block;
  position: absolute;
  inset: 0;
}

.block-hero .block-content {
  position: relative;
}

.block-hero .block-copy {
  display: flex;
  flex-direction: column;
  align-items: center;

  text-align: center;
}

.block-hero .block-subtitle {
  text-transform: uppercase;
  letter-spacing: 0.2em;
}

.block-hero .block-title {
  font-size: 2.5rem;
  text-transform: uppercase;
  font-weight: 300;
  font-family: "Saira Expanded Light";

  margin: 0;
  margin-bottom: 1rem;
}

.block-hero .block-title b {
  font-weight: 800;
}

@media screen and (min-width: 640px) {
  .block-hero .block-subtitle {
    font-size: 1.25rem;
  }

  .block-hero .block-title {
    font-size: 4rem;
  }
}

@media screen and (min-width: 1024px) {
  .block-hero {
    background-image: url("https://assets.corsair.com/image/upload/v1756134750/pages/gaming-gear/hero-desktop-v2.png");
    min-height: 700px;
    height: calc(70svh - var(--megamenu-height));
    background-position-y: 60%;
  }

  .block-hero::before {
    background: radial-gradient(
      50% 50% at 50% 50%,
      rgba(0, 0, 0, 0) 70%,
      rgba(0, 0, 0, 1) 100%
    );
  }

  .block-hero .block-content {
    max-width: 1200px;
  }

  .block-hero .block-title {
    font-size: 4.5rem;
  }

  .block-hero .block-description {
    max-width: 1024px;
  }
}

@media screen and (min-width: 1440px) {
  .block-hero .block-title {
    font-size: 5rem;
    line-height: 0.9;
  }
}

/* EXPLORE */
#explore-carousel .block-carousel-wrapper {
  max-width: 400px;
}

#explore-carousel .carousel-panel-wrapper {
  padding-inline: 1rem;
}

#explore-carousel .carousel-panel {
  overflow: hidden;
  position: relative;
  display: inline-block;
}

#explore-carousel .carousel-panel .bi-chevron-right {
  display: inline-block;
  transition: transform 0.2s ease-out;
}

#explore-carousel .carousel-panel:hover .bi-chevron-right {
  transform: translateX(4px);
}

#explore-carousel .carousel-panel .panel-media {
  transition: transform 0.3s ease-out;
}

#explore-carousel .carousel-panel:hover .panel-media {
  transform: scale(1.05);
}

#explore-carousel .panel-content {
  position: absolute;
  bottom: 0;
  left: 0;
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  padding: 2rem;
}

#explore-carousel .panel-title {
  font-size: 1.5rem;
  text-transform: uppercase;
  line-height: 1.1;
  font-family: "Saira Expanded Regular";
  font-weight: 400;
}

#explore-carousel .panel-cta {
  color: var(--corsair-yellow);
  text-decoration: none;
  font-weight: 600;
  font-size: 1rem;
  line-height: 1.3;
}

#explore-carousel .slick-list,
#explore-carousel .slick-list > * {
  overflow: visible;
}

#explore-carousel .carousel-controls {
  display: flex;
  justify-content: flex-end;
  gap: 0.5rem;
}

#explore-carousel .carousel-control {
  background-color: var(--corsair-yellow);
  width: 32px;
  height: 32px;
  border-radius: 50%;
  display: flex;
  justify-content: center;
  align-items: center;
  cursor: pointer;
  transition: transform 0.2s ease-out;
  transition: background-color 0.2s ease-out;
}

#explore-carousel .carousel-control[disabled] {
  background: #46451d;
  pointer-events: none;
}

@media screen and (min-width: 768px) {
  #explore-carousel .block-carousel-wrapper {
    max-width: var(--panel-max-width);
  }
}

@media screen and (min-width: 1280px) {
  #explore-carousel .block-carousel {
    display: flex;
    justify-content: center;
  }

  #explore-carousel .carousel-controls {
    display: none;
  }

  #explore-carousel .panel-title {
    font-weight: 400;
  }
}

/* CALLOUT CAROUSEL */
#callout-carousel {
  --carousel-panel-width: calc(var(--panel-max-width) * 0.8);
}

/* Desktop Carousel hidden */
#callout-carousel .block-carousel {
  display: none;
}

#callout-carousel .block-carousel-wrapper > .carousel-controls {
  display: none;
}

#callout-carousel .block-header {
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  max-width: var(--panel-max-width);
  padding: var(--panel-padding);
}

#callout-carousel .block-title {
  text-transform: uppercase;
  margin-bottom: 0.5rem;
}

#callout-carousel .carousel-panel {
  position: relative;
  padding-inline: 1rem;
  cursor: grab;
}

#callout-carousel .carousel-panel:active {
  cursor: grabbing;
}

/* CALLOUT CAROUSEL MOBILE - PANEL MEDIA & BUTTONS */
#callout-carousel .block-carousel-mobile .panel-callout-buttons {
  inset: 0;
  position: absolute;
}

#callout-carousel .panel-callouts {
  position: absolute;
  inset: 0;
  z-index: 10;
}

#callout-carousel .slick-slider {
  margin: 0;
}

#callout-carousel .block-carousel-wrapper {
  max-width: var(--carousel-panel-width);
  padding-top: 0;
}

/* CALLOUT CAROUSEL MOBILE - PANEL SLIDER & PRODUCT INFO */
#callout-carousel .block-carousel-mobile .panel-callouts-wrapper {
  position: relative;
  margin-bottom: 1rem;
}

/* Carousel panels on mobile <--> callouts on desktop */
#callout-carousel .panel-callout-content {
  margin-inline: -1rem;
}

#callout-carousel div:has(> .panel-callout) {
  padding-inline: 1rem;
}

#callout-carousel .panel-callout {
  position: relative;
  padding: 1.5rem;
  width: fit-content;
  border: 1px solid #8c8c8e;
  background: rgba(59, 59, 59, 0.7);

  box-shadow: 0px 4px 10px 0px rgba(0, 0, 0, 0.5);
  backdrop-filter: blur(5px);

  cursor: grab;
}

#callout-carousel .panel-callout:active {
  cursor: grabbing;
}

#callout-carousel .callout-corner {
  position: absolute;
  width: 24px;
  height: 24px;
  z-index: 1;
}

#callout-carousel .callout-corner.corner-tl {
  top: -1px;
  left: -1px;
  border-top: 1px solid #fff;
  border-left: 1px solid #fff;
}

#callout-carousel .callout-corner.corner-tr {
  top: -1px;
  right: -1px;
  border-top: 1px solid #fff;
  border-right: 1px solid #fff;
}

#callout-carousel .callout-corner.corner-br {
  bottom: -1px;
  right: -1px;
  border-bottom: 1px solid #fff;
  border-right: 1px solid #fff;
}

#callout-carousel .callout-corner.corner-bl {
  bottom: -1px;
  left: -1px;
  border-bottom: 1px solid #fff;
  border-left: 1px solid #fff;
}

#callout-carousel .panel-callout-description {
  display: none;
}

#callout-carousel .callout-cta {
  color: var(--corsair-yellow);
  font-weight: 600;
  font-size: 0.875rem;
  display: inline-block;
  width: fit-content;
}

#callout-carousel .carousel-controls {
  display: flex;
  justify-content: flex-end;
  gap: 0.5rem;
  padding-top: 1rem;
  padding-bottom: 2rem;
}

#callout-carousel .carousel-control {
  background-color: var(--corsair-yellow);

  width: 32px;
  height: 32px;
  border-radius: 50%;
  display: flex;
  justify-content: center;
  align-items: center;
  cursor: pointer;
  transition: transform 0.2s ease-out;
  transition: background-color 0.2s ease-out;
}

#callout-carousel .carousel-control[disabled] {
  background: #46451d;
  pointer-events: none;
}

/* HOTSPOT */
#callout-carousel .panel-callout-button {
  --button-size: 40px;

  position: absolute;
  left: 50%;
  top: 50%;
  background-color: rgba(0, 0, 0, 0.25);
  width: var(--button-size);
  height: var(--button-size);
  transform: translate(-50%, -50%);
  border-radius: 50%;
}

#callout-carousel .callout-button-icon-wrapper {
  position: absolute;
  display: block;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  border-radius: 50%;

  background-color: rgba(236, 232, 26, 0.25);
  width: calc(var(--button-size) * 0.5);
  height: calc(var(--button-size) * 0.5);

  outline: solid 1px transparent;
  transition: outline 0.5s cubic-bezier(0.34, 1.56, 0.64, 1);
}

#callout-carousel .callout-button-icon-wrapper::before {
  content: "";
  display: block;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  border-radius: 50%;

  background-color: var(--corsair-yellow);
  transition: all 0.4s cubic-bezier(0.34, 1.56, 0.64, 1);
  width: calc(var(--button-size) * 0.35);
  height: calc(var(--button-size) * 0.35);
}

#callout-carousel .callout-button-icon-wrapper .bi {
  color: #000;
  position: absolute;
  display: flex;
  justify-content: center;
  align-items: center;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);

  width: calc(var(--button-size) * 0.35);
  height: calc(var(--button-size) * 0.35);
}

#callout-carousel
  .panel-callout-button:not(.active):hover
  .callout-button-icon-wrapper::before {
  width: calc(var(--button-size) * 0.5);
  height: calc(var(--button-size) * 0.5);
}

#callout-carousel
  .panel-callout-button:active
  .callout-button-icon-wrapper::before {
  width: calc(var(--button-size) * 0.3) !important;
  height: calc(var(--button-size) * 0.3) !important;
}

/* HOTSPOT ACTIVE */
#callout-carousel .panel-callout-button.active .callout-button-icon-wrapper {
  width: calc(var(--button-size) * 0.55);
  height: calc(var(--button-size) * 0.55);
}

#callout-carousel .panel-callout-button.active .callout-button-icon-wrapper {
  outline: solid 1px var(--corsair-yellow);
}

#callout-carousel .panel-callout-title {
  font-family: "Saira Condensed", sans-serif !important;
  font-weight: 600;
  font-size: 1.5rem;
  line-height: 1.25;
  margin-bottom: 0.5rem;
}

#callout-carousel .panel-callout-description {
  line-height: 1.5;
}

@media screen and (min-width: 768px) {
  #callout-carousel .panel-content-wrapper {
    position: relative;
  }

  #callout-carousel .slick-list,
  #callout-carousel .slick-list > * {
    overflow: visible;
  }

  #callout-carousel .block-carousel {
    display: block;
  }

  #callout-carousel .block-carousel-mobile {
    display: none;
  }

  #callout-carousel .panel-callout {
    position: absolute;

    padding: 0;
    width: 300px;
  }

  #callout-carousel .panel-callout-header {
    padding-right: 4rem;
    display: flex;
    align-items: center;
    gap: 0.5rem;
    border-bottom: 1px solid #c1c6c8;
  }

  #callout-carousel .panel-callout-description {
    display: initial;
  }

  #callout-carousel .panel-callout-header::before {
    content: "";
    align-self: stretch;
    display: inline-block;
    width: 16px;
    background: var(--corsair-yellow);
  }

  #callout-carousel .panel-callout-title {
    margin: 0;
    padding-block: 0.5rem;
  }

  #callout-carousel .panel-content-info {
    padding: 0.5rem 1.25rem;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    gap: 1rem;
  }

  #callout-carousel .panel-callout-buttons {
    position: absolute;
    inset: 0;
    pointer-events: none;
  }

  #callout-carousel .panel-callout-button {
    --button-size: 52px;

    pointer-events: initial;
    cursor: pointer;
  }

  #callout-carousel .panel-callout.callout-left {
    --left-offset: -10%;
    --top-offset: -10%;

    transform: translate(-100%, -48px);
    clip-path: polygon(100% 0, 100% 0, 100% 100%, 100% 100%);
    transition: clip-path 0.6s cubic-bezier(0.25, 1, 0.5, 1);
    transition-delay: 0.1s;
  }

  #callout-carousel .panel-callout.callout-right {
    --left-offset: 10%;
    --top-offset: -10%;

    transform: translate(0%, -48px);
    clip-path: polygon(0 0, 0 0, 0 100%, 0% 100%);
    transition: clip-path 0.6s cubic-bezier(0.25, 1, 0.5, 1);
    transition-delay: 0.1s;
  }

  #callout-carousel .panel-callout.callout-top {
    --left-offset: 0%;
    --top-offset: -15%;

    transform: translate(-50%, -100%);
    clip-path: polygon(0 100%, 100% 100%, 100% 100%, 0% 100%);
    transition: clip-path 0.6s cubic-bezier(0.25, 1, 0.5, 1);
    transition-delay: 0.1s;
  }

  #callout-carousel .panel-callout.callout-bottom {
    --left-offset: 0%;
    --top-offset: 15%;

    transform: translate(-50%, 0%);
    clip-path: polygon(0 0, 100% 0, 100% 0, 0 0);
    transition: clip-path 0.6s cubic-bezier(0.25, 1, 0.5, 1);
    transition-delay: 0.1s;
  }

  #callout-carousel .panel-callout + .callout-connector {
    content: "";
    position: absolute;
    top: var(--top);
    left: var(--left);

    background-repeat: no-repeat;
    background-size: 100% 100%;
  }

  #callout-carousel .panel-callout.callout-left + .callout-connector {
    width: 10%;
    height: 10%;
    background-image: url("https://assets.corsair.com/image/upload/v1750890568/pages/tlc-lp/gaming-gear/battlestations/Left.svg");
    transform: translate(-100%, -100%);
    clip-path: polygon(100% 0, 100% 0, 100% 100%, 100% 100%);
  }

  #callout-carousel .panel-callout.callout-right + .callout-connector {
    width: 10%;
    height: 10%;
    background-image: url("https://assets.corsair.com/image/upload/v1750890568/pages/tlc-lp/gaming-gear/battlestations/Right.svg");
    transform: translate(0%, -100%);
    clip-path: polygon(0 0, 0 0, 0 100%, 0% 100%);
  }

  #callout-carousel .panel-callout.callout-top + .callout-connector {
    width: 2px;
    height: 15%;
    background-image: url("https://assets.corsair.com/image/upload/v1750892226/pages/tlc-lp/gaming-gear/battlestations/Vertical.svg");
    transform: translate(0%, -100%);
    clip-path: polygon(0 100%, 100% 100%, 100% 100%, 0% 100%);
  }

  #callout-carousel .panel-callout.callout-bottom + .callout-connector {
    width: 2px;
    height: 15%;
    background-image: url("https://assets.corsair.com/image/upload/v1750892226/pages/tlc-lp/gaming-gear/battlestations/Vertical.svg");
    transform: translate(0%, 0%);
    clip-path: polygon(0 0, 100% 0, 100% 0, 0 0);
  }

  #callout-carousel .panel-callout {
    visibility: hidden;
  }

  #callout-carousel .panel-callout.active {
    visibility: visible;
  }

  #callout-carousel .callout-connector {
    transition: clip-path 0.6s cubic-bezier(0.16, 1, 0.3, 1);
    pointer-events: none;
  }

  #callout-carousel .panel-callout.active,
  #callout-carousel .panel-callout.active + .callout-connector {
    clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);
  }

  #callout-carousel .block-header {
    max-width: 1200px;
  }

  #callout-carousel .callout-corner.corner-tl {
    display: none;
  }

  #callout-carousel .block-carousel-wrapper > .carousel-controls {
    display: flex;
  }
}

/* CALLOUT BUTTON PLACEMENT */
#callout-carousel .panel-callout-button {
  left: var(--left);
  top: var(--top);
}

/* Panels are offset from their buttons */
#callout-carousel .panel-callout {
  left: calc(var(--left) + var(--left-offset));
  top: calc(var(--top) + var(--top-offset) + 1px);
}

/* PANEL 1 */
:is(#panel-callout-1, #panel-callout-mobile-1)
  .panel-callout-button[data-panel-control="k70-pro-tkl"],
#panel-callout-1 .panel-callout[data-panel="k70-pro-tkl"],
#panel-callout-1 .panel-callout[data-panel="k70-pro-tkl"] + .callout-connector {
  --left: 48.5%;
  --top: 42%;
}

:is(#panel-callout-1, #panel-callout-mobile-1)
  .panel-callout-button[data-panel-control="hs80-rgb-wireless"],
#panel-callout-1 .panel-callout[data-panel="hs80-rgb-wireless"],
#panel-callout-1
  .panel-callout[data-panel="hs80-rgb-wireless"]
  + .callout-connector {
  --left: 38%;
  --top: 59%;
}

:is(#panel-callout-1, #panel-callout-mobile-1)
  .panel-callout-button[data-panel-control="mm700-rgb-extended"],
#panel-callout-1 .panel-callout[data-panel="mm700-rgb-extended"],
#panel-callout-1
  .panel-callout[data-panel="mm700-rgb-extended"]
  + .callout-connector {
  --left: 44%;
  --top: 76%;
}

:is(#panel-callout-1, #panel-callout-mobile-1)
  .panel-callout-button[data-panel-control="darkstar-wireless"],
#panel-callout-1 .panel-callout[data-panel="darkstar-wireless"],
#panel-callout-1
  .panel-callout[data-panel="darkstar-wireless"]
  + .callout-connector {
  --left: 70%;
  --top: 31%;
}

:is(#panel-callout-1, #panel-callout-mobile-1)
  .panel-callout-button[data-panel-control="t3-rush"],
#panel-callout-1 .panel-callout[data-panel="t3-rush"],
#panel-callout-1 .panel-callout[data-panel="t3-rush"] + .callout-connector {
  --left: 80%;
  --top: 67%;
}

/* PANEL 2 */
:is(#panel-callout-2, #panel-callout-mobile-2)
  .panel-callout-button[data-panel-control="platform-4-elevate-desk"],
#panel-callout-2 .panel-callout[data-panel="platform-4-elevate-desk"],
#panel-callout-2
  .panel-callout[data-panel="platform-4-elevate-desk"]
  + .callout-connector {
  --left: 25%;
  --top: 68%;
}

:is(#panel-callout-2, #panel-callout-mobile-2)
  .panel-callout-button[data-panel-control="k65-plus-wireless"],
#panel-callout-2 .panel-callout[data-panel="k65-plus-wireless"],
#panel-callout-2
  .panel-callout[data-panel="k65-plus-wireless"]
  + .callout-connector {
  --left: 38%;
  --top: 59%;
}

:is(#panel-callout-2, #panel-callout-mobile-2)
  .panel-callout-button[data-panel-control="void-wireless-v2"],
#panel-callout-2 .panel-callout[data-panel="void-wireless-v2"],
#panel-callout-2
  .panel-callout[data-panel="void-wireless-v2"]
  + .callout-connector {
  --left: 51%;
  --top: 46%;
}

:is(#panel-callout-2, #panel-callout-mobile-2)
  .panel-callout-button[data-panel-control="m75-air-wireless"],
#panel-callout-2 .panel-callout[data-panel="m75-air-wireless"],
#panel-callout-2
  .panel-callout[data-panel="m75-air-wireless"]
  + .callout-connector {
  --left: 52%;
  --top: 61%;
}

:is(#panel-callout-2, #panel-callout-mobile-2)
  .panel-callout-button[data-panel-control="mm500-v2"],
#panel-callout-2 .panel-callout[data-panel="mm500-v2"],
#panel-callout-2 .panel-callout[data-panel="mm500-v2"] + .callout-connector {
  --left: 58%;
  --top: 60%;
}

:is(#panel-callout-2, #panel-callout-mobile-2)
  .panel-callout-button[data-panel-control="tc500-luxe-chair"],
#panel-callout-2 .panel-callout[data-panel="tc500-luxe-chair"],
#panel-callout-2
  .panel-callout[data-panel="tc500-luxe-chair"]
  + .callout-connector {
  --left: 63%;
  --top: 81%;
}

:is(#panel-callout-2, #panel-callout-mobile-2)
  .panel-callout-button[data-panel-control="xeneon-34wqhd240-c"],
#panel-callout-2 .panel-callout[data-panel="xeneon-34wqhd240-c"],
#panel-callout-2
  .panel-callout[data-panel="xeneon-34wqhd240-c"]
  + .callout-connector {
  --left: 42%;
  --top: 34%;
}

/* PANEL 3 */
:is(#panel-callout-3, #panel-callout-mobile-3)
  .panel-callout-button[data-panel-control="platform-4-elevate-desk"],
#panel-callout-3 .panel-callout[data-panel="platform-4-elevate-desk"],
#panel-callout-3
  .panel-callout[data-panel="platform-4-elevate-desk"]
  + .callout-connector {
  --left: 33%;
  --top: 55%;
}

:is(#panel-callout-3, #panel-callout-mobile-3)
  .panel-callout-button[data-panel-control="virtuoso-max"],
#panel-callout-3 .panel-callout[data-panel="virtuoso-max"],
#panel-callout-3
  .panel-callout[data-panel="virtuoso-max"]
  + .callout-connector {
  --left: 25%;
  --top: 47%;
}

:is(#panel-callout-3, #panel-callout-mobile-3)
  .panel-callout-button[data-panel-control="nightsabre-wireless"],
#panel-callout-3 .panel-callout[data-panel="nightsabre-wireless"],
#panel-callout-3
  .panel-callout[data-panel="nightsabre-wireless"]
  + .callout-connector {
  --left: 52%;
  --top: 44%;
}

:is(#panel-callout-3, #panel-callout-mobile-3)
  .panel-callout-button[data-panel-control="mm500-v2"],
#panel-callout-3 .panel-callout[data-panel="mm500-v2"],
#panel-callout-3 .panel-callout[data-panel="mm500-v2"] + .callout-connector {
  --left: 59%;
  --top: 41%;
}

:is(#panel-callout-3, #panel-callout-mobile-3)
  .panel-callout-button[data-panel-control="tc500-luxe-chair"],
#panel-callout-3 .panel-callout[data-panel="tc500-luxe-chair"],
#panel-callout-3
  .panel-callout[data-panel="tc500-luxe-chair"]
  + .callout-connector {
  --left: 72%;
  --top: 60%;
}

:is(#panel-callout-3, #panel-callout-mobile-3)
  .panel-callout-button[data-panel-control="xeneon-32uhd144-a"],
#panel-callout-3 .panel-callout[data-panel="xeneon-32uhd144-a"],
#panel-callout-3
  .panel-callout[data-panel="xeneon-32uhd144-a"]
  + .callout-connector {
  --left: 30%;
  --top: 7%;
}