/* Home About — professional motion · wave331 · keep infographic size */

.page-home #about.pw-sl-about--pro {
  position: relative;
  overflow: hidden;
  background:
    radial-gradient(640px 280px at 8% 12%, rgba(201, 168, 110, 0.12), transparent 58%),
    radial-gradient(520px 240px at 96% 88%, rgba(31, 122, 69, 0.06), transparent 55%),
    #fffcf7 !important;
  padding: clamp(2.8rem, 5vw, 4.2rem) 0 !important;
}

.page-home #about.pw-sl-about--pro .pw-ta-line,
.page-home #about.pw-sl-about--pro .pw-ta-line[data-ta-item],
.page-home #about.pw-sl-about--pro [data-ta-item] {
  opacity: 1 !important;
  transform: none !important;
  overflow: visible !important;
}

.page-home #about .pw-sl-title {
  display: block !important;
  margin: 0.35rem 0 0.85rem !important;
  font-size: clamp(1.55rem, 3vw, 2.1rem) !important;
  line-height: 1.2 !important;
  color: #2d3238 !important;
}

.page-home #about .pw-ta-line--gold {
  color: #b89558 !important;
  font-style: italic;
}

.page-home #about .pw-sl-about__main--infographic {
  animation: pw-about-float 5.5s ease-in-out infinite;
}

.page-home #about .pw-sl-about__main--infographic:hover {
  animation: none;
}

.page-home #about .pw-sl-about__badge {
  animation: pw-about-badge 3.2s ease-in-out infinite;
}

.page-home #about .pw-sl-about__stat {
  background: #fff !important;
  border: 1px solid #eadfca !important;
  transition: transform 0.35s cubic-bezier(0.22, 1, 0.36, 1), box-shadow 0.35s ease !important;
}

.page-home #about .pw-sl-about__stat:hover {
  transform: translateY(-4px) !important;
  box-shadow: 0 12px 24px rgba(45, 50, 56, 0.1);
}

.page-home #about .pw-sl-about__highlights li {
  opacity: 1 !important;
  transform: none !important;
  position: relative;
  padding-left: 2px;
  transition: transform 0.35s ease, color 0.35s ease;
}

.page-home #about .pw-sl-about__highlights li::before {
  content: "";
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #c9a86e;
  box-shadow: 0 0 0 0 rgba(201, 168, 110, 0.45);
  animation: pw-about-dot 2.4s ease-out infinite;
}

.page-home #about .pw-sl-about__highlights li:nth-child(2)::before { animation-delay: 0.4s; }
.page-home #about .pw-sl-about__highlights li:nth-child(3)::before { animation-delay: 0.8s; }

.page-home #about .pw-sl-about__highlights li:hover {
  transform: translateX(6px);
  color: #b89558;
}

.page-home #about .pw-sl-btn {
  position: relative;
  overflow: hidden;
}

.page-home #about .pw-sl-btn::after {
  content: "";
  position: absolute;
  inset: 0 auto 0 -40%;
  width: 40%;
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.45), transparent);
  transform: skewX(-18deg);
  animation: pw-about-shine 3.8s ease-in-out infinite;
}

.page-home #about .pw-sl-call {
  transition: transform 0.35s ease;
}

.page-home #about .pw-sl-call:hover {
  transform: translateY(-2px);
}

.page-home #about .pw-hm-quicklinks a {
  transition: background 0.3s ease, color 0.3s ease, transform 0.3s ease;
}

.page-home #about .pw-hm-quicklinks a:hover {
  transform: translateY(-2px);
  color: #2d3238;
  background: rgba(201, 168, 110, 0.18);
}

.page-home #about .pw-sl-about__corners span {
  opacity: 0.7 !important;
  transform: none !important;
}

@keyframes pw-about-float {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-8px); }
}

@keyframes pw-about-badge {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-3px); }
}

@keyframes pw-about-dot {
  0% { box-shadow: 0 0 0 0 rgba(201, 168, 110, 0.45); }
  70% { box-shadow: 0 0 0 8px rgba(201, 168, 110, 0); }
  100% { box-shadow: 0 0 0 0 rgba(201, 168, 110, 0); }
}

@keyframes pw-about-shine {
  0%, 55% { left: -40%; }
  100% { left: 120%; }
}

@media (prefers-reduced-motion: reduce) {
  .page-home #about .pw-sl-about__main--infographic,
  .page-home #about .pw-sl-about__badge,
  .page-home #about .pw-sl-about__highlights li::before,
  .page-home #about .pw-sl-btn::after {
    animation: none !important;
  }
}
