/* Hinweisseite für mapatrip.cloud: MapATrip ist nach mapatrip.app umgezogen */
@font-face { font-family: 'Nunito'; font-style: normal; font-display: swap; font-weight: 400; src: url(fonts/nunito-latin-400-normal.woff2) format('woff2'); }
@font-face { font-family: 'Nunito'; font-style: normal; font-display: swap; font-weight: 700; src: url(fonts/nunito-latin-700-normal.woff2) format('woff2'); }
@font-face { font-family: 'Baloo 2'; font-style: normal; font-display: swap; font-weight: 500 800; src: url(fonts/baloo2-latin-wght-normal.woff2) format('woff2'); }

* { box-sizing: border-box; }

html, body { height: 100%; margin: 0; }

body {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 1.5rem 1rem;
    font-family: 'Nunito', system-ui, sans-serif;
    color: #1f2a2e;
    /* Schatzkarte der Startseite: Doppelkachel, wiederholt sich nahtlos */
    background: #f9f5ec url("img/home-karte.webp") center top / 2048px 1024px repeat;
}

.card {
    width: 100%;
    max-width: 30rem;
    padding: 2.5rem 2rem 2rem;
    text-align: center;
    background: rgba(255, 255, 255, 0.94);
    border-radius: 1.5rem;
    box-shadow: 0 1rem 2.5rem rgba(15, 118, 110, 0.18), 0 0.25rem 0.75rem rgba(0, 0, 0, 0.08);
}

.logo { width: 15rem; max-width: 80%; height: auto; }

h1 {
    margin: 1.5rem 0 0.75rem;
    font-family: 'Baloo 2', 'Nunito', sans-serif;
    font-weight: 700;
    font-size: 2rem;
    line-height: 1.15;
    color: #0f766e;
}

p { margin: 0; font-size: 1.1rem; line-height: 1.5; }

.domain {
    margin: 0.25rem 0 1.5rem;
    font-family: 'Baloo 2', 'Nunito', sans-serif;
    font-weight: 700;
    font-size: 1.75rem;
    color: #1f2a2e;
}

.button {
    display: inline-block;
    padding: 0.8rem 1.75rem;
    font-weight: 700;
    font-size: 1.1rem;
    color: #fff;
    text-decoration: none;
    background: #0f766e;
    border-radius: 999px;
    transition: background 0.15s;
}

.button:hover, .button:focus-visible { background: #0b5e58; }

.hint { margin-top: 1.5rem; font-size: 0.95rem; color: #5b6b70; }

@media (max-width: 640px) {
    body { background-size: 1536px 768px; }
    .card { padding: 2rem 1.25rem 1.5rem; }
    h1 { font-size: 1.7rem; }
}