@layer components {
    .f-footer {
        @apply mt-2 border-t border-[--f-input-border] bg-[--f-footer-background] text-[--f-text] pt-2;
    }

    .f-footer-inner {
        @apply max-w-7xl mx-auto px-6 grid md:grid-cols-3 gap-12;
    }

    .f-footer-col {
        @apply max-w-sm pt-4 space-y-1;

        h1,
        h2,
        h3,
        h4,
        h5,
        h6 {
            @apply text-xl font-semibold text-[--f-header];
        }
      
        p {
            @apply text-base;
        }
    }

    .f-footer-copyright {
        @apply text-center py-4 text-base text-[--f-text];
    }

    .f-footer-recaptcha {
        @apply text-base;
    }
}