#tc-clicker-studio-promo {
  display: grid;
  grid-template-columns: minmax(0, .85fr) minmax(0, 1.15fr);
  align-items: center;
  gap: clamp(20px, 4vw, 55px);
  margin: 30px auto 42px;
  padding: clamp(20px, 4vw, 52px);
  border: 1px solid #e7d9fb;
  border-radius: 24px;
  background: linear-gradient(120deg, #f5edff, #fff5ea);
  color: #28223b;
  font: 16px/1.55 Arial, Helvetica, sans-serif;
}
#tc-clicker-studio-promo .tc-clicker-new {
  display: inline-block;
  padding: 5px 11px;
  border-radius: 99px;
  background: #fce2d4;
  color: #663b39;
  font-weight: 700;
  font-size: 13px;
}
#tc-clicker-studio-promo h2 {
  margin: 14px 0 12px;
  font: 800 clamp(30px, 4vw, 52px)/1.04 Arial, Helvetica, sans-serif;
  letter-spacing: -.045em;
  color: inherit;
}
#tc-clicker-studio-promo p { max-width: 36ch; margin: 0 0 20px; color: #504660; }
#tc-clicker-studio-promo .tc-clicker-cta {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  min-height: 46px;
  padding: 10px 18px;
  border-radius: 10px;
  color: #fff;
  background: #6342b5;
  font-weight: 700;
  text-decoration: none;
}
#tc-clicker-studio-promo .tc-clicker-cta:focus-visible { outline: 3px solid #28223b; outline-offset: 3px; }
.tc-clicker-stage {
  position: relative;
  isolation: isolate;
  aspect-ratio: 7 / 4;
  min-height: 180px;
  background: radial-gradient(ellipse at 50% 45%, #fffefa, #e9defd 85%);
  border-radius: 19px;
  overflow: hidden;
  perspective: 750px;
}
.tc-clicker-render { position: absolute; width: 49%; top: 4%; }
.tc-clicker-render img { display: block; width: 100%; height: auto; }
.tc-clicker-heart { left: 1%; transform: rotate(-11deg) scale(.8); }
.tc-clicker-ghost { right: 1%; transform: rotate(11deg) scale(.8); }
.tc-clicker-duck { left: 25.5%; z-index: 1; }
.tc-clicker-steps {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  list-style: none;
  gap: 8px;
  margin: 10px 0 0;
  padding: 0;
  color: #504660;
  font-weight: 700;
  font-size: 13px;
  text-align: center;
}
.tc-clicker-steps li { padding: 6px 3px; }
@media (prefers-reduced-motion: no-preference) {
  .tc-clicker-duck { animation: tc-clicker-press 1.1s .35s ease both; }
  .tc-clicker-demo:hover .tc-clicker-duck { animation: tc-clicker-hover 1.1s ease both; }
  @keyframes tc-clicker-press {
    0%, 100% { transform: none; }
    28% { transform: translateY(-4%) rotateY(-12deg) rotateZ(-3deg); }
    48% { transform: translateY(7%) scale(.97, .91); }
    68% { transform: translateY(-2%) rotateY(8deg); }
  }
  @keyframes tc-clicker-hover {
    0%, 100% { transform: none; }
    28% { transform: translateY(-4%) rotateY(-12deg) rotateZ(-3deg); }
    48% { transform: translateY(7%) scale(.97, .91); }
    68% { transform: translateY(-2%) rotateY(8deg); }
  }
}
@media (max-width: 680px) {
  #tc-clicker-studio-promo { grid-template-columns: 1fr; margin: 24px auto 32px; }
  #tc-clicker-studio-promo p { max-width: none; }
  .tc-clicker-stage { min-height: 0; }
}
