
/* ============================================================
   FC Gontenschwil - Homepage
   ============================================================ */

.home {
    --fcg-card-radius: 10px;
    --fcg-card-border: #e2eae5;
    --fcg-card-shadow: 0 4px 16px rgba(23, 45, 63, .065);
    --fcg-box-green: #0A8137;
}


    /* ============================================================
   Green information boxes
   ============================================================ */

    .home .kaestchenGruen {
        min-width: 0;
        padding: 0 !important;
        overflow: hidden;
        border-radius: var(--fcg-card-radius);
        background-color: var(--fcg-box-green);
        color: #fff;
        box-shadow: var(--fcg-card-shadow);
    }

        .home .kaestchenGruen > .beItemContainer {
            padding: 22px 24px;
        }

        .home .kaestchenGruen,
        .home .kaestchenGruen .beItemContent {
            color: #fff;
            font-size: 15px;
            line-height: 1.45;
        }

            /* Headings */

            .home .kaestchenGruen .beItemContent h2 {
                margin: 0 0 16px;
                padding: 0;
                color: #fff;
                font-size: 20px;
                font-weight: 600;
                line-height: 1.3;
            }

            .home .kaestchenGruen .beItemContent h3 {
                margin: 0;
                padding: 0;
                color: #fff;
                font-size: 16px;
                font-weight: 500;
                line-height: 1.35;
            }

            /* Paragraphs */

            .home .kaestchenGruen .beItemContent p {
                margin: 0;
                padding: 0;
            }

            /* Links */

            .home .kaestchenGruen .beItemContent a:not(.button),
            .home .kaestchenGruen .beItemContent a:not(.button):visited {
                color: #fff;
                text-decoration: none;
            }

                .home .kaestchenGruen .beItemContent a:not(.button):hover,
                .home .kaestchenGruen .beItemContent a:not(.button):focus-visible {
                    color: #fff;
                    text-decoration: underline;
                    text-underline-offset: 3px;
                }

            /* Buttons */

            .home .kaestchenGruen .beItemContent a.button,
            .home .kaestchenGruen .beItemContent a.button:visited {
                display: inline-block;
                margin: 12px 0 0;
                padding: 8px 12px;
                border: 1px solid #e9f3ec;
                border-radius: 6px;
                background: #e9f3ec;
                color: var(--fcg-box-green);
                font-size: 14px;
                font-weight: 500;
                text-decoration: none;
            }

                .home .kaestchenGruen .beItemContent a.button:hover,
                .home .kaestchenGruen .beItemContent a.button:focus-visible {
                    background: #fff;
                    border-color: #fff;
                    color: var(--fcg-box-green);
                }


            /* ============================================================
   Important links
   ============================================================ */

            /* Identified by its existing contact link, not a container ID */

            .home .kaestchenGruen:has(a[href="/kontakt/kontakt"]) .beItemContent p br {
                display: none;
            }

            .home .kaestchenGruen:has(a[href="/kontakt/kontakt"]) .beItemContent p a:not(.button) {
                display: block;
                padding: 7px 0;
                border-bottom: 1px solid rgba(255, 255, 255, .2);
                font-size: 15px;
                line-height: 1.4;
            }

                .home .kaestchenGruen:has(a[href="/kontakt/kontakt"]) .beItemContent p a:not(.button):last-of-type {
                    border-bottom: 0;
                }


            /* ============================================================
   Locker room occupancy
   ============================================================ */

            .home .kaestchenGruen .fcgGarderoben {
                width: 100%;
                color: #fff;
            }

            /* Main heading */

            .home .kaestchenGruen .fcgGarderobenTitle h2 {
                margin: 0 0 6px;
                font-size: 20px;
                font-weight: 600;
                line-height: 1.3;
            }

            /* Date */

            .home .kaestchenGruen .fcgGarderobenTitleDate {
                margin: 0 0 15px;
            }

                .home .kaestchenGruen .fcgGarderobenTitleDate h3 {
                    margin: 0;
                    color: rgba(255, 255, 255, .85);
                    font-size: 14px;
                    font-weight: 400;
                    line-height: 1.4;
                }

            /* Individual locker rooms */

            .home .kaestchenGruen .fcgGarderobe {
                margin: 0;
                padding: 10px 0;
                border-bottom: 1px solid rgba(255, 255, 255, .2);
            }

                .home .kaestchenGruen .fcgGarderobe:last-child {
                    border-bottom: 0;
                    padding-bottom: 0;
                }

            .home .kaestchenGruen .fcgGarderobeTitle {
                margin: 0 0 3px;
            }

                .home .kaestchenGruen .fcgGarderobeTitle h3 {
                    margin: 0;
                    color: #fff;
                    font-size: 16px;
                    font-weight: 600;
                    line-height: 1.35;
                }

            /* Occupying team or "frei" */

            .home .kaestchenGruen .fcgGarderobeContent {
                margin: 0;
                color: rgba(255, 255, 255, .85);
                font-size: 14px;
                font-weight: 400;
                line-height: 1.4;
                overflow-wrap: anywhere;
            }


            /* ============================================================
   Agenda
   ============================================================ */

            .home .kaestchenGruen #eventContainer {
                font-size: 15px;
                line-height: 1.45;
            }

                .home .kaestchenGruen #eventContainer .eventItem {
                    padding-bottom: 12px;
                    border-bottom: 1px solid rgba(255, 255, 255, .2);
                }

                .home .kaestchenGruen #eventContainer .eventItemDate {
                    color: rgba(255, 255, 255, .85);
                    font-size: 14px;
                    font-weight: 500;
                }

                .home .kaestchenGruen #eventContainer .eventItemTitle {
                    margin-top: 5px;
                    color: #fff;
                    font-size: 16px;
                    font-weight: 600;
                    line-height: 1.35;
                }

                .home .kaestchenGruen #eventContainer .eventItemAdditionalInfo {
                    color: rgba(255, 255, 255, .85);
                    font-size: 14px;
                }


/* ============================================================
   Responsive
   ============================================================ */

@media screen and (max-width: 1023.9px) {
    .home .kaestchenGruen > .beItemContainer {
        padding: 20px;
    }
}

@media screen and (max-width: 767.9px) {
    .home .kaestchenGruen > .beItemContainer {
        padding: 20px;
    }

    .home .kaestchenGruen .beItemContent h2,
    .home .kaestchenGruen .fcgGarderobenTitle h2 {
        font-size: 19px;
    }
}
