:root {
  --section-max-width: 1260px;
  --sk-focus-color: #0071e3;
  --sk-focus-color-alt: rgb(0, 0, 0);
  --sk-focus-offset: 1px;
  --sk-focus-offset-container: 3px;
}

.text-center {
  text-align: center;
}

body.page-overview-mac {
  background: #161616;
}

/*typography styles*/
.typography-hero-copy {
  font-size: 56px;
  line-height: 1.0714285714;
  font-weight: 600;
  letter-spacing: -0.005em;
  font-family: SF Pro Display, SF Pro Icons, Helvetica Neue, Helvetica, Arial,
    sans-serif;
  color: #fff;
}

@media only screen and (max-width: 1068px) {
  .typography-hero-copy {
    font-size: 40px;
    line-height: 1.1;
    font-weight: 600;
    letter-spacing: -0.024em;
    font-family: SF Pro Display, SF Pro Icons, Helvetica Neue, Helvetica, Arial,
      sans-serif;
  }
}

@media only screen and (max-width: 734px) {
  .typography-hero-copy {
    font-size: 40px;
    line-height: 1.1;
    font-weight: 600;
    letter-spacing: -0.024em;
    font-family: SF Pro Display, SF Pro Icons, Helvetica Neue, Helvetica, Arial,
      sans-serif;
  }
}

.typography-section-headline {
  font-size: 56px;
  line-height: 1.15;
  font-weight: 600;
  letter-spacing: -0.28px;
  font-family: SF Pro Display, SF Pro Icons, Helvetica Neue, Helvetica, Arial,
    sans-serif;
  padding-bottom: 0.15em;
}

@media only screen and (max-width: 1068px) {
  .typography-section-headline {
    font-size: 48px;
    line-height: 1.15;
    font-weight: 600;
    letter-spacing: -0.003em;
    font-family: SF Pro Display, SF Pro Icons, Helvetica Neue, Helvetica, Arial,
      sans-serif;
  }
}

@media only screen and (max-width: 734px) {
  .typography-section-headline {
    font-size: 32px;
    line-height: 1.15;
    font-weight: 600;
    letter-spacing: 0em;
    font-family: SF Pro Display, SF Pro Icons, Helvetica Neue, Helvetica, Arial,
      sans-serif;
  }
}

.typography-tile-headline {
  font-size: 14px;
  line-height: 1.2857742857;
  font-weight: 600;
  letter-spacing: -0.016em;
  font-family: SF Pro Text, SF Pro Icons, Helvetica Neue, Helvetica, Arial,
    sans-serif;
}

.tile-copy-headline {
  font-size: 24px;
  line-height: 1.1666666667;
  font-weight: 600;
  letter-spacing: 0.009em;
  font-family: SF Pro Display, SF Pro Icons, Helvetica Neue, Helvetica, Arial,
    sans-serif;
  margin-top: 0.4em;
}

@media (max-width: 734px) {
  .tile-copy-headline {
    font-size: 19px;
    line-height: 1.2105263158;
    font-weight: 600;
    letter-spacing: 0.012em;
    font-family: SF Pro Display, SF Pro Icons, Helvetica Neue, Helvetica, Arial,
      sans-serif;
  }
}

.tile-copy-body {
  font-size: 17px;
  line-height: 1.4705882353;
  font-weight: 400;
  letter-spacing: -0.37px;
  font-family: SF Pro Text, SF Pro Icons, Helvetica Neue, Helvetica, Arial,
    sans-serif;
  color: #1d1d1f;
}

@media (max-width: 734px) {
  .tile-copy-body {
    font-size: 14px;
    line-height: 1.4285914286;
    letter-spacing: -0.016em;
    font-family: SF Pro Text, SF Pro Icons, Helvetica Neue, Helvetica, Arial,
      sans-serif;
  }
}

.tile-copy-body strong {
  color: #1d1d1f;
}

/*line from 3525 to 3768*/
.paddlenav {
  --sk-paddlenav-diameter: 36px;
  --sk-paddlenav-arrow-color: rgba(0, 0, 0, 0.56);
  --sk-paddlenav-arrow-color-hover: rgba(0, 0, 0, 0.64);
  --sk-paddlenav-arrow-color-active: rgba(0, 0, 0, 0.64);
  --sk-paddlenav-background: transparent;
  --sk-paddlenav-background-hover: transparent;
  --sk-paddlenav-background-active: transparent;
}

.paddlenav,
.paddlenav ul {
  margin: 0;
  list-style: none;
  display: flex;
  justify-content: center;
}

.paddlenav .paddlenav-arrow {
  background: var(--sk-paddlenav-background);
  color: var(--sk-paddlenav-arrow-color);
  display: block;
  width: var(--sk-paddlenav-diameter);
  height: var(--sk-paddlenav-diameter);
  border-radius: var(--sk-paddlenav-diameter);
  font-style: normal;
  overflow: hidden;
  position: absolute;
  text-align: center;
  line-height: 1;
  transition: background 100ms linear, color 100ms linear, opacity 100ms linear;
}

.paddlenav .paddlenav-arrow-next,
.paddlenav .paddlenav-arrow-previous {
  margin-top: calc(var(--sk-paddlenav-diameter) * -0.5);
}

.paddlenav .paddlenav-arrow-down,
.paddlenav .paddlenav-arrow-up {
  margin-left: calc(var(--sk-paddlenav-diameter) * -0.5);
}

.paddlenav .paddlenav-arrow-next,
.paddlenav .paddlenav-arrow-previous {
  top: 50%;
}

.paddlenav .paddlenav-arrow-down,
.paddlenav .paddlenav-arrow-up {
  left: 50%;
}

.paddlenav .paddlenav-arrow svg path {
  fill: var(--sk-paddlenav-arrow-color);
  transition: fill 100ms linear;
}

.paddlenav .paddlenav-arrow:hover {
  background: var(--sk-paddlenav-background-hover);
  color: var(--sk-paddlenav-arrow-color-hover);
  text-decoration: none;
}

.paddlenav .paddlenav-arrow:hover svg path {
  fill: var(--sk-paddlenav-arrow-color-hover);
}

.paddlenav .paddlenav-arrow:active {
  background: var(--sk-paddlenav-background-active);
  color: var(--sk-paddlenav-arrow-color-active);
}

.paddlenav .paddlenav-arrow:active svg path {
  fill: var(--sk-paddlenav-arrow-color-active);
}

