/* ==========================================================================
   tracht.css – Zusatz-Styles für „Wo unsere Bienen sammeln" (tracht.html)
   Ergänzt css/style.css (Variablen, Section- und Karten-Look werden genutzt).
   ========================================================================== */

/* Hero-Hintergrund dieser Seite */
.page-hero--tracht { background-image: url("../assets/hero-rapsfeld.jpg"); }

/* Trachtkarte */
.tracht-karte {
  max-width: 1040px;
  margin-inline: auto;
  background: var(--white);
  border: 3px solid var(--black);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
  overflow: hidden;
}

.tracht-karte > img {
  width: 100%;
  height: auto;
}

.karte-hinweis {
  border-top: 3px solid var(--black);
  background: var(--yellow-soft);
  padding: 12px 18px;
  font-size: 0.9rem;
  font-weight: 700;
  color: var(--grey);
  text-align: center;
}

.karte-hinweis a {
  color: var(--yellow-deep);
  font-weight: 800;
}

/* Trachtkalender (Tabelle) */
.trachtkalender-wrap {
  overflow-x: auto;
  border: 3px solid var(--black);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
  background: var(--white);
}

.trachtkalender {
  width: 100%;
  min-width: 640px;
  border-collapse: collapse;
  font-size: 1.02rem;
}

.trachtkalender caption {
  caption-side: top;
  text-align: left;
  padding: 14px 18px 0;
  color: var(--grey);
  font-size: 0.95rem;
}

.trachtkalender th,
.trachtkalender td {
  padding: 12px 18px;
  text-align: left;
  vertical-align: top;
  border-bottom: 2px solid rgba(25, 25, 25, 0.12);
}

.trachtkalender th {
  background: var(--yellow);
  color: var(--black);
  font-family: var(--font-hand);
  font-size: 1.3rem;
  font-weight: 700;
  border-bottom: 3px solid var(--black);
}

.trachtkalender tbody tr:nth-child(even) {
  background: var(--yellow-soft);
}

.trachtkalender tbody tr:last-child td {
  border-bottom: none;
}

.trachtkalender td:first-child {
  font-weight: 800;
  white-space: nowrap;
}

/* Wildbienen-FAQ (details/summary) */
.wildbienen-faq {
  max-width: 820px;
  margin-inline: auto;
  display: grid;
  gap: 18px;
}

.wildbienen-faq details {
  background: var(--white);
  border: 3px solid var(--black);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
  overflow: hidden;
}

.wildbienen-faq summary {
  cursor: pointer;
  list-style: none;
  padding: 18px 54px 18px 22px;
  font-family: var(--font-hand);
  font-size: 1.6rem;
  font-weight: 700;
  line-height: 1.15;
  background: var(--yellow-soft);
  border-bottom: 3px solid transparent;
  position: relative;
}

.wildbienen-faq summary::-webkit-details-marker {
  display: none;
}

.wildbienen-faq summary::after {
  content: "";
  position: absolute;
  right: 24px;
  top: 50%;
  width: 12px;
  height: 12px;
  border-right: 3px solid var(--black);
  border-bottom: 3px solid var(--black);
  transform: translateY(-70%) rotate(45deg);
  transition: transform 0.2s ease;
}

.wildbienen-faq details[open] summary {
  border-bottom-color: var(--black);
}

.wildbienen-faq details[open] summary::after {
  transform: translateY(-30%) rotate(-135deg);
}

.wildbienen-faq details p {
  padding: 16px 22px 0;
  font-size: 1.05rem;
}

.wildbienen-faq details p:last-child {
  padding-bottom: 20px;
}

/* Sorten & ihre Tracht */
.sorten-tracht {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  gap: 28px;
}

.sorte {
  background: var(--white);
  border: 3px solid var(--black);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
  padding: 24px 22px;
}

.sorte h3 {
  color: var(--yellow-deep);
  margin-bottom: 8px;
}

.sorte p {
  color: var(--grey);
}

@media (max-width: 720px) {
  .wildbienen-faq summary {
    font-size: 1.35rem;
    padding-right: 48px;
  }
}