/* Project-specific styling layered on Bootstrap 5.3.8. */
@font-face { font-display: swap; font-family: "Hind"; font-style: normal; font-weight: 400; src: url("../webfonts/hind-latin-400-normal.woff2") format("woff2"); }
@font-face { font-display: swap; font-family: "Hind"; font-style: normal; font-weight: 500; src: url("../webfonts/hind-latin-500-normal.woff2") format("woff2"); }
@font-face { font-display: swap; font-family: "Hind"; font-style: normal; font-weight: 600; src: url("../webfonts/hind-latin-600-normal.woff2") format("woff2"); }
@font-face { font-display: swap; font-family: "Hind"; font-style: normal; font-weight: 700; src: url("../webfonts/hind-latin-700-normal.woff2") format("woff2"); }
@font-face { font-display: swap; font-family: "Raleway"; font-style: normal; font-weight: 400; src: url("../webfonts/raleway-latin-400-normal.woff2") format("woff2"); }
@font-face { font-display: swap; font-family: "Raleway"; font-style: normal; font-weight: 600; src: url("../webfonts/raleway-latin-600-normal.woff2") format("woff2"); }
@font-face { font-display: swap; font-family: "Raleway"; font-style: normal; font-weight: 900; src: url("../webfonts/raleway-latin-900-normal.woff2") format("woff2"); }
@font-face { font-display: swap; font-family: "Montserrat"; font-style: normal; font-weight: 400; src: url("../webfonts/montserrat-latin-400-normal.woff2") format("woff2"); }
@font-face { font-display: swap; font-family: "Montserrat"; font-style: normal; font-weight: 700; src: url("../webfonts/montserrat-latin-700-normal.woff2") format("woff2"); }

:root {
    --ig-green: #3c9e00;
    --ig-green-dark: #2e7f00;
    --ig-ink: #303030;
    --ig-muted: #868686;
    --ig-footer: #222222;
}

html { scroll-behavior: smooth; }
body { color: var(--ig-ink); font-family: "Hind", Arial, sans-serif; font-size: 16px; margin: 0; }
a { color: inherit; }

