.useful-links-section {
  padding: 0 0 100px;
  background: var(--paper);
}

.useful-links {
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: var(--cloud);
}

.useful-links summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 24px 30px;
  color: var(--ink);
  cursor: pointer;
  font-size: 1.2rem;
  font-weight: 800;
  list-style: none;
}

.useful-links summary::-webkit-details-marker {
  display: none;
}

.useful-links summary::after {
  content: '+';
  color: var(--coral);
  font-size: 1.6rem;
  line-height: 1;
}

.useful-links[open] summary::after {
  content: '−';
}

.useful-links-marquee {
  display: flex;
  width: 100%;
  overflow: hidden;
  border-top: 1px solid var(--line);
}

.useful-links-track {
  display: flex;
  flex-shrink: 0;
  align-items: center;
  gap: 24px;
  padding: 22px 24px;
  animation: useful-links-scroll 38s linear infinite;
}

.useful-links-track a {
  color: var(--ink-soft);
  font-size: .95rem;
  font-weight: 700;
  white-space: nowrap;
}

.useful-links-track a:hover,
.useful-links-track a:focus-visible {
  color: var(--coral);
}

.useful-links-separator {
  color: var(--coral);
  font-weight: 900;
}

.useful-links:hover .useful-links-track {
  animation-play-state: paused;
}

@keyframes useful-links-scroll {
  from { transform: translateX(0); }
  to { transform: translateX(-100%); }
}

@media (prefers-reduced-motion: reduce) {
  .useful-links-track {
    animation: none;
  }
}

@media (max-width: 560px) {
  .useful-links summary {
    padding: 20px 24px;
  }

  .useful-links-track {
    gap: 18px;
    padding: 18px;
  }
}