/* ============================================================
   Fezz Zeigmal – Frontend Base (mobile-first)
   Bewusst minimal: das individuelle Design liefert jede
   Landingpage über body_html + custom_css selbst.
   ============================================================ */

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

html {
    -webkit-text-size-adjust: 100%;
    text-size-adjust: 100%;
}

body {
    margin: 0;
    min-height: 100dvh;
    display: flex;
    flex-direction: column;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
    font-size: 16px;
    line-height: 1.5;
    color: #1a1a1a;
    background: #fff;
    -webkit-font-smoothing: antialiased;
}

img, video, iframe { max-width: 100%; height: auto; }
img { display: block; }

a { color: inherit; }

/* Landingpage-Container */
.lp {
    flex: 1 0 auto;
    width: 100%;
    max-width: 720px;
    margin: 0 auto;
    padding: 1.25rem 1.25rem 2rem;
}
.lp__form { margin-top: 1.5rem; }

/* Home / 404 */
.home {
    flex: 1 0 auto;
    max-width: 640px;
    margin: 0 auto;
    padding: 3rem 1.5rem;
    text-align: center;
}
.home code { background: #f2f2f2; padding: .1em .4em; border-radius: 4px; }

/* Rechtstexte */
.legal {
    flex: 1 0 auto;
    max-width: 760px;
    margin: 0 auto;
    padding: 2rem 1.25rem 3rem;
}
.legal h1 { font-size: 1.6rem; }

/* Footer */
.site-footer {
    flex-shrink: 0;
    padding: 1.25rem;
    text-align: center;
    font-size: .85rem;
    color: #666;
    border-top: 1px solid #ececec;
}
.site-footer__links a {
    color: #666;
    text-decoration: none;
    padding: .25rem .4rem;
}
.site-footer__links a:hover { text-decoration: underline; }
.site-footer__links span { margin: 0 .25rem; color: #ccc; }

/* ---------- Consent-Banner (mobil-first, unten fixiert) ---------- */
.consent {
    position: fixed;
    left: 0; right: 0; bottom: 0;
    z-index: 9999;
    background: #ffffff;
    border-top: 1px solid #e2e2e2;
    box-shadow: 0 -6px 24px rgba(0,0,0,.08);
    padding: .9rem 1rem calc(.9rem + env(safe-area-inset-bottom));
    display: flex;
    flex-direction: column;
    gap: .7rem;
}
.consent[hidden] { display: none; }
.consent__text {
    margin: 0;
    font-size: .85rem;
    line-height: 1.45;
    color: #333;
}
.consent__link { color: #0a58ca; text-decoration: underline; }
.consent__actions {
    display: flex;
    gap: .6rem;
}
.consent__btn {
    flex: 1;
    padding: .75rem 1rem;
    font-size: .95rem;
    font-weight: 600;
    border-radius: 10px;
    border: 1px solid transparent;
    cursor: pointer;
    min-height: 44px; /* Touch-Target */
}
.consent__btn--reject {
    background: #f4f4f5;
    color: #333;
    border-color: #e2e2e2;
}
.consent__btn--accept {
    background: #111827;
    color: #fff;
}
.consent__btn--accept:active { transform: translateY(1px); }

/* Ab Tablet: Banner kompakter, Buttons neben Text */
@media (min-width: 640px) {
    .consent {
        flex-direction: row;
        align-items: center;
        justify-content: space-between;
        max-width: 960px;
        margin: 0 auto 1rem;
        left: 1rem; right: 1rem;
        border-radius: 14px;
        border: 1px solid #e2e2e2;
    }
    .consent__actions { flex: 0 0 auto; }
    .consent__btn { flex: 0 0 auto; min-width: 130px; }
}