.site-header { background: #fff; position: sticky; top: 0; z-index: 1020; }
.header-inner { min-height: 103px; }
.navbar { padding: 0; }
.logo-link { padding: 13px 0; }
.site-logo { display: block; height: auto; max-width: 228px; width: 100%; }
.navbar-nav .nav-link { color: #444; font-size: 15px; font-weight: 600; letter-spacing: .02em; padding: 41px 13px 37px; text-transform: uppercase; }
.navbar-nav .nav-link:hover, .navbar-nav .nav-link.active { color: var(--ig-green); }
.dropdown-menu { border: 0; border-radius: 0; box-shadow: 0 10px 24px rgba(0,0,0,.12); padding: .45rem 0; }
.dropdown-item { color: #555; font-size: 14px; padding: .55rem 1.15rem; }
.dropdown-item:hover { background: #f4f4f4; color: var(--ig-green); }
.dropdown-menu .dropdown-item.active,
.dropdown-menu .dropdown-item:active { background: var(--ig-green); color: #fff; }

.hero-section { align-items: center; background: url("../images/bahnhofstrasse.jpg") center center / cover no-repeat; display: flex; min-height: min(68vw, 695px); position: relative; }
.hero-overlay { background: rgba(0, 0, 0, .24); inset: 0; position: absolute; }
.hero-content { align-items: center; display: flex; justify-content: center; min-height: inherit; position: relative; }
.hero-caption { background: rgba(0, 0, 0, .50); color: #fff; padding: 25px 48px 27px; text-align: center; }
.hero-caption h1 { font-family: "Raleway", Arial, sans-serif; font-size: clamp(2.2rem, 5vw, 3.75rem); font-weight: 900; letter-spacing: 2px; line-height: 1.05; margin: 0; }
.hero-caption p { font-family: "Raleway", Arial, sans-serif; font-size: clamp(1.45rem, 3.2vw, 2.5rem); font-weight: 400; line-height: 1.15; margin: 17px 0 0; }

.stats-section { background: linear-gradient(135deg, var(--ig-green) 0%, #329000 100%); color: #fff; padding: 12px 0; }
.stat-item { align-items: center; display: flex; flex-direction: column; justify-content: center; min-height: 157px; position: relative; text-align: center; }
.stat-item:not(:last-child)::after { background: rgba(255, 255, 255, .35); content: ""; height: 72px; position: absolute; right: 0; top: 50%; transform: translateY(-50%); width: 1px; }
.stat-item strong { font-family: "Montserrat", Arial, sans-serif; font-size: clamp(2.3rem, 4vw, 3.15rem); font-weight: 400; letter-spacing: .03em; line-height: 1; }
.stat-item span { font-size: 14px; font-weight: 500; letter-spacing: .12em; line-height: 1; margin-top: 14px; text-transform: uppercase; }
.stat-item sup { font-size: .58em; top: -.35em; }

.site-footer { background: var(--ig-footer); color: #fff; padding: 53px 0 62px; }
.site-footer h3 { font-size: 18px; font-weight: 500; margin: 0 0 18px; }
.footer-links { display: flex; flex-direction: column; gap: 7px; }
.footer-links-centered { align-items: center; flex-direction: row; flex-wrap: wrap; gap: .35rem 2.25rem; justify-content: center; text-align: center; }
.footer-links a { color: #aaa; font-size: 15px; text-decoration: none; }
.footer-links a:hover { color: #fff; }
.copyright-bar { background: #111; color: #777; font-size: 13px; padding: 20px 15px; text-align: center; }
.copyright-bar a { color: #aaa; text-decoration: none; }
.copyright-bar a:hover { color: #fff; }
.back-to-top { align-items: center; background: var(--ig-green); border-radius: 50%; bottom: 24px; color: #fff; display: flex; font-size: 23px; height: 43px; justify-content: center; position: fixed; right: 24px; text-decoration: none; transition: transform .2s ease, background .2s ease; width: 43px; z-index: 10; }
.back-to-top:hover { background: var(--ig-green-dark); color: #fff; transform: translateY(-3px); }

.inner-page { background: #f3f3f3; padding: 78px 0 92px; }
.page-heading { color: var(--ig-green); font-family: "Montserrat", Arial, sans-serif; font-size: clamp(2.35rem, 5vw, 4rem); font-weight: 400; line-height: 1.3; margin: 0 0 42px; text-transform: uppercase; }
.page-content { color: #666; font-size: 17px; font-weight: 400; line-height: 1.75; }
.page-content h2 { color: var(--ig-green); font-family: "Montserrat", Arial, sans-serif; font-size: clamp(1.7rem, 3vw, 2.35rem); font-weight: 400; line-height: 1.2; margin: 2.3rem 0 1rem; }
.page-content h3 { color: var(--ig-green); font-family: "Montserrat", Arial, sans-serif; font-size: 1.2rem; font-weight: 700; line-height: 1.3; margin: 0 0 .7rem; text-transform: uppercase; }
.page-content p { margin-bottom: 1.2rem; }
.page-content strong { font-weight: 700; }
.page-content ul { margin: 0 0 1.5rem; padding-left: 1.4rem; }
.page-content li { margin-bottom: .35rem; }
.page-content a { color: var(--ig-green-dark); }
.member-card { background: #f7f7f7; border-left: 4px solid var(--ig-green); height: 100%; padding: 1.25rem 1.35rem; }
.member-card h3 { font-size: 1.05rem; margin-bottom: 0; }
.contact-card { background: #f7f7f7; border-top: 4px solid var(--ig-green); padding: 1.5rem; }
.contact-card address { line-height: 1.8; margin: 0; }
.contact-form .form-control { border-radius: 0; min-height: 48px; }
.contact-form textarea.form-control { min-height: 150px; }
.contact-form .btn { background: var(--ig-green); border: 0; border-radius: 0; color: #fff; padding: .75rem 1.5rem; }
.contact-form .btn:hover { background: var(--ig-green-dark); }
.map-placeholder { align-items: center; background: #e4e4e4; border: 1px solid #d3d3d3; color: #666; display: flex; flex-direction: column; justify-content: center; min-height: 320px; padding: 2rem; text-align: center; }
.map-placeholder p { margin-bottom: 1rem; }
.map-placeholder .btn { background: var(--ig-green); border: 0; border-radius: 0; color: #fff; padding: .75rem 1.5rem; }
.map-placeholder .btn:hover { background: var(--ig-green-dark); }
.members-accordion .accordion-item { background: #fff; border: 0; border-bottom: 1px solid #e2e2e2; border-radius: 0; }
.members-accordion .accordion-header { margin: 0; }
.members-accordion .accordion-button { background: #fff; color: #444; font-family: "Montserrat", Arial, sans-serif; font-size: 1rem; font-weight: 700; padding: 1.15rem 1.35rem; }
.members-accordion .accordion-button:not(.collapsed) { background: var(--ig-green); box-shadow: none; color: #fff; }
.members-accordion .accordion-button:focus { border-color: transparent; box-shadow: 0 0 0 .2rem rgba(60, 158, 0, .18); }
.members-accordion .accordion-button::after { background-size: 1rem; }
.members-accordion .accordion-button:not(.collapsed)::after { filter: brightness(0) invert(1); }
.members-accordion .accordion-body { background: #fff; color: #666; font-size: 1rem; line-height: 1.75; padding: 1.35rem 1.5rem 1.5rem; }
.members-accordion .accordion-body br + br { display: block; content: ""; margin-top: .7rem; }

@media (max-width: 991.98px) {
    .header-inner { min-height: 80px; }
    .navbar-toggler { border: 0; border-radius: 0; padding: .5rem; }
    .navbar-collapse { background: #fff; border-top: 1px solid #eee; margin: 0 -12px; padding: 8px 12px 14px; }
    .navbar-nav .nav-link { padding: 10px 4px; }
    .dropdown-menu { box-shadow: none; padding-left: 12px; }
    .hero-section { min-height: 520px; }
}

@media (max-width: 575.98px) {
    .site-logo { max-width: 190px; }
    .hero-section { min-height: 430px; }
    .hero-caption { margin: 0 12px; padding: 21px 22px 23px; }
    .stat-item { min-height: 112px; }
    .stat-item:not(:last-child)::after { bottom: 0; height: 1px; left: 15%; right: 15%; top: auto; transform: none; width: 70%; }
    .site-footer { padding: 42px 0 48px; }
}
