/* ============================================================
   BITBI — Legal Page Styles
   @layer pages — policy-section styling
   Used by: privacy.html, imprint.html
   ============================================================ */

@layer pages {
    .policy-section {
        h3 {
            font-family: var(--font-display);
            font-weight: 700;
            font-size: 1.125rem;
            color: rgba(255, 255, 255, 0.85);
            margin-block-start: var(--space-5);
            margin-block-end: var(--space-3);
        }

        h3:first-child {
            margin-block-start: 0;
        }

        p, li {
            color: rgba(255, 255, 255, 0.45);
            font-size: 0.875rem;
            line-height: 1.8;
        }

        p + p {
            margin-block-start: 10px;
        }

        ul {
            list-style: none;
            padding: 0;
            margin-block-start: var(--space-2);
        }

        ul li {
            padding-inline-start: var(--space-4);
            position: relative;
            margin-block-end: var(--space-1);

            &::before {
                content: '';
                position: absolute;
                inset-inline-start: 0;
                inset-block-start: 10px;
                inline-size: 5px;
                block-size: 5px;
                border-radius: var(--radius-full);
                background: rgba(0, 240, 255, 0.3);
            }
        }

        a {
            color: var(--color-cyan);
            transition: color 0.3s var(--ease-default);

            &:hover {
                color: rgba(0, 240, 255, 0.7);
            }
        }
    }
}