/*
 * Why Choose Section - Exact CSS from Amino Club compiled Tailwind
 * Ensures all classes render identically in WordPress/Hotwire Turbo
 */

/* Layout */
.wcs-section {
    position: relative;
}

.wcs-section .py-12 {
    padding-top: 3rem;
    padding-bottom: 3rem;
}

.wcs-section .overflow-hidden {
    overflow: hidden;
}

.wcs-section .max-w-\[100vw\] {
    max-width: 100vw;
}

.wcs-section .w-full {
    width: 100%;
}

/* Background fill image */
.wcs-section .absolute {
    position: absolute;
}

.wcs-section .inset-0 {
    inset: 0;
}

.wcs-section .pointer-events-none {
    pointer-events: none;
}

.wcs-section .object-cover {
    object-fit: cover;
}

.wcs-section .blur-\[8px\] {
    filter: blur(8px);
}

.wcs-section .opacity-50 {
    opacity: 0.5;
}

/* Content wrapper */
.wcs-section .relative {
    position: relative;
}

.wcs-section .z-10 {
    z-index: 10;
}

/* Heading */
.wcs-section .text-2xl {
    font-size: 1.5rem;
    line-height: 2rem;
}

.wcs-section .font-semibold {
    font-weight: 600;
}

.wcs-section .text-black {
    color: #000;
}

.wcs-section .text-center {
    text-align: center;
}

.wcs-section .mb-6 {
    margin-bottom: 1.5rem;
}

.wcs-section .leading-tight {
    line-height: 1.25;
}

/* Grid */
.wcs-section .grid {
    display: grid;
}

.wcs-section .grid-cols-1 {
    grid-template-columns: repeat(1, minmax(0, 1fr));
}

.wcs-section .gap-4 {
    gap: 1rem;
}

/* Card - use !important to override WordPress/Storefront theme resets */
/* overflow:hidden clips the inner border-[3px] overlay to the card's rounded corners */
.wcs-section article {
    overflow: hidden;
}

/* Inner colored border overlay must exactly match the card's border-radius */
.wcs-section article>.absolute {
    border-radius: inherit !important;
}

.wcs-section article.bg-white\/80,
.wcs-section .bg-white\/80 {
    background-color: rgba(255, 255, 255, 0.8) !important;
}

.wcs-section article.backdrop-blur-sm,
.wcs-section .backdrop-blur-sm {
    -webkit-backdrop-filter: blur(4px) !important;
    backdrop-filter: blur(4px) !important;
}

.wcs-section article.border,
.wcs-section .border {
    border-width: 1px !important;
    border-style: solid !important;
}

.wcs-section article.border-\[rgba\(227\,227\,227\,0\.6\)\],
.wcs-section .border-\[rgba\(227\,227\,227\,0\.6\)\] {
    border-color: rgba(227, 227, 227, 0.6) !important;
}

.wcs-section article.rounded-2xl,
.wcs-section .rounded-2xl {
    border-radius: 1rem !important;
}

/* CRITICAL FIX: WordPress/Storefront resets article padding to 0 */
.wcs-section article.p-4,
.wcs-section article[class*="p-4"] {
    padding: 1rem !important;
}

.wcs-section article.shadow-sm,
.wcs-section .shadow-sm {
    box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05) !important;
}

/* Card inner border overlay */
.wcs-section .border-\[3px\] {
    border-width: 3px;
    border-style: solid;
}

.wcs-section .border-\[rgba\(220\,215\,255\,0\.3\)\] {
    border-color: rgba(220, 215, 255, 0.3);
}

.wcs-section .border-\[rgba\(233\,250\,231\,0\.3\)\] {
    border-color: rgba(233, 250, 231, 0.3);
}

.wcs-section .border-\[rgba\(255\,250\,214\,0\.3\)\] {
    border-color: rgba(255, 250, 214, 0.3);
}

.wcs-section .border-\[rgba\(250\,217\,255\,0\.3\)\] {
    border-color: rgba(250, 217, 255, 0.3);
}

.wcs-section .border-\[rgba\(165\,226\,198\,0\.3\)\] {
    border-color: rgba(165, 226, 198, 0.3);
}

/* Icon box backgrounds */
.wcs-section .bg-\[\#f2f0ff\] {
    background-color: #f2f0ff;
}

