/*
 * HOF Automation - optische Integration typischer WBCE-Module
 * Wird nach den Modul-Styles geladen und darf diese bewusst ueberschreiben.
 */

/* WYSIWYG / allgemeiner Content */
.hof-content p:last-child,
.hof-extra p:last-child { margin-bottom: 0; }
.hof-content ul:not([class]),
.hof-extra ul:not([class]) { padding-left: 1.2rem; }
.hof-content ul:not([class]) li::marker,
.hof-extra ul:not([class]) li::marker { color: var(--hof-green-deep); }

/* OneByOne */
.onebyone { width: 100%; }
.onebyone-global-headline { margin: 0 0 2.2rem; max-width: 14ch; }
.onebyone-before { margin-bottom: 1.5rem; }
.onebyone-after { margin-top: 1.5rem; }
.onebyone-row { --bs-gutter-x: clamp(1.5rem, 4vw, 4rem); --bs-gutter-y: 2rem; }
.onebyone-inner { height: 100%; }
.onebyone-headline { margin: 0 0 1rem; }
.onebyone-image {
  display: block;
  width: 100%;
  aspect-ratio: 4 / 3;
  object-fit: cover;
  margin: 0 0 1.25rem;
  border-radius: 26px;
  box-shadow: var(--hof-shadow);
}
.onebyone-col:nth-child(odd) .onebyone-image { transform: rotate(-1deg); }
.onebyone-col:nth-child(even) .onebyone-image { transform: rotate(1deg); }
.onebyone-text > :last-child,
.onebyone-code > :last-child,
.onebyone-before > :last-child,
.onebyone-after > :last-child { margin-bottom: 0; }
.onebyone-text .btn,
.onebyone-code .btn { margin-top: .7rem; }

.onebyone-imagebox {
  position: relative;
  display: grid;
  place-items: center;
  min-height: clamp(340px, 48vw, 620px);
  overflow: hidden;
  isolation: isolate;
  background: var(--hof-forest);
  border-radius: var(--hof-radius);
  box-shadow: var(--hof-shadow);
}
.onebyone-imagebox-media,
.onebyone-imagebox-media img,
.onebyone-imagebox-overlay { position: absolute; inset: 0; }
.onebyone-imagebox-media { z-index: 0; }
.onebyone-imagebox-media img { width: 100%; height: 100%; object-fit: cover; }
.onebyone-imagebox-overlay {
  z-index: 1;
  background: linear-gradient(90deg, rgba(8,18,11,.8), rgba(12,22,15,.35) 62%, rgba(12,22,15,.2));
}
.onebyone-imagebox-content-wrap { position: relative; z-index: 2; width: 100%; padding: clamp(2.5rem, 7vw, 6rem); }
.onebyone-imagebox-content { max-width: 820px; color: #fff; }
.onebyone-imagebox-global-headline,
.onebyone-imagebox-headline { color: #fff; }
.onebyone-imagebox-global-headline { font-size: clamp(2.4rem, 5vw, 5rem); }
.onebyone-imagebox-headline { font-size: clamp(1.7rem, 3vw, 3rem); }
.onebyone-imagebox-text { font-size: clamp(1.05rem, 1.5vw, 1.35rem); }

/* Members: neutrale Kartenbasis, damit Gruppen z.B. Team/Referenzen/Meilensteine abbilden koennen */
.mgroup-name { margin-bottom: 1.5rem; }
.mgroup-desc { margin-bottom: 2rem; max-width: 850px; }
.member-list { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 1.5rem; }
.member-list > * {
  min-width: 0;
  padding: 1.35rem;
  background: var(--hof-sage-2);
  border: 1px solid rgba(31,45,36,.08);
  border-radius: 20px;
}
.member-list img { border-radius: 16px; }
.member-name { font-family: var(--hof-font); font-size: 1.35rem; font-weight: 800; text-transform: uppercase; }
.member-link a { color: var(--hof-green-deep); font-weight: 700; }

/* Accessible Accordion */
.eqd-accordion { display: grid; gap: .8rem; }
.eqd-accordion__heading { margin: 0; }
.eqd-accordion__button {
  padding: 1.15rem 4rem 1.15rem 1.3rem !important;
  background-color: var(--hof-sage-2) !important;
  color: var(--hof-forest) !important;
  border-radius: 14px !important;
  font-family: var(--hof-font);
  font-size: 1.05rem !important;
  font-weight: 800 !important;
  text-transform: uppercase;
}
.eqd-accordion__button:hover { background-color: #e3eae3 !important; }
.eqd-accordion__button:focus-visible { outline: 3px solid var(--hof-green); outline-offset: 2px; }
.eqd-accordion__content {
  padding: 1.2rem 1.3rem 1.45rem !important;
  border: 0 !important;
  border-left: 3px solid var(--hof-green) !important;
  background: #fff !important;
  color: var(--hof-ink) !important;
  font-size: 1rem !important;
}

/* mpForm - robustes Styling unabhaengig von den konfigurierten Klassen */
form[id^="form_"] { max-width: 980px; }
form[id^="form_"] .questionbox,
form[id^="form_"] [class*="question"] { margin-bottom: .45rem; font-weight: 700; }
form[id^="form_"] .answerbox,
form[id^="form_"] [class*="answer"] { margin-bottom: 1.15rem; }
form[id^="form_"] input[type="text"],
form[id^="form_"] input[type="email"],
form[id^="form_"] input[type="tel"],
form[id^="form_"] input[type="number"],
form[id^="form_"] input[type="date"],
form[id^="form_"] input[type="url"],
form[id^="form_"] select,
form[id^="form_"] textarea {
  width: 100%;
  min-height: 50px;
  padding: .7rem .85rem;
  border: 1px solid #bdc8bf;
  border-radius: 10px;
  background: #fff;
  color: var(--hof-ink);
}
form[id^="form_"] textarea { min-height: 160px; }
form[id^="form_"] input:focus,
form[id^="form_"] select:focus,
form[id^="form_"] textarea:focus { border-color: var(--hof-green-deep); box-shadow: 0 0 0 .22rem rgba(0,251,0,.16); outline: 0; }
form[id^="form_"] input[type="submit"],
form[id^="form_"] button[type="submit"] {
  padding: .78rem 1.25rem;
  border: 1px solid var(--hof-green);
  border-radius: 999px;
  background: var(--hof-green);
  color: var(--hof-black);
  font-family: var(--hof-font);
  font-weight: 800;
  text-transform: uppercase;
}

/* Tabellen */
.hof-site .table { --bs-table-striped-bg: rgba(50,99,63,.06); }
.hof-site .table thead th { background: var(--hof-forest); color: #fff; border-color: rgba(255,255,255,.12); }

@media (max-width: 991.98px) {
  .member-list { grid-template-columns: repeat(2, minmax(0,1fr)); }
}
@media (max-width: 575.98px) {
  .member-list { grid-template-columns: 1fr; }
  .onebyone-imagebox { border-radius: 20px; }
  .onebyone-imagebox-content-wrap { padding: 2rem; }
}
