/* Global site shell and the page building blocks used inside Divi text modules. */

body,
#page-container,
#main-content {
  background: var(--aef-kalkputz);
  color: var(--aef-tintenholz);
  font-family: var(--aef-sans);
}

#main-content p,
#main-content li,
#main-content dt,
#main-content dd {
  font-family: var(--aef-sans);
  font-size: 1.0625rem;
  line-height: 1.65;
}

#main-content h1,
#main-content h2,
#main-content h3,
#main-content h4 {
  padding-bottom: 0;
  font-family: var(--aef-serif);
  font-weight: 400;
  letter-spacing: -0.01em;
  /* Long German compounds hyphenate instead of breaking at an arbitrary letter. */
  overflow-wrap: normal;
  word-break: normal;
  hyphens: auto;
}

#main-content h1 {
  max-width: 20ch;
  margin: 0 0 1rem;
  font-size: clamp(2.4rem, 5vw, 4rem);
  line-height: 1.1;
  letter-spacing: -0.025em;
}

#main-content h2 {
  margin: 0 0 1rem;
  font-size: clamp(1.7rem, 3vw, 2.4rem);
  line-height: 1.15;
}

#main-content h3 {
  margin: 0 0 0.5rem;
  font-size: clamp(1.3rem, 2vw, 1.55rem);
  line-height: 1.25;
}

#main-content .et_pb_text_inner ul {
  padding-left: 1.25em;
}

#main-content :is(.aef-linklist, .aef-sources, .aef-periods, .aef-source__files) {
  list-style: none;
}

#main-content .et_pb_text_inner :where(p, ul, ol, dl, div, details) + :where(h2, h3) {
  margin-top: 2.25rem;
}

/* Divi removes the spacing after the last paragraph of a block; embedded blocks need it back. */
#main-content :is(#aef-shared-book, .aef-event) p:last-child {
  padding-bottom: 1em;
}

/* Divi's own footer is replaced by the association footer (includes/footer.php). */
#main-footer {
  display: none;
}

/* ---------- Section scaffolding ---------- */

.aef-page-hero-section,
.aef-page-body-section,
.aef-home-section,
.aef-home-event,
.aef-home-map,
.aef-home-house {
  padding: clamp(2.5rem, 5vw, 4.5rem) 0 !important;
  background-color: var(--aef-kalkputz) !important;
}

.aef-page-hero-section {
  padding-bottom: clamp(1.75rem, 3vw, 2.5rem) !important;
}

/* Same background directly below the heading: no second full section gap. */
.aef-page-hero-section:not(.aef-history-hero-section) + .aef-page-body-section:not(.aef-band-light) {
  padding-top: 0.5rem !important;
}

.aef-band-light {
  border-block: 1px solid var(--aef-linie);
  background-color: var(--aef-kalkputz-hell) !important;
}

:is(.aef-page-hero-section, .aef-page-body-section, .aef-home-section, .aef-home-event, .aef-home-map, .aef-home-house) .et_pb_row {
  width: min(calc(100% - 2rem), var(--aef-content));
  max-width: none;
  padding-block: 0 !important;
}

.aef-page-lead {
  max-width: 58ch;
  margin: 0 !important;
  padding: 0 !important;
  font-size: clamp(1.15rem, 2vw, 1.3rem) !important;
  line-height: 1.55 !important;
}

.aef-prose {
  max-width: 68ch;
}

.aef-small {
  color: var(--aef-salbeigrau-text);
  font-size: 0.9rem !important;
}

/* ---------- Buttons ---------- */

.aef-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
  margin-top: 1.5rem;
  padding: 0 !important;
}

.aef-button-link {
  display: inline-flex;
  min-height: 2.9rem;
  align-items: center;
  justify-content: center;
  padding: 0.7rem 1.1rem;
  border: 2px solid var(--aef-ziegelrot);
  background: var(--aef-ziegelrot);
  color: #fff !important;
  font-family: var(--aef-sans);
  font-weight: 700;
  line-height: 1.3;
  text-decoration: none;
}

.aef-button-link:hover {
  border-color: var(--aef-ziegelrot-dunkel);
  background: var(--aef-ziegelrot-dunkel);
}

.aef-button-link--secondary {
  background: transparent;
  color: var(--aef-ziegelrot-dunkel) !important;
}

