/* IQSTAT landing — inline SVG icon system (matches hero / favicon palette) */
@keyframes pen-icon-wave {
  0%, 100% { transform: scaleY(0.45); }
  50% { transform: scaleY(1); }
}
@keyframes pen-icon-pulse {
  0%, 100% { opacity: 0.55; transform: scale(1); }
  50% { opacity: 1; transform: scale(1.06); }
}
@keyframes pen-icon-float {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-2px); }
}
@keyframes pen-icon-dash {
  to { stroke-dashoffset: -12; }
}
@keyframes pen-icon-arrow {
  0%, 100% { transform: translateX(0); }
  50% { transform: translateX(3px); }
}

.pen-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 40px;
  height: 40px;
  border-radius: 12px;
  background: #eff6ff;
  border: 1px solid #e5e7eb;
  box-sizing: border-box;
}
.pen-icon--lg {
  width: 44px;
  height: 44px;
  border-radius: 14px;
}
.pen-icon--sm {
  width: 28px;
  height: 28px;
  border-radius: 8px;
}
.pen-icon svg {
  width: 22px;
  height: 22px;
  display: block;
}
.pen-icon--sm svg {
  width: 16px;
  height: 16px;
}
.pen-icon--lg svg {
  width: 24px;
  height: 24px;
}
.pen-icon .pen-i-bar {
  transform-origin: center bottom;
  animation: pen-icon-wave 1.1s ease-in-out infinite;
}
.pen-icon .pen-i-bar:nth-child(2) { animation-delay: 0.12s; }
.pen-icon .pen-i-bar:nth-child(3) { animation-delay: 0.24s; }
.pen-icon .pen-i-pulse {
  transform-origin: center;
  animation: pen-icon-pulse 2.4s ease-in-out infinite;
}
.pen-icon .pen-i-float {
  animation: pen-icon-float 3s ease-in-out infinite;
}
.pen-icon .pen-i-dash {
  stroke-dasharray: 4 4;
  animation: pen-icon-dash 1.2s linear infinite;
}
.pen-audience-card .pen-icon,
.pen-akt-card > .pen-icon {
  margin-bottom: 2px;
}
.pen-akt-card .pen-cta-arrow {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}
.pen-akt-card .pen-cta-arrow svg {
  width: 16px;
  height: 16px;
  flex-shrink: 0;
  animation: pen-icon-arrow 1.4s ease-in-out infinite;
}
.pencil-pill .pen-icon--sm {
  background: #fff;
  border-color: #e2e8f0;
}
.pencil-pill {
  display: inline-flex !important;
  flex-direction: row !important;
  align-items: center !important;
  gap: 10px !important;
}
.pen-step-chip {
  display: flex;
  align-items: center;
  gap: 10px;
}
.pen-step-chip .pen-icon--sm {
  background: #eef2ff;
}
.iqstat-quiz__option {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}
.iqstat-quiz__option-text {
  flex: 1;
  min-width: 0;
}
.iqstat-quiz__option-icon {
  display: inline-flex;
  flex-shrink: 0;
  width: 28px;
  height: 28px;
  align-items: center;
  justify-content: center;
  border-radius: 8px;
  background: #eff6ff;
}
.iqstat-quiz__option-icon svg {
  width: 14px;
  height: 14px;
}
.iqstat-quiz__cta {
  gap: 8px;
}
.iqstat-quiz__cta svg {
  width: 18px;
  height: 18px;
  flex-shrink: 0;
}
@media (prefers-reduced-motion: reduce) {
  .pen-icon .pen-i-bar,
  .pen-icon .pen-i-pulse,
  .pen-icon .pen-i-float,
  .pen-icon .pen-i-dash,
  .pen-akt-card .pen-cta-arrow svg {
    animation: none !important;
  }
}
@media (max-width: 520px) {
  .pen-icon--lg {
    width: 40px;
    height: 40px;
  }
  .pen-step-chip .pen-icon--sm {
    width: 24px;
    height: 24px;
  }
  .pen-step-chip .pen-icon--sm svg {
    width: 14px;
    height: 14px;
  }
}
