.science { background: #000; color: #fff; padding: clamp(36px, 4vw, 64px) var(--page-pad-x) clamp(64px, 6vw, 96px); }
.science__inner { margin: 0 auto; max-width: 1300px; position: relative; }
.science--reveal-ready [data-science-reveal] { opacity: 0; transform: translateY(26px); transition: opacity 520ms ease, transform 760ms cubic-bezier(.22,1,.36,1); }
.science--reveal-ready.is-revealed [data-science-reveal] { opacity: 1; transform: translateY(0); }
.science--reveal-ready.is-revealed .science__health { transition-delay: 140ms; }
.science--reveal-ready.is-revealed .science__accordion { transition-delay: 280ms; }
.science--reveal-ready.is-revealed .science__card { transition-delay: 420ms; }
.science--reveal-ready .science__card[data-science-reveal] { transform: translate(48px, 26px); }
.science--reveal-ready.is-revealed .science__card[data-science-reveal] { transform: translateX(48px); }
.science__intro p { color: rgba(255,255,255,.75); font-family: var(--font-display); font-size: 15px; margin: 0 0 10px; }
.science__intro h2 { font-family: var(--font-display); font-size: clamp(28px, 2.7vw, 46px); font-weight: 400; line-height: 1.04; margin: 0; }
.science__health { align-items: center; display: flex; gap: 14px; position: absolute; right: 0; top: 44px; }
.science__apple-health { height: 48px; width: 48px; }
.science__google-health { height: 68px; object-fit: contain; width: 120px; }
.science__health span { font-size: 13px; line-height: 1.5; }
.science__body { align-items: center; box-sizing: border-box; display: grid; gap: clamp(40px, 7vw, 110px); grid-template-columns: minmax(430px, 615px) minmax(400px, 540px); justify-content: space-between; margin: clamp(48px, 5vw, 64px) 0 0 calc(50% - 50vw + var(--page-pad-x)); max-width: none; padding-left: clamp(120px, 10.8vw, 220px); padding-right: clamp(0px, 2vw, 49px); position: relative; width: calc(100vw - (var(--page-pad-x) * 2)); }
.science__insight-controls { display: grid; gap: 12px; left: calc(clamp(120px, 10.8vw, 220px) - 68px); position: absolute; top: 96px; }.science__insight-controls button { background: transparent; border: 0; cursor: pointer; height: 38px; padding: 0; width: 38px; }.science__insight-controls img { display: block; height: 100%; width: 100%; }
.science__accordion { max-width: 480px; padding-left: 24px; width: 100%; }.science__item { padding: 22px 0; position: relative; }.science__item::after { background: rgba(255,255,255,.35); bottom: 0; content: ""; height: 1px; left: 0; position: absolute; width: min(480px, 100%); }.science__item button { align-items: center; background: transparent; border: 0; color: #fff; cursor: pointer; display: flex; font-size: 25px; font-weight: 600; justify-content: space-between; padding: 0; text-align: left; width: 100%; }.science__item i { font-style: normal; transform: rotate(-90deg); }.science__item.is-open i { transform: rotate(0); }.science__item p { color: rgba(255,255,255,.62); font-size: 14px; line-height: 1.4; margin: 0; max-height: 0; max-width: 370px; opacity: 0; overflow: hidden; transform: translateY(-8px); transition: margin 280ms ease, max-height 360ms ease, opacity 220ms ease, transform 360ms cubic-bezier(.22,1,.36,1); }.science__item.is-open p { margin-top: 12px; max-height: 100px; opacity: 1; transform: translateY(0); }
.science__card { aspect-ratio: 1.2; border-radius: 18px; max-width: 390px; overflow: hidden; transform: translateX(48px); }.science__card img { height: 100%; object-fit: contain; opacity: 1; transition: opacity 160ms ease, transform 240ms cubic-bezier(.22,1,.36,1); width: 100%; }.science__card.is-changing img { opacity: 0; transform: translateY(16px); }
.science__mobile-carousel, .science__mobile-pagination { display: none; }
.science__item:last-child::after { content: none; }
@media (min-width: 1600px) {
  .science__body { margin-left: calc(50% - 720px); max-width: 1440px; padding-left: 160px; width: 1440px; }
  .science__insight-controls { left: 92px; }
}
@media (min-width: 768px) and (max-width: 1023px) {
  .science__health { position: static; margin-top: 24px; flex-wrap: wrap; }
  .science__body { gap: 24px; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); margin: 40px 0 0; padding: 0 0 0 48px; width: 100%; }
  .science__insight-controls { left: 0; }
  .science__accordion { min-width: 0; padding-left: 0; }
  .science__card,
  .science--reveal-ready .science__card[data-science-reveal],
  .science--reveal-ready.is-revealed .science__card[data-science-reveal] { min-width: 0; transform: none; }
}
@media (prefers-reduced-motion: reduce) {
  .science--reveal-ready [data-science-reveal] { opacity: 1; transform: none; transition: none; }
  .science--reveal-ready .science__card[data-science-reveal] { transform: translateX(48px); }
}
@media (max-width: 767px) {
  .science { padding-bottom: 40px; padding-top: 44px; }
  .science__intro p { font-size: 13px; margin-bottom: 7px; }
  .science__intro h2 { font-size: clamp(27px, 7.5vw, 36px); }
  .science__health, .science__insight-controls, .science__card { display: none; }
  .science__mobile-carousel { display: block; margin: 38px calc(var(--page-pad-x) * -1) 0 calc((var(--page-pad-x) * -1) + 12px); }
  .science__mobile-track { display: grid; gap: 14px; grid-auto-columns: calc(100% - 102px); grid-auto-flow: column; overflow-x: auto; overscroll-behavior-x: contain; padding: 0 var(--page-pad-x); scroll-behavior: smooth; scroll-snap-type: x mandatory; scrollbar-width: none; }
  .science__mobile-track::-webkit-scrollbar { display: none; }
  .science__mobile-card { aspect-ratio: 1.18; background: transparent; border: 0; border-radius: 0; cursor: pointer; overflow: hidden; padding: 0; scroll-snap-align: start; }
  .science__mobile-card img { display: block; height: 100%; object-fit: contain; width: 100%; }
  .science__body { display: block; margin: 22px 0 0; min-height: 108px; padding: 0; width: auto; }
  .science__accordion { max-width: none; padding-left: 0; }
  .science__item { display: none; padding: 0; }
  .science__item.is-open { display: block; }
  .science__item::after { display: none; }
  .science__item button { font-size: 22px; pointer-events: none; }
  .science__item button i { display: none; }
  .science__item p, .science__item.is-open p { font-size: 12px; margin-top: 8px; max-height: none; max-width: 34rem; opacity: .7; transform: none; }
  .science__mobile-pagination { align-items: center; background: #363636; border: 0; border-radius: 999px; display: flex; gap: 7px; justify-content: center; margin: 28px auto 0; padding: 9px 12px; width: fit-content; }
  .science__mobile-pagination button { background: rgba(255,255,255,.32); border: 0; border-radius: 999px; height: 7px; padding: 0; transition: background-color 180ms ease, width 180ms ease; width: 7px; }
  .science__mobile-pagination button.is-active { background: #fff; width: 23px; }
  .science--reveal-ready.is-revealed .science__mobile-carousel { transition-delay: 140ms; }
  .science--reveal-ready.is-revealed .science__accordion { transition-delay: 280ms; }
  .science--reveal-ready.is-revealed .science__mobile-pagination { transition-delay: 420ms; }
}