.aef-button-link--secondary:hover {
  background: var(--aef-kalkputz);
}

/* ---------- Home: the Kronenschulhaus standing on the page ---------- */

.aef-home-house {
  padding: clamp(2rem, 4vw, 3.5rem) 0 0 !important;
  border-bottom: 0.2rem solid var(--aef-ziegelrot);
  background: var(--aef-kalkputz) !important;
}

.aef-house-hero {
  display: grid;
  grid-template-columns: minmax(0, 0.85fr) minmax(0, 1.15fr);
  gap: clamp(1.5rem, 4vw, 3.5rem);
  align-items: center;
}

.aef-house-hero__text {
  padding-bottom: clamp(2rem, 6vw, 5rem);
}

#main-content .aef-house-hero h1 {
  max-width: none;
  font-size: clamp(2.5rem, 4.6vw, 4.1rem);
  line-height: 1.05;
}

/* The house sits on the section edge, like on its street. */
.aef-house-hero__house {
  position: relative;
  align-self: end;
  margin: 0;
}

.aef-house-hero__house img {
  display: block;
  width: 100%;
  height: auto;
}

/* Top left, beside the roof, where the page shows through: always readable. */
.aef-house-hero__house figcaption {
  position: absolute;
  top: 0;
  left: 0;
  color: var(--aef-salbeigrau-text);
  font-size: 0.85rem;
  line-height: 1.4;
}

.aef-hero__lead {
  max-width: 44ch;
  margin: 0 !important;
  padding: 0 !important;
  font-family: var(--aef-serif) !important;
  font-size: clamp(1.1rem, 1.8vw, 1.25rem) !important;
  line-height: 1.6 !important;
}

/* ---------- Next event band ---------- */

.aef-home-house + .aef-home-event {
  border-top: 0;
}

.aef-next-event {
  display: grid;
  grid-template-columns: minmax(10rem, 14rem) minmax(0, 1fr) auto;
  gap: clamp(1rem, 3vw, 2.5rem);
  align-items: start;
  padding-left: clamp(1rem, 2.5vw, 1.75rem);
  border-left: 0.4rem solid var(--aef-entenfussgelb);
}

#main-content .aef-next-event h2 {
  margin: 0;
  font-size: clamp(1.3rem, 2vw, 1.55rem);
}

.aef-next-event .aef-event p {
  padding-bottom: 0.35rem;
}

.aef-next-event .aef-actions {
  margin-top: 0;
}

/* Event title and date line; the markup comes from AEF_OFB_Events::card(). */
#main-content .aef-event__title {
  margin: 0 0 0.35rem;
  font-size: clamp(1.3rem, 2vw, 1.55rem);
}

.aef-event__when {
  font-weight: 700;
}

/* ---------- Events (plugin AEF_OFB_Events) ---------- */

/* Same yellow marker as the "next event" band on the front page. */
.aef-events {
  display: grid;
  gap: 1.25rem;
  margin-top: 1.25rem;
}

.aef-event-card {
  max-width: 56rem;
  margin-top: 1.25rem;
  padding: clamp(1.25rem, 3vw, 2rem) clamp(1.25rem, 3vw, 2.25rem);
  border: 1px solid var(--aef-linie);
  border-left: 0.4rem solid var(--aef-entenfussgelb);
  background: var(--aef-kalkputz-hell);
}

.aef-events .aef-event-card {
  margin-top: 0;
}

.aef-event-card--image {
  display: grid;
  grid-template-columns: minmax(0, 13rem) minmax(0, 1fr);
  gap: clamp(1rem, 3vw, 2rem);
  align-items: start;
}

.aef-event__image {
  margin: 0;
}

.aef-event__image-link {
  display: block;
  border: 1px solid var(--aef-linie);
  background: #fff;
}

.aef-event__image figcaption {
  margin-top: 0.35rem;
  color: var(--aef-salbeigrau-text);
  font-size: 0.85rem;
  line-height: 1.35;
}

.aef-event__image img {
  display: block;
  width: 100%;
  height: auto;
}

#main-content .aef-event-card .aef-event__title {
  margin-top: 0;
  font-size: clamp(1.45rem, 2.4vw, 1.8rem);
}

#main-content .aef-event__title a {
  color: inherit;
}

