.tc-w-scatter {
  position: relative;
  overflow: hidden;
  min-height: var(--tc-hero, 900px);
  background: #262626;
  color: #fff9f5;
}

/* —— WORK banner (reference wm-track) —— */
.tc-w-scatter--word {
  min-height: 0;
  padding: 0;
  overflow: visible;
}

.tc-w-scatter--word .tc-w-scatter__track {
  position: relative;
  height: 1230px;
  background: #262626;
}

.tc-w-scatter--word .tc-w-scatter__hero {
  /* Reference review-current: relative + translateY hold (not sticky). */
  position: relative;
  top: auto;
  height: min(810px, 56.25vw);
  min-height: 420px;
  overflow: hidden;
  will-change: transform;
}

.tc-w-scatter--word .tc-w-scatter__stage {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  transform: none;
}

.tc-w-scatter--word .tc-w-scatter__letters {
  position: absolute;
  inset: 0;
  pointer-events: none;
  margin: 0;
  /* No z-index here — letters must share the stage stack with tiles. */
}

.tc-w-scatter--word .tc-w-scatter__letter {
  position: absolute;
  top: 23.75%;
  margin: 0;
  font-size: clamp(72px, 26.389vw, 380px);
  letter-spacing: -0.03em;
  line-height: 1.13;
  font-weight: 400;
  color: #fff9f5;
  text-transform: uppercase;
}

.tc-w-scatter--word .tc-w-scatter__field {
  position: absolute;
  inset: 0;
  pointer-events: none;
  /* No z-index — tiles use their own .is-front / default z. */
}

.tc-w-scatter--word .tc-w-scatter__tile {
  position: absolute;
  left: var(--tc-left, 0%);
  top: var(--tc-top, 0%);
  display: block;
  width: 12.5%;
  aspect-ratio: 1;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  outline: none;
  box-shadow: none;
  text-decoration: none;
  pointer-events: auto;
  cursor: pointer;
  /* Reference wm-root .wm-slot — transparent shell, image clipped inside */
  background: transparent;
  overflow: visible;
  will-change: transform;
  z-index: var(--tc-scatter-back, 1);
  color: #444;
  font-size: 12px;
  transform-origin: center center;
  isolation: isolate;
  /* transform is set by script (parallax) — do not reset here */
  transition: none;
}

.tc-w-scatter--word .tc-w-scatter__tile:nth-child(even) {
  background: transparent;
}

.tc-w-scatter--word .tc-w-scatter__tile.is-front {
  z-index: var(--tc-scatter-front, 3);
}

/* Reference .wm-image — clips the scale so nothing bleeds / no hover border. */
.tc-w-scatter--word .tc-w-scatter__image {
  display: block;
  width: 100%;
  height: 100%;
  overflow: hidden;
  background: #c7c7c7;
  position: relative;
}

.tc-w-scatter--word .tc-w-scatter__tile img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transform-origin: 50% 50%;
  transition: transform 280ms cubic-bezier(0.22, 1, 0.36, 1);
}

/* Grain lives on the crop box so it fades with the image, not a tile outline. */
.tc-w-scatter--word .tc-w-scatter__image::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  z-index: 1;
  background-image: var(
    --tc-noise,
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")
  );
  background-size: 180px 180px;
  mix-blend-mode: overlay;
  filter: contrast(350%) brightness(105%);
  opacity: 1;
  transition: opacity 450ms ease;
}

/* Reference: only the image scales — no outline / border on hover. */
.tc-w-scatter--word .tc-w-scatter__tile:is(:hover, :focus-visible),
.tc-w-scatter--word .tc-w-scatter__tile:is(:hover, :focus-visible) .tc-w-scatter__image {
  outline: none;
  border: 0;
  box-shadow: none;
}

.tc-w-scatter--word .tc-w-scatter__tile:is(:hover, :focus-visible) {
  background: transparent;
}

