/* -------------------------------------------------------
   SME (AutoMyra) industry landing page. Behaviour lives in assets/js/automyra-x.js.
   Rules it shares with other landing pages are in landing-x.css.
------------------------------------------------------- */

/* -------------------------------------------------------
   Shared bits
------------------------------------------------------- */

@keyframes lx-sheen {
  0%, 100% { background-position: 0% 50%; }
  50% { background-position: 100% 50%; }
}

/* -------------------------------------------------------
   Hero
------------------------------------------------------- */

@keyframes lx-drift {
  0%, 100% { transform: translate(0, 0) scale(1); }
  33% { transform: translate(80px, 60px) scale(1.1); }
  66% { transform: translate(-50px, 90px) scale(0.92); }
}

@keyframes lx-ch-in {
  from { opacity: 0; transform: translateY(0.6em) rotateX(-70deg); filter: blur(6px); }
  to { opacity: 1; transform: none; filter: none; }
}

@keyframes lx-ch-out {
  to { opacity: 0; transform: translateY(-0.4em); filter: blur(4px); }
}

.am-ring-fill {
  stroke: url(#am-ring-grad);
  stroke-linecap: round;
  stroke-dasharray: 100;
  stroke-dashoffset: 100;
  transition: stroke-dashoffset 2s var(--lx-ease-out) 0.8s;
}

.am-ready .am-ring-fill {
  stroke-dashoffset: 22;
}

@keyframes lx-bob {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-12px); }
}

.am-scroll-cue span {
  position: absolute;
  top: 8px;
  left: 50%;
  width: 4px;
  height: 8px;
  margin-left: -2px;
  border-radius: 4px;
  background: #fff;
  animation: lx-cue 1.8s ease-in-out infinite;
}

/* -------------------------------------------------------
   Audience marquee
------------------------------------------------------- */

@keyframes lx-marquee {
  to { transform: translateX(-100%); }
}

/* -------------------------------------------------------
   Modules explorer
------------------------------------------------------- */

@keyframes lx-pop {
  from { opacity: 0; transform: translateY(24px) scale(0.96); }
  to { opacity: 1; transform: none; }
}

.am-meter span {
  display: block;
  width: var(--v);
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, var(--lx-coral), var(--lx-peach));
  transform: scaleX(0);
  transform-origin: 0 50%;
}

/* -------------------------------------------------------
   Process
------------------------------------------------------- */

.am-steps-line span {
  display: block;
  height: 100%;
  background: linear-gradient(90deg, var(--lx-base), var(--lx-peach));
  transform: scaleX(var(--lx-s, 0));
  transform-origin: 0 50%;
}

/* -------------------------------------------------------
   Trust & integrations
------------------------------------------------------- */

.am-chips span {
  padding: 9px 16px;
  border-radius: 100px;
  font-size: 14px;
  font-weight: 500;
  color: rgba(255, 255, 255, 0.85);
  background: rgba(255, 255, 255, 0.06);
  border: 1px solid rgba(255, 255, 255, 0.12);
  transition: background-color 0.3s ease, border-color 0.3s ease, transform 0.3s var(--lx-ease-out);
}

/* -------------------------------------------------------
   FAQ
------------------------------------------------------- */

.am-acc-icon::before,
.am-acc-icon::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: 12px;
  height: 2px;
  margin: -1px 0 0 -6px;
  border-radius: 2px;
  background: var(--lx-ink);
  transition: transform 0.4s var(--lx-ease-out), background-color 0.3s ease;
}

/* -------------------------------------------------------
   CTA & related industries
------------------------------------------------------- */

.am-others > span {
  font-size: 14px;
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--lx-muted);
}

/* -------------------------------------------------------
   AI
------------------------------------------------------- */

/* Shown until assets/images/products/automyra.jpg exists */

.am-ai-photo-fallback {
  display: flex;
  align-items: center;
  justify-content: center;
  aspect-ratio: 600 / 730;
  background: linear-gradient(145deg, #f38c4b, #ef5f43);
  color: #fff;
  font-size: 96px;
}

.am-ai-draft-head span {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 14px;
  font-weight: 700;
  color: var(--lx-peach);
}

/* -------------------------------------------------------
   Pricing
------------------------------------------------------- */

.am-plan-price span {
  margin-left: 6px;
  font-size: 15px;
  color: var(--lx-muted);
}

.is-popular li i {
  color: var(--lx-peach);
}

.am-plan .am-btn {
  width: 100%;
  margin-top: auto;
}

.am-enterprise h3 small {
  margin-left: 8px;
  font-size: 14px;
  font-weight: 500;
  color: var(--lx-muted);
}

/* -------------------------------------------------------
   Testimonial
------------------------------------------------------- */

.am-quote-card figcaption small {
  display: block;
  font-size: 14px;
  color: var(--lx-muted);
}

.am-stores span {
  font-size: 16px;
  font-weight: 600;
  line-height: 1.15;
}