/* ════════════════════════════════════════════════════════════
   Kacheln: Divi-5-Blurb (blurb() + kacheln() in werkzeuge/divi/divi5.mjs)
   Flaeche, Innenabstand, Radius, Farben und Symbol stehen als Modulwerte
   im Builder. Hier nur, was Divi nicht als Feld hat:
   gleiche Hoehe je Reihe, Symbol im runden Feld, Titel-Schrift, Links.
   ════════════════════════════════════════════════════════════ */

/* Gleiche Hoehe: Spalten strecken sich in der Flex-Reihe, die Kachel
   fuellt ihre Spalte. Ohne das endet jede Flaeche dort, wo ihr Text endet. */
.gh-kacheln{ align-items:stretch !important; }
.gh-kacheln > .et_pb_column{ display:flex !important; flex-direction:column; }
.gh-kacheln > .et_pb_column > .gh-kachel{ flex:1 1 auto; height:100%; margin-bottom:0 !important; }

/* Inhalt linksbuendig, volle Breite (Divi zentriert das Symbol und kappt
   den Inhalt sonst auf 550 px). */
.gh-kachel .et_pb_blurb_content{ max-width:none !important; width:100%; height:100%; display:flex; flex-direction:column; gap:0 !important; align-items:flex-start; text-align:left; }
.gh-kachel .et_pb_blurb_container{ width:100%; padding:0 !important; }

/* Symbol: Logo-Rot in einem runden Feld, gleiche Groesse in jeder Kachel */
.gh-kachel .et_pb_main_blurb_image{ width:auto !important; max-width:none !important; margin:0 0 20px !important; text-align:left; line-height:0; }
/* !important: Divis eigene Regel (.et_pb_blurb .et_pb_image_wrap:not(...){display:block}) ist spezifischer */
.gh-kachel .et_pb_main_blurb_image .et_pb_image_wrap{ display:grid !important; place-items:center; width:56px; height:56px; border-radius:50%; background:rgba(130,0,0,.08); }
.gh-kachel .et_pb_main_blurb_image .et-pb-icon{ font-size:24px !important; line-height:1 !important; width:auto !important; margin:0 !important; color:var(--gh-akzent) !important; }
.gh-kachel .et_pb_main_blurb_image a{ display:inline-block; border-radius:50%; }

/* Titel: Garamond kursiv wie h2/h3 der Seiten. Groesse kommt aus dem Modul. */
.gh-kachel .et_pb_module_header{ font-family:var(--gh-schrift-titel) !important; font-style:italic; font-weight:500 !important; letter-spacing:-0.01em; margin:0 0 12px !important; padding:0 !important; hyphens:manual; }
.gh-kachel .et_pb_module_header a{ color:inherit; text-decoration:none; }
.gh-kachel .et_pb_module_header a:hover{ color:var(--gh-akzent); }

/* Text: keine automatische Trennung, lange Adressen duerfen umbrechen */
.gh-kachel .et_pb_blurb_description{ hyphens:manual; overflow-wrap:break-word; }
.gh-kachel .et_pb_blurb_description p{ margin:0 0 12px; padding:0; }
.gh-kachel .et_pb_blurb_description p:last-child{ margin-bottom:0; }
.gh-kachel .et_pb_blurb_description a{ color:var(--gh-akzent); text-decoration:underline; text-underline-offset:.15em; }
.gh-kachel .et_pb_blurb_description a:hover{ color:var(--gh-akzent-dunkel); }
.gh-kachel .et_pb_blurb_description .ehc-todo{ margin-top:4px !important; }

/* Hover und Fokus: leicht anheben, Schatten im Weinrot des Logos (wie die
   Plakate in style.css). Nur mit Maus, auf Touch bleibt die Kachel ruhig. */
@media (hover:hover) and (pointer:fine){
	.gh-kacheln > .et_pb_column > .gh-kachel{ transition:transform .3s cubic-bezier(.23,1,.32,1), box-shadow .3s cubic-bezier(.23,1,.32,1); }
	.gh-kacheln > .et_pb_column > .gh-kachel:hover,
	.gh-kacheln > .et_pb_column > .gh-kachel:focus-within{ transform:translateY(-4px); box-shadow:0 18px 36px -18px rgba(130,0,0,.35); }
}
@media (prefers-reduced-motion:reduce){
	.gh-kacheln > .et_pb_column > .gh-kachel{ transition:none; }
	.gh-kacheln > .et_pb_column > .gh-kachel:hover,
	.gh-kacheln > .et_pb_column > .gh-kachel:focus-within{ transform:none; }
}

/* Telefon: etwas weniger Innenabstand, damit Titel und E-Mail-Adressen
   in eine Zeile passen */
@media (max-width: 767px){
	.gh-kacheln > .et_pb_column > .gh-kachel{ padding:24px !important; }
	.gh-kachel .et_pb_main_blurb_image .et_pb_image_wrap{ width:48px; height:48px; }
	.gh-kachel .et_pb_main_blurb_image .et-pb-icon{ font-size:21px !important; }
}