.tc-w-scatter--word .tc-w-scatter__tile:is(:hover, :focus-visible) .tc-w-scatter__image {
  background: #c7c7c7;
}

.tc-w-scatter--word .tc-w-scatter__tile:is(:hover, :focus-visible) img:not([class*="elementor-animation-"]) {
  transform: scale(1.05);
}

.tc-w-scatter--word .tc-w-scatter__tile:is(:hover, :focus-visible) .tc-w-scatter__image::after {
  opacity: 0;
}

.tc-w-scatter--word .tc-w-scatter__tile:focus-visible {
  outline: 3px solid #f44349;
  outline-offset: 2px;
}

.tc-w-scatter--word .tc-w-scatter__tile figcaption {
  display: none !important;
}

.tc-w-scatter--word .tc-w-scatter__copy,
.tc-w-scatter--word .tc-w-scatter__title,
.tc-w-scatter--word .tc-w-scatter__kicker,
.tc-w-scatter--word .tc-w-scatter__text {
  display: none !important;
}

/* —— Split (Culture) ——
   Scatter widgets are excluded from the shared side-padding rule (frontend/wp-elementor.css),
   so the split layout sets its own 1440 canvas + page margins here. Copy column on the left
   (kicker / title / standfirst stacked 24px apart), portraits layered on the right so the
   837px title keeps its four Figma lines. */
.tc-w-scatter--split {
  /* Same canvas inset as the header, written on the padding itself.
     A custom property here was resolving to 48px, so this page sat left of the logo. */
  --tc-side: max(var(--tc-margin, 48px), calc((100% - var(--tc-canvas, 1440px)) / 2 + var(--tc-margin, 48px)));
  position: relative;
  display: flex;
  flex-direction: column;
  width: 100%;
  min-height: 720px;
  padding-top: 128px;
  padding-bottom: 48px;
  padding-left: max(var(--tc-margin, 48px), calc((100% - var(--tc-canvas, 1440px)) / 2 + var(--tc-margin, 48px)));
  padding-right: max(var(--tc-margin, 48px), calc((100% - var(--tc-canvas, 1440px)) / 2 + var(--tc-margin, 48px)));
  box-sizing: border-box;
}

.tc-w-scatter--split .tc-w-scatter__copy {
  position: relative;
  z-index: 2;
  display: flex;
  flex-direction: column;
  flex: 1 0 auto;
  justify-content: flex-start;
  gap: 24px;
  width: 100%;
}

.tc-w-scatter--split .tc-w-scatter__kicker,
.tc-w-scatter--split .tc-w-scatter__title,
.tc-w-scatter--split .tc-w-scatter__text {
  margin: 0;
  flex-shrink: 0;
}

.tc-w-scatter--split .tc-w-scatter__title {
  max-width: 837px;
}

.tc-w-scatter--split .tc-w-scatter__text {
  max-width: 547px;
}

.tc-w-scatter--split .tc-w-scatter__field {
  position: absolute;
  top: 96px;
  right: var(--tc-side);
  bottom: 48px;
  width: min(36%, 507px);
  pointer-events: none;
}

.tc-w-scatter--split .tc-w-scatter__tile {
  position: absolute;
  display: block;
  width: var(--tc-split-small, 80px);
  aspect-ratio: 1;
  margin: 0;
  background: #c7c7c7;
  overflow: hidden;
  pointer-events: auto;
  cursor: pointer;
  will-change: translate;
}