.aef-event-card .aef-event__when {
  font-size: 1.1rem;
}

#main-content .aef-event-card p:last-child,
#main-content .aef-event-card ul:last-child {
  margin-bottom: 0;
  padding-bottom: 0;
}

/* The review is quieter: past events carry a neutral marker and smaller type. */
.aef-events--review .aef-event-card {
  border-left-color: var(--aef-sandstein);
}

.aef-events--review .aef-event-card--image {
  grid-template-columns: minmax(0, 9rem) minmax(0, 1fr);
}

#main-content .aef-events--review .aef-event__title {
  font-size: clamp(1.2rem, 2vw, 1.4rem);
}

.aef-events--review .aef-event__when {
  font-size: 1rem;
}

.aef-review__year {
  margin-top: 1.5rem;
  border-top: 1px solid var(--aef-sandstein);
}

.aef-review__year > summary {
  padding-block: 0.75rem;
  cursor: pointer;
}

/* Keeps the browser's disclosure triangle next to the inline year heading. */
.aef-review__year > summary::marker {
  color: var(--aef-ziegelrot);
}

#main-content .aef-review__year > summary h3 {
  display: inline;
  margin: 0;
}

.aef-events-empty {
  max-width: 68ch;
}

/* The front page band shows the next event without its own card frame. */
.aef-next-event .aef-event-card {
  max-width: none;
  margin: 0;
  padding: 0;
  border: 0;
  background: none;
}

/* ---------- Two columns: who / what ---------- */

.aef-split {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: clamp(2rem, 6vw, 5rem);
}

.aef-linklist {
  margin: 0 0 1rem;
  padding: 0 !important;
  border-top: 1px solid var(--aef-linie);
  list-style: none;
}

.aef-linklist li {
  border-bottom: 1px solid var(--aef-linie);
}

.aef-linklist a {
  display: block;
  padding: 0.7rem 0;
  color: var(--aef-tintenholz);
  font-family: var(--aef-serif);
  font-size: 1.2rem;
  text-decoration: none;
}

.aef-linklist a:hover {
  color: var(--aef-ziegelrot);
  text-decoration: underline;
  text-underline-offset: 0.2em;
}

/* ---------- Project teaser on the home page ---------- */

.aef-teasers {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: clamp(1.5rem, 4vw, 3rem);
  margin-top: 1.5rem;
}

.aef-teasers > div {
  padding-top: 1rem;
  border-top: 1px solid var(--aef-sandstein);
}

/* ---------- Map band leading into the history area ---------- */

.aef-home-map {
  background: linear-gradient(rgb(243 240 231 / 20%), rgb(243 240 231 / 20%)), url("../images/karte-band.webp") center / cover no-repeat, var(--aef-kalkputz) !important;
}

.aef-map-plate {
  max-width: 36rem;
  padding: clamp(1.5rem, 4vw, 2.5rem);
  background: var(--aef-kalkputz-hell);
}

/* ---------- Body with an optional facts box ---------- */

.aef-page-body {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(15rem, 20rem);
  gap: clamp(2rem, 6vw, 5rem);
  align-items: start;
}

.aef-page-body > div:first-child {
  max-width: 68ch;
}

.aef-page-body__aside {
  padding: 1.5rem;
  border: 1px solid var(--aef-sandstein);
  background: var(--aef-kalkputz-hell);
}

#main-content .aef-page-body__aside h2 {
  font-size: 1.35rem;
}

.aef-facts {
  margin: 0;
}

.aef-facts dt {
  margin-top: 0.85rem;
  color: var(--aef-salbeigrau-text);
  font-size: 0.9rem !important;
}

.aef-facts dt:first-child {
  margin-top: 0;
}

.aef-facts dd {
  margin: 0;
  font-weight: 700;
}

/* ---------- Program of recurring activities ---------- */

.aef-program {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: clamp(1.75rem, 4vw, 3rem) clamp(2rem, 5vw, 4rem);
  margin-top: 2rem;
}

.aef-program > section {
  padding-top: 1rem;
  border-top: 1px solid var(--aef-sandstein);
}

.aef-program__image {
  margin: 1.25rem 0 0;
}

.aef-program__image img {
  display: block;
  width: 100%;
  height: auto;
}

