/* KI-Gemeinschaft Landing – schlankes Seitendesign, Suite-Tokens, Light/Dark. */

.kig { max-width: 62rem; margin: 0 auto; padding: 0 1.25rem; }
.kig section { margin: 3.25rem 0; }
.kig h1 { font-size: clamp(2rem, 5vw, 3.25rem); line-height: 1.1; color: var(--color-h1, #2F6592); margin: 0 0 .5rem; }
.kig h2 { font-size: clamp(1.5rem, 3vw, 2.1rem); color: var(--color-h1, #2F6592); margin: 0 0 1.15rem; display: flex; align-items: center; gap: .55rem; }
.kig .kig-lead { font-size: clamp(1.15rem, 2.2vw, 1.4rem); color: var(--color-text-secondary, #666); }
.kig-ic { width: 1.5rem; height: 1.5rem; flex: none; }
.kig h2 .kig-ic { color: var(--color-accent, #3d6911); }

.kig-hero { text-align: center; padding: 2.5rem 0 1rem; }
.kig-hero .kig-lead { max-width: 40rem; margin: 0 auto .75rem; }
.kig-hero p { max-width: 42rem; margin: 0 auto; color: var(--color-text-secondary, #666); }

/* Themen – Gruppen mit Karten */
.kig-themengruppe { font-size: 1.15rem; color: var(--color-text-primary, #111); margin: 2rem 0 .85rem; padding-bottom: .4rem; border-bottom: 2px solid var(--color-accent, #3d6911); }
.kig-grid { display: grid; gap: 1rem; grid-template-columns: 1fr; list-style: none; padding: 0; margin: 0; }
@media (min-width: 42rem) { .kig-grid { grid-template-columns: repeat(3, 1fr); } }
.kig-card { display: flex; gap: .85rem; align-items: flex-start; background: var(--color-bg-secondary, #f8f9fa); border: 1px solid var(--color-border, #d0d0d0); border-radius: 12px; padding: 1.2rem 1.35rem; }
.kig-card .kig-ic { color: var(--color-accent, #3d6911); margin-top: .1rem; }
.kig-card strong { display: block; color: var(--color-text-primary, #111); margin-bottom: .3rem; }
.kig-card span { color: var(--color-text-secondary, #666); line-height: 1.5; }

/* Technologien – aufklappbare Ebenen, 2-spaltig */
.kig-tech { display: grid; gap: .7rem; grid-template-columns: 1fr; }
@media (min-width: 42rem) { .kig-tech-2 { grid-template-columns: repeat(2, 1fr); align-items: start; } }
.kig-tech-cat { border: 1px solid var(--color-border, #d0d0d0); border-radius: 10px; background: var(--color-bg-secondary, #f8f9fa); }
.kig-tech-cat > summary { list-style: none; cursor: pointer; display: flex; align-items: center; gap: .6rem; padding: .9rem 1.1rem; font-weight: 600; color: var(--color-text-primary, #111); }
.kig-tech-cat > summary::-webkit-details-marker { display: none; }
.kig-tech-cat > summary:hover { color: var(--color-accent, #3d6911); }
.kig-tech-cat > summary .kig-ic { color: var(--color-accent, #3d6911); }
.kig-tech-cat > summary .kig-chevron { margin-left: auto; transition: transform .2s ease; width: 1.1rem; height: 1.1rem; color: var(--color-text-muted, #999); }
.kig-tech-cat[open] > summary .kig-chevron { transform: rotate(180deg); }
.kig-tech-body { padding: 0 1.1rem 1rem; }
.kig-hint { color: var(--color-text-secondary, #666); margin: 0 0 .6rem; font-size: .95rem; }
.kig-pills { display: flex; flex-wrap: wrap; gap: .5rem; list-style: none; padding: 0; margin: 0; }
.kig-pills li { padding: .4rem .9rem; border: 1px solid var(--color-border, #d0d0d0); border-radius: 999px; font-size: .9rem; background: var(--color-bg-primary, #fff); color: var(--color-text, #333); }

/* Synapsen-Party-Kalender – 2 Kacheln nebeneinander, aufklappbar */
.kig-termine { display: grid; grid-template-columns: 1fr; gap: 1rem; }
@media (min-width: 42rem) { .kig-termine { grid-template-columns: repeat(2, 1fr); } }
.kig-kachel { border: 1px solid var(--color-border, #d0d0d0); border-radius: 12px; background: var(--color-bg-primary, #fff); overflow: hidden; }
.kig-kachel[open] { border-color: var(--color-accent, #3d6911); }
.kig-kachel > summary { list-style: none; cursor: pointer; display: flex; flex-direction: column; gap: .3rem; padding: 1.1rem 1.2rem 2.3rem; position: relative; }
.kig-kachel > summary::-webkit-details-marker { display: none; }
.kig-kachel-titel { font-weight: 700; color: var(--color-text-primary, #111); font-size: 1.05rem; }
.kig-kachel-meta { color: var(--color-text-secondary, #666); font-size: .9rem; }
.kig-kachel-typ { font-size: .78rem; text-transform: uppercase; letter-spacing: .04em; font-weight: 700; color: var(--color-accent, #3d6911); }
.kig-mehr { position: absolute; right: 1.2rem; bottom: .85rem; font-size: .82rem; font-weight: 600; color: var(--color-accent, #3d6911); }
.kig-kachel[open] > summary { padding-bottom: 1.1rem; }
.kig-kachel[open] .kig-mehr { display: none; }
.kig-kachel-desc { padding: 0 1.2rem 1.15rem; color: var(--color-text-secondary, #666); font-size: .92rem; line-height: 1.5; }

/* Teilnahme / Angebote */
.kig-angebote { display: grid; gap: 1rem; max-width: 36rem; margin: 0 auto; }
.kig-angebot { background: var(--color-bg-secondary, #f8f9fa); border: 1px solid var(--color-border, #d0d0d0); border-radius: 16px; padding: 2rem 1.6rem; text-align: center; }
.kig-angebot.is-sold { opacity: .68; }
.kig-preis { font-size: clamp(1.7rem, 3.5vw, 2.4rem); font-weight: 700; color: var(--color-h1, #2F6592); margin: .25rem 0; }
.kig-preis small { display: block; font-size: .9rem; font-weight: 400; color: var(--color-text-muted, #999); margin-top: .25rem; }
.kig-features { list-style: none; padding: 0; margin: 1.25rem 0; text-align: left; display: grid; gap: .7rem; }
.kig-features li { display: flex; align-items: flex-start; gap: .6rem; color: var(--color-text-secondary, #666); line-height: 1.45; }
.kig-features strong { color: var(--color-text-primary, #111); }
.kig-check { width: 1.25rem; height: 1.25rem; flex: none; margin-top: .1rem; color: var(--color-accent, #3d6911); }
.kig-sold { display: inline-block; margin-top: 1rem; background: var(--color-bg-tertiary, #e9ecef); color: var(--color-text-muted, #999); border-radius: 999px; padding: .35rem .9rem; font-size: .82rem; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; text-decoration: none; }
a.kig-sold:hover, a.kig-sold:focus-visible { color: var(--color-accent, #3d6911); }
.kig-cta { display: inline-block; margin-top: 1.25rem; padding: .9rem 1.8rem; border-radius: 10px; background: var(--color-accent, #3d6911); color: #fff; font-weight: 600; text-decoration: none; transition: background .15s ease; }
.kig-cta:hover, .kig-cta:focus-visible { background: var(--color-accent-hover, #2F5209); color: #fff; }
.kig a:focus-visible, .kig-cta:focus-visible, .kig summary:focus-visible { outline: 2px solid var(--color-accent, #3d6911); outline-offset: 3px; border-radius: 6px; }