.tc-w-scatter--split .tc-w-scatter__tile:nth-child(1) { top: 11%; left: 7%; }
.tc-w-scatter--split .tc-w-scatter__tile:nth-child(2) { top: 5%; left: 31%; }
.tc-w-scatter--split .tc-w-scatter__tile:nth-child(3) { top: 7%; right: 0; left: auto; }
.tc-w-scatter--split .tc-w-scatter__tile:nth-child(4) { top: 16%; left: 56%; }
.tc-w-scatter--split .tc-w-scatter__tile:nth-child(5) { top: 29%; left: 29%; }
.tc-w-scatter--split .tc-w-scatter__tile:nth-child(6) { top: 42%; left: 7%; }
.tc-w-scatter--split .tc-w-scatter__tile:nth-child(7) { top: 47%; left: 60%; }
.tc-w-scatter--split .tc-w-scatter__tile:nth-child(8) { top: 36%; right: 0; left: auto; }
.tc-w-scatter--split .tc-w-scatter__tile:nth-child(9) { top: 59%; left: 31%; }
.tc-w-scatter--split .tc-w-scatter__tile:nth-child(10) { top: 68%; right: 0; left: auto; }
.tc-w-scatter--split .tc-w-scatter__tile:nth-child(11) { top: 77%; left: 7%; }
.tc-w-scatter--split .tc-w-scatter__tile:nth-child(12) { top: 83%; left: 56%; }

/* Small / big portraits (Style → Culture portraits). The Auto pattern stays below Style → Tile → Width;
   a card set to Small or Big outranks Tile → Width (0,4,0) but not its own exact size (0,5,0). */
.tc-w-scatter--split .tc-w-scatter__tile:where(:nth-child(3), :nth-child(5), :nth-child(10)):not(.tc-w-scatter__tile--small) {
  width: var(--tc-split-big, 128px);
}

section.tc-w-scatter--split .tc-w-scatter__field .tc-w-scatter__tile.tc-w-scatter__tile--small {
  width: var(--tc-split-small, 80px);
}

section.tc-w-scatter--split .tc-w-scatter__field .tc-w-scatter__tile.tc-w-scatter__tile--big {
  width: var(--tc-split-big, 128px);
}

.tc-w-scatter--split .tc-w-scatter__tile img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 280ms cubic-bezier(0.22, 1, 0.36, 1);
}

.tc-w-scatter--split .tc-w-scatter__tile:is(:hover, :focus-visible) img:not([class*="elementor-animation-"]) {
  transform: scale(1.05);
}

/* Decorative portraits are CSS backgrounds (no <img>); same fill and hover zoom as the img above. */
.tc-w-scatter--split .tc-w-scatter__tile .tc-w-scatter__bg {
  display: block;
  width: 100%;
  height: 100%;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  transition: transform 280ms cubic-bezier(0.22, 1, 0.36, 1);
}

.tc-w-scatter--split .tc-w-scatter__tile:is(:hover, :focus-visible) .tc-w-scatter__bg {
  transform: scale(1.05);
}

.tc-w-scatter--split .tc-w-scatter__tile figcaption {
  display: none !important;
}


/* More Work orbit pill — beat Elementor inline/post CSS (same rules that worked in Custom CSS). */
body.tangerine-theme .elementor .elementor-widget-tc-scatter-field .tc-w-scatter--pill,
body.tangerine-theme .elementor .tc-w-scatter--pill,
body.tangerine-theme .tc-w-scatter--pill,
.elementor-widget-tc-scatter-field .tc-w-scatter--pill,
.tc-w-scatter--pill {
  height: min(810px, 56.25vw) !important;
  min-height: min(810px, 56.25vw) !important;
  max-height: none;
  width: 100%;
  position: relative;
  overflow: hidden;
  clip-path: inset(0);
  -webkit-clip-path: inset(0);
  display: flex;
  align-items: center;
  justify-content: center;
  background: #262626;
  isolation: isolate;
  padding: 0;
  z-index: 1;
}

.tc-w-scatter--pill .tc-w-scatter__copy {
  display: none !important;
}

body.tangerine-theme .elementor .elementor-widget-tc-scatter-field .tc-w-scatter--pill .tc-w-scatter__clip,
body.tangerine-theme .elementor .tc-w-scatter--pill .tc-w-scatter__clip,
body.tangerine-theme .tc-w-scatter--pill .tc-w-scatter__clip,
.elementor-widget-tc-scatter-field .tc-w-scatter--pill .tc-w-scatter__clip,
.tc-w-scatter--pill .tc-w-scatter__clip {
  position: absolute;
  inset: 0;
  overflow: visible !important;
  clip-path: none !important;
  -webkit-clip-path: none !important;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 0;
}

