/* Append after landing-story.css. Inline SVGs inherit the A/B palette. */
.landing-page .audience-custom-icon {
  width: 60px;
  height: 60px;
  border-radius: 17px;
  color: #356b53;
  background: #eff5ef;
  box-shadow: inset 0 0 0 1px rgb(53 107 83 / 5%);
}
html[data-design=purple] .landing-page .audience-custom-icon {
  color: #70529a;
  background: #f0ebf7;
  box-shadow: inset 0 0 0 1px rgb(112 82 154 / 6%);
}
.landing-page .audience-icon {
  display: block;
  width: 38px;
  height: 38px;
  overflow: visible;
}
.landing-page .audience-detail {
  transform-box: fill-box;
  transform-origin: center;
}
/* One short gesture on scroll into view; the whole icon lifts slightly on deliberate hover. */
@media (prefers-reduced-motion: no-preference) {
  .landing-page .audience-card.audience-visible .audience-detail {
    animation-duration: 1600ms;
    animation-timing-function: cubic-bezier(.22,.61,.36,1);
    animation-fill-mode: both;
    animation-iteration-count: 1;
  }
  .landing-page .audience-card.audience-visible .audience-detail-shop { animation-name: liva-audience-confirm; }
  .landing-page .audience-card.audience-visible .audience-detail-local { animation-name: liva-audience-glimmer; }
  .landing-page .audience-card.audience-visible .audience-detail-care { animation-name: liva-audience-pulse; }
  .landing-page .audience-card.audience-visible .audience-detail-advice { animation-name: liva-audience-thought; }
  .landing-page .audience-card.audience-visible .audience-detail-dining { animation-name: liva-audience-warmth; }
  .landing-page .audience-card.audience-visible .audience-detail-software { animation-name: liva-audience-code; }
}
@media (prefers-reduced-motion: no-preference) and (hover: hover) {
  .landing-page .audience-card:hover .audience-icon {
    transform: translateY(-2px);
  }
  .landing-page .audience-icon { transition: transform 250ms ease; }
}
@keyframes liva-audience-confirm { 0%,100% { transform: translateY(0); } 35% { transform: translateY(-2px); } 60% { transform: translateY(0); } }
@keyframes liva-audience-glimmer { 0%,100% { opacity: 1; } 30% { opacity: .35; } 60% { opacity: 1; } }
@keyframes liva-audience-pulse { 0%,100% { transform: scale(1); } 35% { transform: scale(1.12); } 65% { transform: scale(1); } }
@keyframes liva-audience-thought { 0%,100% { opacity: 1; transform: translateX(0); } 35% { opacity: .4; transform: translateX(2px); } 70% { opacity: 1; transform: translateX(0); } }
@keyframes liva-audience-warmth { 0%,100% { opacity: 1; transform: translateY(0); } 40% { opacity: .4; transform: translateY(-2px); } }
@keyframes liva-audience-code { 0%,100% { transform: translateX(0); } 35% { transform: translateX(1.5px); } 65% { transform: translateX(-.5px); } }
@media (prefers-reduced-motion: reduce) {
  .landing-page .audience-icon,
  .landing-page .audience-detail { animation: none !important; transition: none !important; transform: none !important; }
}