/**
 * Impressum
 *
 * Nur .hitlife-imprint* – gehört ausschliesslich zum Impressum-Widget
 * und teilt sich mit keinem anderen Widget eine Regel.
 *
 * Hier gibt es bewusst kein Aufklappen und keine Reiter: ein Impressum
 * muss leicht erkennbar und unmittelbar erreichbar sein, deshalb steht
 * jede Pflichtangabe sichtbar auf der Seite.
 */

.hitlife-imprint {
    --hitlife-imprint-green-dark: #1d4d36;
    --hitlife-imprint-label: #2a6b4b;
    --hitlife-imprint-text: #3c4a43;
    --hitlife-imprint-bg: #fff;
    --hitlife-imprint-border: #eaf3ee;
    --hitlife-imprint-radius: 14px;
    --hitlife-imprint-accent-bg: #eaf3ee;

    display: block;
    color: var(--hitlife-imprint-text);
}

.hitlife-imprint *,
.hitlife-imprint *::before,
.hitlife-imprint *::after {
    box-sizing: border-box;
}

/* Kopfbereich ------------------------------------------------------------- */

.hitlife-imprint__head {
    margin: 0 0 26px;
}

.hitlife-imprint__heading {
    margin: 0;
    color: var(--hitlife-imprint-green-dark);
    font-size: clamp(1.6rem, 1.2rem + 1.5vw, 2.4rem);
    font-weight: 700;
    line-height: 1.2;
}

.hitlife-imprint__note {
    margin: 8px 0 0;
    font-size: 0.92rem;
    line-height: 1.55;
    opacity: 0.8;
}

/* Blöcke ------------------------------------------------------------------ */

/* Gleiche Hoehen je Reihe. Mit "start" endet jede Kachel auf ihrer
   eigenen Hoehe, die naechste Reihe wartet aber auf die hoechste - unter
   der kuerzeren Kachel klafft dann eine deutlich groessere Luecke als
   unter der hoeheren. So ist jeder senkrechte Abstand genau der
   eingestellte. */
.hitlife-imprint__blocks {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 18px;
    align-items: stretch;
}

.hitlife-imprint__block {
    min-width: 0;
    padding: 20px 22px;
    border: 1px solid var(--hitlife-imprint-border);
    border-radius: var(--hitlife-imprint-radius);
    background-color: var(--hitlife-imprint-bg);
}

/* Ein Block darf sich ueber beide Spalten legen - fuer Angaben, die
   laenger sind als eine Anschrift, etwa eine Berufsordnung. */
.hitlife-imprint__block--wide {
    grid-column: 1 / -1;
}

/* Hervorgehoben: derselbe Aufbau, nur farbig unterlegt. Bewusst kein
   greller Kasten - im Impressum ist alles gleich verbindlich. */
.hitlife-imprint__block--accent {
    border-color: transparent;
    background-color: var(--hitlife-imprint-accent-bg);
}

/* Ohne Rahmen: fuer einen laufenden Text, der keine Kachel braucht.
   Der Innenabstand der Kachel faellt weg, sonst kaeme er zum Abstand des
   Rasters noch obendrauf. Die kleine Zugabe oben ist Absicht: ohne
   Rahmen fehlt die Kante, die sonst den Abschluss markiert, und 18 Pixel
   allein wirken dann zu gedraengt. */
.hitlife-imprint__block--quiet {
    padding: 8px 0 0;
    border-color: transparent;
    background-color: transparent;
}

.hitlife-imprint__label {
    display: flex;
    align-items: center;
    gap: 8px;
    margin: 0 0 10px;
    color: var(--hitlife-imprint-label);
    font-size: 0.76rem;
    font-weight: 700;
    letter-spacing: 0.1em;
    line-height: 1.3;
    text-transform: uppercase;
}

/* Symbol in der Zwischenueberschrift */
.hitlife-imprint__icon {
    display: inline-flex;
    flex: 0 0 auto;
    font-size: 15px;
    line-height: 1;
}

.hitlife-imprint__icon svg {
    display: block;
    width: 1em;
    height: 1em;
    fill: currentColor;
}

/* Anschriften ------------------------------------------------------------- */

/* Das address-Element wird von Browsern kursiv gesetzt. Fuer eine
   Anschrift ist das hier nicht gewollt. */
.hitlife-imprint__address {
    display: flex;
    flex-direction: column;
    gap: 2px;
    margin: 0;
    font-style: normal;
    font-size: 1rem;
    line-height: 1.55;
}

.hitlife-imprint__strong {
    color: var(--hitlife-imprint-green-dark);
    font-weight: 700;
}

.hitlife-imprint__muted {
    font-size: 0.88rem;
    line-height: 1.45;
    opacity: 0.8;
}

/* Listen ------------------------------------------------------------------ */

.hitlife-imprint__list {
    margin: 0;
    padding: 0;
    list-style: none;
}

.hitlife-imprint__list-item {
    display: flex;
    flex-direction: column;
    gap: 1px;
    margin: 0 0 10px;
    line-height: 1.5;
}

.hitlife-imprint__list-item:last-child {
    margin-bottom: 0;
}

/* Einzelne Zeilen --------------------------------------------------------- */

.hitlife-imprint__line {
    margin: 10px 0 0;
    font-size: 1rem;
    line-height: 1.55;
}

.hitlife-imprint__address + .hitlife-imprint__line {
    margin-top: 12px;
}

.hitlife-imprint__key {
    color: var(--hitlife-imprint-green-dark);
    font-weight: 600;
}

.hitlife-imprint__text {
    margin: 0;
    font-size: 0.98rem;
    line-height: 1.65;
}

/* Verweise ---------------------------------------------------------------- */

/* Eine lange Adresse darf die Kachel nicht sprengen */
.hitlife-imprint .hitlife-imprint__link {
    color: var(--hitlife-imprint-label);
    text-decoration: none;
    overflow-wrap: anywhere;
}

.hitlife-imprint .hitlife-imprint__link:hover {
    text-decoration: underline;
}

.hitlife-imprint .hitlife-imprint__link:focus-visible {
    outline: 2px solid var(--hitlife-imprint-label);
    outline-offset: 3px;
    border-radius: 3px;
}

.hitlife-imprint__footnote {
    margin: 24px 0 0;
    font-size: 0.88rem;
    line-height: 1.65;
    opacity: 0.8;
}

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

@media (max-width: 767px) {
    .hitlife-imprint__blocks {
        grid-template-columns: minmax(0, 1fr);
    }

    .hitlife-imprint__block {
        padding: 18px 18px;
    }

    .hitlife-imprint__block--quiet {
        padding: 8px 0 0;
    }

    .hitlife-imprint__head {
        margin-bottom: 20px;
    }
}