body.tangerine-theme .elementor .elementor-widget-tc-scatter-field .tc-w-scatter--pill .tc-w-scatter__field,
body.tangerine-theme .elementor .tc-w-scatter--pill .tc-w-scatter__field,
body.tangerine-theme .tc-w-scatter--pill .tc-w-scatter__field,
.elementor-widget-tc-scatter-field .tc-w-scatter--pill .tc-w-scatter__field,
.tc-w-scatter--pill .tc-w-scatter__field {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
  z-index: 0;
  overflow: visible !important;
}

.tc-w-scatter--pill .tc-w-scatter__clock {
  position: absolute;
  left: 50%;
  top: 50%;
  width: 0;
  height: 0;
  overflow: visible;
  animation: tc-orbit-clock 120s linear infinite;
}

body.tangerine-theme .elementor .elementor-widget-tc-scatter-field .tc-w-scatter--pill .tc-w-scatter__tile,
body.tangerine-theme .elementor .tc-w-scatter--pill .tc-w-scatter__tile,
.elementor-widget-tc-scatter-field .tc-w-scatter--pill .tc-w-scatter__tile,
.tc-w-scatter--pill .tc-w-scatter__tile {
  position: absolute;
  left: 0;
  top: 0;
  /* Thumb 135 @ 1440 → 9.375vw; keep equal angular gaps via --angle. */
  width: min(135px, 9.375vw) !important;
  height: min(149.75px, 10.4vw) !important;
  min-width: 48px;
  min-height: 48px;
  margin: 0;
  padding: 0;
  border: 0;
  background: transparent;
  overflow: visible;
  pointer-events: none;
  opacity: 1 !important;
  visibility: visible !important;
  /* Reference radius 390 @ 1440 (= 27.083vw). No tighter shrink — that caused overlap. */
  transform: rotate(var(--angle, 0deg)) translateX(var(--tc-orbit-r, min(390px, 27.083vw))) rotate(calc(-1 * var(--angle, 0deg)));
}

/* Centred on the orbit point; follows Style → Tile → Width. */
.tc-w-scatter--pill .tc-w-scatter__upright {
  position: absolute;
  left: -50%;
  top: -50%;
  width: 100%;
  height: 100%;
  animation: tc-orbit-upright 120s linear infinite;
}

body.tangerine-theme .elementor .elementor-widget-tc-scatter-field .tc-w-scatter--pill .tc-w-scatter__thumb,
body.tangerine-theme .elementor .tc-w-scatter--pill .tc-w-scatter__thumb,
body.tangerine-theme .tc-w-scatter--pill .tc-w-scatter__thumb,
.elementor-widget-tc-scatter-field .tc-w-scatter--pill .tc-w-scatter__thumb,
.tc-w-scatter--pill .tc-w-scatter__thumb {
  position: relative !important;
  display: block !important;
  width: 100% !important;
  height: auto !important;
  aspect-ratio: 1;
  min-height: 48px !important;
  background: #c7c7c7;
  overflow: hidden;
  pointer-events: auto;
  cursor: pointer;
  opacity: 1 !important;
  visibility: visible !important;
  transform: scale(1);
  transform-origin: center bottom;
  transition: transform 600ms cubic-bezier(0.45, 0, 0.25, 1);
}

.tc-w-scatter--pill .tc-w-scatter__thumb:hover {
  transform: scale(1.05);
}

body.tangerine-theme .elementor .elementor-widget-tc-scatter-field .tc-w-scatter--pill .tc-w-scatter__thumb img,
body.tangerine-theme .elementor .tc-w-scatter--pill .tc-w-scatter__thumb img,
body.tangerine-theme .tc-w-scatter--pill .tc-w-scatter__thumb img,
.elementor-widget-tc-scatter-field .tc-w-scatter--pill .tc-w-scatter__thumb img,
.tc-w-scatter--pill .tc-w-scatter__thumb img {
  position: absolute !important;
  top: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  left: 0 !important;
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  max-width: none !important;
  object-fit: cover !important;
  opacity: 1 !important;
  visibility: visible !important;
}