.paddlenav .paddlenav-arrow:focus-visible {
  outline: 2px solid var(--sk-focus-color, #0071e3);
  outline-offset: var(--sk-focus-offset-container, 3px);
}

.paddlenav .paddlenav-arrow.disabled,
.paddlenav .paddlenav-arrow:disabled {
  pointer-events: none;
  opacity: var(--sk-link-disabled-opacity, 0.42);
}

.paddlenav .paddlenav-arrow-previous {
  inset-inline-start: 18px;
}

.paddlenav .paddlenav-arrow-next {
  inset-inline-end: 18px;
}

.paddlenav .paddlenav-arrow-up {
  top: 18px;
}

.paddlenav .paddlenav-arrow-down {
  bottom: 18px;
}

.paddlenav-elevated {
  --sk-paddlenav-diameter: 56px;
}

.paddlenav-super {
  --sk-paddlenav-diameter: 90px;
}

.paddlenav-alpha {
  --sk-paddlenav-background: rgba(210, 210, 215, 0.64);
  --sk-paddlenav-background-hover: rgba(223, 223, 227, 0.6976);
  --sk-paddlenav-background-active: rgba(193, 193, 198, 0.6544);
}

.paddlenav-solid {
  --sk-paddlenav-background: rgb(232, 232, 237);
  --sk-paddlenav-background-hover: #ececf0;
  --sk-paddlenav-background-active: #dfdfe4;
}

html:not([dir="rtl"])
  .paddlenav-justified.paddlenav-outside
  .paddlenav-arrow-previous {
  left: calc(var(--sk-paddlenav-diameter) * -1 + -18px);
}

html:not([dir="rtl"])
  .paddlenav-justified.paddlenav-outside
  .paddlenav-arrow-next,
html[dir="rtl"]
  .paddlenav-justified.paddlenav-outside
  .paddlenav-arrow-previous {
  right: calc(var(--sk-paddlenav-diameter) * -1 + -18px);
}

html[dir="rtl"] .paddlenav-justified.paddlenav-outside .paddlenav-arrow-next {
  left: calc(var(--sk-paddlenav-diameter) * -1 + -18px);
}

.paddlenav-side-aligned .paddlenav-arrow-next,
.paddlenav-side-aligned .paddlenav-arrow-previous {
  top: 100%;
  margin-top: calc(var(--sk-paddlenav-diameter) * -1 + -18px);
}

html:not([dir="rtl"]) .paddlenav-side-aligned .paddlenav-arrow-previous {
  left: auto;
  right: calc(var(--sk-paddlenav-diameter) + 36px);
}

html[dir="rtl"] .paddlenav-side-aligned .paddlenav-arrow-previous {
  left: calc(var(--sk-paddlenav-diameter) + 36px);
  right: auto;
}

html:not([dir="rtl"]) .paddlenav-side-aligned .paddlenav-arrow-next {
  right: 18px;
}

html[dir="rtl"] .paddlenav-side-aligned .paddlenav-arrow-next {
  left: 18px;
}

.paddlenav-side-aligned.paddlenav-outside .paddlenav-arrow-next,
.paddlenav-side-aligned.paddlenav-outside .paddlenav-arrow-previous {
  top: 100%;
  margin-top: 18px;
}

html:not([dir="rtl"])
  .paddlenav-side-aligned.paddlenav-outside
  .paddlenav-arrow-previous {
  left: auto;
  right: calc(var(--sk-paddlenav-diameter) + 18px);
}

html[dir="rtl"]
  .paddlenav-side-aligned.paddlenav-outside
  .paddlenav-arrow-previous {
  right: auto;
  left: calc(var(--sk-paddlenav-diameter) + 18px);
}

html:not([dir="rtl"])
  .paddlenav-side-aligned.paddlenav-outside
  .paddlenav-arrow-next {
  right: 0;
}

html[dir="rtl"]
  .paddlenav-side-aligned.paddlenav-outside
  .paddlenav-arrow-next {
  left: 0;
}

.paddlenav-centered .paddlenav-arrow-next,
.paddlenav-centered .paddlenav-arrow-previous {
  top: 100%;
  margin-top: calc(var(--sk-paddlenav-diameter) * -1 + -18px);
}

.paddlenav-centered .paddlenav-arrow-previous {
  margin-inline-start: calc(var(--sk-paddlenav-diameter) * -1 + -9px);
}

html:not([dir="rtl"]) .paddlenav-centered .paddlenav-arrow-previous {
  left: auto;
}

html[dir="rtl"] .paddlenav-centered .paddlenav-arrow-previous {
  right: auto;
}

.paddlenav-centered .paddlenav-arrow-next {
  margin-inline-start: 9px;
}

html:not([dir="rtl"]) .paddlenav-centered .paddlenav-arrow-next {
  right: auto;
}

html[dir="rtl"] .paddlenav-centered .paddlenav-arrow-next {
  left: auto;
}

.paddlenav-centered.paddlenav-outside .paddlenav-arrow-next,
.paddlenav-centered.paddlenav-outside .paddlenav-arrow-previous {
  top: 100%;
  margin-top: 18px;
}

.paddlenav-centered.paddlenav-outside .paddlenav-arrow-previous {
  margin-inline-start: calc(var(--sk-paddlenav-diameter) * -1 + -9px);
}

html:not([dir="rtl"])
  .paddlenav-centered.paddlenav-outside
  .paddlenav-arrow-previous {
  left: auto;
}

html[dir="rtl"]
  .paddlenav-centered.paddlenav-outside
  .paddlenav-arrow-previous {
  right: auto;
}

.paddlenav-centered.paddlenav-outside .paddlenav-arrow-next {
  margin-inline-start: 9px;
}

html:not([dir="rtl"])
  .paddlenav-centered.paddlenav-outside
  .paddlenav-arrow-next {
  right: auto;
}

html[dir="rtl"] .paddlenav-centered.paddlenav-outside .paddlenav-arrow-next {
  left: auto;
}

/*3800*/
.tile {
  margin-inline-start: auto;
  margin-inline-end: auto;
  --sk-tile-box-shadow: initial;
  --sk-tile-background: rgb(255, 255, 255);
  --sk-tile-button-background: rgba(210, 210, 215, 0.64);
  --sk-tile-button-background-hover: rgba(223, 223, 227, 0.6976);
  --sk-tile-button-background-active: rgba(193, 193, 198, 0.6544);
  --sk-tile-button-icon-color: rgba(0, 0, 0, 0.56);
  --sk-tile-button-icon-color-hover: rgba(0, 0, 0, 0.64);
  box-sizing: border-box;
  height: 100%;
  position: relative;
  overflow: hidden;
  /*    background: var(--sk-tile-background);*/
  /*    box-shadow: var(--sk-tile-box-shadow);*/
}

.tile-content {
  --sk-tile-padding-large: var(--sk-tile-padding, 60px 8.3333333333%);
  --sk-tile-padding-xlarge: var(
    --sk-tile-padding,
    var(--sk-tile-padding-large)
  );
  --sk-tile-padding-medium: var(
    --sk-tile-padding,
    var(--sk-tile-padding-large)
  );
  --sk-tile-padding-small: var(--sk-tile-padding, var(--sk-tile-padding-large));
  padding: var(--sk-tile-padding-large);
}

/*@media only screen and (min-width: 1441px) {
    .tile-content {
        padding: var(--sk-tile-padding-xlarge);
        padding-top: 0px;
    }
}*/

@media only screen and (max-width: 1068px) {
  .tile-content {
    padding: var(--sk-tile-padding-medium);
  }
}

@media only screen and (max-width: 734px) {
  .tile-content {
    padding: var(--sk-tile-padding-small);
  }
}

.tile-button-wrapper {
  width: 44px;
  height: 44px;
  bottom: 16px;
  cursor: pointer;
  display: flex;
  justify-content: center;
  align-items: center;
  position: absolute;
}

@media only screen and (max-width: 1068px) {
  .tile-button-wrapper {
    bottom: 13px;
  }
}

html:not([dir="rtl"]) .tile-button-wrapper {
  right: 16px;
}

@media only screen and (max-width: 1068px) {
  html:not([dir="rtl"]) .tile-button-wrapper {
    right: 13px;
  }
}

html[dir="rtl"] .tile-button-wrapper {
  left: 16px;
}

@media only screen and (max-width: 1068px) {
  html[dir="rtl"] .tile-button-wrapper {
    left: 13px;
  }
}

.tile-button-wrapper:focus-visible {
  outline: none;
}

.tile-button-wrapper:focus-visible .tile-button {
  outline: 2px solid var(--sk-focus-color, #0071e3);
  outline-offset: var(--sk-focus-offset-container, 3px);
}

.tile-button {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  display: flex;
  justify-content: center;
  align-items: center;
  position: relative;
  transition: background-color 100ms linear;
  background: var(--sk-tile-button-background);
  color: var(--sk-tile-button-icon-color);
}

.tile-button:hover {
  background: var(--sk-tile-button-background-hover);
  color: var(--sk-tile-button-icon-color-hover);
}

.tile-button:active {
  background: var(--sk-tile-button-background-active);
}

.tile-button-solid {
  --sk-tile-button-icon-color: #636365;
  --sk-tile-button-icon-color-hover: #414141;
  --sk-tile-button-background: #e2e2e5;
  --sk-tile-button-background-hover: #e9e9eb;
  --sk-tile-button-background-active: #d6d6d9;
}

.tile-icon {
  fill: currentColor;
  position: absolute;
  inset-inline-start: 50%;
  width: 20px;
  height: 20px;
}

html:not([dir="rtl"]) .tile-icon {
  transform: translateX(-50%);
}

html[dir="rtl"] .tile-icon {
  transform: translateX(50%);
}

.tile-rounded {
  border-radius: 28px;
}

.tile-shadow {
  --sk-tile-box-shadow: 8px 8px 16px 0 rgba(0, 0, 0, 0.08);
}

/*line 4204*/
.section-content-responsive {
  margin-inline: auto;
  width: 87.5vw;
  max-width: var(--section-max-width);
}

/*4281*/
.tile-content .tile-link {
  margin-block-start: 0.8em;
}

.tile-content .tile-link + .tile-link {
  margin-block-start: 0.4em;
}

/*line 7188 to 7227*/
:root {
  --modal-button-size: 36px;
  --gallery-card-width: 372px;
  --gallery-card-height: 680px;
  --section-header: 50px;
  --nav-collective-height: calc(
    var(--r-globalnav-height, 0px) + var(--r-localnav-height, 0px) +
      var(--ribbon-height, 0px) + var(--r-localeswitcher-height, 0px) +
      var(--r-globalmessage-segment-height, 0px)
  );
  --section-max-width: 1260px;
}

@media only screen and (max-width: 1068px) {
  :root {
    --gallery-card-width: 344px;
    --gallery-card-height: 416px;
    --section-header: 30px;
  }
}

@media only screen and (max-width: 734px) {
  :root {
    --gallery-card-width: 260px;
    --gallery-card-height: 314px;
  }
}

.section {
  overflow: hidden;
  padding-block: 140px;
}

@media only screen and (max-width: 1068px) {
  .section {
    padding-block: 100px;
  }
}

@media only screen and (max-width: 734px) {
  .section {
    padding-block: 80px;
  }

  .section-ways-to-save-wts {
    padding-block-start: 74px;
  }
}

/*7263*/
.scroll-gallery {
  --section-header: 74px;
  --item-width: 406px;
  --item-height: 690px;
  --gallery-side-padding: max(
    calc(6.25vw - var(--modal-scrollbar-buffer, 0px) / 2),
    calc(
      50vw - var(--section-max-width) / 2 - var(--modal-scrollbar-buffer, 0px) /
        2
    )
  );
  width: 100%;
  position: relative;
  margin-block-start: var(--section-header);
}

@media only screen and (max-width: 1068px) {
  .scroll-gallery {
    --item-width: 295px;
    --item-height: 670px;
  }
}

@media only screen and (max-width: 734px) {
  .scroll-gallery {
    --item-width: 260px;
    --item-height: 420px;
    --section-header: 54px;
  }

  .scroll-gallery {
    --section-header: 40px;
  }
}

html.text-zoom .scroll-gallery {
  --item-width: 450px;
}

.scroll-gallery:has(.paddlenav-outside) {
  padding-block-end: calc(40px + var(--modal-button-size));
}

@media only screen and (max-width: 1068px) {
  .scroll-gallery:has(.paddlenav-outside) {
    padding-block-end: calc(30px + var(--modal-button-size));
  }
}

@media only screen and (max-width: 734px) {
  .scroll-gallery:has(.paddlenav-outside) {
    padding-block-end: calc(-16px + var(--modal-button-size));
  }
}

.scroll-gallery:has(.paddlenav-disabled) {
  padding-block-end: 0;
}

.scroll-gallery .scroll-container {
  overflow-x: scroll;
  scroll-snap-type: x mandatory;
  scroll-padding: calc(var(--gallery-side-padding));
  scrollbar-width: none;
}

.scroll-gallery .scroll-container::-webkit-scrollbar {
  display: none;
}

.scroll-gallery .item-container {
  list-style: none;
  margin: auto 0;
  padding: 0;
  display: grid;
  grid-auto-flow: column;
  grid-gap: 20px;
  gap: 20px;
  width: fit-content;
  padding-inline: var(--gallery-side-padding);
}

.scroll-gallery .gallery-item {
  position: relative;
  width: var(--item-width);
  min-height: var(--item-height);
  scroll-snap-align: start;
}

@media only screen and (min-width: 1069px) {
  /*.scroll-gallery.hardware-gallery-shelve .gallery-item {
        min-height: 690px;
    }*/
}

/*7331*/

/*line 7333 7533*/
.paddlenav {
  width: 87.5%;
  max-width: var(--section-max-width);
  position: relative;
  margin-inline: auto;
  display: none;
}

.paddlenav:not(.paddlenav-disabled) {
  display: block;
}

.paddlenav.paddlenav-side-aligned.paddlenav-outside .paddlenav-arrow {
  margin-block-start: 40px;
}

@media only screen and (max-width: 1068px) {
  .paddlenav.paddlenav-side-aligned.paddlenav-outside .paddlenav-arrow {
    margin-block-start: 30px;
  }
}

/*line 10863*/

.section-ways-to-save {
  background-color: #fff;
  padding-block-start: 0;
  padding-block-start: 140px;
}

.section.section-superpowers {
  padding-block-start: 66px;
  padding-bottom: 140px;
}

@media only screen and (max-width: 1068px) {
  .section.section-superpowers {
    padding-block-start: 70px;
    padding-bottom: 140px;
  }
}

@media only screen and (max-width: 734px) {
  .section.section-superpowers {
    padding-block-start: 64px;
    padding-bottom: 64px;
  }
}

.section.alt-background {
  background-color: #fafafc;
}

@media only screen and (max-width: 1068px) {
  .section-ways-to-save {
    padding-block-start: 100px;
  }
}

@media only screen and (max-width: 734px) {
  .section-ways-to-save {
    padding-block-start: 80px;
  }
}

.section-ways-to-save .ways-to-save-gallery {
  --item-width: 372px;
}

@media only screen and (max-width: 1440px) {
  .section-ways-to-save .ways-to-save-gallery {
    --item-width: 372px;
  }
}

@media only screen and (max-width: 1068px) {
  .section-ways-to-save .ways-to-save-gallery {
    --item-width: 372px;
  }
}

@media only screen and (max-width: 734px) {
  .section-ways-to-save .ways-to-save-gallery {
    --item-width: 280px;
  }
}

html.text-zoom .section-ways-to-save .ways-to-save-gallery {
  --item-width: 372px;
}

.section-ways-to-save .tile {
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  position: relative;
}

.section-ways-to-save .tile-content {
  padding: 0px 16px 16px;
}

.section-ways-to-save .tile .tile-media {
  margin-block-start: 0px;
  padding-block-end: 0px;
  margin-block-end: 30px;
  align-self: flex-start;
  border-radius: 28px;
  overflow: hidden;
}

/*@media (min-width: 1441px) {
    .section-ways-to-save .hardware-gallery-shelve .tile .tile-media {
        height: 687px;
    }
}*/

.section-ways-to-save .tile .tile-media picture {
  display: block;
  font-size: 0px;
}

@media only screen and (max-width: 1068px) {
  .section-ways-to-save .nowrap {
    display: inline;
    white-space: normal;
  }
}

.section-ways-to-save
  .paddlenav-side-aligned.paddlenav-outside
  .paddlenav-arrow {
  margin-block-start: 34px;
}

@media only screen and (max-width: 1068px) {
  .section-ways-to-save
    .paddlenav-side-aligned.paddlenav-outside
    .paddlenav-arrow {
    margin-block-start: 20px;
  }
}

@media only screen and (max-width: 734px) {
  .section-ways-to-save
    .paddlenav-side-aligned.paddlenav-outside
    .paddlenav-arrow {
    margin-block-start: 14px;
  }
}

/*welcome video styles*/
.section-welcome {
  padding-top: 80px;
}

@media (max-width: 1068px) {
  .section-welcome {
    padding-top: 72px;
  }
}

@media (max-width: 734px) {
  .section-welcome {
    padding-top: 56px;
  }
}

html.enhanced .section-welcome .welcome-video-wall-container {
  animation-name: welcomeFadeIn, welcomeMoveIn;
  animation-duration: calc(var(--global-staggered-opacity-duration) * 1s),
    calc(var(--global-staggered-translate-y-duration) * 1s);
  animation-timing-function: var(--global-animation-easing-function);
  animation-fill-mode: both;
}

html.enhanced .section-welcome .welcome-video-wall-container {
  animation-delay: calc(var(--global-staggered-delay) * 3s);
}

@keyframes welcomeFadeIn {
  0% {
    opacity: 0;
  }

  100% {
    opacity: 1;
  }
}

@keyframes welcomeMoveIn {
  0% {
    transform: translateY(var(--global-staggered-translate-y));
  }

  100% {
    transform: translateY(0);
  }
}

.welcome-video-wall-container {
  --corner-radius: 40px;
  height: 80vh;
  min-height: 650px;
  max-width: 1920px;
  max-height: 1260px;
  margin: 0 auto;
  width: 87.5%;
  display: flex;
  justify-content: center;
  align-items: center;
  position: relative;
}

@media (min-width: 1441px) {
  .welcome-video-wall-container {
    --corner-radius: 44px;
  }
}

@media (max-width: 1068px) {
  .welcome-video-wall-container {
    --corner-radius: 36px;
  }
}

@media (max-width: 734px) {
  .welcome-video-wall-container {
    --corner-radius: 28px;
    max-height: 960px;
  }
}

html.enhanced .welcome-video-wall-container {
  clip-path: inset(0px 0% 0px 0% round 0px);
  width: 100%;
}

.welcome-video-content-container {
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  z-index: 1;
  overflow: visible;
  -webkit-box-flex: 1;
  -ms-flex-positive: 1;
  flex-grow: 1;
}

.welcome-video-content-container .welcome-image {
  z-index: 1;
  position: absolute;
  border: 0;
  margin: 0;
  padding: 0;
  left: calc(50% + 0px);
  right: auto;
  bottom: 0px;
  top: auto;
  -webkit-transform: translatex(-50%);
  transform: translatex(-50%);
}

.welcome-video-content-container .welcome-image-education-mac {
  width: 3008px;
  height: 740px;
  background-size: 3008px 740px;
  background-repeat: no-repeat;
  background-image: url("/in/education/mac/images/overview/hero/hero_dsb1__dagkm4t9ni82_xlarge.jpg");
}

@media only screen and (-webkit-min-device-pixel-ratio: 1.5),
  only screen and (min-resolution: 1.5dppx),
  (-webkit-min-device-pixel-ratio: 1.5),
  (min-resolution: 144dpi) {
  .welcome-video-content-container .welcome-image-education-mac {
    background-image: url("/in/education/mac/images/overview/hero/hero_dsb1__dagkm4t9ni82_xlarge_2x.jpg");
  }
}

@media only screen and (max-width: 1440px) {
  .welcome-video-content-container .welcome-image-education-mac {
    width: 1440px;
    height: 740px;
    background-size: 1440px 740px;
    background-repeat: no-repeat;
    background-image: url("/in/education/mac/images/overview/hero/hero_dsb1__dagkm4t9ni82_large.jpg");
  }
}

@media only screen and (max-width: 1440px) and (-webkit-min-device-pixel-ratio: 1.5),
  only screen and (max-width: 1440px) and (min-resolution: 1.5dppx),
  only screen and (max-width: 1440px) and (min-resolution: 144dpi) {
  .welcome-video-content-container .welcome-image-education-mac {
    background-image: url("/in/education/mac/images/overview/hero/hero_dsb1__dagkm4t9ni82_large_2x.jpg");
  }
}

@media only screen and (max-width: 1068px) {
  .welcome-video-content-container .welcome-image-education-mac {
    width: 1068px;
    height: 650px;
    background-size: 1068px 650px;
    background-repeat: no-repeat;
    background-image: url("/in/education/mac/images/overview/hero/hero_dsb1__dagkm4t9ni82_medium.jpg");
  }
}

@media only screen and (max-width: 1068px) and (-webkit-min-device-pixel-ratio: 1.5),
  only screen and (max-width: 1068px) and (min-resolution: 1.5dppx),
  only screen and (max-width: 1068px) and (min-resolution: 144dpi) {
  .welcome-video-content-container .welcome-image-education-mac {
    background-image: url("/in/education/mac/images/overview/hero/hero_dsb1__dagkm4t9ni82_medium_2x.jpg");
  }
}

@media only screen and (max-width: 734px) {
  .welcome-video-content-container .welcome-image-education-mac {
    width: 732px;
    height: 600px;
    background-size: 732px 600px;
    background-repeat: no-repeat;
    background-image: url("/in/education/mac/images/overview/hero/hero_dsb1__dagkm4t9ni82_small.jpg");
  }
}

@media only screen and (max-width: 734px) and (-webkit-min-device-pixel-ratio: 1.5),
  only screen and (max-width: 734px) and (min-resolution: 1.5dppx),
  only screen and (max-width: 734px) and (min-resolution: 144dpi) {
  .welcome-video-content-container .welcome-image-education-mac {
    background-image: url("/in/education/mac/images/overview/hero/hero_dsb1__dagkm4t9ni82_small_2x.jpg");
  }
}

.section-welcome {
  background-color: #180703;
}

html.safari .welcome-video-content-container {
  clip-path: inset(1px round var(--corner-radius));
}

html.safari.enhanced .welcome-video-content-container {
  clip-path: none;
}

html.enhanced .welcome-video-content-container {
  transform: scale(1);
  border-radius: unset;
}

.welcome-video-content-container {
  transform: none !important;
  clip-path: none !important;
  border-radius: 0;
}

.welcome-video-start-frame {
  position: absolute;
  height: 100%;
}

.welcome-video-start-frame img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  /*    object-position: center top;*/
}

@media screen and (min-width: 3000px) {
  .welcome-video-start-frame img {
    object-position: center center;
  }
}

.loaded .welcome-video-start-frame {
  visibility: hidden;
}

.welcome-video-start-frame,
.welcome-video-video {
  top: 0%;
  transform: translateY(0%);
  width: calc(100% + 2px);
  left: -1px;
}

.welcome-video-video {
  object-fit: cover;
  position: relative;
  left: 0;
}

.welcome-video-scrim {
  position: absolute;
  bottom: 0;
  background: linear-gradient(
    180deg,
    rgba(0, 0, 0, 0.24),
    rgba(0, 0, 0, 0.42) 40%,
    rgba(0, 0, 0, 0.56)
  );
  height: 100%;
  width: 100%;
  transition: opacity 100ms linear;
  pointer-events: none;
}

.welcome-video-scrim-clear {
  opacity: 0;
}

.welcome-video-controls-container {
  --button-v-position: 40px;
  --button-movement: -40px;
  --button-size: 36px;
  --scrim-background-color: rgb(51, 51, 54);
  --icon-color: rgba(255, 255, 255, 0.8);
  position: absolute;
  bottom: var(--button-v-position);
  right: 40px;
  height: calc(100% - var(--button-v-position));
  display: flex;
  align-items: flex-end;
}

@media (max-width: 734px) {
  .welcome-video-controls-container {
    --button-movement: -28px;
    --button-v-position: 28px;
    right: 28px;
  }
}

html.enhanced .welcome-video-controls-container {
  opacity: 0;
}

.timedout .welcome-video-controls-container {
  display: none;
}

.welcome-video-control-item {
  --scrim-background-color: rgb(232, 232, 237);
  --scrim-hover-background-color: #ececf0;
  --scrim-active-background-color: #dfdfe4;
  --icon-color: rgba(0, 0, 0, 0.56);
  --icon-interaction-color: rgba(0, 0, 0, 0.5952);
  position: sticky;
  bottom: var(--button-v-position);
  border-radius: 50%;
  display: flex;
  align-items: center;
  height: 36px;
  width: 36px;
  outline: none;
  margin: var(--button-v-position) 0 0 0;
  padding: 0;
  border: 0;
  justify-content: center;
  cursor: pointer;
  transition: background-color 100ms linear, color 100ms linear;
  background-color: var(--scrim-background-color);
  color: var(--icon-color);
}

.theme-dark .welcome-video-control-item {
  --scrim-background-color: rgb(51, 51, 54);
  --scrim-hover-background-color: #37373a;
  --scrim-active-background-color: #2f2f32;
  --icon-color: rgba(255, 255, 255, 0.8);
  --icon-interaction-color: rgb(255, 255, 255);
}

.welcome-video-control-item:focus {
  box-shadow: 0px 0px 0px 3px #fff, 0px 0px 0px 5px #0071e3;
  outline: none;
}

.welcome-video-control-item:hover {
  background-color: var(--scrim-hover-background-color);
  color: var(--icon-interaction-color);
}

.welcome-video-control-item svg {
  fill: currentColor;
  pointer-events: none;
}

.welcome-video-control-item .control-centered-small-icon {
  height: 20px;
  width: 20px;
}

.playing .welcome-video-control-item .control-icon-play {
  display: none;
}

.paused .welcome-video-control-item .control-icon-play {
  display: block;
}

.paused .welcome-video-control-item .control-icon-pause {
  display: none;
}

/*@media only screen and (max-width: 734px) {
    .no-not-small-desktop .section-welcome .welcome-video-wall-container {
        max-height: calc(731px - 48px);
    }
}*/

.section-welcome {
  padding-top: 0;
}

.section-welcome.phase1 .welcome-video-start-frame img {
  object-position: center top;
}

.section-welcome .welcome-video-wall-container {
  clip-path: none !important;
  width: 100%;
  display: block;
  /*    min-height: 740px;*/
  height: 740px;
  /*    max-height: calc(940px - 44px - 45px);*/
  max-width: 100%;
}

@media only screen and (max-width: 1068px) {
  .section-welcome .welcome-video-wall-container {
    height: 650px;
  }
}

@media only screen and (max-width: 734px) {
  .section-welcome .welcome-video-wall-container {
    min-height: 453px;
    height: 600px;
  }
}

/*@media only screen and (max-width: 440px) {
    .section-welcome .welcome-video-wall-container {
        max-height: calc(93vh - 48px - 48px);
        min-height: 0;
    }
}*/

.welcome-video-content-container {
  transform: none !important;
  clip-path: none !important;
  border-radius: 0;
}

.welcome-video-controls-container {
  transform: none !important;
  bottom: auto;
  top: 30px;
  right: 30px;
  height: auto;
}

.welcome-video-control-item {
  margin-top: 0;
}

.section-welcome .copy-wrapper {
  position: absolute;
  bottom: 53px;
  left: 0;
  right: 0;
  text-align: center;
  color: var(--sk-headline-text-color, rgb(29, 29, 31));
}

@media only screen and (min-width: 1069px) {
  .section-welcome .copy-wrapper {
    bottom: 93px;
  }
}

.typography-tour-hero-headline:lang(ja) {
  font-size: 32px;
  font-weight: 600;
  letter-spacing: 0.004em;
  line-height: 1.21875;
  font-family: SF Pro JP, SF Pro Display, SF Pro Icons, Hiragino Kaku Gothic Pro,
    ヒラギノ角ゴ Pro W3, メイリオ, Meiryo, ＭＳ Ｐゴシック,
    Helvetica Neue, Helvetica, Arial, sans-serif;
}

@media only screen and (max-width: 734px) {
  .typography-tour-hero-headline:lang(ja) {
    font-size: 21px;
    font-weight: 600;
    letter-spacing: 0.011em;
    line-height: 1.2380952381;
    font-family: SF Pro JP, SF Pro Display, SF Pro Icons,
      Hiragino Kaku Gothic Pro, ヒラギノ角ゴ Pro W3, メイリオ, Meiryo,
      ＭＳ Ｐゴシック, Helvetica Neue, Helvetica, Arial, sans-serif;
  }
}

.typography-hero-headline {
  margin-top: 0.2em;
  font-size: 72px;
  font-weight: 700;
  line-height: 1.0875;
  letter-spacing: 0em;
  font-family: SF Pro JP, SF Pro Display, SF Pro Icons, Hiragino Kaku Gothic Pro,
    ヒラギノ角ゴ Pro W3, メイリオ, Meiryo, ＭＳ Ｐゴシック,
    Helvetica Neue, Helvetica, Arial, sans-serif;
}

@media only screen and (max-width: 1068px) {
  .typography-hero-headline {
    font-size: 64px;
  }
}

@media only screen and (max-width: 734px) {
  .typography-hero-headline {
    font-size: 56px;
  }
}

@media only screen and (max-width: 480px) {
  .typography-hero-headline {
    font-size: 40px;
  }
}

@media only screen and (max-width: 350px) {
  .typography-hero-headline {
    font-size: 36px;
  }
}

.section-welcome .hero-copy {
  font-size: 30px;
  font-weight: 600;
}

@media only screen and (max-width: 1068px) {
  .section-welcome .hero-copy {
    font-size: 26px;
  }
}

@media only screen and (max-width: 734px) {
  .section-welcome .hero-copy {
    padding: 0 5%;
    font-size: 21px;
  }
}

.typography-hero-headline .eyeblow {
  font-size: 30px;
  display: block;
  margin-bottom: 10px;
}

@media only screen and (max-width: 734px) {
  .typography-hero-headline .eyeblow {
    font-size: 24px;
  }
}

.welcome-copy-wrapper {
  padding: 74px 0;
}

.typography-hero-intro {
  text-align: center;
  font-size: 21px;
  line-height: 1.381002381;
  color: #86868b;
  font-weight: 600;
}

.typography-hero-intro .highlight {
  color: #1d1d1f;
}

@media only screen and (max-width: 1068px) {
  .typography-hero-intro {
    font-size: 19px;
    line-height: 1.4211026316;
  }
}

@media only screen and (max-width: 734px) {
  .typography-hero-intro {
    max-width: 315px;
    margin-left: auto;
    margin-right: auto;
  }
}

.section-welcome .hero-logo {
  width: 182px;
  height: 30px;
  background-size: 182px 30px;
  background-repeat: no-repeat;
  background-image: url(/jp/mac/gakusei/images/overview/hero/header_eyebrow__eoanwibhva4i_large.png);
  margin: 0 auto;
}

@media (-webkit-min-device-pixel-ratio: 1.5),
  (min-resolution: 144dpi),
  only screen and (-webkit-min-device-pixel-ratio: 1.5),
  only screen and (min-resolution: 1.5dppx) {
  .section-welcome .hero-logo {
    background-image: url(/jp/mac/gakusei/images/overview/hero/header_eyebrow__eoanwibhva4i_large_2x.png);
  }
}

@media only screen and (max-width: 1068px) {
  .section-welcome .hero-logo {
    width: 158px;
    height: 26px;
    background-size: 158px 26px;
    background-repeat: no-repeat;
    background-image: url(/jp/mac/gakusei/images/overview/hero/header_eyebrow__eoanwibhva4i_medium.png);
  }
}

@media only screen and (max-width: 1068px) and (-webkit-min-device-pixel-ratio: 1.5),
  only screen and (max-width: 1068px) and (min-resolution: 1.5dppx),
  only screen and (max-width: 1068px) and (min-resolution: 144dpi) {
  .section-welcome .hero-logo {
    background-image: url(/jp/mac/gakusei/images/overview/hero/header_eyebrow__eoanwibhva4i_medium_2x.png);
  }
}

@media only screen and (max-width: 734px) {
  .section-welcome .hero-logo {
    width: 148px;
    height: 24px;
    background-size: 148px 24px;
    background-repeat: no-repeat;
    background-image: url(/jp/mac/gakusei/images/overview/hero/header_eyebrow__eoanwibhva4i_small.png);
  }
}

@media only screen and (max-width: 734px) and (-webkit-min-device-pixel-ratio: 1.5),
  only screen and (max-width: 734px) and (min-resolution: 1.5dppx),
  only screen and (max-width: 734px) and (min-resolution: 144dpi) {
  .section-welcome .hero-logo {
    background-image: url(/jp/mac/gakusei/images/overview/hero/header_eyebrow__eoanwibhva4i_small_2x.png);
  }
}

@media only screen and (max-width: 480px) {
  .section-welcome .hero-logo {
    width: 128px;
    height: 22px;
    background-size: 128px 22px;
    background-repeat: no-repeat;
    background-image: url(/jp/mac/gakusei/images/overview/hero/header_eyebrow__eoanwibhva4i_xsmall.png);
  }
}

@media only screen and (max-width: 480px) and (-webkit-min-device-pixel-ratio: 1.5),
  only screen and (max-width: 480px) and (min-resolution: 1.5dppx),
  only screen and (max-width: 480px) and (min-resolution: 144dpi) {
  .section-welcome .hero-logo {
    background-image: url(/jp/mac/gakusei/images/overview/hero/header_eyebrow__eoanwibhva4i_xsmall_2x.png);
  }
}

@media only screen and (max-width: 350px) {
  .section-welcome .hero-logo {
    width: 114px;
    height: 19px;
    background-size: 114px 19px;
    background-repeat: no-repeat;
    background-image: url(/jp/mac/gakusei/images/overview/hero/header_eyebrow__eoanwibhva4i_xxsmall.png);
  }

  .typography-hero-headline {
    margin-top: 0.1em;
  }

  .section-welcome .copy-wrapper {
    bottom: 42px;
  }
}

@media only screen and (max-width: 350px) and (-webkit-min-device-pixel-ratio: 1.5),
  only screen and (max-width: 350px) and (min-resolution: 1.5dppx),
  only screen and (max-width: 350px) and (min-resolution: 144dpi) {
  .section-welcome .hero-logo {
    background-image: url(/jp/mac/gakusei/images/overview/hero/header_eyebrow__eoanwibhva4i_xxsmall_2x.png);
  }
}

/*accordion*/
.accordion {
  --accordion-button-padding-top: 1em;
  --accordion-button-padding-bottom: 1em;
  --accordion-border-color: rgb(210, 210, 215);
  --accordion-border-width: 1px;
  --accordion-content-padding-top: 0;
  --accordion-content-padding-bottom: 1em;
  --accordion-content-paragraph-max-width: 83.3333333333%;
  --accordion-content-paragraph-padding-top: 0;
  --accordion-content-paragraph-padding-bottom: 0.8em;
  --accordion-icon-color: rgb(134, 134, 139);
  --accordion-icon-color-hover: rgb(110, 110, 115);
  --accordion-icon-width: 1em;
  --accordion-icon-height: auto;
  --accordion-icon-stroke-width: 2.25;
  --accordion-icon-svg-width: 1em;
  --accordion-title-max-width: 83.3333333333%;
  --accordion-transition-duration: 400ms;
  margin: 0;
  list-style: none;
}

.accordion-item {
  font-size: 24px;
  line-height: 1.1666666667;
  font-weight: 600;
  letter-spacing: 0.009em;
  font-family: SF Pro Display, SF Pro Icons, Helvetica Neue, Helvetica, Arial,
    sans-serif;
  border-color: var(--accordion-border-color);
  border-top: var(--accordion-border-width) solid var(--accordion-border-color);
}

.accordion-item:lang(ja) {
  line-height: 1.25;
  font-family: SF Pro JP, SF Pro Display, SF Pro Icons, Hiragino Kaku Gothic Pro,
    ヒラギノ角ゴ Pro W3, メイリオ, Meiryo, ＭＳ Ｐゴシック, Helvetica Neue,
    Helvetica, Arial, sans-serif;
}

.accordion-item:lang(ko) {
  line-height: 1.2916666667;
  font-family: SF Pro KR, SF Pro Display, SF Pro Icons, Apple Gothic, HY Gulim,
    MalgunGothic, HY Dotum, Lexi Gulim, Helvetica Neue, Helvetica, Arial,
    sans-serif;
}

.accordion-item:lang(th) {
  line-height: 1.375;
  font-family: SF Pro TH, SF Pro Display, SF Pro Icons, Helvetica Neue,
    Helvetica, Arial, sans-serif;
}

.accordion-item:lang(zh) {
  line-height: 1.2916666667;
}

.accordion-item:lang(ar) {
  font-family: SF Pro AR, SF Pro AR Display, SF Pro Display, SF Pro Gulf,
    SF Pro Icons, Helvetica Neue, Helvetica, Arial, sans-serif;
}

.accordion-item:lang(zh-CN) {
  font-family: SF Pro SC, SF Pro Display, SF Pro Icons, PingFang SC,
    Helvetica Neue, Helvetica, Arial, sans-serif;
}

.accordion-item:lang(zh-HK) {
  font-family: SF Pro HK, SF Pro Display, SF Pro Icons, PingFang HK,
    Helvetica Neue, Helvetica, Arial, sans-serif;
}

.accordion-item:lang(zh-MO) {
  font-family: SF Pro HK, SF Pro TC, SF Pro Display, SF Pro Icons, PingFang HK,
    Helvetica Neue, Helvetica, Arial, sans-serif;
}

.accordion-item:lang(zh-TW) {
  font-family: SF Pro TC, SF Pro Display, SF Pro Icons, PingFang TC,
    Helvetica Neue, Helvetica, Arial, sans-serif;
}

@media (max-width: 1068px) {
  .accordion-item {
    font-size: 21px;
    line-height: 1.1904761905;
    font-weight: 600;
    letter-spacing: 0.011em;
    font-family: SF Pro Display, SF Pro Icons, Helvetica Neue, Helvetica, Arial,
      sans-serif;
  }

  .accordion-item:lang(ja) {
    line-height: 1.2380952381;
    font-family: SF Pro JP, SF Pro Display, SF Pro Icons,
      Hiragino Kaku Gothic Pro, ヒラギノ角ゴ Pro W3, メイリオ, Meiryo,
      ＭＳ Ｐゴシック, Helvetica Neue, Helvetica, Arial, sans-serif;
  }

  .accordion-item:lang(ko) {
    line-height: 1.2858042857;
    font-family: SF Pro KR, SF Pro Display, SF Pro Icons, Apple Gothic, HY Gulim,
      MalgunGothic, HY Dotum, Lexi Gulim, Helvetica Neue, Helvetica, Arial,
      sans-serif;
  }

  .accordion-item:lang(th) {
    line-height: 1.381002381;
    font-family: SF Pro TH, SF Pro Display, SF Pro Icons, Helvetica Neue,
      Helvetica, Arial, sans-serif;
  }

  .accordion-item:lang(zh) {
    line-height: 1.3334033333;
  }

  .accordion-item:lang(ar) {
    font-family: SF Pro AR, SF Pro AR Display, SF Pro Display, SF Pro Gulf,
      SF Pro Icons, Helvetica Neue, Helvetica, Arial, sans-serif;
  }

  .accordion-item:lang(zh-CN) {
    font-family: SF Pro SC, SF Pro Display, SF Pro Icons, PingFang SC,
      Helvetica Neue, Helvetica, Arial, sans-serif;
  }

  .accordion-item:lang(zh-HK) {
    font-family: SF Pro HK, SF Pro Display, SF Pro Icons, PingFang HK,
      Helvetica Neue, Helvetica, Arial, sans-serif;
  }

  .accordion-item:lang(zh-MO) {
    font-family: SF Pro HK, SF Pro TC, SF Pro Display, SF Pro Icons, PingFang HK,
      Helvetica Neue, Helvetica, Arial, sans-serif;
  }

  .accordion-item:lang(zh-TW) {
    font-family: SF Pro TC, SF Pro Display, SF Pro Icons, PingFang TC,
      Helvetica Neue, Helvetica, Arial, sans-serif;
  }
}

@media (max-width: 734px) {
  .accordion-item {
    font-size: 19px;
    line-height: 1.2105263158;
    font-weight: 600;
    letter-spacing: 0.012em;
    font-family: SF Pro Display, SF Pro Icons, Helvetica Neue, Helvetica, Arial,
      sans-serif;
  }

  .accordion-item:lang(ja) {
    line-height: 1.2631578947;
    font-family: SF Pro JP, SF Pro Display, SF Pro Icons,
      Hiragino Kaku Gothic Pro, ヒラギノ角ゴ Pro W3, メイリオ, Meiryo,
      ＭＳ Ｐゴシック, Helvetica Neue, Helvetica, Arial, sans-serif;
  }

  .accordion-item:lang(ko) {
    line-height: 1.3157894737;
    font-family: SF Pro KR, SF Pro Display, SF Pro Icons, Apple Gothic, HY Gulim,
      MalgunGothic, HY Dotum, Lexi Gulim, Helvetica Neue, Helvetica, Arial,
      sans-serif;
  }

  .accordion-item:lang(th) {
    line-height: 1.3684410526;
    font-family: SF Pro TH, SF Pro Display, SF Pro Icons, Helvetica Neue,
      Helvetica, Arial, sans-serif;
  }

  .accordion-item:lang(zh) {
    line-height: 1.3684410526;
  }

  .accordion-item:lang(ar) {
    font-family: SF Pro AR, SF Pro AR Display, SF Pro Display, SF Pro Gulf,
      SF Pro Icons, Helvetica Neue, Helvetica, Arial, sans-serif;
  }

  .accordion-item:lang(zh-CN) {
    font-family: SF Pro SC, SF Pro Display, SF Pro Icons, PingFang SC,
      Helvetica Neue, Helvetica, Arial, sans-serif;
  }

  .accordion-item:lang(zh-HK) {
    font-family: SF Pro HK, SF Pro Display, SF Pro Icons, PingFang HK,
      Helvetica Neue, Helvetica, Arial, sans-serif;
  }

  .accordion-item:lang(zh-MO) {
    font-family: SF Pro HK, SF Pro TC, SF Pro Display, SF Pro Icons, PingFang HK,
      Helvetica Neue, Helvetica, Arial, sans-serif;
  }

  .accordion-item:lang(zh-TW) {
    font-family: SF Pro TC, SF Pro Display, SF Pro Icons, PingFang TC,
      Helvetica Neue, Helvetica, Arial, sans-serif;
  }
}

.accordion-item:first-child {
  --accordion-border-width: 0;
}

.accordion-title {
  font-size: inherit;
  line-height: inherit;
  letter-spacing: inherit;
}

.accordion-title .accordion-title-text {
  max-width: var(--accordion-title-max-width);
}

.accordion-button {
  letter-spacing: inherit;
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  width: 100%;
  position: relative;
  padding-top: var(--accordion-button-padding-top);
  padding-bottom: var(--accordion-button-padding-bottom);
}

.accordion-button:focus-visible {
  outline: none;
}

.accordion-button:focus-visible:after {
  outline: 2px solid var(--sk-focus-color, #0071e3);
  outline-offset: var(--sk-focus-offset, 1px);
}

.accordion-button:after {
  content: "";
  display: block;
  width: 100%;
  top: 0.6em;
  height: calc(100% - 1.2em);
  position: absolute;
}

.accordion-icon {
  margin: 0;
  transition: color 100ms linear;
  display: flex;
  justify-content: center;
  align-items: center;
  color: var(--accordion-icon-color);
  width: var(--accordion-icon-width);
  height: var(--accordion-icon-height);
  stroke-width: var(--accordion-icon-stroke-width);
}

.accordion-icon .accordion-icon-svg {
  overflow: visible;
}

.accordion-button:hover .accordion-icon {
  color: var(--accordion-icon-color-hover);
}

.accordion-icon .accordion-icon-svg {
  width: var(--accordion-icon-svg-width);
}

.accordion-tray {
  margin: 0;
  transition: height ease-in-out;
  transition-duration: var(--accordion-transition-duration);
}

html.js .accordion-item.collapsed > .accordion-tray {
  height: 0;
}

.accordion-item.expanded > .accordion-tray {
  overflow: visible;
}

.accordion-item.animating > .accordion-tray,
.accordion-item.collapsed > .accordion-tray,
.accordion-tray {
  overflow: hidden;
}

@media (prefers-reduced-motion) {
  .accordion-tray {
    transition: none;
  }
}

.accordion-content {
  padding-top: var(--accordion-content-padding-top);
  padding-bottom: var(--accordion-content-padding-bottom);
}

.accordion-content .accordion-content-paragraph {
  font-size: 17px;
  line-height: 1.4705882353;
  font-weight: 400;
  letter-spacing: -0.022em;
  font-family: SF Pro Text, SF Pro Icons, Helvetica Neue, Helvetica, Arial,
    sans-serif;
  max-width: var(--accordion-content-paragraph-max-width);
  padding-top: var(--accordion-content-paragraph-padding-top);
  padding-bottom: var(--accordion-content-paragraph-padding-bottom);
}

.accordion-content .accordion-content-paragraph:lang(ar) {
  letter-spacing: 0em;
  font-family: SF Pro AR, SF Pro AR Text, SF Pro Text, SF Pro Gulf, SF Pro Icons,
    Helvetica Neue, Helvetica, Arial, sans-serif;
}

.accordion-content .accordion-content-paragraph:lang(ja) {
  line-height: 1.3529611765;
  letter-spacing: 0em;
  font-family: SF Pro JP, SF Pro Text, SF Pro Icons, Hiragino Kaku Gothic Pro,
    ヒラギノ角ゴ Pro W3, メイリオ, Meiryo, ＭＳ Ｐゴシック, Helvetica Neue,
    Helvetica, Arial, sans-serif;
}

.accordion-content .accordion-content-paragraph:lang(ko) {
  line-height: 1.5882352941;
  letter-spacing: 0em;
  font-family: SF Pro KR, SF Pro Text, SF Pro Icons, Apple Gothic, HY Gulim,
    MalgunGothic, HY Dotum, Lexi Gulim, Helvetica Neue, Helvetica, Arial,
    sans-serif;
}

.accordion-content .accordion-content-paragraph:lang(zh) {
  letter-spacing: 0em;
}

.accordion-content .accordion-content-paragraph:lang(th) {
  line-height: 1.3529611765;
  letter-spacing: 0em;
  font-family: SF Pro TH, SF Pro Text, SF Pro Icons, Helvetica Neue, Helvetica,
    Arial, sans-serif;
}

.accordion-content .accordion-content-paragraph:lang(zh-CN) {
  font-family: SF Pro SC, SF Pro Text, SF Pro Icons, PingFang SC, Helvetica Neue,
    Helvetica, Arial, sans-serif;
}

.accordion-content .accordion-content-paragraph:lang(zh-HK) {
  font-family: SF Pro HK, SF Pro Text, SF Pro Icons, PingFang HK, Helvetica Neue,
    Helvetica, Arial, sans-serif;
}

.accordion-content .accordion-content-paragraph:lang(zh-MO) {
  font-family: SF Pro HK, SF Pro TC, SF Pro Text, SF Pro Icons, PingFang HK,
    Helvetica Neue, Helvetica, Arial, sans-serif;
}

.accordion-content .accordion-content-paragraph:lang(zh-TW) {
  font-family: SF Pro TC, SF Pro Text, SF Pro Icons, PingFang TC, Helvetica Neue,
    Helvetica, Arial, sans-serif;
}

.accordion-elevated .accordion-item {
  font-size: 32px;
  line-height: 1.125;
  font-weight: 600;
  letter-spacing: 0.004em;
  font-family: SF Pro Display, SF Pro Icons, Helvetica Neue, Helvetica, Arial,
    sans-serif;
}

.accordion-elevated .accordion-item:lang(ja) {
  line-height: 1.21875;
  font-family: SF Pro JP, SF Pro Display, SF Pro Icons, Hiragino Kaku Gothic Pro,
    ヒラギノ角ゴ Pro W3, メイリオ, Meiryo, ＭＳ Ｐゴシック, Helvetica Neue,
    Helvetica, Arial, sans-serif;
}

.accordion-elevated .accordion-item:lang(ko) {
  line-height: 1.21875;
  font-family: SF Pro KR, SF Pro Display, SF Pro Icons, Apple Gothic, HY Gulim,
    MalgunGothic, HY Dotum, Lexi Gulim, Helvetica Neue, Helvetica, Arial,
    sans-serif;
}

.accordion-elevated .accordion-item:lang(th) {
  line-height: 1.375;
  font-family: SF Pro TH, SF Pro Display, SF Pro Icons, Helvetica Neue,
    Helvetica, Arial, sans-serif;
}

.accordion-elevated .accordion-item:lang(zh) {
  line-height: 1.21875;
}

.accordion-elevated .accordion-item:lang(ar) {
  font-family: SF Pro AR, SF Pro AR Display, SF Pro Display, SF Pro Gulf,
    SF Pro Icons, Helvetica Neue, Helvetica, Arial, sans-serif;
}

.accordion-elevated .accordion-item:lang(zh-CN) {
  font-family: SF Pro SC, SF Pro Display, SF Pro Icons, PingFang SC,
    Helvetica Neue, Helvetica, Arial, sans-serif;
}

.accordion-elevated .accordion-item:lang(zh-HK) {
  font-family: SF Pro HK, SF Pro Display, SF Pro Icons, PingFang HK,
    Helvetica Neue, Helvetica, Arial, sans-serif;
}

.accordion-elevated .accordion-item:lang(zh-MO) {
  font-family: SF Pro HK, SF Pro TC, SF Pro Display, SF Pro Icons, PingFang HK,
    Helvetica Neue, Helvetica, Arial, sans-serif;
}

.accordion-elevated .accordion-item:lang(zh-TW) {
  font-family: SF Pro TC, SF Pro Display, SF Pro Icons, PingFang TC,
    Helvetica Neue, Helvetica, Arial, sans-serif;
}

@media (max-width: 1068px) {
  .accordion-elevated .accordion-item {
    font-size: 28px;
    line-height: 1.1428571429;
    font-weight: 600;
    letter-spacing: 0.007em;
    font-family: SF Pro Display, SF Pro Icons, Helvetica Neue, Helvetica, Arial,
      sans-serif;
  }

  .accordion-elevated .accordion-item:lang(ja) {
    line-height: 1.1786114286;
    font-family: SF Pro JP, SF Pro Display, SF Pro Icons,
      Hiragino Kaku Gothic Pro, ヒラギノ角ゴ Pro W3, メイリオ, Meiryo,
      ＭＳ Ｐゴシック, Helvetica Neue, Helvetica, Arial, sans-serif;
  }

  .accordion-elevated .accordion-item:lang(ko) {
    line-height: 1.25;
    font-family: SF Pro KR, SF Pro Display, SF Pro Icons, Apple Gothic, HY Gulim,
      MalgunGothic, HY Dotum, Lexi Gulim, Helvetica Neue, Helvetica, Arial,
      sans-serif;
  }

  .accordion-elevated .accordion-item:lang(th) {
    line-height: 1.3928571429;
    font-family: SF Pro TH, SF Pro Display, SF Pro Icons, Helvetica Neue,
      Helvetica, Arial, sans-serif;
  }

  .accordion-elevated .accordion-item:lang(zh) {
    line-height: 1.25;
  }

  .accordion-elevated .accordion-item:lang(ar) {
    font-family: SF Pro AR, SF Pro AR Display, SF Pro Display, SF Pro Gulf,
      SF Pro Icons, Helvetica Neue, Helvetica, Arial, sans-serif;
  }

  .accordion-elevated .accordion-item:lang(zh-CN) {
    font-family: SF Pro SC, SF Pro Display, SF Pro Icons, PingFang SC,
      Helvetica Neue, Helvetica, Arial, sans-serif;
  }

  .accordion-elevated .accordion-item:lang(zh-HK) {
    font-family: SF Pro HK, SF Pro Display, SF Pro Icons, PingFang HK,
      Helvetica Neue, Helvetica, Arial, sans-serif;
  }

  .accordion-elevated .accordion-item:lang(zh-MO) {
    font-family: SF Pro HK, SF Pro TC, SF Pro Display, SF Pro Icons, PingFang HK,
      Helvetica Neue, Helvetica, Arial, sans-serif;
  }

  .accordion-elevated .accordion-item:lang(zh-TW) {
    font-family: SF Pro TC, SF Pro Display, SF Pro Icons, PingFang TC,
      Helvetica Neue, Helvetica, Arial, sans-serif;
  }
}

@media (max-width: 734px) {
  .accordion-elevated .accordion-item {
    font-size: 24px;
    line-height: 1.1666666667;
    font-weight: 600;
    letter-spacing: 0.009em;
    font-family: SF Pro Display, SF Pro Icons, Helvetica Neue, Helvetica, Arial,
      sans-serif;
  }

  .accordion-elevated .accordion-item:lang(ja) {
    line-height: 1.25;
    font-family: SF Pro JP, SF Pro Display, SF Pro Icons,
      Hiragino Kaku Gothic Pro, ヒラギノ角ゴ Pro W3, メイリオ, Meiryo,
      ＭＳ Ｐゴシック, Helvetica Neue, Helvetica, Arial, sans-serif;
  }

  .accordion-elevated .accordion-item:lang(ko) {
    line-height: 1.2916666667;
    font-family: SF Pro KR, SF Pro Display, SF Pro Icons, Apple Gothic, HY Gulim,
      MalgunGothic, HY Dotum, Lexi Gulim, Helvetica Neue, Helvetica, Arial,
      sans-serif;
  }

  .accordion-elevated .accordion-item:lang(th) {
    line-height: 1.375;
    font-family: SF Pro TH, SF Pro Display, SF Pro Icons, Helvetica Neue,
      Helvetica, Arial, sans-serif;
  }

  .accordion-elevated .accordion-item:lang(zh) {
    line-height: 1.2916666667;
  }

  .accordion-elevated .accordion-item:lang(ar) {
    font-family: SF Pro AR, SF Pro AR Display, SF Pro Display, SF Pro Gulf,
      SF Pro Icons, Helvetica Neue, Helvetica, Arial, sans-serif;
  }

  .accordion-elevated .accordion-item:lang(zh-CN) {
    font-family: SF Pro SC, SF Pro Display, SF Pro Icons, PingFang SC,
      Helvetica Neue, Helvetica, Arial, sans-serif;
  }

  .accordion-elevated .accordion-item:lang(zh-HK) {
    font-family: SF Pro HK, SF Pro Display, SF Pro Icons, PingFang HK,
      Helvetica Neue, Helvetica, Arial, sans-serif;
  }

  .accordion-elevated .accordion-item:lang(zh-MO) {
    font-family: SF Pro HK, SF Pro TC, SF Pro Display, SF Pro Icons, PingFang HK,
      Helvetica Neue, Helvetica, Arial, sans-serif;
  }

  .accordion-elevated .accordion-item:lang(zh-TW) {
    font-family: SF Pro TC, SF Pro Display, SF Pro Icons, PingFang TC,
      Helvetica Neue, Helvetica, Arial, sans-serif;
  }
}

.accordion-reduced .accordion-item {
  font-size: 17px;
  line-height: 1.2353641176;
  font-weight: 600;
  letter-spacing: -0.022em;
  font-family: SF Pro Text, SF Pro Icons, Helvetica Neue, Helvetica, Arial,
    sans-serif;
}

.accordion-reduced .accordion-item:lang(ar) {
  letter-spacing: 0em;
  font-family: SF Pro AR, SF Pro AR Text, SF Pro Text, SF Pro Gulf, SF Pro Icons,
    Helvetica Neue, Helvetica, Arial, sans-serif;
}

.accordion-reduced .accordion-item:lang(ja) {
  letter-spacing: 0em;
  font-family: SF Pro JP, SF Pro Text, SF Pro Icons, Hiragino Kaku Gothic Pro,
    ヒラギノ角ゴ Pro W3, メイリオ, Meiryo, ＭＳ Ｐゴシック, Helvetica Neue,
    Helvetica, Arial, sans-serif;
}

.accordion-reduced .accordion-item:lang(ko) {
  line-height: 1.3529611765;
  letter-spacing: 0em;
  font-family: SF Pro KR, SF Pro Text, SF Pro Icons, Apple Gothic, HY Gulim,
    MalgunGothic, HY Dotum, Lexi Gulim, Helvetica Neue, Helvetica, Arial,
    sans-serif;
}

.accordion-reduced .accordion-item:lang(zh) {
  line-height: 1.3529611765;
  letter-spacing: 0em;
}

.accordion-reduced .accordion-item:lang(th) {
  line-height: 1.3529611765;
  letter-spacing: 0em;
  font-family: SF Pro TH, SF Pro Text, SF Pro Icons, Helvetica Neue, Helvetica,
    Arial, sans-serif;
}

.accordion-reduced .accordion-item:lang(zh-CN) {
  font-family: SF Pro SC, SF Pro Text, SF Pro Icons, PingFang SC, Helvetica Neue,
    Helvetica, Arial, sans-serif;
}

.accordion-reduced .accordion-item:lang(zh-HK) {
  font-family: SF Pro HK, SF Pro Text, SF Pro Icons, PingFang HK, Helvetica Neue,
    Helvetica, Arial, sans-serif;
}

.accordion-reduced .accordion-item:lang(zh-MO) {
  font-family: SF Pro HK, SF Pro TC, SF Pro Text, SF Pro Icons, PingFang HK,
    Helvetica Neue, Helvetica, Arial, sans-serif;
}

.accordion-reduced .accordion-item:lang(zh-TW) {
  font-family: SF Pro TC, SF Pro Text, SF Pro Icons, PingFang TC, Helvetica Neue,
    Helvetica, Arial, sans-serif;
}

@media (max-width: 1068px) {
  .accordion-reduced .accordion-item {
    font-size: 17px;
    line-height: 1.2353641176;
    font-weight: 600;
    letter-spacing: -0.022em;
    font-family: SF Pro Text, SF Pro Icons, Helvetica Neue, Helvetica, Arial,
      sans-serif;
  }

  .accordion-reduced .accordion-item:lang(ar) {
    letter-spacing: 0em;
    font-family: SF Pro AR, SF Pro AR Text, SF Pro Text, SF Pro Gulf,
      SF Pro Icons, Helvetica Neue, Helvetica, Arial, sans-serif;
  }

  .accordion-reduced .accordion-item:lang(ja) {
    letter-spacing: 0em;
    font-family: SF Pro JP, SF Pro Text, SF Pro Icons, Hiragino Kaku Gothic Pro,
      ヒラギノ角ゴ Pro W3, メイリオ, Meiryo, ＭＳ Ｐゴシック, Helvetica Neue,
      Helvetica, Arial, sans-serif;
  }

  .accordion-reduced .accordion-item:lang(ko) {
    line-height: 1.3529611765;
    letter-spacing: 0em;
    font-family: SF Pro KR, SF Pro Text, SF Pro Icons, Apple Gothic, HY Gulim,
      MalgunGothic, HY Dotum, Lexi Gulim, Helvetica Neue, Helvetica, Arial,
      sans-serif;
  }

  .accordion-reduced .accordion-item:lang(zh) {
    line-height: 1.3529611765;
    letter-spacing: 0em;
  }

  .accordion-reduced .accordion-item:lang(th) {
    line-height: 1.3529611765;
    letter-spacing: 0em;
    font-family: SF Pro TH, SF Pro Text, SF Pro Icons, Helvetica Neue, Helvetica,
      Arial, sans-serif;
  }

  .accordion-reduced .accordion-item:lang(zh-CN) {
    font-family: SF Pro SC, SF Pro Text, SF Pro Icons, PingFang SC,
      Helvetica Neue, Helvetica, Arial, sans-serif;
  }

  .accordion-reduced .accordion-item:lang(zh-HK) {
    font-family: SF Pro HK, SF Pro Text, SF Pro Icons, PingFang HK,
      Helvetica Neue, Helvetica, Arial, sans-serif;
  }

  .accordion-reduced .accordion-item:lang(zh-MO) {
    font-family: SF Pro HK, SF Pro TC, SF Pro Text, SF Pro Icons, PingFang HK,
      Helvetica Neue, Helvetica, Arial, sans-serif;
  }

  .accordion-reduced .accordion-item:lang(zh-TW) {
    font-family: SF Pro TC, SF Pro Text, SF Pro Icons, PingFang TC,
      Helvetica Neue, Helvetica, Arial, sans-serif;
  }
}

@media (max-width: 734px) {
  .accordion-reduced .accordion-item {
    font-size: 14px;
    line-height: 1.2857742857;
    font-weight: 600;
    letter-spacing: -0.016em;
    font-family: SF Pro Text, SF Pro Icons, Helvetica Neue, Helvetica, Arial,
      sans-serif;
  }

  .accordion-reduced .accordion-item:lang(ar) {
    letter-spacing: 0em;
    font-family: SF Pro AR, SF Pro AR Text, SF Pro Text, SF Pro Gulf,
      SF Pro Icons, Helvetica Neue, Helvetica, Arial, sans-serif;
  }

  .accordion-reduced .accordion-item:lang(ja) {
    line-height: 1.3571828571;
    letter-spacing: 0em;
    font-family: SF Pro JP, SF Pro Text, SF Pro Icons, Hiragino Kaku Gothic Pro,
      ヒラギノ角ゴ Pro W3, メイリオ, Meiryo, ＭＳ Ｐゴシック, Helvetica Neue,
      Helvetica, Arial, sans-serif;
  }

  .accordion-reduced .accordion-item:lang(ko) {
    line-height: 1.4285914286;
    letter-spacing: 0em;
    font-family: SF Pro KR, SF Pro Text, SF Pro Icons, Apple Gothic, HY Gulim,
      MalgunGothic, HY Dotum, Lexi Gulim, Helvetica Neue, Helvetica, Arial,
      sans-serif;
  }

  .accordion-reduced .accordion-item:lang(zh) {
    line-height: 1.3571828571;
    letter-spacing: 0em;
  }

  .accordion-reduced .accordion-item:lang(th) {
    line-height: 1.3571828571;
    letter-spacing: 0em;
    font-family: SF Pro TH, SF Pro Text, SF Pro Icons, Helvetica Neue, Helvetica,
      Arial, sans-serif;
  }

  .accordion-reduced .accordion-item:lang(zh-CN) {
    font-family: SF Pro SC, SF Pro Text, SF Pro Icons, PingFang SC,
      Helvetica Neue, Helvetica, Arial, sans-serif;
  }

  .accordion-reduced .accordion-item:lang(zh-HK) {
    font-family: SF Pro HK, SF Pro Text, SF Pro Icons, PingFang HK,
      Helvetica Neue, Helvetica, Arial, sans-serif;
  }

  .accordion-reduced .accordion-item:lang(zh-MO) {
    font-family: SF Pro HK, SF Pro TC, SF Pro Text, SF Pro Icons, PingFang HK,
      Helvetica Neue, Helvetica, Arial, sans-serif;
  }

  .accordion-reduced .accordion-item:lang(zh-TW) {
    font-family: SF Pro TC, SF Pro Text, SF Pro Icons, PingFang TC,
      Helvetica Neue, Helvetica, Arial, sans-serif;
  }
}

.accordion-reduced .accordion-content .accordion-content-paragraph {
  font-size: 14px;
  line-height: 1.4285914286;
  font-weight: 400;
  letter-spacing: -0.016em;
  font-family: SF Pro Text, SF Pro Icons, Helvetica Neue, Helvetica, Arial,
    sans-serif;
}

.accordion-reduced .accordion-content .accordion-content-paragraph:lang(ar) {
  letter-spacing: 0em;
  font-family: SF Pro AR, SF Pro AR Text, SF Pro Text, SF Pro Gulf, SF Pro Icons,
    Helvetica Neue, Helvetica, Arial, sans-serif;
}

.accordion-reduced .accordion-content .accordion-content-paragraph:lang(ja) {
  line-height: 1.4;
  letter-spacing: 0em;
  font-family: SF Pro JP, SF Pro Text, SF Pro Icons, Hiragino Kaku Gothic Pro,
    ヒラギノ角ゴ Pro W3, メイリオ, Meiryo, ＭＳ Ｐゴシック, Helvetica Neue,
    Helvetica, Arial, sans-serif;
}

.accordion-reduced .accordion-content .accordion-content-paragraph:lang(ko) {
  line-height: 1.5714285714;
  letter-spacing: 0em;
  font-family: SF Pro KR, SF Pro Text, SF Pro Icons, Apple Gothic, HY Gulim,
    MalgunGothic, HY Dotum, Lexi Gulim, Helvetica Neue, Helvetica, Arial,
    sans-serif;
}

.accordion-reduced .accordion-content .accordion-content-paragraph:lang(zh) {
  line-height: 1.5;
  letter-spacing: 0em;
}

.accordion-reduced .accordion-content .accordion-content-paragraph:lang(th) {
  line-height: 1.3571828571;
  letter-spacing: 0em;
  font-family: SF Pro TH, SF Pro Text, SF Pro Icons, Helvetica Neue, Helvetica,
    Arial, sans-serif;
}

.accordion-reduced .accordion-content .accordion-content-paragraph:lang(zh-CN) {
  font-family: SF Pro SC, SF Pro Text, SF Pro Icons, PingFang SC, Helvetica Neue,
    Helvetica, Arial, sans-serif;
}

.accordion-reduced .accordion-content .accordion-content-paragraph:lang(zh-HK) {
  font-family: SF Pro HK, SF Pro Text, SF Pro Icons, PingFang HK, Helvetica Neue,
    Helvetica, Arial, sans-serif;
}

.accordion-reduced .accordion-content .accordion-content-paragraph:lang(zh-MO) {
  font-family: SF Pro HK, SF Pro TC, SF Pro Text, SF Pro Icons, PingFang HK,
    Helvetica Neue, Helvetica, Arial, sans-serif;
}

.accordion-reduced .accordion-content .accordion-content-paragraph:lang(zh-TW) {
  font-family: SF Pro TC, SF Pro Text, SF Pro Icons, PingFang TC, Helvetica Neue,
    Helvetica, Arial, sans-serif;
}

.accordion-numbered {
  --accordion-number-side-padding: 0.4em;
  --accordion-number-icon-display: inline-block;
}

.accordion-numbered .accordion-title-text {
  display: flex;
  align-items: baseline;
}

.accordion-numbered .accordion-title-text::after,
.accordion-numbered .accordion-title-text::before {
  font-family: SF Pro Icons;
  color: inherit;
  display: inline-block;
  font-style: normal;
  font-weight: inherit;
  font-size: inherit;
  line-height: 1;
  text-decoration: underline;
  position: relative;
  z-index: 1;
  alt: "";
  text-decoration: none;
}

.accordion-numbered .accordion-title-text::before {
  display: none;
}

.accordion-numbered .accordion-title-text::after,
.accordion-numbered .accordion-title-text::before {
  content: "";
}

.accordion-numbered .accordion-title-text::before {
  display: inline-block;
  padding-inline-end: var(--accordion-number-side-padding);
  top: 0;
}

.accordion-numbered .accordion-title-text::after {
  display: none;
}

.accordion-numbered .accordion-title-text::before {
  display: var(--accordion-number-icon-display);
}

.accordion-numbered .accordion-item:nth-child(2) .accordion-title-text::after,
.accordion-numbered .accordion-item:nth-child(2) .accordion-title-text::before {
  content: "";
}

.accordion-numbered .accordion-item:nth-child(3) .accordion-title-text::after,
.accordion-numbered .accordion-item:nth-child(3) .accordion-title-text::before {
  content: "";
}

.accordion-numbered .accordion-item:nth-child(4) .accordion-title-text::after,
.accordion-numbered .accordion-item:nth-child(4) .accordion-title-text::before {
  content: "";
}

.accordion-numbered .accordion-item:nth-child(5) .accordion-title-text::after,
.accordion-numbered .accordion-item:nth-child(5) .accordion-title-text::before {
  content: "";
}

.accordion-numbered .accordion-item:nth-child(6) .accordion-title-text::after,
.accordion-numbered .accordion-item:nth-child(6) .accordion-title-text::before {
  content: "";
}

.accordion-numbered .accordion-item:nth-child(7) .accordion-title-text::after,
.accordion-numbered .accordion-item:nth-child(7) .accordion-title-text::before {
  content: "";
}

.accordion-numbered .accordion-item:nth-child(8) .accordion-title-text::after,
.accordion-numbered .accordion-item:nth-child(8) .accordion-title-text::before {
  content: "";
}

.accordion-numbered .accordion-item:nth-child(9) .accordion-title-text::after,
.accordion-numbered .accordion-item:nth-child(9) .accordion-title-text::before {
  content: "";
}

.accordion-numbered .accordion-item:nth-child(10) .accordion-title-text::after,
.accordion-numbered
  .accordion-item:nth-child(10)
  .accordion-title-text::before {
  content: "";
}

.accordion-numbered .accordion-item:nth-child(11) .accordion-title-text::after,
.accordion-numbered
  .accordion-item:nth-child(11)
  .accordion-title-text::before {
  content: "";
}

.accordion-numbered .accordion-item:nth-child(12) .accordion-title-text::after,
.accordion-numbered
  .accordion-item:nth-child(12)
  .accordion-title-text::before {
  content: "";
}

.accordion-numbered .accordion-item:nth-child(13) .accordion-title-text::after,
.accordion-numbered
  .accordion-item:nth-child(13)
  .accordion-title-text::before {
  content: "";
}

.accordion-numbered .accordion-item:nth-child(14) .accordion-title-text::after,
.accordion-numbered
  .accordion-item:nth-child(14)
  .accordion-title-text::before {
  content: "";
}

.accordion-numbered .accordion-item:nth-child(15) .accordion-title-text::after,
.accordion-numbered
  .accordion-item:nth-child(15)
  .accordion-title-text::before {
  content: "";
}

.accordion-numbered .accordion-item:nth-child(16) .accordion-title-text::after,
.accordion-numbered
  .accordion-item:nth-child(16)
  .accordion-title-text::before {
  content: "";
}

.accordion-numbered .accordion-item:nth-child(17) .accordion-title-text::after,
.accordion-numbered
  .accordion-item:nth-child(17)
  .accordion-title-text::before {
  content: "";
}

.accordion-numbered .accordion-item:nth-child(18) .accordion-title-text::after,
.accordion-numbered
  .accordion-item:nth-child(18)
  .accordion-title-text::before {
  content: "";
}

.accordion-numbered .accordion-item:nth-child(19) .accordion-title-text::after,
.accordion-numbered
  .accordion-item:nth-child(19)
  .accordion-title-text::before {
  content: "";
}

.accordion-numbered .accordion-item:nth-child(20) .accordion-title-text::after,
.accordion-numbered
  .accordion-item:nth-child(20)
  .accordion-title-text::before {
  content: "";
}

.accordion-numbered
  .accordion-nested:not(.accordion-numbered)
  .accordion-title-text {
  --accordion-number-icon-display: none;
}

.accordion-inset {
  --accordion-number-icon-width: 1.1875em;
  --accordion-number-side-padding: 0.4em;
}

.accordion-inset .accordion-content {
  padding-inline-start: calc(
    var(--accordion-number-icon-width) + var(--accordion-number-side-padding)
  );
}

.accordion-inset .accordion-nested:not(.accordion-inset) .accordion-content {
  --accordion-number-icon-width: 0;
  --accordion-number-side-padding: 0;
}

.accordion-nested .accordion-icon {
  --accordion-icon-stroke-width: 2.75;
  --accordion-icon-width: 24px;
}

@media (max-width: 1068px) {
  .accordion-nested .accordion-icon {
    --accordion-icon-width: 21px;
  }
}

@media (max-width: 734px) {
  .accordion-nested .accordion-icon {
    --accordion-icon-width: 19px;
  }
}

.accordion-elevated .accordion-nested .accordion-icon {
  --accordion-icon-stroke-width: 2.75;
  --accordion-icon-width: 32px;
}

@media (max-width: 1068px) {
  .accordion-elevated .accordion-nested .accordion-icon {
    --accordion-icon-width: 28px;
  }
}

@media (max-width: 734px) {
  .accordion-elevated .accordion-nested .accordion-icon {
    --accordion-icon-width: 24px;
  }
}

.accordion-reduced .accordion-nested .accordion-icon {
  --accordion-icon-stroke-width: 2.25;
  --accordion-icon-width: 17px;
}

@media (max-width: 1068px) {
  .accordion-reduced .accordion-nested .accordion-icon {
    --accordion-icon-width: 17px;
  }
}

@media (max-width: 734px) {
  .accordion-reduced .accordion-nested .accordion-icon {
    --accordion-icon-width: 14px;
  }
}

.accordion-toggle-all {
  display: flex;
  justify-content: flex-end;
}

.accordion-toggle-all .accordion-toggle-all-button {
  font-size: 14px;
  line-height: 1.4285914286;
  font-weight: 400;
  letter-spacing: -0.016em;
  font-family: SF Pro Text, SF Pro Icons, Helvetica Neue, Helvetica, Arial,
    sans-serif;
  margin-bottom: 12px;
}

.accordion-toggle-all .accordion-toggle-all-button:lang(ar) {
  letter-spacing: 0em;
  font-family: SF Pro AR, SF Pro AR Text, SF Pro Text, SF Pro Gulf, SF Pro Icons,
    Helvetica Neue, Helvetica, Arial, sans-serif;
}

.accordion-toggle-all .accordion-toggle-all-button:lang(ja) {
  line-height: 1.4;
  letter-spacing: 0em;
  font-family: SF Pro JP, SF Pro Text, SF Pro Icons, Hiragino Kaku Gothic Pro,
    ヒラギノ角ゴ Pro W3, メイリオ, Meiryo, ＭＳ Ｐゴシック, Helvetica Neue,
    Helvetica, Arial, sans-serif;
}

.accordion-toggle-all .accordion-toggle-all-button:lang(ko) {
  line-height: 1.5714285714;
  letter-spacing: 0em;
  font-family: SF Pro KR, SF Pro Text, SF Pro Icons, Apple Gothic, HY Gulim,
    MalgunGothic, HY Dotum, Lexi Gulim, Helvetica Neue, Helvetica, Arial,
    sans-serif;
}

.accordion-toggle-all .accordion-toggle-all-button:lang(zh) {
  line-height: 1.5;
  letter-spacing: 0em;
}

.accordion-toggle-all .accordion-toggle-all-button:lang(th) {
  line-height: 1.3571828571;
  letter-spacing: 0em;
  font-family: SF Pro TH, SF Pro Text, SF Pro Icons, Helvetica Neue, Helvetica,
    Arial, sans-serif;
}

.accordion-toggle-all .accordion-toggle-all-button:lang(zh-CN) {
  font-family: SF Pro SC, SF Pro Text, SF Pro Icons, PingFang SC, Helvetica Neue,
    Helvetica, Arial, sans-serif;
}

.accordion-toggle-all .accordion-toggle-all-button:lang(zh-HK) {
  font-family: SF Pro HK, SF Pro Text, SF Pro Icons, PingFang HK, Helvetica Neue,
    Helvetica, Arial, sans-serif;
}

.accordion-toggle-all .accordion-toggle-all-button:lang(zh-MO) {
  font-family: SF Pro HK, SF Pro TC, SF Pro Text, SF Pro Icons, PingFang HK,
    Helvetica Neue, Helvetica, Arial, sans-serif;
}

.accordion-toggle-all .accordion-toggle-all-button:lang(zh-TW) {
  font-family: SF Pro TC, SF Pro Text, SF Pro Icons, PingFang TC, Helvetica Neue,
    Helvetica, Arial, sans-serif;
}

.accordion-toggle-all .accordion-toggle-all-collapse.hidden,
.accordion-toggle-all .accordion-toggle-all-expand.hidden {
  display: none;
}

.accordion-dark,
.theme-dark .accordion,
.theme-light .accordion-dark {
  --accordion-border-color: rgb(66, 66, 69);
  --accordion-icon-color: rgb(110, 110, 115);
  --accordion-icon-color-hover: rgb(134, 134, 139);
}

.accordion-light,
.theme-dark .accordion-light,
.theme-light .accordion {
  --accordion-border-color: rgb(210, 210, 215);
  --accordion-icon-color: rgb(134, 134, 139);
  --accordion-icon-color-hover: rgb(110, 110, 115);
}

.accordion-wrapper {
  border-radius: var(--global-card-corner-radius);
  --accordion-side-padding: 90px;
  --accordion-width: 350px;
  --accordion-content-width: 323px;
}

@media (min-width: 1441px) {
  .accordion-wrapper {
    --accordion-side-padding: 120px;
  }
}

@media (max-width: 1068px) {
  .accordion-wrapper {
    --accordion-side-padding: 45px;
  }
}

@media (max-width: 734px) {
  .accordion-wrapper {
    --accordion-side-padding: 30px;
  }
}

.accordion {
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: center;
  height: var(--accordion-height, auto);
  padding: 120px var(--accordion-side-padding);
}

@media (min-width: 1069px) {
  .accordion {
    width: var(--accordion-width);
  }
}

@media (max-width: 1068px) {
  .accordion {
    padding-top: 30px;
    padding-bottom: 30px;
  }
}

.accordion.animating {
  pointer-events: none;
}

.accordion .accordion-item:first-of-type {
  border-top: none;
}

.accordion .accordion-item.expanded .accordion-title {
  pointer-events: all;
}

.accordion .accordion-item .accordion-button {
  align-items: center;
}

.accordion .accordion-item .accordion-button .accordion-title-text {
  text-align: start;
}

.accordion .accordion-item .accordion-icon {
  font-size: 20px;
}

.accordion .accordion-item .accordion-paragraph-text {
  font-size: 17px;
  line-height: 1.4705882353;
  font-weight: 400;
  letter-spacing: -0.022em;
  font-family: SF Pro Text, SF Pro Icons, Helvetica Neue, Helvetica, Arial,
    sans-serif;
}

.accordion .accordion-item .accordion-paragraph-text:lang(ar) {
  letter-spacing: 0em;
  font-family: SF Pro AR, SF Pro AR Text, SF Pro Text, SF Pro Gulf, SF Pro Icons,
    Helvetica Neue, Helvetica, Arial, sans-serif;
}

.accordion .accordion-item .accordion-paragraph-text:lang(ja) {
  line-height: 1.3529611765;
  letter-spacing: 0em;
  font-family: SF Pro JP, SF Pro Text, SF Pro Icons, Hiragino Kaku Gothic Pro,
    ヒラギノ角ゴ Pro W3, メイリオ, Meiryo, ＭＳ Ｐゴシック, Helvetica Neue,
    Helvetica, Arial, sans-serif;
}

.accordion .accordion-item .accordion-paragraph-text:lang(ko) {
  line-height: 1.5882352941;
  letter-spacing: 0em;
  font-family: SF Pro KR, SF Pro Text, SF Pro Icons, Apple Gothic, HY Gulim,
    MalgunGothic, HY Dotum, Lexi Gulim, Helvetica Neue, Helvetica, Arial,
    sans-serif;
}

.accordion .accordion-item .accordion-paragraph-text:lang(zh) {
  letter-spacing: 0em;
}

.accordion .accordion-item .accordion-paragraph-text:lang(th) {
  line-height: 1.3529611765;
  letter-spacing: 0em;
  font-family: SF Pro TH, SF Pro Text, SF Pro Icons, Helvetica Neue, Helvetica,
    Arial, sans-serif;
}

.accordion .accordion-item .accordion-paragraph-text:lang(zh-CN) {
  font-family: SF Pro SC, SF Pro Text, SF Pro Icons, PingFang SC, Helvetica Neue,
    Helvetica, Arial, sans-serif;
}

.accordion .accordion-item .accordion-paragraph-text:lang(zh-HK) {
  font-family: SF Pro HK, SF Pro Text, SF Pro Icons, PingFang HK, Helvetica Neue,
    Helvetica, Arial, sans-serif;
}

.accordion .accordion-item .accordion-paragraph-text:lang(zh-MO) {
  font-family: SF Pro HK, SF Pro TC, SF Pro Text, SF Pro Icons, PingFang HK,
    Helvetica Neue, Helvetica, Arial, sans-serif;
}

.accordion .accordion-item .accordion-paragraph-text:lang(zh-TW) {
  font-family: SF Pro TC, SF Pro Text, SF Pro Icons, PingFang TC, Helvetica Neue,
    Helvetica, Arial, sans-serif;
}

@media (max-width: 734px) {
  .accordion .accordion-item .accordion-paragraph-text {
    font-size: 14px;
    line-height: 1.4285914286;
    font-weight: 400;
    letter-spacing: -0.016em;
    font-family: SF Pro Text, SF Pro Icons, Helvetica Neue, Helvetica, Arial,
      sans-serif;
  }

  .accordion .accordion-item .accordion-paragraph-text:lang(ar) {
    letter-spacing: 0em;
    font-family: SF Pro AR, SF Pro AR Text, SF Pro Text, SF Pro Gulf,
      SF Pro Icons, Helvetica Neue, Helvetica, Arial, sans-serif;
  }

  .accordion .accordion-item .accordion-paragraph-text:lang(ja) {
    line-height: 1.4;
    letter-spacing: 0em;
    font-family: SF Pro JP, SF Pro Text, SF Pro Icons, Hiragino Kaku Gothic Pro,
      ヒラギノ角ゴ Pro W3, メイリオ, Meiryo, ＭＳ Ｐゴシック, Helvetica Neue,
      Helvetica, Arial, sans-serif;
  }

  .accordion .accordion-item .accordion-paragraph-text:lang(ko) {
    line-height: 1.5714285714;
    letter-spacing: 0em;
    font-family: SF Pro KR, SF Pro Text, SF Pro Icons, Apple Gothic, HY Gulim,
      MalgunGothic, HY Dotum, Lexi Gulim, Helvetica Neue, Helvetica, Arial,
      sans-serif;
  }

  .accordion .accordion-item .accordion-paragraph-text:lang(zh) {
    line-height: 1.5;
    letter-spacing: 0em;
  }

  .accordion .accordion-item .accordion-paragraph-text:lang(th) {
    line-height: 1.3571828571;
    letter-spacing: 0em;
    font-family: SF Pro TH, SF Pro Text, SF Pro Icons, Helvetica Neue, Helvetica,
      Arial, sans-serif;
  }

  .accordion .accordion-item .accordion-paragraph-text:lang(zh-CN) {
    font-family: SF Pro SC, SF Pro Text, SF Pro Icons, PingFang SC,
      Helvetica Neue, Helvetica, Arial, sans-serif;
  }

  .accordion .accordion-item .accordion-paragraph-text:lang(zh-HK) {
    font-family: SF Pro HK, SF Pro Text, SF Pro Icons, PingFang HK,
      Helvetica Neue, Helvetica, Arial, sans-serif;
  }

  .accordion .accordion-item .accordion-paragraph-text:lang(zh-MO) {
    font-family: SF Pro HK, SF Pro TC, SF Pro Text, SF Pro Icons, PingFang HK,
      Helvetica Neue, Helvetica, Arial, sans-serif;
  }

  .accordion .accordion-item .accordion-paragraph-text:lang(zh-TW) {
    font-family: SF Pro TC, SF Pro Text, SF Pro Icons, PingFang TC,
      Helvetica Neue, Helvetica, Arial, sans-serif;
  }
}

.accordion .accordion-item .typography-accordion-copy {
  margin-right: 40px;
}

@media (min-width: 735px) and (max-width: 1068px) {
  .accordion .accordion-item .typography-accordion-copy {
    padding-bottom: 0;
  }

  .accordion .accordion-item .image-container {
    margin-top: 40px;
    margin-bottom: 20px;
  }
}

@media (max-width: 734px) {
  .accordion .accordion-item .typography-site-caption,
  .accordion .accordion-item h4.accordion-title {
    margin-inline-start: 0;
    margin-inline-end: 0;
    width: auto;
  }

  .accordion .accordion-item .typography-accordion-copy {
    margin-right: 28px;
    padding-bottom: 0;
  }

  .accordion .accordion-item .accordion-icon {
    font-size: 17px;
  }
}

.accordion-content {
  display: flex;
  flex-direction: column;
}

@media (min-width: 1069px) {
  .accordion-content {
    width: calc(100% - 40px);
  }
}

@media (max-width: 734px) {
  .accordion-content {
    padding-bottom: 40px;
  }
}

.accordion-content .image-container {
  display: flex;
  justify-content: center;
  max-width: 100%;
  pointer-events: none;
}

@media (max-width: 734px) {
  .accordion-content .image-container {
    padding-top: 30px;
  }
}

@media (min-width: 1069px) {
  .accordion-content .image-container {
    position: absolute;
    inset-inline-start: calc(350px + var(--accordion-side-padding) * 2);
    top: 50%;
    transform: translateY(-50%);
    opacity: 0;
    min-width: max-content;
    width: 100%;
    pointer-events: none;
    z-index: -1;
  }
}

.accordion-content .image-container img {
  max-width: 100%;
}

.accordion-wrapper {
  background-color: #f5f5f7;
}

.background-alt .accordion-wrapper {
  background-color: #fff;
}

.theme-dark .accordion-wrapper {
  background-color: transparent;
  overflow: visible;
}

.theme-dark .background-alt .accordion-wrapper {
  background-color: #000;
}

.accordion-wrapper,
.card .card-modifier {
  background: transparent;
}

.accordion-pane .accordion {
  min-height: var(--accordion-height, auto);
  height: auto;
  width: 100%;
  padding: 0px;
  height: auto;
  min-height: auto;
}

@media (min-width: 1069px) {
  .content-container {
    display: flex;
    /*      grid-template-columns: calc(var(--accordion-width) + var(--accordion-side-padding)*2) 1fr;*/
    justify-content: space-between;
    align-items: flex-start;
    overflow: hidden;
    min-height: auto;
  }
}

.section-compare .tile {
  margin-inline-start: auto;
  margin-inline-end: auto;
  --sk-tile-box-shadow: initial;
  --sk-tile-background: rgb(255, 255, 255);
  --sk-tile-button-background: rgba(210, 210, 215, 0.64);
  --sk-tile-button-background-hover: rgba(223, 223, 227, 0.6976);
  --sk-tile-button-background-active: rgba(193, 193, 198, 0.6544);
  --sk-tile-button-icon-color: rgba(0, 0, 0, 0.56);
  --sk-tile-button-icon-color-hover: rgba(0, 0, 0, 0.64);
  box-sizing: border-box;
  height: 100%;
  position: relative;
  overflow: hidden;
  background: var(--sk-tile-background);
  box-shadow: var(--sk-tile-box-shadow);
}

.section-compare .section-content-responsive {
  margin-inline: auto;
  width: 87.5vw;
  max-width: var(--section-max-width);
}

.section-compare .typography-eyebrow-reduced {
  font-size: 21px;
  line-height: 1.1904761905;
  font-weight: 600;
  letter-spacing: 0.011em;
  font-family: SF Pro Display, SF Pro Icons, Helvetica Neue, Helvetica, Arial,
    sans-serif;
}

@media only screen and (max-width: 734px) {
  .section-compare .typography-eyebrow-reduced {
    font-size: 19px;
    line-height: 1.2105263158;
    font-weight: 600;
    letter-spacing: 0.012em;
    font-family: SF Pro Display, SF Pro Icons, Helvetica Neue, Helvetica, Arial,
      sans-serif;
  }
}

.section-compare .typography-body-reduced {
  font-size: 17px;
  line-height: 1.4285914286;
  font-weight: 400;
  letter-spacing: -0.016em;
  font-family: SF Pro Text, SF Pro Icons, Helvetica Neue, Helvetica, Arial,
    sans-serif;
}

.section-compare .typography-compare-tight {
  font-size: 16px;
  line-height: 1.4705882353;
  font-weight: 400;
  letter-spacing: -0.022em;
  font-family: SF Pro Text, SF Pro Icons, Helvetica Neue, Helvetica, Arial,
    sans-serif;
}

@media only screen and (max-width: 1068px) {
  .section-compare .typography-compare-tight {
    font-size: 16px;
    line-height: 1.4285914286;
    font-weight: 400;
    letter-spacing: -0.016em;
    font-family: SF Pro Text, SF Pro Icons, Helvetica Neue, Helvetica, Arial,
      sans-serif;
  }
}

.section-compare .tile {
  margin-inline-start: auto;
  margin-inline-end: auto;
  --sk-tile-box-shadow: initial;
  --sk-tile-background: rgb(255, 255, 255);
  --sk-tile-button-background: rgba(210, 210, 215, 0.64);
  --sk-tile-button-background-hover: rgba(223, 223, 227, 0.6976);
  --sk-tile-button-background-active: rgba(193, 193, 198, 0.6544);
  --sk-tile-button-icon-color: rgba(0, 0, 0, 0.56);
  --sk-tile-button-icon-color-hover: rgba(0, 0, 0, 0.64);
  box-sizing: border-box;
  height: 100%;
  position: relative;
  overflow: hidden;
  background: #fafafc;
  box-shadow: var(--sk-tile-box-shadow);
}

@media only screen and (max-width: 1068px) {
  .section-compare .tile {
    background: #fff;
  }
}

.section-compare .section-content-responsive {
  margin-inline: auto;
  width: 87.5vw;
  max-width: var(--section-max-width);
}

.section-compare .typography-eyebrow-reduced {
  font-size: 21px;
  line-height: 1.1904761905;
  font-weight: 600;
  letter-spacing: 0.011em;
  font-family: SF Pro Display, SF Pro Icons, Helvetica Neue, Helvetica, Arial,
    sans-serif;
}

@media only screen and (max-width: 734px) {
  .section-compare .typography-eyebrow-reduced {
    font-size: 19px;
    line-height: 1.2105263158;
    font-weight: 600;
    letter-spacing: 0.012em;
    font-family: SF Pro Display, SF Pro Icons, Helvetica Neue, Helvetica, Arial,
      sans-serif;
  }
}

.section-compare .typography-body-reduced {
  font-size: 15px;
  line-height: 1.4285914286;
  font-weight: 400;
  letter-spacing: -0.016em;
  font-family: SF Pro Text, SF Pro Icons, Helvetica Neue, Helvetica, Arial,
    sans-serif;
}

/*
.section-compare .typography-compare-tight {
    font-size: 16px;
    line-height: 1.4705882353;
    font-weight: 400;
    letter-spacing: -0.022em;
    font-family:
        SF Pro Text,
        SF Pro Icons,
        Helvetica Neue,
        Helvetica,
        Arial,
        sans-serif;
}

@media only screen and (max-width: 1068px) {
    .section-compare .typography-compare-tight {
        font-size: 14px;
        line-height: 1.4285914286;
        font-weight: 400;
        letter-spacing: -0.016em;
        font-family:
            SF Pro Text,
            SF Pro Icons,
            Helvetica Neue,
            Helvetica,
            Arial,
            sans-serif;
    }
}*/

.section-compare [class*="typography-eyebrow"] {
  display: block;
  margin-bottom: 0.4em;
}

.section-compare .overview-compare-imac {
  display: block;
  --p-width: 202px;
  --p-height: 172px;
  width: var(--p-width);
  height: var(--p-height);
}

.section-compare .overview-compare-ipad-air {
  --p-height: 116px;
}

.section-compare .overview-compare-ipad-air,
.section-compare .overview-compare-ipad-pro {
  display: block;
  --p-width: 100px;
  width: var(--p-width);
  height: var(--p-height);
}

.section-compare .overview-compare-ipad-pro {
  --p-height: 117px;
}

.section-compare .overview-compare-mac-air {
  --p-width: 220px;
  --p-height: 121px;
}

.section-compare .overview-compare-mac-air,
.section-compare .overview-compare-mac-mini {
  display: block;
  width: var(--p-width);
  height: var(--p-height);
}

.section-compare .overview-compare-mac-mini {
  --p-width: 66px;
  --p-height: 27px;
}

.section-compare .overview-compare-mac-pro {
  --p-width: 224px;
  --p-height: 121px;
}

.section-compare .overview-compare-mac-pro {
  display: block;
  width: var(--p-width);
  height: var(--p-height);
}

.section-compare .overview-icon-compare-apple-intelligence {
  display: block;
  --p-width: 42px;
  --p-height: 42px;
  width: var(--p-width);
  height: var(--p-height);
}

.section-compare .overview-icon-imac-chip,
.section-compare .overview-icon-ipad-air-chip {
  display: block;
  --p-width: 38px;
  --p-height: 38px;
  width: var(--p-width);
  height: var(--p-height);
}

.section-compare .overview-icon-ipad-pro-chip {
  --p-width: 38px;
}

.section-compare .overview-icon-ipad-pro-chip,
.section-compare .overview-icon-mac-air-chip {
  display: block;
  --p-height: 38px;
  width: var(--p-width);
  height: var(--p-height);
}

.section-compare .overview-icon-mac-air-chip {
  --p-width: 80px;
}

.section-compare .overview-icon-mac-mini-chip {
  --p-width: 80px;
  --p-height: 38px;
}

.section-compare .overview-icon-mac-mini-chip,
.section-compare .overview-icon-mac-pro-chip {
  display: block;
  width: var(--p-width);
  height: var(--p-height);
}

.section-compare .overview-icon-mac-pro-chip {
  --p-width: 122px;
  --p-height: 39px;
}

.section-compare .overview-icon-pencil {
  --p-width: 17px;
  --p-height: 45px;
}

.section-compare .overview-icon-pencil {
  display: block;
  width: var(--p-width);
  height: var(--p-height);
}

.section-compare.section {
  overflow: hidden;
  padding-block: 140px;
}

@media only screen and (max-width: 1068px) {
  .section-compare.section {
    padding-block: 100px;
  }
}

@media only screen and (max-width: 734px) {
  .section-compare.section {
    padding-block: 70px;
  }
}

.section-compare .tile-rounded {
  --sk-tile-border-radius-large: 30px;
  --sk-tile-border-radius-small: 20px;
}

.section-compare .scroll-gallery {
  --item-width: 406px;
  --item-height: 479px;
  --gallery-side-padding: max(
    calc(6.25vw - var(--modal-scrollbar-buffer, 0px) / 2),
    calc(
      50vw - var(--section-max-width) / 2 - var(--modal-scrollbar-buffer, 0px) /
        2
    )
  );
  width: 100%;
  position: relative;
  margin-block-start: var(--section-header);
}

@media only screen and (max-width: 1068px) {
  .section-compare .scroll-gallery {
    --item-width: 295px;
  }
}

@media only screen and (max-width: 734px) {
  .section-compare .scroll-gallery {
    --item-width: 260px;
    --item-height: 420px;
  }
}

.section-compare .scroll-gallery:has(.paddlenav-outside) {
  padding-block-end: calc(40px + var(--modal-button-size));
}

@media only screen and (max-width: 1068px) {
  .section-compare .scroll-gallery:has(.paddlenav-outside) {
    padding-block-end: 6px;
  }
}

.section-compare .scroll-gallery:has(.paddlenav-disabled) {
  padding-block-end: 0;
}

.section-compare .scroll-gallery .scroll-container {
  overflow-x: scroll;
  scroll-snap-type: x mandatory;
  scroll-padding: calc(var(--gallery-side-padding));
  scrollbar-width: none;
}

.section-compare .scroll-gallery .scroll-container::-webkit-scrollbar {
  display: none;
}

.section-compare .scroll-gallery .item-container {
  list-style: none;
  margin: auto 0;
  padding: 0;
  display: grid;
  grid-auto-flow: column;
  grid-gap: 20px;
  gap: 20px;
  width: -moz-fit-content;
  width: fit-content;
  padding-inline: var(--gallery-side-padding);
}

.section-compare .scroll-gallery .gallery-item {
  position: relative;
  width: var(--item-width);
  min-height: var(--item-height);
  scroll-snap-align: start;
}

.section-compare .paddlenav {
  width: 87.5%;
  max-width: var(--section-max-width);
  position: relative;
  margin-inline: auto;
  display: none;
}

.section-compare
  .paddlenav.paddlenav-side-aligned.paddlenav-outside
  .paddlenav-arrow {
  margin-block-start: 40px;
}

@media only screen and (max-width: 1068px) {
  .section-compare
    .paddlenav.paddlenav-side-aligned.paddlenav-outside
    .paddlenav-arrow {
    margin-block-start: 30px;
  }
}

html.js [data-component-list*="DrawerComponent"] [data-drawer-container] {
  height: 0;
}

html.js [data-component-list*="DrawerComponent"] [data-drawer-content] {
  opacity: 0;
  visibility: hidden;
}

.drawer-toggle {
  background-color: #fff;
  color: var(--modal-trigger-bg);
  padding: 10px 7px 10px 22px;
  display: flex;
  flex-direction: row;
  align-items: center;
  font-weight: 500;
  border-radius: 28px;
}

@media only screen and (max-width: 1068px) {
  .drawer-toggle {
    background-color: var(--modal-trigger-color);
  }
}

.section-compare .drawer-toggle,
.section-compare .drawer-toggle:hover {
  text-decoration: none;
}

.section-compare .drawer-toggle:hover .svg-plus path:first-child {
  fill: #000;
}

.section-compare .drawer-toggle .icon-copy {
  margin-inline-end: 12px;
}

.section-compare .drawer-toggle .svg-plus {
  width: 36px;
  height: 36px;
  display: block;
}

.section-compare .drawer-toggle .svg-plus path {
  transition: fill 0.2s;
}

.section-compare .drawer-toggle .svg-plus path:first-child {
  fill: var(--modal-trigger-bg);
}

.section-compare .drawer-toggle .svg-plus path:last-child {
  fill: var(--modal-trigger-color);
}

.section-compare .drawer-toggle-wrapper {
  text-align: center;
  margin-inline-start: auto;
  margin-inline-end: auto;
  --modal-trigger-color: rgb(245, 245, 247);
  --modal-trigger-bg: #333;
  margin-top: 15px;
  position: relative;
}

.section-compare,
.section-ways-to-save-wts {
  background-color: #fff;
}

@media only screen and (max-width: 1068px) {
  .section-compare {
    background-color: #fff;
  }
}

.section-compare .tile-rounded {
  overflow: visible;
  --side-padding: min(6.18vw, 90px);
  padding: 50px var(--side-padding) 60px;
  margin-block-start: var(--section-header);
}

@media only screen and (max-width: 1068px) {
  .section-compare .tile-rounded {
    padding: 0;
    margin-block-start: 40px;
  }
}

@media only screen and (max-width: 734px) {
  .section-compare .tile-rounded {
    margin-block-start: 73px;
  }
}

@media only screen and (max-width: 734px) {
  .section-compare .tile-rounded.fall-spacing-update {
    margin-block-start: 120px;
  }
}

.section-compare .tablist-container {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-block-end: 50px;
}

@media only screen and (max-width: 734px) {
  .section-compare .tablist-container {
    margin-block-end: 30px;
  }
}

.section-compare .cta {
  position: absolute;
  right: -90px;
  top: -138px;
}

@media only screen and (max-width: 1068px) {
  .section-compare .cta {
    top: -28px;
    right: auto;
  }
}

@media only screen and (max-width: 734px) {
  .section-compare .cta {
    right: auto;
    left: 0;
    top: -50px;
  }
}

@media only screen and (max-width: 734px) {
  .section-compare .cta.cta-fall-update {
    top: -171px;
  }
}

.section-compare .cta.cta-fall-update a:first-of-type {
  margin-right: 34px;
}

@media only screen and (max-width: 734px) {
  .section-compare .cta.cta-fall-update a:first-of-type {
    display: block;
    margin-right: 0;
    margin-bottom: 5px;
  }
}

.section-compare .tabnav-items {
  margin: 0;
  list-style: none;
  display: flex;
  background: #f5f5f7;
  box-shadow: inset 0 0 1px 0 rgba(0, 0, 0, 0.15);
  width: min-content;
  border-radius: 100px;
  padding: 5px;
  grid-gap: 5px;
  gap: 5px;
}

@media only screen and (max-width: 734px) {
  .section-compare .tabnav-items {
    padding: 4px;
  }
}

.tabnav a:focus {
/*  outline: 2px solid #0071e3;*/
  outline-offset: 0;
}

.section-compare .tabnav-items .button {
  font-size: 17px;
  line-height: 1.2353641176;
  font-weight: 400;
  letter-spacing: -0.022em;
  font-family: SF Pro Text, SF Pro Icons, Helvetica Neue, Helvetica, Arial,
    sans-serif;
  transition: background 0.1s, color 0.1s;
  padding: 10px 24px;
  outline-offset: 0;
  border: 0;
}

@media only screen and (max-width: 734px) {
  .section-compare .tabnav-items .button {
    font-size: 14px;
    line-height: 1.2857742857;
    font-weight: 400;
    letter-spacing: -0.016em;
    font-family: SF Pro Text, SF Pro Icons, Helvetica Neue, Helvetica, Arial,
      sans-serif;
    padding: 10 18px;
  }
}

.section-compare .tabnav-items .button[aria-selected="true"] {
  pointer-events: none;
}

.section-compare .tabnav-items .button:not([aria-selected="true"]) {
  background: none;
  color: #000;
}

.section-compare .gallery-main-content {
  position: relative;
  display: flex;
  transition: height 0.5s;
}

.section-compare .scroll-gallery {
  width: 100%;
  margin-block-start: 0;
  --item-width: 240px;
  --gallery-side-padding: max(6.25%, calc(50% - var(--section-max-width) / 2));
}

@media only screen and (max-width: 1068px) {
  .section-compare .scroll-gallery {
    --gallery-side-padding: 6.18vw;
  }
}

.section-compare .scroll-gallery .item-container {
  grid-gap: 35px;
  gap: 35px;
  width: -moz-fit-content;
  width: fit-content;
  margin-inline: auto;
}

.section-compare .scroll-gallery .scroll-container {
  padding-block-end: 1px;
  overflow-y: hidden;
  margin-inline: calc(var(--side-padding) * -1);
}

@media only screen and (max-width: 1068px) {
  .section-compare .scroll-gallery .scroll-container {
    margin-inline: calc(var(--side-padding) * -1 + -1px);
  }
}

.section-compare .scroll-gallery .gallery-item-inner {
  margin-block-start: 30px;
  position: relative;
  padding-inline: 0;
}

.section-compare .scroll-gallery .paddlenav {
  margin: 0;
  width: 100%;
}

.section-compare .scroll-gallery:has(.paddlenav-disabled) {
  padding-block-end: 0;
}

.section-compare .compare-table {
  display: flex;
  flex-direction: column;
  --image-link-margin: 35px;
}

@media only screen and (max-width: 734px) {
  .section-compare .compare-table {
    --image-link-margin: 25px;
  }
}

.section-compare .compare-table .icon-support {
  margin: 0 auto 5px;
}

@media only screen and (max-width: 734px) {
  .section-compare .compare-table .icon-support {
    margin-inline-start: 0;
  }
}

.section-compare .compare-table .icon-chip {
  margin-inline: auto;
  margin-block-end: 20px;
}

@media only screen and (max-width: 734px) {
  .section-compare .compare-table .icon-chip {
    margin-inline: 0;
  }
}

.section-compare .compare-table .icon-apple-intelligence {
  margin-inline: auto;
  margin-block-end: 20px;
}

@media only screen and (max-width: 734px) {
  .section-compare .compare-table .icon-apple-intelligence {
    margin-inline: 0;
  }
}

.section-compare .compare-table .gallery-item {
  --headline-margin: 4px;
  --description-margin: 4px;
  --headline-row: auto;
  --pricing-row: auto;
  --description-row: auto;
  text-align: center;
}

.section-compare
  .compare-table
  .gallery-item:last-child
  .compare-buttons:before {
  right: 0;
}

@media only screen and (max-width: 734px) {
  .section-compare .compare-table .gallery-item {
    text-align: left;
  }
}

@media only screen and (max-width: 375px) {
  .section-compare .compare-table .gallery-item {
    --item-width: 87.5vw;
  }

  .section-compare .compare-table .compare-row {
    justify-items: flex-start;
  }

  .section-compare .compare-table .compare-column {
    width: 234px;
  }
}

.section-compare .product-tile-header {
  --image-link-row: minmax(calc(172px + var(--image-link-margin)), max-content);
  --headline-row: minmax(
    calc(var(--headline-height) + var(--headline-margin)),
    max-content
  );
  --pricing-row: minmax(var(--pricing-height), max-content);
  --description-row: minmax(
    calc(var(--description-height) + var(--description-margin)),
    max-content
  );
  justify-content: flex-start;
  display: grid;
  grid-template-rows: var(--image-link-row) var(--headline-row) var(
      --description-row
    );
  grid-template-areas: "image-link" "headline" "description";
}

.section-compare .product-tile-header .compare-image {
  grid-area: image-link;
  display: flex;
  justify-content: center;
  align-items: flex-end;
}

@media only screen and (max-width: 734px) {
  .section-compare .product-tile-header .compare-image {
    justify-content: flex-start;
  }
}

.section-compare .product-tile-header .compare-headline {
  grid-area: headline;
}

.section-compare .product-tile-header .compare-headline-copy {
  margin-bottom: 12px;
}

@media only screen and (max-width: 734px) {
  .section-compare .product-tile-header .compare-headline-copy {
    margin-bottom: 10px;
  }
}

.section-compare .product-tile-header .compare-pricing {
  grid-area: pricing;
}

.section-compare .product-tile-header .compare-description {
  grid-area: description;
}

.section-compare .product-tile-header .compare-device {
  margin-block-end: var(--image-link-margin);
}

.section-compare .compare-column-extra {
  display: grid;
  grid-gap: 10px;
  gap: 24px;
  grid-template-rows: var(--plus-row-1-height) var(--plus-row-2-height) var(
      --plus-row-3-height
    ) var(--plus-row-4-height);
  position: relative;
  width: var(--item-width);
}

@media only screen and (max-width: 734px) {
  .section-compare .compare-column-extra {
    gap: 25px;
  }
}

.section-compare .compare-column-extra:focus {
  outline: none;
}

.section-compare .compare-column-extra .compare-row {
  position: relative;
}

.section-compare .compare-column-extra .stat-above {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
}

.section-compare .compare-column-extra .value {
  font-size: 14px;
  line-height: 1.1666666667;
  font-weight: 400;
  letter-spacing: 0.007em;
  font-family: SF Pro Display, SF Pro Icons, Helvetica Neue, Helvetica, Arial,
    sans-serif;
  display: block;
  margin-block: 0;
}

@media only screen and (max-width: 1068px) {
  .section-compare .compare-column-extra .value {
    font-size: 17px;
    line-height: 1.1666666667;
    font-weight: 400;
    letter-spacing: 0.009em;
    font-family: SF Pro Display, SF Pro Icons, Helvetica Neue, Helvetica, Arial,
      sans-serif;
  }
}

@media only screen and (max-width: 734px) {
  .section-compare .compare-column-extra .value {
    font-size: 17px;
    line-height: 1.1904761905;
    font-weight: 400;
    letter-spacing: 0.011em;
    font-family: SF Pro Display, SF Pro Icons, Helvetica Neue, Helvetica, Arial,
      sans-serif;
  }
}

.section-compare .compare-mac {
  --columns: 4;
  width: 100%;
}

.section-compare .compare-ipad {
  --columns: 2;
  width: 100%;
}

html.js .section-compare .compare-ipad {
  position: absolute;
  z-index: -1;
}

.section-compare .compare-tech {
  padding-block-start: 0;
}

.section-compare .compare-tech-chip,
.section-compare .compare-tech-supports {
  padding-block-start: 0;
}

.section-compare .compare-pricing p {
  font-weight: 600;
}

.section-compare .compare-pricing {
  margin-block-start: 30px;
}

@media only screen and (max-width: 734px) {
  .section-compare .compare-pricing {
    margin-block-start: 30px;
  }
}

.section-compare .compare-buttons {
  margin-block-start: 50px;
  padding-block-end: 5px;
  position: relative;
}

.section-compare .compare-buttons .compare-column {
  display: flex;
  align-items: center;
}

@media only screen and (min-width: 735px) {
  .section-compare .compare-buttons .compare-column {
    justify-content: center;
  }

  .section-compare .compare-buttons {
    margin-block-start: 40px;
  }
}

.section-compare .compare-buttons .button {
  box-sizing: border-box;
}

.section-compare .compare-buttons .button:first-child {
  margin-inline-end: 17px;
}

@media only screen and (max-width: 734px) {
  .section-compare .compare-buttons .button:first-child {
    margin-inline-end: 25px;
  }
}

@media only screen and (min-width: 735px) {
  .section-compare .compare-buttons .button {
    --sk-button-padding-horizontal: 22px;
    --sk-button-padding-vertical: 12px;
    --sk-button-min-width-basis: 70px;
    --sk-button-margin-horizontal: 18px;
    --sk-button-margin-vertical: 18px;
    font-size: 17px;
    line-height: 1.1764805882;
    font-weight: 400;
    letter-spacing: -0.022em;
    font-family: SF Pro Text, SF Pro Icons, Helvetica Neue, Helvetica, Arial,
      sans-serif;
  }
}

@media only screen and (max-width: 734px) {
  .section-compare .compare-buttons .buy-link {
    font-size: 14px;
    line-height: 1.4285914286;
    font-weight: 400;
    letter-spacing: -0.016em;
    font-family: SF Pro Text, SF Pro Icons, Helvetica Neue, Helvetica, Arial,
      sans-serif;
  }
}

.section-compare .drawer {
  text-align: center;
  overflow: hidden;
}

@media only screen and (max-width: 734px) {
  .section-compare .drawer {
    text-align: left;
  }
}

.section-compare .drawer .compare-row:last-child {
  margin-block-end: 0;
}

.section-compare .drawer-toggle-wrapper {
  margin-block-start: 50px;
}

.section-ways-to-save-wts .tile {
  margin-inline-start: auto;
  margin-inline-end: auto;
  --sk-tile-box-shadow: initial;
  --sk-tile-background: rgb(245 245 247);
  --sk-tile-button-background: rgba(210, 210, 215, 0.64);
  --sk-tile-button-background-hover: rgba(223, 223, 227, 0.6976);
  --sk-tile-button-background-active: rgba(193, 193, 198, 0.6544);
  --sk-tile-button-icon-color: rgba(0, 0, 0, 0.56);
  --sk-tile-button-icon-color-hover: rgba(0, 0, 0, 0.64);
  box-sizing: border-box;
  height: 100%;
  position: relative;
  overflow: hidden;
  background: #fafafc;
  box-shadow: var(--sk-tile-box-shadow);
}

.section-ways-to-save-wts .tile-content {
  --sk-tile-padding-large: var(--sk-tile-padding, 60px 8.3333333333%);
  --sk-tile-padding-xlarge: var(
    --sk-tile-padding,
    var(--sk-tile-padding-large)
  );
  --sk-tile-padding-medium: var(
    --sk-tile-padding,
    var(--sk-tile-padding-large)
  );
  --sk-tile-padding-small: var(--sk-tile-padding, var(--sk-tile-padding-large));
  padding: var(--sk-tile-padding-large);
}

@media only screen and (min-width: 1441px) {
  .section-ways-to-save-wts .tile-content {
    padding: var(--sk-tile-padding-xlarge);
  }
}

@media only screen and (max-width: 1068px) {
  .section-ways-to-save-wts .tile-content {
    padding: var(--sk-tile-padding-medium);
  }
}

@media only screen and (max-width: 734px) {
  .section-ways-to-save-wts .tile-content {
    padding: var(--sk-tile-padding-small);
  }
}

.section-ways-to-save-wts .overview-wts-applecare {
  display: block;
  width: var(--p-width);
  height: var(--p-height);
}

.section-ways-to-save-wts .overview-wts-applecare {
  --p-width: 125px;
  --p-height: 125px;
}

@media only screen and (max-width: 1068px) {
  .section-ways-to-save-wts .overview-wts-applecare {
    --p-width: 113px;
    --p-height: 113px;
  }
}

@media only screen and (max-width: 734px) {
  .section-ways-to-save-wts .overview-wts-applecare {
    --p-width: 100px;
    --p-height: 100px;
  }
}

.section-ways-to-save-wts .overview-wts-mac-ipad {
  display: block;
  --p-width: 345px;
  --p-height: 193px;
  width: var(--p-width);
  height: var(--p-height);
}

@media only screen and (max-width: 1068px) {
  .section-ways-to-save-wts .overview-wts-mac-ipad {
    --p-width: 267px;
    --p-height: 147px;
  }
}

@media only screen and (max-width: 734px) {
  .section-ways-to-save-wts .overview-wts-mac-ipad {
    --p-width: 240px;
    --p-height: 148px;
  }
}

.section-ways-to-save-wts .overview-wts-pay {
  display: block;
  --p-width: 202px;
  --p-height: 248px;
  width: var(--p-width);
  height: var(--p-height);
}

@media only screen and (max-width: 1068px) {
  .section-ways-to-save-wts .overview-wts-pay {
    --p-width: 202px;
    --p-height: 248px;
  }
}

@media only screen and (max-width: 734px) {
  .section-ways-to-save-wts .overview-wts-pay {
    --p-width: 178px;
    --p-height: 211px;
  }
}

.section-ways-to-save-wts .overview-wts-trade {
  display: block;
  --p-width: 373px;
  --p-height: 175px;
  width: var(--p-width);
  height: var(--p-height);
}

@media only screen and (max-width: 1068px) {
  .section-ways-to-save-wts .overview-wts-trade {
    --p-width: 295px;
    --p-height: 152px;
  }
}

@media only screen and (max-width: 734px) {
  .section-ways-to-save-wts .overview-wts-trade {
    --p-width: 262px;
    --p-height: 131px;
  }
}

.section-ways-to-save-wts .tile-content {
  --sk-tile-padding-large: 40px;
  --sk-tile-padding-medium: 30px;
  --sk-tile-padding-small: 20px;
}

.section-ways-to-save-wts .scroll-gallery {
  --item-width: 406px;
  --item-height: 350px;
  --gallery-side-padding: max(
    calc(6.25vw - var(--modal-scrollbar-buffer, 0px) / 2),
    calc(
      50vw - var(--section-max-width) / 2 - var(--modal-scrollbar-buffer, 0px) /
        2
    )
  );
  width: 100%;
  position: relative;
  margin-block-start: var(--section-header);
}

@media only screen and (max-width: 1068px) {
  .section-ways-to-save-wts .scroll-gallery {
    --item-width: 295px;
  }
}

@media only screen and (max-width: 734px) {
  .section-ways-to-save-wts .scroll-gallery {
    --item-width: 260px;
    --item-height: 320px;
  }
}

.section-ways-to-save-wts .scroll-gallery:has(.paddlenav-outside) {
  padding-block-end: calc(40px + var(--modal-button-size));
}

@media only screen and (max-width: 1068px) {
  .section-ways-to-save-wts .scroll-gallery:has(.paddlenav-outside) {
    padding-block-end: calc(30px + var(--modal-button-size));
  }
}

.section-ways-to-save-wts .scroll-gallery .scroll-container {
  overflow-x: scroll;
  scroll-snap-type: x mandatory;
  scroll-padding: calc(var(--gallery-side-padding));
  scrollbar-width: none;
}

.section-ways-to-save-wts .scroll-gallery .scroll-container::-webkit-scrollbar {
  display: none;
}

.section-ways-to-save-wts .scroll-gallery .item-container {
  list-style: none;
  margin: auto 0;
  padding: 0;
  display: grid;
  grid-auto-flow: column;
  grid-gap: 20px;
  gap: 20px;
  width: -moz-fit-content;
  width: fit-content;
  padding-inline: var(--gallery-side-padding);
}

.section-ways-to-save-wts .scroll-gallery .gallery-item {
  position: relative;
  width: var(--item-width);
  min-height: var(--item-height);
  scroll-snap-align: start;
}

.section-ways-to-save-wts .paddlenav {
  width: 87.5%;
  max-width: var(--section-max-width);
  position: relative;
  margin-inline: auto;
  display: none;
}

.section-ways-to-save-wts .paddlenav:not(.paddlenav-disabled) {
  display: block;
}

.section-ways-to-save-wts
  .paddlenav.paddlenav-side-aligned.paddlenav-outside
  .paddlenav-arrow {
  margin-block-start: 40px;
}

@media only screen and (max-width: 1068px) {
  .section-ways-to-save-wts
    .paddlenav.paddlenav-side-aligned.paddlenav-outside
    .paddlenav-arrow {
    margin-block-start: 30px;
  }
}

.section-ways-to-save-wts .ways-to-save-gallery {
  --item-width: 372px;
}

@media only screen and (max-width: 1068px) {
  .section-ways-to-save-wts .ways-to-save-gallery {
    --item-width: 295px;
  }
}

@media only screen and (max-width: 734px) {
  .section-ways-to-save-wts .ways-to-save-gallery {
    --item-width: 261px;
  }
}

.section-ways-to-save-wts .tile {
  display: flex;
  flex-direction: column;
}

.section-ways-to-save-wts .tile-content {
  /*    --sk-tile-padding-large: 30px;*/
}

.section-ways-to-save-wts .tile .tile-media {
  margin-block-start: auto;
  padding-block-end: 30px;
  align-self: center;
}

.section-ways-to-save-wts .tile-discounts .tile-media {
  /*    align-self: flex-end;*/
}

.section-ways-to-save-wts .tile-pay-over-time .tile-media {
  /*    padding-block-end: 0;*/
  margin-block-end: 0;
}

@media only screen and (min-width: 735px) and (max-width: 1068px) {
  .section-ways-to-save-wts .tile-pay-over-time .tile-media {
    /*  padding-block-end: 0;*/
    align-self: end;
  }
}

.section-ways-to-save-wts .tile-applecare .tile-media {
  margin-block: auto;
}

.section-ways-to-save-wts
  .paddlenav-side-aligned.paddlenav-outside
  .paddlenav-arrow {
  margin-block-start: 40px;
}

.section-values .tile {
  margin-inline-start: auto;
  margin-inline-end: auto;
  --sk-tile-box-shadow: initial;
  --sk-tile-background: rgb(255, 255, 255);
  --sk-tile-button-background: rgba(210, 210, 215, 0.64);
  --sk-tile-button-background-hover: rgba(223, 223, 227, 0.6976);
  --sk-tile-button-background-active: rgba(193, 193, 198, 0.6544);
  --sk-tile-button-icon-color: rgba(0, 0, 0, 0.56);
  --sk-tile-button-icon-color-hover: rgba(0, 0, 0, 0.64);
  box-sizing: border-box;
  height: 100%;
  position: relative;
  overflow: hidden;
  background: #f5f5f7;
  box-shadow: var(--sk-tile-box-shadow);
}

.section-values .tile-content {
  --sk-tile-padding-large: var(--sk-tile-padding, 60px 8.3333333333%);
  --sk-tile-padding-xlarge: var(
    --sk-tile-padding,
    var(--sk-tile-padding-large)
  );
  --sk-tile-padding-medium: var(
    --sk-tile-padding,
    var(--sk-tile-padding-large)
  );
  --sk-tile-padding-small: var(--sk-tile-padding, var(--sk-tile-padding-large));
  padding: var(--sk-tile-padding-large);
}

@media only screen and (min-width: 1441px) {
  .section-values .tile-content {
    padding: var(--sk-tile-padding-xlarge);
  }
}

@media only screen and (max-width: 1068px) {
  .section-values .tile-content {
    padding: var(--sk-tile-padding-medium);
  }
}

@media only screen and (max-width: 734px) {
  .section-values .tile-content {
    padding: var(--sk-tile-padding-small);
  }
}

.section-values .tile-rounded {
  --sk-tile-border-radius-large: var(--sk-tile-border-radius, 18px);
  --sk-tile-border-radius-xlarge: var(
    --sk-tile-border-radius,
    var(--sk-tile-border-radius-large)
  );
  --sk-tile-border-radius-medium: var(
    --sk-tile-border-radius,
    var(--sk-tile-border-radius-large)
  );
  --sk-tile-border-radius-small: var(
    --sk-tile-border-radius,
    var(--sk-tile-border-radius-large)
  );
  border-radius: var(--sk-tile-border-radius-large);
}

@media only screen and (min-width: 1441px) {
  .section-values .tile-rounded {
    border-radius: var(--sk-tile-border-radius-xlarge);
  }
}

@media only screen and (max-width: 1068px) {
  .section-values .tile-rounded {
    border-radius: var(--sk-tile-border-radius-medium);
  }
}

@media only screen and (max-width: 734px) {
  .section-values .tile-rounded {
    border-radius: var(--sk-tile-border-radius-small);
  }
}

.section-values .overview-icon-accessibility {
  display: block;
  --p-width: 39px;
  --p-height: 39px;
  width: var(--p-width);
  height: var(--p-height);
}

@media only screen and (max-width: 734px) {
  .section-values .overview-icon-accessibility {
    --p-width: 35px;
    --p-height: 35px;
  }
}

.section-values .overview-icon-environment {
  display: block;
  --p-width: 39px;
  --p-height: 39px;
  width: var(--p-width);
  height: var(--p-height);
}

@media only screen and (max-width: 734px) {
  .section-values .overview-icon-environment {
    --p-width: 37px;
    --p-height: 37px;
  }
}

.section-values .overview-icon-privacy {
  display: block;
  width: var(--p-width);
  height: var(--p-height);
}

.section-values .overview-icon-privacy {
  --p-width: 31px;
  --p-height: 42px;
}

@media only screen and (max-width: 734px) {
  .section-values .overview-icon-privacy {
    --p-width: 29px;
    --p-height: 39px;
  }
}

.section.section-values {
  overflow: hidden;
  padding-block: 120px;
}

@media only screen and (max-width: 1068px) {
  .section.section-values {
    padding-block: 100px;
  }
}

@media only screen and (max-width: 734px) {
  .section.section-values {
    padding-block: 70px;
  }
}

.section-values .tile-rounded {
  --sk-tile-border-radius-large: 30px;
  --sk-tile-border-radius-small: 20px;
}

.section-values .tile-content {
  --sk-tile-padding-large: 40px;
  --sk-tile-padding-medium: 30px;
  --sk-tile-padding-small: 20px;
}

.section-values .scroll-gallery {
  --item-width: 406px;
  --item-height: 479px;
  --gallery-side-padding: max(
    calc(6.25vw - var(--modal-scrollbar-buffer, 0px) / 2),
    calc(
      50vw - var(--section-max-width) / 2 - var(--modal-scrollbar-buffer, 0px) /
        2
    )
  );
  width: 100%;
  position: relative;
  margin-block-start: var(--section-header);
}

@media only screen and (max-width: 1068px) {
  .section-values .scroll-gallery {
    --item-width: 295px;
  }
}

@media only screen and (max-width: 734px) {
  .section-values .scroll-gallery {
    --item-width: 260px;
    --item-height: 420px;
  }
}

.section-values .scroll-gallery:has(.paddlenav-outside) {
  padding-block-end: calc(40px + var(--modal-button-size));
}

@media only screen and (max-width: 1068px) {
  .section-values .scroll-gallery:has(.paddlenav-outside) {
    padding-block-end: calc(30px + var(--modal-button-size));
  }
}

.section-values .scroll-gallery:has(.paddlenav-disabled) {
  padding-block-end: 0;
}

.section-values .scroll-gallery .scroll-container {
  overflow-x: scroll;
  scroll-snap-type: x mandatory;
  scroll-padding: calc(var(--gallery-side-padding));
  scrollbar-width: none;
}

.section-values .scroll-gallery .scroll-container::-webkit-scrollbar {
  display: none;
}

.section-values .scroll-gallery .item-container {
  list-style: none;
  margin: auto 0;
  padding: 0;
  display: grid;
  grid-auto-flow: column;
  grid-gap: 20px;
  gap: 20px;
  width: -moz-fit-content;
  width: fit-content;
  padding-inline: var(--gallery-side-padding);
}

.section-values .scroll-gallery .gallery-item {
  position: relative;
  width: var(--item-width);
  min-height: var(--item-height);
  scroll-snap-align: start;
}

.section-values {
  background-color: #fff;
  padding-block-start: 0;
  padding-block-end: 120px;
}

@media only screen and (max-width: 1068px) {
  .section-values {
    padding-block-end: 100px;
  }
}

@media only screen and (max-width: 734px) {
  .section-values {
    padding-block-end: 70px;
  }
}

.section-values .values-gallery {
  --item-height: 372px;
}

@media only screen and (max-width: 1068px) {
  .section-values .values-gallery {
    --item-height: 400px;
  }
}

@media only screen and (max-width: 734px) {
  .section-values .values-gallery {
    --item-height: 340px;
  }
}

.section-values .tile-content {
  padding-block-end: 70px;
}

@media only screen and (max-width: 1068px) {
  .section-values .tile-content {
    padding-block-end: 40px;
  }
}

@media only screen and (max-width: 734px) {
  .section-values .tile-content {
    padding-block-start: 40px;
  }
}

.section-values .icon {
  margin-block-end: 19px;
}

.section-ways-to-save-wts .typography-tile-headline,
.section-values .typography-tile-headline {
  font-size: 28px;
  line-height: 1.1428571429;
  font-weight: 600;
  letter-spacing: 0.007em;
  font-family: SF Pro Display, SF Pro Icons, Helvetica Neue, Helvetica, Arial,
    sans-serif;
}

@media only screen and (max-width: 1068px) {
  .section-ways-to-save-wts .typography-tile-headline,
  .section-values .typography-tile-headline {
    font-size: 28px;
    line-height: 1.1428571429;
    font-weight: 600;
    letter-spacing: 0.007em;
    font-family: SF Pro Display, SF Pro Icons, Helvetica Neue, Helvetica, Arial,
      sans-serif;
  }
}

@media only screen and (max-width: 734px) {
  .section-ways-to-save-wts .typography-tile-headline,
  .section-values .typography-tile-headline {
    font-size: 21px;
    line-height: 1.1904761905;
    font-weight: 600;
    letter-spacing: 0.011em;
    font-family: SF Pro Display, SF Pro Icons, Helvetica Neue, Helvetica, Arial,
      sans-serif;
  }
}

.jumpnav {
  /*    position: sticky;*/
  /*    top: 0;*/
  z-index: 11;
  /*    margin-top: 84px;*/
  /*    margin-bottom: 21px;*/
}

@media only screen and (max-width: 734px) {
  .jumpnav {
    /*        margin-top: 60px;*/
    margin-bottom: 0px;
  }
}

/*.jumpnav:before {
    content:'';
    display:block;
    width:400%;
    transform: translateX(-50%);
    position: absolute;
    height:50px;
    top:0;
    -webkit-backdrop-filter: saturate(180%) blur(20px);
    backdrop-filter: saturate(180%) blur(20px);
    background-color: rgb(245 245 247 / 80%);
}*/
.sticky-background {
  -webkit-backdrop-filter: saturate(180%) blur(20px);
  backdrop-filter: saturate(180%) blur(20px);
  background: rgba(245, 245, 247, 0.6);
  height: 54px;
  position: absolute;
  width: 100%;
  background: hsla(0, 0%, 100%, 0.99);
  -webkit-backdrop-filter: saturate(180%) blur(20px);
  backdrop-filter: saturate(180%) blur(20px);
  top: -1px;
}

.sticky-background:after {
  margin-inline-start: 0;
  width: 100%;
  inset-inline-start: 0;
  content: "";
  display: block;
  position: absolute;
  bottom: 0;
  width: 100%;
  height: 1px;
  z-index: 1;
  background: rgba(0, 0, 0, 0.16);
}

.section.section-ways-to-save {
  overflow: visible;
}

.jumpnav .button {
  --sk-button-color: rgb(255, 255, 255);
  --sk-button-color-hover: var(--sk-button-color);
  --sk-button-color-active: var(--sk-button-color-hover);
  --sk-button-disabled-opacity: var(--sk-link-disabled-opacity);
  --sk-button-border-color: transparent;
  --sk-button-border-radius: 980px;
  --sk-button-margin-horizontal: 14px;
  --sk-button-margin-vertical: 14px;
  --sk-button-min-width-basis: 60px;
  --sk-button-padding-horizontal: 16px;
  --sk-button-padding-vertical: 8px;
  --sk-button-border-width: 1px;
  --sk-button-box-sizing: content-box;
  --sk-button-width: auto;
  --sk-button-display: inline-block;
  font-size: 14px;
  line-height: 1.2857742857;
  font-weight: 400;
  letter-spacing: -0.016em;
  font-family: SF Pro Text, SF Pro Icons, Helvetica Neue, Helvetica, Arial,
    sans-serif;
  background: var(--sk-button-background);
  color: var(--sk-button-color);
  padding-block: calc(
    var(--sk-button-padding-vertical) - var(--sk-button-border-width)
  );
  padding-inline: calc(
    var(--sk-button-padding-horizontal) - var(--sk-button-border-width)
  );
  border-radius: var(--sk-button-border-radius);
  border: var(--sk-button-border-width) solid var(--sk-button-border-color);
  width: var(--sk-button-width);
  min-width: calc(
    var(--sk-button-min-width-basis) - var(--sk-button-padding-horizontal) * 2
  );
  cursor: pointer;
  display: var(--sk-button-display);
  box-sizing: var(--sk-button-box-sizing);
  text-align: center;
  text-decoration: none;
  white-space: nowrap;
  --sk-button-background: rgb(0, 113, 227);
  --sk-button-background-hover: #0077ed;
  --sk-button-background-active: #006edb;
}

.jumpnav .button:hover {
  /*    background: var(--sk-button-background-hover, var(--sk-button-background));*/
  color: #6b6b6b;
  text-decoration: none;
  border-color: rgba(0, 0, 0, 0);
}

.jumpnav .button:active {
  /*    background: var(--sk-button-background-active, var(--sk-button-background));*/
  color: #6b6b6b;
  outline: none;
}

.jumpnav .button:disabled {
  pointer-events: none;
  opacity: var(--sk-button-disabled-opacity);
}

.jumpnav .typography-filter-tabnav {
  font-size: 19px;
  line-height: 1.2105263158;
  font-weight: 600;
  letter-spacing: 0.012em;
  font-family: SF Pro Display, SF Pro Icons, Helvetica Neue, Helvetica, Arial,
    sans-serif;
}

@media only screen and (max-width: 734px) {
  .jumpnav .typography-filter-tabnav {
    /*font-size: 14px;
        line-height: 1;
        font-weight: 500;
        letter-spacing: 0em;
        font-family:
            SF Pro Text,
            SF Pro Icons,
            Helvetica Neue,
            Helvetica,
            Arial,
            sans-serif;*/
  }
}

.jumpnav .tabnav-items {
  margin: 0 var(--scroll-container-paddle-width);
  overflow-x: auto;
  overflow-y: hidden;
  white-space: nowrap;
  -webkit-overflow-scrolling: touch;
  -ms-overflow-style: none;
  padding: 0 0 3.1764705882em;
  position: relative;
  scroll-behavior: smooth;
  scrollbar-width: none;
  transform: translatey(-20px);
  transition: opacity 1s ease-out, transform 0.4s ease-out;
  transition-delay: 0.15s;
  will-change: opacity, transform;
}

.jumpnav-sticky-is--visible .tabnav-items {
  opacity: 1;
  transform: translatey(0);
}

.jumpnav .tabnav-items::-webkit-scrollbar {
  display: none;
}

.jumpnav .tabnav-items:before {
}

.jumpnav .tabnav-item {
  display: inline-block;
  padding-inline-start: 60px;
  border-bottom: 1px solid var(--tabnav-bottom-border);
  list-style: none;
  outline: none;
}

@media only screen and (max-width: 1068px) {
  .jumpnav .tabnav-item {
    padding-inline-start: 50px;
  }
}

@media only screen and (max-width: 734px) {
  .jumpnav .tabnav-item {
    padding-inline-start: 30px;
  }
}

.jumpnav .tabnav-item:first-child {
  padding-inline-start: 3px;
}

.jumpnav .tabnav-item:last-child {
  padding-inline-end: 3px;
}

/*! CSS Used from: https://www.apple.com/v/apps/d/built/styles/overview.built.css */
.jumpnav .tabnav ::-webkit-scrollbar {
  display: none;
}

@media only screen and (min-width: 735px) and (max-width: 1068px) {
  .jumpnav .tabnav-avp .tabnav-items {
    margin: 0 var(--scroll-container-paddle-width);
  }
}

.jumpnav .tabnav-items {
  display: flex;
  align-items: center;
  padding-bottom: 0;
  height: 53px;
  margin: 0;
}

@media only screen and (max-width: 734px) {
  .jumpnav .tabnav-items {
    margin: 0 var(--scroll-container-paddle-width);
  }
}

.jumpnav .tabnav-item {
  border: none;
  padding-inline: 7px;
}

.jumpnav .tabnav-item .tabnav-button.current,
.jumpnav .tabnav-item .tabnav-button.current:active {
  --sk-button-background: transparent;
  --sk-button-background-hover: #2f2f31;
  --sk-button-background-active: #1b1b1d;
  --sk-button-color: #1d1d1f;
  --sk-button-background-hover: inherit;
  opacity: 1;
  cursor: default;
  color:var(--sk-button-color-active);
}

.jumpnav .tabnav-item:first-child {
  padding-inline-start: 3px;
}

.jumpnav .button:focus-visible {
  outline-offset: 0;
}

.jumpnav .tabnav-button {
  --sk-button-background: transparent;
  --sk-button-background-hover: #eaeaee;
  --sk-button-background-active: #d5d5da;
  --sk-button-color: #86868b;
  --sk-button-padding-horizontal: 16px;
  border-radius: 0px !important;
}

.section.section-content-start {
  padding-block-start: 0;
  padding-block-end: 30px;
}

@media only screen and (max-width: 734px) {
  .section.section-content-start {
    padding-block-start: 0;
    padding-block-end: 0;
  }
}

.section-main-wrapper {
  background-color: #fff;
}

.typography-section-headline.hero-headline-padding {
  padding-block-start: 140px;
}

@media only screen and (max-width: 734px) {
  .typography-section-headline.hero-headline-padding {
    padding-block-start: 72px;
  }
}

.typography-section-headline-copy {
  margin-block-end: 64px;
  margin-top: 30px;
}

.typography-section-headline-copy-max-width {
  max-width: 910px;
}

.typography-section-headline-copy {
  font-size: 24px;
  line-height: 1.3333333333;
  font-weight: 400;
  letter-spacing: 0.009em;
  font-family: SF Pro Display, SF Pro Icons, Helvetica Neue, Helvetica, Arial,
    sans-serif;
}

@media only screen and (max-width: 1068px) {
  .typography-section-headline-copy {
    font-size: 21px;
    line-height: 1.380952381;
    font-weight: 400;
    letter-spacing: 0.011em;
    font-family: SF Pro Display, SF Pro Icons, Helvetica Neue, Helvetica, Arial,
      sans-serif;
  }

  .typography-section-headline-copy {
    margin-block-end: 40px;
  }
}

@media only screen and (max-width: 1068px) {
  .typography-section-headline-copy {
    font-size: 19px;
    line-height: 1.2105263158;
  }
}

.section-compatibility .grid {
  --sk-cssgrid-columns: 12;
  --sk-cssgrid-column-gutter-inner-large: var(
    --sk-cssgrid-column-gutter-inner,
    24px
  );
  --sk-cssgrid-column-gutter-inner-xlarge: var(
    --sk-cssgrid-column-gutter-inner,
    var(--sk-cssgrid-column-gutter-inner-large)
  );
  --sk-cssgrid-column-gutter-inner-medium: var(
    --sk-cssgrid-column-gutter-inner,
    var(--sk-cssgrid-column-gutter-inner-large)
  );
  --sk-cssgrid-column-gutter-inner-small: var(
    --sk-cssgrid-column-gutter-inner,
    var(--sk-cssgrid-column-gutter-inner-large)
  );
  --sk-cssgrid-column-gutter-inner-xsmall: var(
    --sk-cssgrid-column-gutter-inner,
    var(--sk-cssgrid-column-gutter-inner-large)
  );
  grid-column-gap: var(--sk-cssgrid-column-gutter-inner-large);
  --sk-cssgrid-row-gutter-inner-large: var(--sk-cssgrid-row-gutter-inner, 24px);
  --sk-cssgrid-row-gutter-inner-xlarge: var(
    --sk-cssgrid-row-gutter-inner,
    var(--sk-cssgrid-row-gutter-inner-large)
  );
  --sk-cssgrid-row-gutter-inner-medium: var(
    --sk-cssgrid-row-gutter-inner,
    var(--sk-cssgrid-row-gutter-inner-large)
  );
  --sk-cssgrid-row-gutter-inner-small: var(
    --sk-cssgrid-row-gutter-inner,
    var(--sk-cssgrid-row-gutter-inner-large)
  );
  --sk-cssgrid-row-gutter-inner-xsmall: var(
    --sk-cssgrid-row-gutter-inner,
    var(--sk-cssgrid-row-gutter-inner-large)
  );
  grid-row-gap: var(--sk-cssgrid-row-gutter-inner-large);
  --sk-cssgrid-column-gutter-outer-large: var(
    --sk-cssgrid-column-gutter-outer,
    24px
  );
  --sk-cssgrid-column-gutter-outer-xlarge: var(
    --sk-cssgrid-column-gutter-outer,
    var(--sk-cssgrid-column-gutter-outer-large)
  );
  --sk-cssgrid-column-gutter-outer-medium: var(
    --sk-cssgrid-column-gutter-outer,
    var(--sk-cssgrid-column-gutter-outer-large)
  );
  --sk-cssgrid-column-gutter-outer-small: var(
    --sk-cssgrid-column-gutter-outer,
    var(--sk-cssgrid-column-gutter-outer-large)
  );
  --sk-cssgrid-column-gutter-outer-xsmall: var(
    --sk-cssgrid-column-gutter-outer,
    var(--sk-cssgrid-column-gutter-outer-large)
  );
  --sk-cssgrid-row-gutter-outer-large: var(--sk-cssgrid-row-gutter-outer, 0);
  --sk-cssgrid-row-gutter-outer-xlarge: var(
    --sk-cssgrid-row-gutter-outer,
    var(--sk-cssgrid-row-gutter-outer-large)
  );
  --sk-cssgrid-row-gutter-outer-medium: var(
    --sk-cssgrid-row-gutter-outer,
    var(--sk-cssgrid-row-gutter-outer-large)
  );
  --sk-cssgrid-row-gutter-outer-small: var(
    --sk-cssgrid-row-gutter-outer,
    var(--sk-cssgrid-row-gutter-outer-large)
  );
  --sk-cssgrid-row-gutter-outer-xsmall: var(
    --sk-cssgrid-row-gutter-outer,
    var(--sk-cssgrid-row-gutter-outer-large)
  );
  padding: var(--sk-cssgrid-row-gutter-outer-large)
    var(--sk-cssgrid-column-gutter-outer-large);
  margin-inline-start: auto;
  margin-inline-end: auto;
  display: grid;
  grid-template-columns: repeat(var(--sk-cssgrid-columns), minmax(0, 1fr));
}

@media (min-width: 1441px) {
  .section-compatibility .grid {
    grid-column-gap: var(--sk-cssgrid-column-gutter-inner-xlarge);
  }
}

@media (max-width: 1068px) {
  .section-compatibility .grid {
    grid-column-gap: var(--sk-cssgrid-column-gutter-inner-medium);
  }
}

@media (max-width: 734px) {
  .section-compatibility .grid {
    grid-column-gap: var(--sk-cssgrid-column-gutter-inner-small);
  }
}

@media (max-width: 480px) {
  .section-compatibility .grid {
    grid-column-gap: var(--sk-cssgrid-column-gutter-inner-xsmall);
  }
}

@media (min-width: 1441px) {
  .section-compatibility .grid {
    grid-row-gap: var(--sk-cssgrid-row-gutter-inner-xlarge);
  }
}

@media (max-width: 1068px) {
  .section-compatibility .grid {
    grid-row-gap: var(--sk-cssgrid-row-gutter-inner-medium);
  }
}

@media (max-width: 734px) {
  .section-compatibility .grid {
    grid-row-gap: var(--sk-cssgrid-row-gutter-inner-small);
  }
}

@media (max-width: 480px) {
  .section-compatibility .grid {
    grid-row-gap: var(--sk-cssgrid-row-gutter-inner-xsmall);
  }
}

@media (min-width: 1441px) {
  .section-compatibility .grid {
    padding-left: var(--sk-cssgrid-column-gutter-outer-xlarge);
  }
}

@media (max-width: 1068px) {
  .section-compatibility .grid {
    padding-left: var(--sk-cssgrid-column-gutter-outer-medium);
  }
}

@media (max-width: 734px) {
  .section-compatibility .grid {
    padding-left: var(--sk-cssgrid-column-gutter-outer-small);
  }
}

@media (max-width: 480px) {
  .section-compatibility .grid {
    padding-left: var(--sk-cssgrid-column-gutter-outer-xsmall);
  }
}

@media (min-width: 1441px) {
  .section-compatibility .grid {
    padding-right: var(--sk-cssgrid-column-gutter-outer-xlarge);
  }
}

@media (max-width: 1068px) {
  .section-compatibility .grid {
    padding-right: var(--sk-cssgrid-column-gutter-outer-medium);
  }
}

@media (max-width: 734px) {
  .section-compatibility .grid {
    padding-right: var(--sk-cssgrid-column-gutter-outer-small);
  }
}

@media (max-width: 480px) {
  .section-compatibility .grid {
    padding-right: var(--sk-cssgrid-column-gutter-outer-xsmall);
  }
}

@media (min-width: 1441px) {
  .section-compatibility .grid {
    padding-top: var(--sk-cssgrid-row-gutter-outer-xlarge);
  }
}

@media (max-width: 1068px) {
  .section-compatibility .grid {
    padding-top: var(--sk-cssgrid-row-gutter-outer-medium);
  }
}

@media (max-width: 734px) {
  .section-compatibility .grid {
    padding-top: var(--sk-cssgrid-row-gutter-outer-small);
  }
}

@media (max-width: 480px) {
  .section-compatibility .grid {
    padding-top: var(--sk-cssgrid-row-gutter-outer-xsmall);
  }
}

@media (min-width: 1441px) {
  .section-compatibility .grid {
    padding-bottom: var(--sk-cssgrid-row-gutter-outer-xlarge);
  }
}

@media (max-width: 1068px) {
  .section-compatibility .grid {
    padding-bottom: var(--sk-cssgrid-row-gutter-outer-medium);
  }
}

@media (max-width: 734px) {
  .section-compatibility .grid {
    padding-bottom: var(--sk-cssgrid-row-gutter-outer-small);
  }
}

@media (max-width: 480px) {
  .section-compatibility .grid {
    padding-bottom: var(--sk-cssgrid-row-gutter-outer-xsmall);
  }
}

.section-compatibility .tile {
  margin-inline-start: auto;
  margin-inline-end: auto;
  --sk-tile-box-shadow: initial;
  --sk-tile-background: rgb(255, 255, 255);
  --sk-tile-button-background: rgba(210, 210, 215, 0.64);
  --sk-tile-button-background-hover: rgba(223, 223, 227, 0.6976);
  --sk-tile-button-background-active: rgba(193, 193, 198, 0.6544);
  --sk-tile-button-icon-color: rgba(0, 0, 0, 0.56);
  --sk-tile-button-icon-color-hover: rgba(0, 0, 0, 0.64);
  box-sizing: border-box;
  height: 100%;
  position: relative;
  overflow: hidden;
  background: var(--sk-tile-background);
  box-shadow: var(--sk-tile-box-shadow);
}

.section-compatibility .tile-rounded {
  --sk-tile-border-radius-large: var(--sk-tile-border-radius, 18px);
  --sk-tile-border-radius-xlarge: var(
    --sk-tile-border-radius,
    var(--sk-tile-border-radius-large)
  );
  --sk-tile-border-radius-medium: var(
    --sk-tile-border-radius,
    var(--sk-tile-border-radius-large)
  );
  --sk-tile-border-radius-small: var(
    --sk-tile-border-radius,
    var(--sk-tile-border-radius-large)
  );
  --sk-tile-border-radius-xsmall: var(
    --sk-tile-border-radius,
    var(--sk-tile-border-radius-large)
  );
  border-radius: var(--sk-tile-border-radius-large);
}

@media (min-width: 1441px) {
  .section-compatibility .tile-rounded {
    border-radius: var(--sk-tile-border-radius-xlarge);
  }
}

@media (max-width: 1068px) {
  .section-compatibility .tile-rounded {
    border-radius: var(--sk-tile-border-radius-medium);
  }
}

@media (max-width: 734px) {
  .section-compatibility .tile-rounded {
    border-radius: var(--sk-tile-border-radius-small);
  }
}

@media (max-width: 480px) {
  .section-compatibility .tile-rounded {
    border-radius: var(--sk-tile-border-radius-xsmall);
  }
}

.section-compatibility .typography-ps-headline-super {
  font-size: 80px;
  line-height: 1.05;
  font-weight: 700;
  letter-spacing: -0.015em;
  font-family: SF Pro Display, SF Pro Icons, Helvetica Neue, Helvetica, Arial,
    sans-serif;
}

@media (max-width: 1068px) {
  .section-compatibility .typography-ps-headline-super {
    font-size: 64px;
    line-height: 1.0625;
    font-weight: 700;
    letter-spacing: -0.009em;
    font-family: SF Pro Display, SF Pro Icons, Helvetica Neue, Helvetica, Arial,
      sans-serif;
  }
}

@media (max-width: 734px) {
  .section-compatibility .typography-ps-headline-super {
    font-size: 48px;
    line-height: 1.0834933333;
    font-weight: 700;
    letter-spacing: -0.003em;
    font-family: SF Pro Display, SF Pro Icons, Helvetica Neue, Helvetica, Arial,
      sans-serif;
  }
}

.section-compatibility .typography-ps-eyebrow {
  font-size: 24px;
  line-height: 1.1666666667;
  font-weight: 700;
  letter-spacing: 0.009em;
  font-family: SF Pro Display, SF Pro Icons, Helvetica Neue, Helvetica, Arial,
    sans-serif;
}

@media (max-width: 1068px) {
  .section-compatibility .typography-ps-eyebrow {
    font-size: 21px;
    line-height: 1.1904761905;
    font-weight: 700;
    letter-spacing: 0.011em;
    font-family: SF Pro Display, SF Pro Icons, Helvetica Neue, Helvetica, Arial,
      sans-serif;
  }
}

.section-compatibility .typography-ps-intro {
  font-size: 21px;
  line-height: 1.381002381;
  font-weight: 600;
  letter-spacing: 0.011em;
  font-family: SF Pro Display, SF Pro Icons, Helvetica Neue, Helvetica, Arial,
    sans-serif;
}

@media (max-width: 734px) {
  .section-compatibility .typography-ps-intro {
    font-size: 19px;
    line-height: 1.2105263158;
    font-weight: 600;
    letter-spacing: 0.012em;
    font-family: SF Pro Display, SF Pro Icons, Helvetica Neue, Helvetica, Arial,
      sans-serif;
  }
}

.section-compatibility .tabnav {
  font-size: 14px;
  line-height: 1.4285914286;
  font-weight: 400;
  letter-spacing: -0.016em;
  font-family: SF Pro Text, SF Pro Icons, Helvetica Neue, Helvetica, Arial,
    sans-serif;
  --tabnav-height: 44px;
  --tabnav-inner-height: 36px;
  --tabnav-platter-padding: 0px;
  --tabnav-platter-background: rgb(232, 232, 237);
  --tabnav-platter-blur: 20px;
  --tabnav-mask-gradient-width: 22px;
  --tabnav-mask-offset: calc(
    var(--tabnav-paddle-width) + var(--tabnav-mask-gradient-width)
  );
  --tabnav-mask-animation-name: "";
  --tabnav-mask-active-gradient: var(--tabnav-mask-gradient);
  --tabnav-items-offset: 0px;
  --tabnav-item-padding: 16px;
  --tabnav-item-color: rgb(0, 0, 0);
  --tabnav-item-color-active: rgb(255, 255, 255);
  --tabnav-paddle-width: var(--tabnav-inner-height);
  --tabnav-paddle-color: rgba(0, 0, 0, 0.56);
  --tabnav-paddle-color-hover: rgba(0, 0, 0, 0.64);
  --tabnav-indicator-background: rgb(29, 29, 31);
  --tabnav-indicator-start: var(--tabnav-platter-padding);
  --tabnav-indicator-width: 0px;
  --tabnav-motion-gradient-delay: 280ms;
  --tabnav-mask-gradient: linear-gradient(
    90deg,
    transparent 0,
    transparent var(--tabnav-paddle-width),
    black calc(var(--tabnav-paddle-width) + var(--tabnav-mask-gradient-width)),
    black
      calc(
        100% - var(--tabnav-paddle-width) - var(--tabnav-mask-gradient-width)
      ),
    transparent calc(100% - var(--tabnav-paddle-width)),
    transparent
  );
  position: relative;
  width: -moz-fit-content;
  width: fit-content;
  max-width: 100%;
  box-sizing: border-box;
}

.section-compatibility .tabnav.tabnav-elevated {
  font-size: 17px;
  line-height: 1.4705882353;
  font-weight: 400;
  letter-spacing: -0.022em;
  font-family: SF Pro Text, SF Pro Icons, Helvetica Neue, Helvetica, Arial,
    sans-serif;
  --tabnav-height: 56px;
  --tabnav-inner-height: 44px;
  --tabnav-platter-padding: 6px;
  --tabnav-item-padding: 22px;
}

.section-compatibility .tabnav * {
  box-sizing: border-box;
}

.section-compatibility .tabnav-platter {
  height: var(--tabnav-height);
  padding: var(--tabnav-platter-padding);
  background-color: var(--tabnav-platter-background);
  border-radius: 999px;
  overflow: hidden;
}

.section-compatibility .tabnav:not(.tabnav-noblur) .tabnav-platter {
  -webkit-backdrop-filter: blur(var(--tabnav-platter-blur));
  backdrop-filter: blur(var(--tabnav-platter-blur));
}

.section-compatibility .tabnav-mask {
  position: relative;
  width: calc(100% + var(--tabnav-mask-offset));
  height: 100%;
  padding: 0px 0px 0px var(--tabnav-mask-offset);
  z-index: 1;
  mask-image: var(--tabnav-mask-active-gradient);
}

.section-compatibility .tabnav-mask.tabnav-mask-noscroll {
  display: contents;
  margin-inline-start: 0;
  padding: 0;
}

.section-compatibility .tabnav-items {
  display: flex;
  align-items: center;
  margin: 0;
  width: -moz-fit-content;
  width: fit-content;
  list-style: none;
  z-index: 1;
  transform: translateX(var(--tabnav-items-offset));
  transition-property: transform;
  transition-duration: 320ms;
  transition-timing-function: ease-out;
}

.section-compatibility .tabnav-item,
.section-compatibility .tabnav-items {
  position: relative;
  height: 100%;
}

.section-compatibility .tabnav-item {
  /*padding: 0 var(--tabnav-item-padding);
    color: var(--tabnav-item-color);
    white-space: nowrap;
    transition-duration: 120ms;
    transition-property: color;
    transition-timing-function: ease-out;*/
}

.section-compatibility .tabnav-item .tabnav-link {
  display: flex;
  align-items: center;
  height: 100%;
  background: rgba(0, 0, 0, 0);
  border: none;
  border-radius: 0;
  color: inherit;
  text-decoration: none;
  opacity: 0.8;
  transition-property: opacity;
  transition-duration: 100ms;
  transition-timing-function: ease-in-out;
}

.section-compatibility .tabnav-item .tabnav-link:focus {
  outline: none;
}

.section-compatibility .tabnav-item .tabnav-link:hover {
  opacity: 1;
}

.section-compatibility .tabnav-item.tabnav-item-active {
  color: var(--tabnav-item-color-active);
  transition-delay: 160ms;
  transition-duration: 160ms;
  transition-timing-function: ease-in;
}

.section-compatibility .tabnav-item.tabnav-item-active .tabnav-link {
  opacity: 1;
}

.section-compatibility .tabnav-paddle {
  position: absolute;
  display: flex;
  justify-content: center;
  align-items: center;
  transform: translateZ(0);
  top: var(--tabnav-platter-padding);
  bottom: var(--tabnav-platter-padding);
  width: var(--tabnav-paddle-width);
  height: var(--tabnav-paddle-width);
  background-color: rgba(0, 0, 0, 0);
  border: none;
  border-radius: 999px;
  color: var(--tabnav-paddle-color);
  cursor: pointer;
  z-index: 2;
  transition-delay: 0ms, 40ms, 40ms;
  transition-duration: 100ms, 80ms, 80ms;
  transition-property: color, opacity, visibility;
  transition-timing-function: ease-in-out, ease-out, step-start;
}

.section-compatibility .tabnav-paddle-left {
  left: var(--tabnav-platter-padding);
}

.section-compatibility .tabnav-paddle-right {
  right: var(--tabnav-platter-padding);
}

.section-compatibility .tabnav-paddle:hover {
  color: var(--tabnav-paddle-color-hover);
}

.section-compatibility .tabnav-paddle.tabnav-paddle-hidden {
  opacity: 0;
  visibility: hidden;
  transition-delay: 200ms;
  transition-duration: 80ms;
  transition-property: opacity, visibility;
  transition-timing-function: ease-out, step-end;
}

.section-compatibility .tabnav-indicator {
  position: absolute;
  top: var(--tabnav-platter-padding);
  left: var(--tabnav-indicator-start);
  bottom: var(--tabnav-platter-padding);
  width: var(--tabnav-indicator-width);
  height: calc(100% - var(--tabnav-platter-padding) * 2);
  background: #1d1d1f;
  /*    background: #f95f00;*/
  border-radius: 999px;
  transition-property: left, width;
  transition-duration: 320ms;
  transition-timing-function: ease-out;
}

.section-compatibility .card {
  width: 100%;
  --sk-tile-background: rgb(245, 245, 247);
  --sk-tile-border-radius: 28px;
}

.section-compatibility .card.tile-rounded {
  isolation: isolate;
}

.section-compatibility .section {
  padding-top: var(--global-section-padding);
  padding-bottom: var(--global-section-aap-padding);
}

/*html.no-enhanced .section:not(:has(.all-access-pass:not(.fallback))) {
    padding-bottom: 0;
}*/

.section-compatibility.section {
  position: relative;
  /*    background-color: var(--background-accent, rgb(255, 255, 255));*/
}

.section-compatibility.section strong {
  color: var(--highlight-accent, #000);
}

.section-compatibility .card-large {
  --sk-tile-border-radius: 14px;
}

@media (max-width: 1068px) {
  .section-compatibility .card-large {
    --sk-tile-border-radius: 14px;
  }
}

@media (max-width: 734px) {
  .section-compatibility .card-large {
    --sk-tile-border-radius: 14px;
  }
}

.section-compatibility .bento-content-width {
  --bento-max-width: 1260px;
  --bento-inline-padding: var(--sk-cssgrid-column-gutter-outer-large);
  --bento-width: calc(var(--bento-max-width) + var(--bento-inline-padding) * 2);
  box-sizing: border-box;
  width: 100%;
  max-width: var(--bento-width);
  margin-inline-start: auto;
  margin-inline-end: auto;
  padding-inline-start: initial;
  padding-inline-end: initial;
}

@media (max-width: 1068px) {
  .section-compatibility .bento-content-width {
    --bento-max-width: 934px;
    --bento-inline-padding: var(--sk-cssgrid-column-gutter-outer-medium);
  }
}

@media (max-width: 734px) {
  .section-compatibility .bento-content-width {
    --bento-max-width: var(--small-max-width);
    --bento-inline-padding: var(--sk-cssgrid-column-gutter-outer-small);
  }
}

main .section-compatibility .tile {
  --ax-contrast-color: var(--sk-tile-background);
}

@media (inverted-colors: inverted) or (prefers-contrast: more) or (prefers-reduced-transparency) {
  main h2:not(: has(> .visuallyhidden:only-child, > picture:only-child),
        [role="presentation"] *),
    main p:not(:has(> .visuallyhidden:only-child, > picture:only-child),
        [role="presentation"] *) {
    background-color: var(--ax-contrast-color) !important;
  }
}

@media (max-width: 734px) {
  .section-compatibility .tabnav.tabnav-elevated {
    font-size: 14px;
    line-height: 1.2857742857;
    font-weight: 400;
    letter-spacing: -0.016em;
    font-family: SF Pro Text, SF Pro Icons, Helvetica Neue, Helvetica, Arial,
      sans-serif;
    --tabnav-height: 44px;
    --tabnav-inner-height: 36px;
    --tabnav-platter-padding: 4px;
    --tabnav-item-padding: 16px;
  }
}

.section-compatibility .tabnav.tabnav-elevated .tabnav-item-active {
  pointer-events: none;
}

.section-compatibility .tabnav-gallery {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 100%;
}

.section-compatibility .tabnav-gallery .item-container {
  order: 1;
  display: flex;
  justify-content: center;
  position: relative;
  width: 100%;
  overflow: hidden;
}

.section-compatibility .tabnav-gallery .tabnav-wrapper {
  order: 2;
  margin-top: 50px;
  /*margin-inline-start: auto;
    margin-inline-end: auto;
    width: 87.5%;
    max-width: 1680px;*/
}

@media (max-width: 1068px) {
  .section-compatibility .tabnav-gallery .tabnav-wrapper {
    margin-top: 36px;
  }
}

@media (max-width: 734px) {
  .section-compatibility .tabnav-gallery .tabnav-wrapper {
    margin-top: 49px;
  }
}

.section-compatibility .tabnav-gallery .tabnav-wrapper .tabnav {
  margin-inline: 0;
}

.section-compatibility .tabnav-gallery .captions-container {
  order: 3;
}

.section-compatibility .tabnav-gallery .captions-gallery {
  display: flex;
  align-items: flex-start;
  justify-content: center;
  position: relative;
  margin-top: 36px;
  margin-inline-start: 0;
  margin-inline-end: auto;
}

@media (max-width: 734px) {
  .section-compatibility .tabnav-gallery .captions-gallery {
    margin-top: 32px;
  }
}

.section-compatibility .tabnav-gallery .captions-gallery .gallery-caption {
  position: absolute;
  top: 0;
  opacity: 0;
  text-align: left;
  transition: opacity 250ms cubic-bezier(0.33, 1, 0.68, 1);
}

.section-compatibility
  .tabnav-gallery
  .captions-gallery
  .gallery-caption.current {
  opacity: 1;
  z-index: 1;
}

.section-compatibility
  .tabnav-gallery
  .captions-gallery
  .gallery-caption:first-child {
  position: relative;
}

.section-compatibility .tabnav-gallery .captions-gallery .gallery-caption p {
  margin: 0 auto;
}

.section-compatibility .tabnav-gallery .gallery-item {
  width: 100%;
  margin-inline: auto;
  width: 87.5vw;
  max-width: var(--section-max-width);
}

.section-compatibility .tabnav-gallery .gallery-item:not(:first-child) {
  position: absolute;
}

.section-compatibility .tabnav-gallery .gallery-item:first-child {
  position: relative;
}

.section-compatibility
  .section-product-stories
  .section-ps-headline-container
  .section-ps-headline:not(:first-child) {
  margin-top: var(--headline-margin-top);
}

.section-compatibility
  .section-product-stories
  .section-ps-headline-container
  + .section-ps-intro {
  --intro-margin-top: 32px;
  margin-top: var(--intro-margin-top);
}

@media (max-width: 1068px) {
  .section-compatibility
    .section-product-stories
    .section-ps-headline-container
    + .section-ps-intro {
    --intro-margin-top: 20px;
  }
}

.section-compatibility .section-product-stories strong {
  font-weight: 700;
}

.section-compatibility .section-product-stories .viewport-content {
  width: 980px;
}

@media (max-width: 1068px) {
  .section-compatibility .section-product-stories .viewport-content {
    width: 692px;
  }
}

@media (max-width: 734px) {
  .section-compatibility .section-product-stories .viewport-content {
    width: 87.5%;
    max-width: var(--small-max-width);
  }
}

@supports (margin: calc(max(0px))) {
  html:not([dir="rtl"]) .section-compatibility .tabnav-items {
    margin-inline: initial;
  }
}

.feature-card-modal.modal-page-overlay .modal-overlay {
  min-width: min(48rem, 100vw);
  max-width: 816px;
}

.compatibility-subheading {
  margin: 20px auto 70px;
  text-align: center;
  max-width: 760px;
}

@media (max-width: 1068px) {
  .compatibility-subheading {
    margin: 20px auto 40px;
    max-width: 600px;
  }
}

@media (max-width: 734px) {
  .compatibility-subheading {
    max-width: calc(100% - 80px);
  }
}

.typography-section-eyebrow {
  color: #fff;
}

#ac-globalfooter {
  --footer-background: white;
}

.no-js .page-overview-mac.deeplink-check {
  opacity: 1;
}

.no-js .section-content-start #hardware-software-1,
.no-js .section-superpowers #mac-best-device-2 {
  display: none;
}

.page-overview-mac.deeplink-check {
  opacity: 0;
}

.page-overview-mac {
  opacity: 1;
  transition: opacity 0.3s ease-in-out;
}

.jumpnav .tabnav-items {
}

.section-main-wrapper {
  display: flex;
  flex-direction: column;
}

.deeplink-multitask {
}

.deeplink-summary,
.deeplink-multitask {
}

.ai-gradient {
  background: -webkit-linear-gradient(356deg, #fb3400, #f95f00);
  background: linear-gradient(94deg, #fb3400, #f95f00);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  display: inline-block;
}

.typography-section-headline.ai-gradient {
  line-height: 1.1;
}

.section-augment .section-header {
  padding-bottom: 50px;
}

@media (max-width: 1068px) {
  .section-augment .section-header {
    padding-bottom: 20px;
  }
}

.section-ways-to-save-wts .tile-content .card-container {
  padding-bottom: 12px;
  padding-top: 10px;
}

.hero-headline-container .typography-section-headline-copy {
  margin-block-end: 0;
}

.section-apps .typography-tout {
  font-size: 17px;
  line-height: 1.2105263158;
  font-weight: 600;
  letter-spacing: 0.012em;
  font-family: SF Pro Display, SF Pro Icons, Helvetica Neue, Helvetica, Arial,
    sans-serif;
}

.section-apps .typography-body-reduced-tight,
.section-ways-to-save .typography-body-reduced-tight {
  font-size: 14px;
  line-height: 1.2857742857;
  font-weight: 400;
  letter-spacing: -0.016em;
  font-family: SF Pro Text, SF Pro Icons, Helvetica Neue, Helvetica, Arial,
    sans-serif;
}

.section-apps .typography-section-headline-large {
  font-size: 56px;
  line-height: 1;
  font-weight: 600;
  letter-spacing: -0.0058em;
  font-family: SF Pro Display, SF Pro Icons, Helvetica Neue, Helvetica, Arial,
    sans-serif;
}

@media (max-width: 1068px) {
  .section-apps .typography-section-headline-large {
    font-size: 48px;
    line-height: 1.0834933333;
    font-weight: 600;
    letter-spacing: -0.003em;
    font-family: SF Pro Display, SF Pro Icons, Helvetica Neue, Helvetica, Arial,
      sans-serif;
  }
}

@media (max-width: 734px) {
  .section-apps .typography-section-headline-large {
    font-size: 32px;
    line-height: 1.1;
    font-weight: 600;
    letter-spacing: 0em;
    font-family: SF Pro Display, SF Pro Icons, Helvetica Neue, Helvetica, Arial,
      sans-serif;
  }
}

.section-apps .tabnav {
  --tabnav-background-color: rgb(232, 232, 237);
  --tabnav-paddles-max-width: 345px;
  --tabnav-paddle-width: 46px;
  --tabnav-paddle-height: 42px;
  --tabnav-paddle-color: rgba(0, 0, 0, 0.56);
  position: relative;
  display: flex;
  width: -moz-fit-content;
  width: fit-content;
  margin-inline: auto;
}

@media (max-width: 365px) {
  .section-apps .tabnav {
    --tabnav-paddles-max-width: 100%;
  }
}

.section-apps .tabnav-items {
  display: flex;
  overflow-x: auto;
  overflow-y: hidden;
  margin-inline: auto;
  background: var(--tabnav-background-color);
  border-radius: 300px;
  /*    border-bottom: 1px solid #d2d2d7;*/
}

.section-apps .tabnav-item {
  padding-block: 3px;
  margin-inline: 5px;
  /*border-bottom: 1px solid #d2d2d7;
    padding-left: 0px;
    padding-right: 0px;*/
}

.section-apps .tabnav-item-link {
  --sk-button-border-width: 0px;
  transition: opacity 100ms ease-in-out;
  /*font-size: 21px;
    color: #6e6e73;
    letter-spacing: -0.224px;
    font-weight: 500;
    line-height: 1.8em;*/
}

@media (max-width: 734px) {
  .section-apps .tabnav-item-link {
    /*        font-size: 16px;*/
    /*        padding: 6px 13px;*/
  }
}

.section-apps .tabnav-item-link:not([aria-selected="true"]) {
  opacity: 0.8;
}

/*.section-apps .tabnav-item-link:active,
.section-apps .tabnav-item-link:hover {
    background: inherit;
    color: inherit;
    opacity: 1;
}*/

/*.section-apps .tabnav-item-link:after {
    left: 0;
    position: absolute;
    bottom: -1px;
    width: 100%;
    border-bottom: 1px solid transparent;
    content: "";
}*/

.tabnav .tabnav-item-link.current {
  background: var(--sk-button-background-hover);
  color: var(--sk-button-color-hover);
  pointer-events: none;
}

.tabnav .tabnav-item-link.current:after {
  border-bottom-color: #1d1d1f;
}

.section-apps .tabnav-paddles {
  display: none;
  pointer-events: none;
  visibility: hidden;
  margin: 0;
  position: absolute;
}

.section-apps .overview-coding,
.section-apps .overview-creativity,
.section-apps .overview-productivity,
.section-apps .overview-stem {
  display: block;
  --p-width: 761px;
  --p-height: 468px;
  width: var(--p-width);
  height: var(--p-height);
}

@media (max-width: 1068px) {
  .section-apps .overview-coding,
  .section-apps .overview-creativity,
  .section-apps .overview-productivity,
  .section-apps .overview-stem {
    --p-width: 478px;
    --p-height: 293px;
  }
}

@media (max-width: 734px) {
  .section-apps .overview-coding,
  .section-apps .overview-creativity,
  .section-apps .overview-productivity,
  .section-apps .overview-stem {
    --p-width: 308px;
    --p-height: 189px;
  }
}

.section-apps .section {
  overflow: hidden;
  padding-block: 140px;
}

@media (max-width: 1068px) {
  .section-apps .section {
    padding-block: 100px;
  }
}

@media (max-width: 734px) {
  .section-apps .section {
    padding-block: 80px;
  }
}

.section-apps {
  --content-width: 980px;
  --content-height: 600px;
  --content-caption-width: 630px;
  padding-block: 140px 140px;
  --gutter: 20px;
  background-color: #f5f5f7;
}

@media (max-width: 1068px) {
  .section-apps {
    --content-width: 692px;
    --content-height: 400px;
    padding-block: 90px 75px;
  }
}

@media (max-width: 734px) {
  .section-apps {
    --content-width: min(480px 85vw);
    --content-height: 310px;
    --content-caption-width: 360px;
    padding-block: 76px 50px;
  }

  .section-apps {
    --gutter: 40px;
  }
}

.section-apps .text-gradient-apps {
  display: inline-block;
  color: rgba(0, 0, 0, 0);
  background-clip: text;
  background-image: linear-gradient(45deg, #7f8ee7, #d558f9);
  transform: rotate(0deg);
  padding-bottom: 1px;
  margin-bottom: -1px;
}

.section-apps .section-headline {
  margin-block-end: 40px;
  text-align: center;
}

@media (max-width: 734px) {
  .section-apps .section-headline {
    margin-block-end: 30px;
  }
}

.section-apps .gallery {
  position: relative;
  max-width: calc(var(--content-width) + var(--gutter));
  margin-inline: auto;
  display: grid;
  grid-template-rows: repeat(3, auto);
  grid-template-columns: 100%;
  padding-block: 0px;
}

@media (max-width: 734px) {
  .section-apps .gallery {
    max-width: 1260px;
    width: calc(87.5vw + 40px);
    /*      padding-inline: 12px;*/
    padding-block: 0px;
  }
}

.section-apps .tablist-wrapper {
  padding-block: 40px 36px;
  grid-row: 2;
  z-index: 10;
}

@media (max-width: 1068px) {
  .section-apps .tablist-wrapper {
    padding-block: 30px 25px;
  }
}

@media (max-width: 450px) {
  .section-apps .tablist-wrapper {
    width: calc(100% - var(--gutter));
    margin-inline: auto;
    box-sizing: border-box;
  }
}

.section-apps .item-container,
.section-apps .tablist-wrapper {
  grid-column: 1;
}

.section-apps .item-container {
  margin-inline: auto;
  width: 100%;
  display: grid;
  grid-template-rows: subgrid;
}

.section-apps .captions-gallery {
  grid-row: 3;
  display: grid;
}

.section-apps .gallery-item {
  width: 100%;
  height: var(--content-height);
}

@media (max-width: 365px) {
  .section-apps .gallery-item {
    width: auto;
    max-width: calc(100vw - 22px);
  }
}

.section-apps .gallery-item-container {
  width: var(--content-width);
  height: var(--content-height);
  min-height: var(--content-height);
  display: flex;
  background: #fff;
  flex-direction: column;
  justify-content: flex-end;
  align-items: center;
  margin-inline: auto;
  border-radius: 28px;
  opacity: 0.5;
  transition: opacity 0.6s cubic-bezier(0.645, 0.045, 0.355, 1);
  overflow: hidden;
}

@media (max-width: 734px) {
  .section-apps .gallery-item-container {
    width: calc(100% - var(--gutter));
    margin-inline: auto;
  }
}

.section-apps .gallery-item-image-container {
  max-width: 100%;
}

@media (max-width: 734px) {
  .section-apps .gallery-item .gallery-image {
    display: flex;
    max-width: 100%;
    justify-content: center;
  }

  .section-apps .gallery-item .gallery-image img {
    padding-inline: 10px;
  }

  .section-apps .gallery-item .gallery-image.anchor-left {
    justify-content: flex-start;
  }

  .section-apps .gallery-item .gallery-image.anchor-right {
    justify-content: flex-end;
  }
}

.section-apps .gallery-item-image-caption {
  padding-block: 30px;
  grid-gap: 50px;
  gap: 50px;
  display: inline-flex;
  width: var(--content-caption-width);
  justify-content: space-between;
}

@media (max-width: 1068px) {
  .section-apps .gallery-item-image-caption {
    padding-block: 20px;
  }
}

@media (max-width: 734px) {
  .section-apps .gallery-item-image-caption {
    padding-block: 17px;
    grid-gap: 5px;
    gap: 5px;
  }
}

@media (max-width: 1068px) {
  .section-apps .gallery-item-image-caption {
    justify-content: center;
  }
}

@media (max-width: 734px) {
  .section-apps .gallery-item-image-caption {
    flex-direction: column;
    align-items: flex-start;
    max-width: var(--content-caption-width);
    width: -moz-fit-content;
    width: fit-content;
  }
}

.section-apps .gallery-item-image-caption > .caption {
  display: inline-flex;
  align-items: center;
  grid-gap: 5px;
  gap: 5px;
  margin: 0;
  color: #86868b;
}

.section-apps .gallery-item-image-caption > .caption:only-child {
  margin-inline: auto;
}

@media (max-width: 734px) {
  .section-apps .gallery-item-image-caption > .caption:only-child {
    padding-block: 0px;
  }

  .section-apps .gallery-item-image-caption > .caption {
    max-width: 240px;
  }
}

.section-apps .gallery-item-copy {
  grid-row: 1;
  grid-column: 1;
  font-weight: 400;
  max-width: var(--content-caption-width);
  margin-inline: auto;
  text-align: center;
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.6s cubic-bezier(0.645, 0.045, 0.355, 1),
    visibility 0.6s cubic-bezier(0.645, 0.045, 0.355, 1);
  /*    font-size: 17px;*/
}

.section-apps .gallery-item-copy .cta-group {
  display: inline-flex;
  flex-direction: column;
  grid-gap: 5px;
  gap: 5px;
}

.section-apps .gallery-item-copy.current {
  visibility: visible;
  opacity: 1;
}

.section-apps .gallery-item.current .gallery-item-container {
  opacity: 1;
}

.section-apps .image-icon-matlab {
  display: inline-block;
  min-width: 30px;
  height: 30px;
  background-repeat: no-repeat;
  background-image: url(/in/education/mac/images/overview/compatibility/icons/icon_matlab__f1vfouoa4hym_large.png);
  background-size: 30px 30px;
}

@media (min-resolution: 1.5dppx), (min-resolution: 144dpi) {
  .section-apps .image-icon-matlab {
    background-image: url(/in/education/mac/images/overview/compatibility/icons/icon_matlab__f1vfouoa4hym_large_2x.png);
  }
}

.section-apps .image-icon-microsoft-excel {
  display: inline-block;
  min-width: 30px;
  height: 30px;
  background-repeat: no-repeat;
  background-image: url(/in/education/mac/images/overview/compatibility/icons/icon_microsoft_excel__bwyxcl0jb8gi_large.png);
  background-size: 30px 30px;
}

@media (min-resolution: 1.5dppx), (min-resolution: 144dpi) {
  .section-apps .image-icon-microsoft-excel {
    background-image: url(/in/education/mac/images/overview/compatibility/icons/icon_microsoft_excel__bwyxcl0jb8gi_large_2x.png);
  }
}

@media (max-width: 734px) {
  .section-apps .image-icon-microsoft-excel {
    min-width: 25px;
    height: 25px;
    background-size: 25px 25px;
  }
}

.section-apps .image-icon-affinity-photo {
  display: inline-block;
  min-width: 30px;
  height: 30px;
  background-repeat: no-repeat;
  background-image: url(/in/education/mac/images/overview/compatibility/icons/icon_affinity__ds056nh6cfwy_large.png);
  background-size: 30px 30px;
}

@media (min-resolution: 1.5dppx), (min-resolution: 144dpi) {
  .section-apps .image-icon-affinity-photo {
    background-image: url(/in/education/mac/images/overview/compatibility/icons/icon_affinity__ds056nh6cfwy_large_2x.png);
  }
}

@media (max-width: 734px) {
  .section-apps .image-icon-affinity-photo {
    min-width: 25px;
    height: 25px;
    background-size: 25px 25px;
  }
}

.section-apps .image-icon-xcode {
  display: inline-block;
  min-width: 30px;
  height: 30px;
  background-repeat: no-repeat;
  background-image: url(/in/education/mac/images/overview/compatibility/icons/icon_xcode__b3sazowhcipe_large.png);
  background-size: 30px 30px;
}

@media (min-resolution: 1.5dppx), (min-resolution: 144dpi) {
  .section-apps .image-icon-xcode {
    background-image: url(/in/education/mac/images/overview/compatibility/icons/icon_xcode__b3sazowhcipe_large_2x.png);
  }
}

@media (max-width: 734px) {
  .section-apps .image-icon-xcode {
    min-width: 25px;
    height: 25px;
    background-size: 25px 25px;
  }
}

@media (max-width: 734px) {
  .section-apps .image-icon-matlab {
    min-width: 25px;
    height: 25px;
    background-size: 25px 25px;
  }
}

.apps-copy-gradient {
  -webkit-text-fill-color: transparent;
  display: inline-block;
  background: linear-gradient(270deg, #c760f6 4%, #8d85ea 95%) text;
}

.design-heading-gradient {
  -webkit-text-fill-color: transparent;
  display: inline-block;
  background: linear-gradient(270deg, #0a968e 4%, #08827c 30%, #469d00 95%) text;
}

.superpowers-heading-gradient {
  -webkit-text-fill-color: transparent;
  display: inline-block;
  background: linear-gradient(-89deg, #fa554f 3%, #ee4ac6 97%) text;
}

.faq-heading-gradient {
  -webkit-text-fill-color: transparent;
  display: inline-block;
  background: linear-gradient(-89deg, #c213f2 4%, #225ff1 96%) text;
}

.section-apps .apps-gallery .captions-gallery {
  font-size: 17px;
  color: #5d5d5d;
  line-height: 1.4705882353;
}

@media only screen and (max-width: 1068px) {
  /*.section-ways-to-save .hardware-gallery-shelve.ways-to-save-gallery {
        --item-width: 344px;
    }*/
}

@media only screen and (max-width: 734px) {
  /*.section-ways-to-save .hardware-gallery-shelve.ways-to-save-gallery {
        --item-width: 280px;
    }*/
  .section-apps .apps-gallery .captions-gallery {
    width: calc(100% - var(--gutter));
    margin-inline: auto;
    padding: 0 10px;
    box-sizing: border-box;
  }
}

/*new card size for section-superpowers*/
.section-ways-to-save .ways-to-save-gallery {
  --item-width: 372px;
}

/*@media only screen and (max-width: 1440px) {
    .section-ways-to-save .ways-to-save-gallery {
        --item-width: 372px;
    }
}*/

@media only screen and (max-width: 1068px) {
  .section-ways-to-save .ways-to-save-gallery {
    --item-width: 344px;
  }
}

@media only screen and (max-width: 734px) {
  .section-ways-to-save .ways-to-save-gallery {
    --item-width: 260px;
  }
}

html.text-zoom .section-ways-to-save .ways-to-save-gallery {
  --item-width: 372px;
}

.scroll-gallery .gallery-item {
  position: relative;
  width: var(--item-width);
  min-height: var(--item-height);
  scroll-snap-align: start;
}

@media only screen and (min-width: 1069px) {
  .scroll-gallery .gallery-item {
    min-height: 450px;
  }
}

.section-ways-to-save .tile .tile-media {
  margin-block-start: 0px;
  padding-block-end: 0px;
  margin-block-end: 32px;
  align-self: flex-start;
  border-radius: 28px;
  overflow: hidden;
  /*    width: 372px;*/
}

@media only screen and (max-width: 734px) {
  .section-ways-to-save .tile .tile-media {
    /*        width: 304px;*/
    margin-block-end: 28px;
  }
}

@media (min-width: 1068px) {
  .section-ways-to-save .tile .tile-media {
    height: 450px;
  }
}

/*.section-ways-to-save .hardware-gallery-shelve .tile-content {
    position: absolute;
    top:0px ;
    left:0px;
    padding:25px;
}
@media only screen and (max-width: 734px) {
    .section-ways-to-save .hardware-gallery-shelve .tile-content {
        max-width: 280px;
    }
}
.section-ways-to-save .hardware-gallery-shelve .tile-content .tile-copy-body {
    color:#D2D2D7;
}
.section-ways-to-save .hardware-gallery-shelve .tile-content .tile-copy-body strong {
    color:#F5F5F7;
    display: block;
    font-size: 24px;
    line-height: 1.1666666667;
    margin-bottom:8px;
}*/
.welcome-video-wall-container .typography-section-headline-copy {
  position: absolute;
  z-index: 4;
  color: #fff;
  text-align: center;
  bottom: 0px;
  max-width: 780px;
}

@media only screen and (max-width: 1068px) {
  .welcome-video-wall-container .typography-section-headline-copy {
    max-width: calc(100% - 200px);
  }
}

@media only screen and (max-width: 734px) {
  .welcome-video-wall-container .typography-section-headline-copy {
    max-width: calc(100% - 100px);
  }

  /*.section-ways-to-save .hardware-gallery-shelve .tile-content .tile-copy-body strong {
        font-size: 19px;
    }*/
}

.jumpnav-tabnav-wrapper {
  position: relative;
  display: flex;
  justify-content: center;
}

@media only screen and (max-width: 1068px) {
  .jumpnav-tabnav-wrapper {
    display: block;
  }
}

.jumpnav .tabnav-paddle {
  --scroll-container-border-color: rgb(150 150 150 / 23%);
  --scroll-container-paddle-chevron-color: rgb(29, 29, 31);
  --scroll-container-paddle-width: 6vw;
  --scroll-container-paddle-hover-duration: 200ms;
  --scroll-container-paddle-fade-duration: 150ms;
  --scroll-container-paddle-hover-opacity: 1;
  --scroll-container-border-width: 1px;
  --scroll-container-paddle-horizontal-offset: -0.5px;
  --scroll-container-safearea-offset: -10px;
  font-size: 17px;
  line-height: 1.7647058824;
  font-weight: 300;
  letter-spacing: 0em;
  font-family: SF Pro Text, SF Pro Icons, Helvetica Neue, Helvetica, Arial,
    sans-serif;
  border: 0 solid var(--scroll-container-border-color);
  border-radius: 0;
  color: var(--scroll-container-paddle-chevron-color);
  opacity: 1;
  position: absolute;
  top: 0;
  bottom: 0;
  text-align: center;
  width: calc(var(--scroll-container-paddle-width) - 1px);
  transition: opacity var(--scroll-container-paddle-fade-duration) ease-out;
}

.jumpnav .tabnav-paddle:disabled {
  opacity: 0;
}

.jumpnav .tabnav-paddle:hover::after {
  opacity: var(--scroll-container-paddle-hover-opacity);
}

.jumpnav .tabnav-paddle:focus {
  outline: none;
}

.jumpnav .tabnav-paddle:focus::after {
  outline: 2px solid var(--sk-focus-color);
  outline-offset: 3px;
  opacity: 1;
}

.jumpnav .tabnav-paddle:active {
  outline: none;
}

.jumpnav .tabnav-paddle:active::after {
  outline: none;
  opacity: var(--scroll-container-paddle-hover-opacity);
}

.jumpnav .tabnav-paddle-left {
  border-right-width: var(--scroll-container-border-width);
  left: -6vw;
}

.jumpnav .tabnav-paddle-left::after,
.jumpnav .tabnav-paddle-left::before {
  font-family: SF Pro Icons;
  color: inherit;
  display: inline-block;
  font-style: normal;
  font-weight: inherit;
  font-size: inherit;
  line-height: 1;
  text-decoration: underline;
  position: relative;
  z-index: 1;
  alt: "";
  text-decoration: none;
}

.jumpnav .tabnav-paddle-left::before {
  display: none;
}

.jumpnav .tabnav-paddle-left::after,
.jumpnav .tabnav-paddle-left::before {
  content: "";
}

.jumpnav .tabnav-paddle-left::after {
  margin-left: var(--scroll-container-paddle-horizontal-offset);
}

@supports (left: calc(max(0px))) {
  .jumpnav .tabnav-paddle-left {
    left: max(
      env(safe-area-inset-inline-start()) +
        var(--scroll-container-safearea-offset),
      0px
    );
  }
}

.jumpnav .tabnav-paddle-right {
  border-left-width: var(--scroll-container-border-width);
  right: -6vw;
  margin-top: 0px;
}

.jumpnav .tabnav-paddle-right::after,
.jumpnav .tabnav-paddle-right::before {
  font-family: SF Pro Icons;
  color: inherit;
  display: inline-block;
  font-style: normal;
  font-weight: inherit;
  font-size: inherit;
  line-height: 1;
  text-decoration: underline;
  position: relative;
  z-index: 1;
  alt: "";
  text-decoration: none;
}

.jumpnav .tabnav-paddle-right::before {
  display: none;
}

.jumpnav .tabnav-paddle-right::after,
.jumpnav .tabnav-paddle-right::before {
  content: "";
}

.jumpnav .tabnav-paddle-right::after {
  margin-right: var(--scroll-container-paddle-horizontal-offset);
}

@supports (right: calc(max(0px))) {
  .jumpnav .tabnav-paddle-right {
    right: max(
      env(safe-area-inset-inline-start()) +
        var(--scroll-container-safearea-offset),
      0px
    );
  }
}

.section-apps .typography-section-headline-copy {
  font-size: 24px;
  line-height: 1.3333333333;
  font-weight: 600;
  letter-spacing: 0.009em;
  font-family: SF Pro Display, SF Pro Icons, Helvetica Neue, Helvetica, Arial,
    sans-serif;
  color: #86868b;
}

@media only screen and (max-width: 1068px) {
  .section-apps .typography-section-headline-copy {
    font-size: 21px;
    line-height: 1.1904761905;
    font-weight: 600;
    letter-spacing: 0.011em;
    font-family: SF Pro Display, SF Pro Icons, Helvetica Neue, Helvetica, Arial,
      sans-serif;
  }
}

@media only screen and (max-width: 734px) {
  .section-apps .typography-section-headline-copy {
    max-width: 375px;
  }
}

.section-ways-to-save .section-content-header {
  position: relative;
  z-index: 0;
  overflow: hidden;
  background-color: #f5f5f7;
}

.section-ways-to-save .section-content-header .columns {
  overflow: hidden;
}

.section-ways-to-save {
  --hardware-top-margin: 75px;
}

@media (max-width: 1068px) {
  .section-ways-to-save {
    --hardware-top-margin: 60px;
  }
}

@media (max-width: 734px) {
  .section-ways-to-save {
    --hardware-top-margin: 24px;
  }
}

.section-ways-to-save .garage-image {
  display: flex;
  flex-direction: column;
  align-items: center;
  margin-top: var(--hardware-top-margin);
}

.section-ways-to-save .garage-image .hardware-container {
  position: relative;
}

.section-ways-to-save .garage-image .screen-scrim {
  background: #000;
  pointer-events: none;
}

.section-ways-to-save .garage-image .image-hardware {
  z-index: -1;
}

html.safari .section-ways-to-save .garage-image .image-hardware {
  transform: rotate(0deg);
}

/*html.enhance-xp .section-ways-to-save .garage-image .image-screen {
    opacity: .2
}*/

.section-ways-to-save .garage-image-mac {
  margin-left: 67px;
}

@media (max-width: 1068px) {
  .section-ways-to-save .garage-image-mac {
    margin-left: 0px;
  }
}

@media (max-width: 734px) {
  .section-ways-to-save .garage-image-mac {
    margin-left: min(0px, calc(100vw - 707px));
  }
}

.section-ways-to-save .garage-image-mac .overview-macbook-hw {
  mask-repeat: no-repeat;
  mask-image: url(/in/education/mac/images/overview/macos/hero/macbook_screen_mask__c9231d5bn9m6_large.png);
  mask-size: 1052px 618px;
  mask-position: -0.5px 0px;
}

@media (min-resolution: 1.5dppx), (min-resolution: 144dpi) {
  .section-ways-to-save .garage-image-mac .overview-macbook-hw {
    mask-image: url(/in/education/mac/images/overview/macos/hero/macbook_screen_mask__c9231d5bn9m6_large_2x.png);
  }
}

@media (max-width: 1068px) {
  .section-ways-to-save .garage-image-mac .overview-macbook-hw {
    mask-repeat: no-repeat;
    mask-image: url(/in/education/mac/images/overview/macos/hero/macbook_screen_mask__c9231d5bn9m6_medium.png);
    mask-size: 1068px 438px;
  }
}

@media (max-width: 1068px) and (min-resolution: 1.5dppx),
  (max-width: 1068px) and (min-resolution: 144dpi) {
  .section-ways-to-save .garage-image-mac .overview-macbook-hw {
    mask-image: url(/in/education/mac/images/overview/macos/hero/macbook_screen_mask__c9231d5bn9m6_medium_2x.png);
  }
}

@media (max-width: 734px) {
  .section-ways-to-save .garage-image-mac .overview-macbook-hw {
    mask-repeat: no-repeat;
    mask-image: url(/in/education/mac/images/overview/macos/hero/macbook_screen_mask__c9231d5bn9m6_small.png);
    mask-size: 734px 388px;
  }
}

@media (max-width: 734px) and (min-resolution: 1.5dppx),
  (max-width: 734px) and (min-resolution: 144dpi) {
  .section-ways-to-save .garage-image-mac .overview-macbook-hw {
    mask-image: url(/in/education/mac/images/overview/macos/hero/macbook_screen_mask__c9231d5bn9m6_small_2x.png);
  }
}

.section-ways-to-save .garage-image-mac .screen-scrim {
  display: block;
  --p-width: 944px;
  --p-height: 614px;
  width: var(--p-width);
  height: var(--p-height);
}

@media (max-width: 1068px) {
  .section-ways-to-save .garage-image-mac .screen-scrim {
    --p-width: 668px;
    --p-height: 434px;
  }
}

@media (max-width: 734px) {
  .section-ways-to-save .garage-image-mac .screen-scrim {
    --p-width: 592px;
    --p-height: 386px;
  }
}

.section-ways-to-save .garage-image-mac .overview-macbook-screen,
.section-ways-to-save .garage-image-mac .screen-scrim {
  position: absolute;
  transform: perspective(2000px) translate3d(19px, -134px, -3px) rotateX(-46deg)
    scale3d(0.945, 0.62, 1);
}

@media (max-width: 1068px) {
  .section-ways-to-save .garage-image-mac .overview-macbook-screen,
  .section-ways-to-save .garage-image-mac .screen-scrim {
    transform: perspective(2000px) translate3d(197px, -105px, 59px)
      rotateX(-55deg) scale3d(0.92, 0.74, 1) translateY(32px) skewX(3.5deg);
  }
}

@media (max-width: 734px) {
  .section-ways-to-save .garage-image-mac .overview-macbook-screen,
  .section-ways-to-save .garage-image-mac .screen-scrim {
    transform: perspective(2000px) translate3d(81px, -104px, 49px)
      rotateX(-55deg) scale3d(0.93, 0.75, 1) translateY(50px) skewX(2deg);
  }
}

.section-ways-to-save .garage-image-mac .overview-macbook-shadow {
  position: absolute;
  z-index: -1;
  top: 0;
  left: 0;
}

.overview-macbook-hw {
  display: block;
  --p-width: 1052px;
  --p-height: 618px;
  width: var(--p-width);
  height: var(--p-height);
}

@media (max-width: 1068px) {
  .overview-macbook-hw {
    --p-width: 1068px;
    --p-height: 438px;
  }
}

@media (max-width: 734px) {
  .overview-macbook-hw {
    --p-width: 734px;
    --p-height: 388px;
  }
}

.overview-macbook-screen {
  display: block;
  --p-width: 944px;
  --p-height: 614px;
  width: var(--p-width);
  height: var(--p-height);
}

@media (max-width: 1068px) {
  .overview-macbook-screen {
    --p-width: 668px;
    --p-height: 434px;
  }
}

@media (max-width: 734px) {
  .overview-macbook-screen {
    --p-width: 592px;
    --p-height: 386px;
  }
}

.overview-macbook-screen-mask {
  display: block;
  --p-width: 1052px;
  --p-height: 618px;
  width: var(--p-width);
  height: var(--p-height);
}

@media (max-width: 1068px) {
  .overview-macbook-screen-mask {
    --p-width: 1068px;
    --p-height: 438px;
  }
}

@media (max-width: 734px) {
  .overview-macbook-screen-mask {
    --p-width: 734px;
    --p-height: 388px;
  }
}

.overview-macbook-shadow {
  display: block;
  --p-width: 1052px;
  --p-height: 618px;
  width: var(--p-width);
  height: var(--p-height);
}

@media (max-width: 1068px) {
  .overview-macbook-shadow {
    --p-width: 1068px;
    --p-height: 438px;
  }
}

@media (max-width: 734px) {
  .overview-macbook-shadow {
    --p-width: 734px;
    --p-height: 388px;
  }
}

.section-content-header.section-header-mac {
  background-color: #f5f5f7;
  padding-top: 140px;
}

@media (max-width: 1068px) {
  .section-content-header.section-header-mac {
    padding-top: 100px;
  }
}

@media (max-width: 734px) {
  .section-content-header.section-header-mac {
    padding-top: 80px;
  }
}

.section-superpowers .typography-section-headline {
}

.section-ways-to-save .image-caption {
  grid-area: before;
  text-align: center;
  color: #6e6e73;
  margin-top: -50px;
  margin-bottom: 74px;
}

@media (max-width: 734px) {
  .section-ways-to-save .image-caption {
    padding-inline: 20px;
  }
}

@media (max-width: 1068px) {
  .section-ways-to-save .ways-to-save-gallery.macos-gallery-shelve {
    /*        margin-top: -68px;*/
    background: #fff;
  }

  .section-ways-to-save .image-caption {
    margin-bottom: 54px;
    padding-top: 18px;
  }
}

@media (max-width: 734px) {
  .section-ways-to-save .ways-to-save-gallery.macos-gallery-shelve {
    /*        margin-top: -60px;*/
    background: #fff;
  }

  .section-ways-to-save .image-caption {
    margin-bottom: 36px;
    padding-top: 18px;
  }
}

.tile .typography-eyebrow-elevated {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1;
  color: #fff;
  padding: 32px;
  font-size: 17px;
  letter-spacing: -0.37px;
}

@media (max-width: 1068px) {
  .tile .typography-eyebrow-elevated {
    padding: 28px;
    font-size: 14px;
    letter-spacing: -0.22px;
  }
}

@media (max-width: 734px) {
  .tile .typography-eyebrow-elevated {
    padding: 24px;
  }
}

.jumpnav-sticky-wrapper {
  width: 100%;
  z-index: 501;
  opacity: 0;
  transform: translateY(-100%);
  will-change: opacity, transform;
  transition: opacity 0.3s ease-in-out, transform 0.2s ease-in-out;
  position: fixed;
  top: 0;
}

.jumpnav-sticky-wrapper.jumpnav-sticky-is--visible {
  opacity: 1;
  transform: translateY(0);
}

.section-apps .tabnav.with-paddles .tabnav-paddle,
.section-apps .tabnav.with-paddles .tabnav-paddle::after {
  opacity: 0;
  transition: opacity 150ms ease-out;
}

.section-apps .tabnav.with-paddles .tabnav-paddle:not([disabled]) {
  opacity: 1;
  pointer-events: all;
}

.section-apps .tabnav.with-paddles .tabnav-paddle:not([disabled])::after {
  opacity: 1;
}

.section-apps .tabnav.with-paddles .tabnav-paddle:focus-visible {
  outline: none;
}

.section-apps .tabnav.with-paddles .tabnav-paddle:focus-visible::after {
  outline: 2px solid var(--sk-focus-color, #0071e3);
  outline-offset: var(--sk-focus-offset, 1px);
}

/* Optional for visual feedback */
.scroll-left {
  border-color: green;
}

.scroll-right {
  border-color: red;
}

.scroll-middle {
  border-color: orange;
}

/*#ac-localnav.is-sticky {
    position: fixed;
    opacity:1;
    top:0;
}
#ac-localnav {
    opacity: 0;
    transform: translateY(0); 
    transition: opacity .6s ease-in-out;
    position: initial;
}*/
#ac-localnav {
  position: sticky;
  top: 0;
}

.hero-headline-deeplink {
  display: none;
}

.layout-deeplink .hero-headline-initial {
  display: none;
}

.layout-deeplink .hero-headline-deeplink {
  display: block;
}

/*.layout-deeplink .hero-headline-container-hardware-deeplink,
.layout-deeplink .hero-headline-container-software-deeplink {
    display:block;
}
.layout-deeplink .hero-headline-container-hardware,
.layout-deeplink .hero-headline-container-software {
    display:none;
}
*/

.theme-dark .accordion-wrapper {
  background: transparent;
}

.tabnav {
  --tabnav-paddles-max-width: 345px;
}

@media (max-width: 365px) {
  .tabnav {
    --tabnav-paddles-max-width: 100%;
  }
}

@media (max-width: 734px) {
  /*.tabnav.with-paddles {
        max-width: var(--tabnav-paddles-max-width)
    }*/

  .tabnav.with-paddles .tabnav-items {
    overflow-x: scroll;
    scroll-snap-type: x mandatory;
    scrollbar-width: none;
  }

  .tabnav.with-paddles .tabnav-items::-webkit-scrollbar {
    display: none;
  }
}

.tabnav.with-paddles .tabnav-paddles {
  visibility: visible;
  display: flex;
  justify-content: space-between;
  width: calc(100% + 2px);
  left: -1px;
}

.tabnav.with-paddles .tabnav-paddle {
  pointer-events: none;
  width: var(--tabnav-paddle-width);
  height: var(--tabnav-paddle-height);
  background: rgba(0, 0, 0, 0);
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 22px;
  font-weight: 600;
  color: var(--tabnav-paddle-color);
  will-change: opacity;
}

.tabnav.with-paddles .tabnav-paddle,
.tabnav.with-paddles .tabnav-paddle::after {
  opacity: 0;
  transition: opacity 150ms ease-out;
}

.tabnav.with-paddles .tabnav-paddle:not([disabled]) {
  opacity: 1;
  pointer-events: all;
}

.tabnav.with-paddles .tabnav-paddle:not([disabled])::after {
  opacity: 1;
}

.tabnav.with-paddles .tabnav-paddle:focus-visible {
  outline: none;
}

.tabnav.with-paddles .tabnav-paddle:focus-visible::after {
  outline: 2px solid var(--sk-focus-color, #0071e3);
  outline-offset: var(--sk-focus-offset, 1px);
}

.tabnav.with-paddles .tabnav-paddle-left {
  /*border-bottom-left-radius: 80px;
    border-top-left-radius: 80px*/
}

.tabnav.with-paddles .tabnav-paddle-left:not([disabled]) {
  background: linear-gradient(
    90deg,
    var(--tabnav-background-color) 85%,
    transparent
  );
}

.tabnav.with-paddles .tabnav-paddle-right {
  /*border-bottom-right-radius: 80px;
    border-top-right-radius: 80px*/
}

.tabnav.with-paddles .tabnav-paddle-right:not([disabled]) {
  background: linear-gradient(
    90deg,
    transparent,
    var(--tabnav-background-color) 15%
  );
}

.tabnav-item-link:active,
.tabnav-item-link:hover {
  background: inherit;
  color: inherit;
  opacity: 1;
}

/*styles for updated gallery card*/

.section-garage-carousel.section-mac {
  --image-hidden-amount: 92px;
}

@media (max-width: 1068px) {
  .section-garage-carousel.section-mac {
    --image-hidden-amount: 66px;
  }
}

@media (max-width: 734px) {
  .section-garage-carousel.section-mac {
    --image-hidden-amount: 58px;
  }
}

.section-garage-carousel .garage-image {
  display: flex;
  flex-direction: column;
  align-items: center;
  margin-top: var(--hardware-top-margin);
}

.section-garage-carousel .garage-image .hardware-container {
  position: relative;
}

.section-garage-carousel .garage-image .screen-scrim {
  background: #000;
  pointer-events: none;
}

.section-garage-carousel .garage-image .image-hardware {
  z-index: -1;
}

html.safari .section-garage-carousel .garage-image .image-hardware {
  transform: rotate(0deg);
}

html.enhance-xp .section-garage-carousel .garage-image .image-screen {
  opacity: 0.2;
}

.section-garage-carousel .garage-image-mac {
  margin-left: 67px;
}

@media (max-width: 1068px) {
  .section-garage-carousel .garage-image-mac {
    margin-left: 0px;
  }
}

@media (max-width: 734px) {
  .section-garage-carousel .garage-image-mac {
    margin-left: min(0px, calc(100vw - 707px));
  }
}

.section-garage-carousel .garage-image-mac .overview-macbook-hw {
  mask-repeat: no-repeat;
  mask-image: url(/v/education/college-students/e/images/overview/macbook_screen_mask__c9231d5bn9m6_large.png);
  mask-size: 1052px 618px;
  mask-position: -0.5px 0px;
}

@media (min-resolution: 1.5dppx), (min-resolution: 144dpi) {
  .section-garage-carousel .garage-image-mac .overview-macbook-hw {
    mask-image: url(/v/education/college-students/e/images/overview/macbook_screen_mask__c9231d5bn9m6_large_2x.png);
  }
}

@media (max-width: 1068px) {
  .section-garage-carousel .garage-image-mac .overview-macbook-hw {
    mask-repeat: no-repeat;
    mask-image: url(/v/education/college-students/e/images/overview/macbook_screen_mask__c9231d5bn9m6_medium.png);
    mask-size: 1068px 438px;
  }
}

@media (max-width: 1068px) and (min-resolution: 1.5dppx),
  (max-width: 1068px) and (min-resolution: 144dpi) {
  .section-garage-carousel .garage-image-mac .overview-macbook-hw {
    mask-image: url(/v/education/college-students/e/images/overview/macbook_screen_mask__c9231d5bn9m6_medium_2x.png);
  }
}

@media (max-width: 734px) {
  .section-garage-carousel .garage-image-mac .overview-macbook-hw {
    mask-repeat: no-repeat;
    mask-image: url(/v/education/college-students/e/images/overview/macbook_screen_mask__c9231d5bn9m6_small.png);
    mask-size: 734px 388px;
  }
}

@media (max-width: 734px) and (min-resolution: 1.5dppx),
  (max-width: 734px) and (min-resolution: 144dpi) {
  .section-garage-carousel .garage-image-mac .overview-macbook-hw {
    mask-image: url(/v/education/college-students/e/images/overview/macbook_screen_mask__c9231d5bn9m6_small_2x.png);
  }
}

.section-garage-carousel .garage-image-mac .screen-scrim {
  display: block;
  --p-width: 944px;
  --p-height: 614px;
  width: var(--p-width);
  height: var(--p-height);
}

@media (max-width: 1068px) {
  .section-garage-carousel .garage-image-mac .screen-scrim {
    --p-width: 668px;
    --p-height: 434px;
  }
}

@media (max-width: 734px) {
  .section-garage-carousel .garage-image-mac .screen-scrim {
    --p-width: 592px;
    --p-height: 386px;
  }
}

.section-garage-carousel .garage-image-mac .overview-macbook-screen,
.section-garage-carousel .garage-image-mac .screen-scrim {
  position: absolute;
  transform: perspective(2000px) translate3d(19px, -134px, -3px) rotateX(-46deg)
    scale3d(0.945, 0.62, 1);
}

@media (max-width: 1068px) {
  .section-garage-carousel .garage-image-mac .overview-macbook-screen,
  .section-garage-carousel .garage-image-mac .screen-scrim {
    transform: perspective(2000px) translate3d(197px, -105px, 59px)
      rotateX(-55deg) scale3d(0.92, 0.74, 1) translateY(32px) skewX(3.5deg);
  }
}

@media (max-width: 734px) {
  .section-garage-carousel .garage-image-mac .overview-macbook-screen,
  .section-garage-carousel .garage-image-mac .screen-scrim {
    transform: perspective(2000px) translate3d(81px, -104px, 49px)
      rotateX(-55deg) scale3d(0.93, 0.75, 1) translateY(50px) skewX(2deg);
  }
}

.section-garage-carousel .garage-image-mac .overview-macbook-shadow {
  position: absolute;
  z-index: -1;
  top: 0;
  left: 0;
}

.section-garage-carousel .garage-image-ipad {
  margin-left: 111px;
}

@media (max-width: 1068px) {
  .section-garage-carousel .garage-image-ipad {
    margin-left: 0px;
  }
}

@media (max-width: 569px) {
  .section-garage-carousel .garage-image-ipad {
    align-items: flex-start;
    margin-left: -90px;
  }
}

.section-garage-carousel .garage-image-ipad .overview-ipad-hw {
  mask-repeat: no-repeat;
  mask-image: url(/v/education/college-students/e/images/overview/ipad_screen_mask__dw0o8jfzp2y6_large.png);
  mask-size: 932px 706px;
}

@media (min-resolution: 1.5dppx), (min-resolution: 144dpi) {
  .section-garage-carousel .garage-image-ipad .overview-ipad-hw {
    mask-image: url(/v/education/college-students/e/images/overview/ipad_screen_mask__dw0o8jfzp2y6_large_2x.png);
  }
}

@media (max-width: 1068px) {
  .section-garage-carousel .garage-image-ipad .overview-ipad-hw {
    mask-repeat: no-repeat;
    mask-image: url(/v/education/college-students/e/images/overview/ipad_screen_mask__dw0o8jfzp2y6_medium.png);
    mask-size: 1068px 538px;
  }
}

@media (max-width: 1068px) and (min-resolution: 1.5dppx),
  (max-width: 1068px) and (min-resolution: 144dpi) {
  .section-garage-carousel .garage-image-ipad .overview-ipad-hw {
    mask-image: url(/v/education/college-students/e/images/overview/ipad_screen_mask__dw0o8jfzp2y6_medium_2x.png);
  }
}

@media (max-width: 734px) {
  .section-garage-carousel .garage-image-ipad .overview-ipad-hw {
    mask-repeat: no-repeat;
    mask-image: url(/v/education/college-students/e/images/overview/ipad_screen_mask__dw0o8jfzp2y6_small.png);
    mask-size: 734px 418px;
  }
}

@media (max-width: 734px) and (min-resolution: 1.5dppx),
  (max-width: 734px) and (min-resolution: 144dpi) {
  .section-garage-carousel .garage-image-ipad .overview-ipad-hw {
    mask-image: url(/v/education/college-students/e/images/overview/ipad_screen_mask__dw0o8jfzp2y6_small_2x.png);
  }
}

.section-garage-carousel .garage-image-ipad .screen-scrim {
  display: block;
  --p-width: 766px;
  --p-height: 574px;
  width: var(--p-width);
  height: var(--p-height);
}

@media (max-width: 1068px) {
  .section-garage-carousel .garage-image-ipad .screen-scrim {
    --p-width: 570px;
    --p-height: 428px;
  }
}

@media (max-width: 734px) {
  .section-garage-carousel .garage-image-ipad .screen-scrim {
    --p-width: 466px;
    --p-height: 352px;
  }
}

.section-garage-carousel .garage-image-ipad .overview-ipad-screen,
.section-garage-carousel .garage-image-ipad .screen-scrim {
  position: absolute;
  top: 54px;
  left: 29px;
}

@media (max-width: 1068px) {
  .section-garage-carousel .garage-image-ipad .overview-ipad-screen,
  .section-garage-carousel .garage-image-ipad .screen-scrim {
    top: 39px;
    left: 250px;
  }
}

@media (max-width: 734px) {
  .section-garage-carousel .garage-image-ipad .overview-ipad-screen,
  .section-garage-carousel .garage-image-ipad .screen-scrim {
    top: 30px;
    left: 134px;
  }
}

.section-garage-carousel .garage-image-ipad .overview-ipad-shadow {
  position: absolute;
  z-index: -1;
  top: 0;
  left: 0;
}

.section-garage-carousel .image-caption {
  grid-area: before;
  text-align: center;
  color: #6e6e73;
}

@media (max-width: 734px) {
  .section-garage-carousel .image-caption {
    padding-inline: 20px;
  }
}

.section-garage-carousel .scroll-gallery {
  background-color: #fff;
  margin-block-start: 0px;
  padding-block-end: 0px;
  display: grid;
  grid-template: "before" "items" "after";
}

html.safari .section-garage-carousel .scroll-gallery {
  transform: rotate(0deg);
}

.section-garage-carousel .scroll-gallery .scroll-container {
  grid-area: items;
  overflow: scroll;
  padding-block-start: 74px;
}

@media (max-width: 1068px) {
  .section-garage-carousel .scroll-gallery .scroll-container {
    padding-block-start: 74px;
  }
}

@media (max-width: 734px) {
  .section-garage-carousel .scroll-gallery .scroll-container {
    padding-block-start: 40px;
  }
}

.section-garage-carousel .scroll-gallery .item-container .gallery-item {
  width: var(--gallery-card-width);
}

html.text-zoom
  .section-garage-carousel
  .scroll-gallery
  .item-container
  .gallery-item {
  min-width: 450px;
}

html.text-zoom
  .section-garage-carousel
  .scroll-gallery
  .item-container
  .gallery-item
  br {
  display: none;
}

.section-garage-carousel .scroll-gallery .item-container .image-content {
  border-radius: 28px;
  overflow: hidden;
  margin-block-end: 32px;
}

@media (max-width: 734px) {
  .section-garage-carousel .scroll-gallery .item-container .image-content {
    margin-block-end: 28px;
  }
}

.section-garage-carousel .scroll-gallery .item-container .overlay-scrim {
  position: relative;
}

.section-garage-carousel
  .scroll-gallery
  .item-container
  .overlay-scrim::before {
  content: "";
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.05);
}

.section-garage-carousel .scroll-gallery .item-container .text-content {
  padding: 0 16px 16px;
}

@media (max-width: 1068px) {
  .section-garage-carousel .scroll-gallery .item-container .text-content {
    margin-block-start: 15px;
  }
}

.section-garage-carousel .scroll-gallery .item-container .card-headline {
  margin-block-end: 11px;
}

@media (max-width: 1068px) {
  .section-garage-carousel .scroll-gallery .item-container .card-headline {
    margin-block-end: 14px;
  }
}

.section-garage-carousel .scroll-gallery .item-container .card-copy {
  color: #6e6e73;
}

.section-garage-carousel .scroll-gallery .scroll-gallery-controls {
  margin-block-start: 34px;
}

@media (max-width: 1068px) {
  .section-garage-carousel .scroll-gallery .scroll-gallery-controls {
    margin-block-start: 20px;
  }
}

@media (max-width: 734px) {
  .section-garage-carousel .scroll-gallery .scroll-gallery-controls {
    margin-block-start: 14px;
  }
}

.section-garage-carousel .scroll-gallery .scroll-gallery-controls-autoplay {
  grid-area: after;
  margin-inline: auto;
  width: 87.5vw;
  max-width: var(--section-max-width);
  pointer-events: none;
}

.section-garage-carousel
  .scroll-gallery
  .scroll-gallery-controls-autoplay
  .autoplay {
  pointer-events: all;
  position: relative;
  z-index: 10;
}

.section-garage-carousel .scroll-gallery .scroll-gallery-controls-paddlenav {
  grid-area: after;
  pointer-events: none;
}

.section-garage-carousel
  .scroll-gallery
  .scroll-gallery-controls-paddlenav
  .paddlenav-arrow {
  pointer-events: all;
  margin-block-start: 0;
  top: 0;
  z-index: 10;
}

.section-garage-carousel .item-container {
  grid-auto-flow: column;
}

.play-pause-button {
  --icon-transition: 100ms linear;
  --icon-diameter: 36px;
  --icon-scrim-color: rgb(232, 232, 237);
  --icon-scrim-color-hover: #ececf0;
  --icon-scrim-color-active: #dfdfe4;
  --icon-content-color: rgba(0, 0, 0, 0.56);
  --icon-content-color-hover: rgba(0, 0, 0, 0.64);
  --icon-content-color-active: rgba(0, 0, 0, 0.64);
  --icon-disabled-opacity: var(--sk-link-disabled-opacity, 0.36);
}

.play-pause-button .svg {
  transition: background var(--icon-transition), opacity var(--icon-transition);
  display: block;
  width: var(--icon-diameter);
  background: var(--icon-scrim-color);
  border-radius: 50%;
  overflow: hidden;
  pointer-events: none;
}

.play-pause-button .svg path {
  fill: var(--icon-content-color);
  transition: fill var(--icon-transition);
}

.play-pause-button[data-state="paused"] .svg-pause,
.play-pause-button[data-state="playing"] .svg-play {
  display: none;
}

.play-pause-button[disabled] {
  opacity: var(--icon-disabled-opacity);
}

.play-pause-button:not([disabled]):hover .svg {
  background: var(--icon-scrim-color-hover);
}

.play-pause-button:not([disabled]):hover .svg path {
  fill: var(--icon-content-color-hover);
}

.play-pause-button:not([disabled]):active .svg {
  background: var(--icon-scrim-color-active);
}

.play-pause-button:not([disabled]):active .svg path {
  fill: var(--icon-content-color-active);
}

.tile-image {
  display: block;
  --p-width: 372px;
  --p-height: 450px;
  width: var(--p-width);
  height: var(--p-height);
}

@media (max-width: 1068px) {
  .tile-image {
    --p-width: 344px;
    --p-height: 416px;
  }
}

@media (max-width: 734px) {
  .tile-image {
    --p-width: 260px;
    --p-height: 314px;
  }
}

.overview-wts-icon-discounts {
  display: block;
  --p-width: 45px;
  --p-height: 39px;
  width: var(--p-width);
  height: var(--p-height);
}

.overview-wts-icon-flexible-payments {
  display: block;
  --p-width: 51px;
  --p-height: 39px;
  width: var(--p-width);
  height: var(--p-height);
}

.overview-wts-icon-applecare {
  display: block;
  --p-width: 32px;
  --p-height: 39px;
  width: var(--p-width);
  height: var(--p-height);
}

.overview-wts-icon-music {
  display: block;
  --p-width: 38px;
  --p-height: 39px;
  width: var(--p-width);
  height: var(--p-height);
}

.overview-wts-icon-trade {
  display: block;
  --p-width: 42px;
  --p-height: 39px;
  width: var(--p-width);
  height: var(--p-height);
}

.pagetitle {
  position: absolute;
  clip: rect(1px, 1px, 1px, 1px);
  clip-path: inset(0 0 99.9% 99.9%);
  overflow: hidden;
  height: 1px;
  width: 1px;
  padding: 0;
  border: 0;
}