/* Figma 498:924 cards. Faces keep the original design dimensions and assets;
   the outer bodies scale with the scene and use the original Solo solver. */
body.ui-study.landing-v2 main#main #top .hero-gallery.solo-hero-free-art {
  max-width: 1120px;
  padding: 0;
  container-type: inline-size;
}
body.ui-study.landing-v2 main#main #top .solo-free-scene {
  --hf: .1cqw;
  --face-scale: calc(100cqw / 1000px);
  position: relative;
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 1000 / 600;
  margin: 0;
  padding: 0;
  overflow: clip;
  isolation: isolate;
  list-style: none;
  background: transparent;
  border: 0;
  font-size: calc(100 * var(--hf));
}
body.ui-study.landing-v2 main#main #top .solo-free-scene.is-falling {
  mask-image: linear-gradient(to bottom, transparent, #000 clamp(20px, 4cqw, 44px));
}
body.ui-study.landing-v2 main#main #top .solo-free-scene > .free-card {
  position: absolute;
  inset: auto;
  left: calc(var(--card-x) * var(--hf));
  top: calc(var(--card-y) * var(--hf));
  display: block;
  box-sizing: border-box;
  width: calc(var(--card-w) * var(--hf));
  height: calc(var(--card-h) * var(--hf));
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: calc(16 * var(--hf));
  background: transparent;
  box-shadow: 0 3px 10px #30343806;
  color: #25282b;
  transform: rotate(calc(var(--card-angle, 0) * 1deg));
  transform-origin: center;
  transition: none;
  animation: none;
}
body.ui-study.landing-v2 main#main #top .solo-free-scene .fh-face {
  position: absolute;
  inset: 0 auto auto 0;
  display: flex;
  align-items: center;
  gap: 8px;
  box-sizing: border-box;
  width: calc(var(--card-w) * 1px);
  height: calc(var(--card-h) * 1px);
  padding: 12px;
  border: 1px solid #c5e8ee;
  border-radius: 16px;
  background: #fff;
  color: #25282b;
  font: 400 16px/22px 'Onest', Arial, sans-serif;
  letter-spacing: normal;
  text-align: left;
  white-space: nowrap;
  transform: scale(var(--face-scale, 1));
  transform-origin: top left;
}
body.ui-study.landing-v2 main#main #top .solo-free-scene .fh-face :is(p, strong, b) {
  margin: 0;
  padding: 0;
  font: inherit;
  color: inherit;
  letter-spacing: normal;
}
body.ui-study.landing-v2 main#main #top .solo-free-scene .fh-face img { display: block; flex: none; max-width: none; object-fit: contain; }
body.ui-study.landing-v2 main#main #top .solo-free-scene .fh-face .fh-title { font-size: 17px; font-weight: 600; line-height: 23px; }
body.ui-study.landing-v2 main#main #top .solo-free-scene .fh-face .fh-title-small { font-size: 16px; line-height: 22px; }
body.ui-study.landing-v2 main#main #top .solo-free-scene .fh-copy { display: flex; flex: none; flex-direction: column; align-items: flex-start; }
body.ui-study.landing-v2 main#main #top .solo-free-scene .fh-icon-box { display: flex; flex: none; width: var(--icon-size); height: var(--icon-size); align-items: center; justify-content: center; border-radius: 4px; background: #e7fbff; }
body.ui-study.landing-v2 main#main #top .solo-free-scene .fh-icon-green { background: #eaf9f0; }
body.ui-study.landing-v2 main#main #top .solo-free-scene .fh-face .fh-food-photo { border-radius: 4px; object-fit: cover; }
body.ui-study.landing-v2 main#main #top .solo-free-scene .fh-photo-copy { gap: 4px; }
body.ui-study.landing-v2 main#main #top .solo-free-scene .fh-face .fh-photo-caption { color: #5d6267; font-size: 14px; line-height: 19px; }
body.ui-study.landing-v2 main#main #top .solo-free-scene :is(.fh-app, .fh-loyalty, .fh-pos) .fh-face { flex-direction: column; align-items: flex-start; }
body.ui-study.landing-v2 main#main #top .solo-free-scene .fh-connection .fh-face { gap: 8px; align-items: flex-start; }
body.ui-study.landing-v2 main#main #top .solo-free-scene .fh-progress { display: flex; flex: none; align-items: center; gap: 3px; width: 116px; }
body.ui-study.landing-v2 main#main #top .solo-free-scene .fh-check { display: flex; flex: none; align-items: center; justify-content: center; width: 26px; height: 26px; border-radius: 50%; background: #00cada; }
body.ui-study.landing-v2 main#main #top .solo-free-scene .fh-progress > span:not(.fh-check) { flex: 1; height: 1px; background: #00cada; }
body.ui-study.landing-v2 main#main #top .solo-free-scene .fh-row { display: flex; align-items: center; justify-content: space-between; width: 100%; }
body.ui-study.landing-v2 main#main #top .solo-free-scene .fh-integrations .fh-face { gap: 8px; }
body.ui-study.landing-v2 main#main #top .solo-free-scene .fh-logos { display: flex; align-items: center; }
body.ui-study.landing-v2 main#main #top .solo-free-scene .fh-logos > span { display: flex; position: relative; flex: none; align-items: center; justify-content: center; box-sizing: border-box; width: 32px; height: 32px; margin-right: -6px; overflow: clip; border: 1px solid #c5e8ee; border-radius: 50%; background: #fff; }
body.ui-study.landing-v2 main#main #top .solo-free-scene .fh-logos > span:last-child { margin-right: 0; }
body.ui-study.landing-v2 main#main #top .solo-free-scene .fh-logos > span:last-child img { object-fit: cover; }
body.ui-study.landing-v2 main#main #top .solo-free-scene .fh-menu-copy { display: flex; flex: none; min-width: 0; flex-direction: column; align-items: flex-start; gap: 6px; }
body.ui-study.landing-v2 main#main #top .solo-free-scene .fh-badge { display: block; padding: 3px 9px; border-radius: 7px; background: #d9f8ff; font-size: 13px; font-weight: 500; line-height: 18px; }
body.ui-study.landing-v2 main#main #top .solo-free-scene .fh-face .fh-menu-caption { color: #5d6267; font-size: 15px; line-height: 20px; }
body.ui-study.landing-v2 main#main #top .solo-free-scene .fh-icon-link { border-radius: 4px; }
body.ui-study.landing-v2 main#main #top .solo-free-scene .fh-website-copy { display: flex; flex: none; align-items: center; gap: 4px; }
body.ui-study.landing-v2 main#main #top .solo-free-scene .fh-face .fh-website-label { color: #5d6267; font-size: 17px; font-weight: 500; line-height: 23px; }
body.ui-study.landing-v2 main#main #top .solo-free-scene .fh-website-address { color: #0067ff; font-size: 17px; font-weight: 500; line-height: 23px; }
body.ui-study.landing-v2 main#main #top .solo-free-scene .fh-app .fh-face { gap: 8px; }
body.ui-study.landing-v2 main#main #top .solo-free-scene .fh-stores { display: flex; align-items: center; gap: 20px; }
body.ui-study.landing-v2 main#main #top .solo-free-scene .fh-stores > span { display: flex; align-items: center; gap: 8px; font-size: 14px; font-weight: 500; line-height: 19px; }
body.ui-study.landing-v2 main#main #top .solo-free-scene .fh-loyalty .fh-face { gap: 8px; }
body.ui-study.landing-v2 main#main #top .solo-free-scene .fh-bonus { justify-content: flex-start; gap: 10px; font-size: 15px; line-height: 20px; }
body.ui-study.landing-v2 main#main #top .solo-free-scene .fh-bonus-value { color: #0067ff; font-size: 14px; line-height: 19px; }
body.ui-study.landing-v2 main#main #top .solo-free-scene .fh-tabs { display: flex; flex: none; align-items: center; box-sizing: border-box; height: 34px; padding: 2px; border: 1px solid #c5e8ee; border-radius: 9px; font-size: 13px; font-weight: 500; line-height: 18px; }
body.ui-study.landing-v2 main#main #top .solo-free-scene .fh-tabs > span { display: flex; flex: 1; align-items: center; justify-content: center; height: 30px; border-radius: 7px; color: #5d6267; }
body.ui-study.landing-v2 main#main #top .solo-free-scene .fh-tabs > .fh-tab-active { background: #d9f8ff; color: #25282b; }
body.ui-study.landing-v2 main#main #top .solo-free-scene .fh-pos .fh-face { gap: 8px; }
body.ui-study.landing-v2 main#main #top .solo-free-scene .fh-divider { opacity: 0; flex: none; width: 292px; height: 1px; background: #c5e8ee; }
body.ui-study.landing-v2 main#main #top .solo-free-scene .fh-order { font-size: 15px; line-height: 20px; }
body.ui-study.landing-v2 main#main #top .solo-free-scene .fh-order strong { font-weight: 600; }
body.ui-study.landing-v2 main#main #top .solo-free-scene .fh-fiscal { display: flex; align-items: center; gap: 10px; color: #5d6267; font-size: 13px; line-height: 18px; }
body.ui-study.landing-v2 main#main #top .solo-free-scene .fh-check-small { width: 22px; height: 22px; background: #11af58; }
@media (max-width: 699px) {
  body.ui-study.landing-v2 main#main #top .solo-free-scene {
    --hf: .84px;
    --face-scale: .84;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 14px;
    height: 980px;
    aspect-ratio: auto;
    padding: 14px 8px;
  }
  body.ui-study.landing-v2 main#main #top .solo-free-scene > .free-card { position: relative; left: auto; top: auto; flex: none; }
}
@media (max-width: 359px) {
  body.ui-study.landing-v2 main#main #top .solo-free-scene { --hf: .72px; --face-scale: .72; height: 900px; }
}
@media (prefers-reduced-motion: reduce), print {
  body.ui-study.landing-v2 main#main #top .solo-free-scene.is-falling { mask-image: none; }
}

body.ui-study.landing-v2 main#main #top .solo-free-scene .fh-photo .fh-face { gap: 16px; }
body.ui-study.landing-v2 main#main #top .solo-free-scene .fh-menu-photo-crop { position: relative; display: block; flex: none; width: 70px; height: 71px; overflow: hidden; }
body.ui-study.landing-v2 main#main #top .solo-free-scene .fh-menu-photo-crop img { position: absolute; width: 92.001px; height: 70.7373px; left: -10.997px; top: .1278px; }