.tc-w-scatter--pill .tc-w-scatter__meta-row {
  display: flex;
  justify-content: space-between;
  gap: 4px;
  width: 100%;
  margin-top: max(2px, 0.26vw);
  /* work.html orbit captions: 7.5px / 10.5px @ 1440 */
  font-size: max(6px, min(7.5px, 0.520833vw));
  line-height: 10.5px;
  letter-spacing: -0.03em;
  color: #fff9f5;
  white-space: nowrap;
  transition: width 600ms cubic-bezier(0.45, 0, 0.25, 1), margin-left 600ms cubic-bezier(0.45, 0, 0.25, 1);
}

.tc-w-scatter--pill .tc-w-scatter__thumb:hover + .tc-w-scatter__meta-row {
  width: 105%;
  margin-left: -2.5%;
}

.tc-w-scatter--pill .tc-w-scatter__caption,
.tc-w-scatter--pill .tc-w-scatter__meta {
  font-size: inherit;
  line-height: inherit;
  color: inherit;
}

@keyframes tc-orbit-clock {
  to {
    transform: rotate(360deg);
  }
}

@keyframes tc-orbit-upright {
  to {
    transform: rotate(-360deg);
  }
}

body.tangerine-theme .elementor .tc-w-scatter--pill .tc-w-scatter__pill,
.tc-w-scatter--pill .tc-w-scatter__pill {
  position: relative;
  z-index: 3;
  appearance: none;
  display: flex;
  align-items: center;
  justify-content: center;
  width: min(953px, 66.18vw);
  max-width: 92%;
  height: min(216px, 15vw);
  min-height: 0;
  padding: 0;
  margin: 0;
  border: 1px solid #fff9f5;
  border-radius: 999px;
  background: #262626;
  color: #fff9f5;
  font-family: inherit;
  font-size: min(135px, 9.375vw);
  font-weight: 400;
  line-height: 0.9;
  letter-spacing: -0.03em;
  text-transform: uppercase;
  text-decoration: none;
  white-space: nowrap;
  cursor: pointer;
  flex: none;
  transition:
    transform 0.25s ease-out,
    background 0.25s ease-out,
    color 0.25s ease-out,
    border-color 0.25s ease-out;
}

body.tangerine-theme .elementor .tc-w-scatter--pill .tc-w-scatter__pill:is(:hover, :focus-visible):not(:disabled),
.tc-w-scatter--pill .tc-w-scatter__pill:is(:hover, :focus-visible):not(:disabled) {
  transform: scale(1.05);
  background: #fff9f5;
  color: #262626;
  border-color: #fff9f5;
}

.tc-w-scatter--pill .tc-w-scatter__pill:disabled {
  /* Keep full reference look while loading; exhausted state hides the section. */
  opacity: 1;
  cursor: default;
  transform: none;
}

.tc-w-scatter--pill .tc-w-scatter__pill:disabled:is(:hover, :focus-visible) {
  background: #262626;
  color: #fff9f5;
  transform: none;
}

@media (prefers-reduced-motion: reduce) {
  .tc-w-scatter--word .tc-w-scatter__track {
    height: min(810px, 56.25vw);
  }

  .tc-w-scatter--word .tc-w-scatter__image::after,
  .tc-w-scatter--word .tc-w-scatter__tile img {
    transition: none;
  }

  .tc-w-scatter--word .tc-w-scatter__tile:is(:hover, :focus-visible) img {
    transform: none;
  }

  .tc-w-scatter--pill .tc-w-scatter__clock,
  .tc-w-scatter--pill .tc-w-scatter__upright {
    animation: none;
  }

  .tc-w-scatter--pill .tc-w-scatter__thumb,
  .tc-w-scatter--pill .tc-w-scatter__meta-row {
    transition: none;
  }

  .tc-w-scatter--pill .tc-w-scatter__thumb:hover {
    transform: none;
  }
}