.aef-program__image figcaption {
  margin-top: 0.4rem;
  color: var(--aef-salbeigrau-text);
  font-size: 0.9rem;
}

.aef-program ul {
  margin: 0;
}


/* ---------- Projects ---------- */

.aef-project {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: clamp(1.5rem, 5vw, 4rem);
  align-items: center;
  padding-block: clamp(1.5rem, 4vw, 2.75rem);
  border-top: 1px solid var(--aef-linie);
}

.aef-project:first-child {
  border-top: 0;
  padding-top: 0;
}

.aef-project:nth-child(even) .aef-project__media {
  order: 2;
}

.aef-project__media {
  margin: 0;
}

.aef-project__media img {
  display: block;
  width: 100%;
  height: auto;
}

.aef-project--text {
  grid-template-columns: minmax(0, 1fr);
}

.aef-project--text .aef-project__copy {
  max-width: 68ch;
}

/* ---------- Sources ---------- */

.aef-sources {
  margin: 1.5rem 0 0;
  padding: 0 !important;
  list-style: none;
}

.aef-source {
  padding-block: 1.5rem;
  border-top: 1px solid var(--aef-linie);
}

.aef-source__meta {
  color: var(--aef-salbeigrau-text);
  font-size: 0.95rem !important;
}

.aef-source__files {
  margin: 0.5rem 0 0;
  padding: 0 !important;
  list-style: none;
}

.aef-source__files li {
  padding-block: 0.15rem;
}

.aef-source details {
  margin-top: 0.75rem;
}

.aef-source summary,
.aef-satzung summary {
  color: var(--aef-ziegelrot-dunkel);
  font-weight: 700;
  cursor: pointer;
}

/* ---------- Published corrections (one collection, records open in place) ---------- */

.aef-corrections__count {
  margin-top: 1.75rem;
  color: var(--aef-salbeigrau-text);
}

.aef-correction-record {
  border-top: 1px solid var(--aef-sandstein);
}

.aef-correction-record:last-child {
  border-bottom: 1px solid var(--aef-sandstein);
}

.aef-correction-record > summary {
  padding-block: 0.9rem;
  cursor: pointer;
}

.aef-correction-record > summary::marker {
  color: var(--aef-ziegelrot);
}

#main-content .aef-correction-record__title {
  display: inline;
  margin: 0;
  font-size: 1.35rem;
}

.aef-correction-record__facts {
  display: block;
  margin: 0.2rem 0 0 1.1rem;
  color: var(--aef-salbeigrau-text);
  font-size: 0.95rem;
}

.aef-correction-record__body {
  max-width: 68ch;
  padding: 0 0 1.25rem 1.1rem;
}

#main-content .aef-correction-record__body h4 {
  margin: 1rem 0 0.2rem;
  font-family: var(--aef-sans);
  font-size: 0.95rem;
  font-weight: 700;
}

.aef-correction-record__credit {
  color: var(--aef-salbeigrau-text);
}

.aef-periods {
  margin: 1rem 0 0;
  padding: 0 !important;
  list-style: none;
}

.aef-periods li {
  padding-block: 1rem;
  border-top: 1px solid var(--aef-linie);
}

.aef-periods a {
  font-family: var(--aef-serif);
  font-size: 1.35rem;
}

/* ---------- Contact ---------- */

.aef-contact {
  font-style: normal;
}

.aef-contact a {
  font-weight: 700;
}

/* ---------- Footer ---------- */

.aef-site-footer {
  border-top: 0.35rem solid var(--aef-ziegelrot);
  background: var(--aef-tintenholz);
  color: #fff;
}

.aef-site-footer__grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 2rem;
  padding-block: clamp(2rem, 4vw, 3rem);
}

.aef-site-footer h2 {
  margin: 0 0 0.6rem;
  padding: 0;
  color: #fff;
  font-family: var(--aef-serif);
  font-size: 1.15rem;
  font-weight: 400;
}

.aef-site-footer p,
.aef-site-footer li,
.aef-site-footer address {
  margin: 0;
  color: #fff;
  font-size: 0.95rem;
  font-style: normal;
  line-height: 1.7;
}

.aef-site-footer ul {
  margin: 0;
  padding: 0;
  list-style: none;
}

.aef-site-footer a {
  color: #fff;
}

