/* Terms & Conditions page-specific styles for PenMarkk */
.legal { padding-block: var(--space-12); }
.legal__header { margin-bottom: var(--space-8); }
.legal__meta { color: var(--gray-600); font-size: var(--text-sm); }

.toc { margin-bottom: var(--space-8); }
.toc__title { margin-bottom: var(--space-3); font-size: var(--text-xl); }
.toc__list { margin: 0; padding-left: var(--space-6); }
.toc__list li { margin-bottom: var(--space-2); }
.toc a { text-decoration: underline; text-decoration-color: transparent; }
.toc a:hover { text-decoration-color: currentColor; }

.legal__section { margin-bottom: var(--space-6); }
.legal__section h2 { margin-bottom: var(--space-4); }
.legal__section h3 { margin-top: var(--space-3); }

/* Improve focus visibility when scrolled to anchors */
.legal__section:focus { outline: 3px solid rgba(15, 39, 72, 0.25); outline-offset: 2px; border-radius: var(--radius-md); }

@media (min-width: 960px) {
  .legal { display: grid; grid-template-columns: 1fr 2fr; gap: var(--space-8); }
  .toc { position: sticky; top: var(--space-12); align-self: start; height: max-content; }
  .legal__header { grid-column: 1 / -1; }
  .legal__section { grid-column: 2; }
}