@media (max-width: 900px) {
  .tc-w-scatter--word .tc-w-scatter__track {
    height: auto;
  }

  .tc-w-scatter--word .tc-w-scatter__hero,
  .tc-w-scatter--word .tc-w-scatter__stage {
    position: relative;
    top: auto;
    height: auto;
    transform: none;
    aspect-ratio: auto;
  }

  .tc-w-scatter--word .tc-w-scatter__letters {
    position: relative;
    min-height: 120px;
  }

  .tc-w-scatter--word .tc-w-scatter__letter {
    position: relative;
    top: auto;
    left: auto;
    display: inline;
    font-size: clamp(64px, 18vw, 160px);
  }

  .tc-w-scatter--word .tc-w-scatter__field {
    position: relative;
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
    margin-top: 24px;
  }

  .tc-w-scatter--word .tc-w-scatter__tile {
    position: relative;
    top: auto;
    left: auto;
    width: 100%;
    transform: none;
  }

  .tc-w-scatter--split {
    display: flex;
    flex-direction: column;
    min-height: 0;
    padding: 80px var(--tc-margin) 48px;
  }

  .tc-w-scatter--split .tc-w-scatter__copy {
    gap: 16px;
  }

  .tc-w-scatter--split .tc-w-scatter__field {
    position: relative;
    inset: auto;
    width: auto;
    min-height: 420px;
    margin-top: 32px;
  }

  .tc-w-scatter--pill {
    height: auto;
    min-height: 0;
    padding: 64px 24px;
    flex-direction: column;
    gap: 32px;
  }

  .tc-w-scatter--pill .tc-w-scatter__clock {
    position: relative;
    left: auto;
    top: auto;
    width: auto;
    height: auto;
    display: contents;
    animation: none;
  }

  .tc-w-scatter--pill .tc-w-scatter__tile,
  .tc-w-scatter--pill .tc-w-scatter__upright {
    position: relative;
    left: auto;
    top: auto;
    width: 100%;
    height: auto;
    transform: none;
    animation: none;
  }

  .tc-w-scatter--pill .tc-w-scatter__thumb {
    width: 100%;
    height: auto;
    aspect-ratio: 1;
  }

  .tc-w-scatter--pill .tc-w-scatter__pill {
    width: 100%;
    max-width: 100%;
    height: auto;
    min-height: 96px;
    font-size: clamp(40px, 12vw, 80px);
    padding: 24px 16px;
  }
}