.aef-site-footer :where(a):focus-visible {
  outline-color: var(--aef-entenfussgelb) !important;
}

/* ---------- Preview placeholder (includes/preview-gate.php) ---------- */

.aef-preview {
  display: flex;
  min-height: 100vh;
  flex-direction: column;
  margin: 0;
}

.aef-preview__brand {
  display: flex;
  gap: 0.9rem;
  align-items: center;
  padding-block: 1.5rem;
  border-bottom: 1px solid var(--aef-linie);
}

.aef-preview__brand p {
  margin: 0;
  font-family: var(--aef-serif);
  line-height: 1.3;
}

.aef-preview__main {
  flex: 1;
  padding-block: clamp(2.5rem, 8vw, 6rem);
}

.aef-preview #main-content h1 {
  margin: 0 0 1rem;
  font-size: clamp(2.4rem, 5vw, 4rem);
  font-weight: 400;
}

.aef-preview__event {
  margin-top: clamp(2rem, 5vw, 3rem);
}

.aef-preview #main-content .aef-preview__event h2 {
  margin: 0 0 0.6rem;
  color: var(--aef-salbeigrau-text);
  font-family: var(--aef-sans);
  font-size: 0.95rem;
  font-weight: 700;
}

.aef-preview #main-content .aef-event p {
  margin: 0 0 0.75rem;
}

.aef-preview .aef-event-card {
  margin-top: 0;
}

/* ---------- Responsive ---------- */

@media (max-width: 61.25rem) {
  .aef-next-event {
    grid-template-columns: 1fr;
    gap: 0.75rem;
  }

  .aef-house-hero {
    grid-template-columns: 1fr;
    gap: 0;
  }

  .aef-house-hero__house {
    order: -1;
    width: min(100%, 36rem);
    margin-inline: auto;
  }

  .aef-house-hero__text {
    padding-block: 1.5rem 2.5rem;
  }

  .aef-house-hero__house figcaption {
    position: static;
    margin-top: 0.4rem;
  }

  .aef-split,
  .aef-teasers,
  .aef-page-body,
  .aef-program,
  .aef-project {
    grid-template-columns: 1fr;
  }

  .aef-project:nth-child(even) .aef-project__media {
    order: 0;
  }

  .aef-site-footer__grid {
    grid-template-columns: 1fr;
    gap: 1.5rem;
  }
}

@media (max-width: 40rem) {
  .aef-event-card--image,
  .aef-events--review .aef-event-card--image {
    grid-template-columns: 1fr;
  }

  .aef-event__image {
    max-width: 16rem;
  }

  .aef-events--review .aef-event__image {
    max-width: 11rem;
  }
}

@media (max-width: 34rem) {
  .aef-actions,
  .aef-actions .aef-button-link {
    width: 100%;
  }
}

/* The OFB form brings its own page wrapper; inside a Divi page it follows the page column. */
.et_pb_text_inner .aef-ofb.aef-section {
  padding: 0 0 1rem;
}

.et_pb_text_inner .aef-ofb > .aef-shell {
  width: 100%;
}

/* A small additional picture inside an event text, e.g. a portrait. */
.aef-event__body .aef-program__image {
  max-width: 9rem;
  margin-top: 1rem;
}

/* Landscape photos from a trip need room to be recognisable; portraits stay small. */
.aef-event__body .aef-program__image--wide {
  max-width: 30rem;
  margin-bottom: 1rem;
}

/* Statutes on "Über uns": collapsed full text with the original paragraph numbers as hanging indent. */
.aef-satzung {
  margin: 1rem 0;
}

#main-content .aef-satzung h3 {
  margin: 1.5rem 0 0.5rem;
}

#main-content .aef-satzung ol {
  margin: 0 0 0.75rem;
  padding: 0 !important;
  list-style: none;
}

#main-content .aef-satzung li {
  position: relative;
  margin: 0 0 0.4rem;
  padding-left: 2.6rem;
}

#main-content .aef-satzung .aef-satzung__punkte {
  margin-top: 0.4rem;
}

#main-content .aef-satzung .aef-satzung__punkte li {
  padding-left: 1.8rem;
}

.aef-satzung__nr {
  position: absolute;
  left: 0;
}

#main-content .aef-satzung li p {
  margin: 0.4rem 0 0;
}