.wcs-section .bg-\[\#f0ffee\] {
    background-color: #f0ffee;
}

.wcs-section .bg-\[\#fffbdb\] {
    background-color: #fffbdb;
}

.wcs-section .bg-\[\#ffe7fd\] {
    background-color: #ffe7fd;
}

.wcs-section .bg-\[\#f1eeff\] {
    background-color: #f1eeff;
}

.wcs-section .bg-\[\#effff8\] {
    background-color: #effff8;
}

/* Icon box borders */
.wcs-section .border-\[rgba\(224\,220\,253\,0\.83\)\] {
    border-color: rgba(224, 220, 253, 0.83);
}

.wcs-section .border-\[rgba\(209\,243\,205\,0\.83\)\] {
    border-color: rgba(209, 243, 205, 0.83);
}

.wcs-section .border-\[rgba\(238\,230\,172\,0\.83\)\] {
    border-color: rgba(238, 230, 172, 0.83);
}

.wcs-section .border-\[rgba\(246\,209\,243\,0\.83\)\] {
    border-color: rgba(246, 209, 243, 0.83);
}

.wcs-section .border-\[rgba\(217\,208\,255\,0\.83\)\] {
    border-color: rgba(217, 208, 255, 0.83);
}

.wcs-section .border-\[rgba\(180\,227\,206\,0\.83\)\] {
    border-color: rgba(180, 227, 206, 0.83);
}

/* Icon box dimensions */
.wcs-section .rounded-xl {
    border-radius: 0.75rem;
}

.wcs-section .w-11 {
    width: 2.75rem;
}

.wcs-section .h-11 {
    height: 2.75rem;
}

.wcs-section .flex {
    display: flex;
}

.wcs-section .items-center {
    align-items: center;
}

.wcs-section .justify-center {
    justify-content: center;
}

.wcs-section .mb-3 {
    margin-bottom: 0.75rem;
}

/* Icon image */
.wcs-section .w-6 {
    width: 1.5rem;
}

.wcs-section .h-6 {
    height: 1.5rem;
}

.wcs-section .object-contain {
    object-fit: contain;
}

/* Card heading */
.wcs-section .text-base {
    font-size: 1rem;
    line-height: 1.5rem;
}

.wcs-section .mb-1\.5 {
    margin-bottom: 0.375rem;
}

/* Card text */
.wcs-section .text-\[\#797979\] {
    color: #797979;
}

.wcs-section .text-sm {
    font-size: 0.875rem;
    line-height: 1.25rem;
}

.wcs-section .leading-relaxed {
    line-height: 1.625;
}

/* Responsive md */
@media (min-width: 768px) {
    .wcs-section .md\:grid-cols-2 {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .wcs-section .md\:text-3xl {
        font-size: 1.875rem;
        line-height: 2.25rem;
    }
}

/* Responsive lg */
@media (min-width: 1024px) {
    .wcs-section .lg\:py-16 {
        padding-top: 4rem;
        padding-bottom: 4rem;
    }

    .wcs-section .lg\:grid-cols-3 {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .wcs-section .lg\:gap-5 {
        gap: 1.25rem;
    }

    .wcs-section .lg\:rounded-3xl {
        border-radius: 1.5rem !important;
    }

    /* CRITICAL FIX: Force desktop padding on cards */
    .wcs-section article.lg\:p-5,
    .wcs-section article[class*="lg:p-5"] {
        padding: 1.25rem !important;
    }

    .wcs-section .lg\:w-14 {
        width: 3.5rem;
    }

    .wcs-section .lg\:h-14 {
        height: 3.5rem;
    }

    .wcs-section .lg\:mb-4 {
        margin-bottom: 1rem;
    }

    .wcs-section .lg\:w-8 {
        width: 2rem;
    }

    .wcs-section .lg\:h-8 {
        height: 2rem;
    }

    .wcs-section .lg\:text-4xl {
        font-size: 2.25rem;
        line-height: 2.5rem;
    }

    .wcs-section .lg\:mb-10 {
        margin-bottom: 2.5rem;
    }

    .wcs-section .lg\:text-lg {
        font-size: 1.125rem;
        line-height: 1.75rem;
    }

    .wcs-section .lg\:mb-2 {
        margin-bottom: 0.5rem;
    }

    .wcs-section .lg\:text-base {
        font-size: 1rem;
        line-height: 1.5rem;
    }
}