/* Tablet and mobile layouts for this widget. */
@media (max-width: 900px) {
  /* Taller than the hero so the card rise has a scroll, same idea as the 1230px desktop track. */

  .tc-w-scatter--word .tc-w-scatter__stage { position: absolute; inset: 0; }

  .tc-w-scatter--word .tc-w-scatter__letters,
  .tc-w-scatter--word .tc-w-scatter__field { position: absolute; inset: 0; display: block; margin: 0; }

  .tc-w-scatter--word .tc-w-scatter__letter {
    position: absolute;
    top:30%;
    display: block;
  }
  .tc-w-scatter--word .tc-w-scatter__tile.is-front {
    z-index: var(--tc-scatter-back, 1);
  }

  .tc-w-scatter--word .tc-w-scatter__tile.is-front-m {
    z-index: var(--tc-scatter-front, -2);
  }
  .tc-w-scatter--word .tc-w-scatter__tile {
    position: absolute;
    left: var(--tc-left-m, var(--tc-left, 0%));
    top: var(--tc-top-m, var(--tc-top, 0%));
    /* Default only. Style → Tile → Width (mobile) overrides this. */
    width: 72px;
    height: auto;
    aspect-ratio: 1;
  }

  .tc-w-scatter--pill { position: relative; height: 440px !important; padding: 0 !important; flex-direction: row; }

  .tc-w-scatter--pill .tc-w-scatter__clip,
  .tc-w-scatter--pill .tc-w-scatter__field { position: absolute; inset: 0; height: 100%; }

  .tc-w-scatter--pill .tc-w-scatter__clock { position: absolute; left: 50%; top: 50%; display: block; width: 0; height: 0; animation: tc-orbit-clock 120s linear infinite; }

  .tc-w-scatter--pill .tc-w-scatter__tile { position: absolute; left: 0; top: 0; width: 56px; height: auto; aspect-ratio: 1; transform: rotate(var(--angle, 0deg)) translateX(var(--tc-orbit-r, 148px)) rotate(calc(-1 * var(--angle, 0deg))); }

  .tc-w-scatter--pill .tc-w-scatter__upright { position: absolute; left: -50%; top: -50%; width: 100%; height: 100%; animation: tc-orbit-upright 120s linear infinite; }

  .tc-w-scatter--pill .tc-w-scatter__thumb { width: 100%; height: auto; aspect-ratio: 1; }

  .tc-w-scatter--pill .tc-w-scatter__meta-row { display: none; }

  body.tangerine-theme .elementor .tc-w-scatter--pill .tc-w-scatter__pill,
  .tc-w-scatter--pill .tc-w-scatter__pill { width: calc(100% - 2 * var(--tc-margin)); height: 96px; min-height: 0; max-width: 650px; padding: 0 20px; }
}

/* Tablet card positions (Elementor tablet range). Empty tablet fields fall back to phone below 901px, desktop above. */
@media (min-width: 901px) and (max-width: 1024px) {
  .tc-w-scatter--word .tc-w-scatter__tile {
    left: var(--tc-left-t, var(--tc-left, 0%));
    top: var(--tc-top-t, var(--tc-top, 0%));
  }
}
@media (min-width: 768px) and (max-width: 900px) {
  .tc-w-scatter--word .tc-w-scatter__tile {
    left: var(--tc-left-t, var(--tc-left-m, var(--tc-left, 0%)));
    top: var(--tc-top-t, var(--tc-top-m, var(--tc-top, 0%)));
  }
}
@media (min-width: 768px) and (max-width: 1024px) {
  .tc-w-scatter--word .tc-w-scatter__tile.is-front-t {
    z-index: var(--tc-scatter-front, 3);
  }
  .tc-w-scatter--word .tc-w-scatter__tile.is-back-t {
    z-index: var(--tc-scatter-back, 1);
  }
}
@media (max-width: 600px) {

  .tc-w-scatter--word .tc-w-scatter__letter:nth-child(1) { left: 10% !important; }

  .tc-w-scatter--word .tc-w-scatter__letter:nth-child(2) { left: 35% !important; }

  .tc-w-scatter--word .tc-w-scatter__letter:nth-child(3) { left: 54% !important; }

  .tc-w-scatter--word .tc-w-scatter__letter:nth-child(4) { left: 71% !important; }

  .tc-w-scatter--word .tc-w-scatter__tile { width: 64px; }

  .tc-w-scatter--pill { height: 355px !important; }

  .tc-w-scatter--pill .tc-w-scatter__tile { width: 48px; transform: rotate(var(--angle, 0deg)) translateX(var(--tc-orbit-r, 128px)) rotate(calc(-1 * var(--angle, 0deg))); }

  .tc-w-scatter--pill .tc-w-scatter__pill,
  body.tangerine-theme .elementor .tc-w-scatter--pill .tc-w-scatter__pill { height: 84px; }
}
@media (max-width: 767px) {
  .tc-w-scatter--split .tc-w-scatter__tile--hide-m {
    display: none;
  }
}

@media (max-width: 900px) and (prefers-reduced-motion: reduce) {
  .tc-w-scatter--pill .tc-w-scatter__clock,
  .tc-w-scatter--pill .tc-w-scatter__upright { animation: none; } 
}