/* ===========================
   Kontaktseite
=========================== */

.contact-page {
    background: var(--cream);
}

.contact-hero {
    padding: 120px 0 80px;
    text-align: center;
    background: var(--cream-light);
    border-bottom: 1px solid var(--border);
}

.contact-hero h1 {
    max-width: 900px;
    margin: 20px auto;
    font-size: clamp(42px, 6vw, 68px);
    line-height: 1.15;
    color: var(--primary);
}

.contact-hero p {
    max-width: 720px;
    margin: auto;
    font-size: 22px;
    line-height: 1.7;
    color: var(--accent);
}

.contact-details {
    padding: 90px 0;
}

.contact-details-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 30px;
}

.contact-card {
    background: var(--cream-light);
    border: 1px solid var(--border);
    border-radius: var(--radius);
    padding: 35px;
    box-shadow: var(--shadow-soft);
}

.contact-card h2 {
    color: var(--primary);
    font-size: 28px;
    margin-top: 0;
}

.contact-card p {
    color: var(--accent);
    line-height: 1.7;
    font-size: 19px;
}

.contact-card a {
    color: var(--primary);
    font-weight: 700;
    text-decoration: none;
}

.contact-card a:hover {
    color: var(--accent);
}

.map-placeholder {
    padding: 0 0 120px;
    background: var(--cream);
}

.location-image-box {
    display: grid;
    grid-template-columns: 1.2fr .8fr;
    gap: 50px;
    align-items: center;
    background: var(--cream-light);
    border: 1px solid var(--border);
    border-radius: var(--radius);
    padding: 45px;
    box-shadow: var(--shadow-soft);
}

.location-image {
    border-radius: var(--radius);
    overflow: hidden;
    box-shadow: var(--shadow-soft);
}

.location-image img {
    width: 100%;
    height: 420px;
    object-fit: cover;
    object-position: center;
    display: block;
}

.location-info h2 {
    font-size: clamp(38px, 5vw, 56px);
    color: var(--primary);
    margin: 20px 0 25px;
}

.location-info p {
    font-size: 21px;
    line-height: 1.7;
    color: var(--accent);
    margin-bottom: 35px;
}

@media (max-width: 1100px) {
    .contact-details-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 900px) {
    .location-image-box {
        grid-template-columns: 1fr;
    }

    .location-image img {
        height: 340px;
    }
}

@media (max-width: 650px) {
    .contact-hero {
        padding: 80px 0 60px;
    }

    .contact-details {
        padding: 70px 0;
    }

    .contact-details-grid {
        grid-template-columns: 1fr;
    }

    .contact-card {
        padding: 30px 24px;
    }

    .location-image-box {
        padding: 28px;
    }

    .location-image img {
        height: 260px;
    }

    .location-info p,
    .contact-card p {
        font-size: 19px;
    }
}


/* ===========================
   Kontaktformular
=========================== */

.contact-form-section{
    padding:110px 0;
    background:#FCFAF6;
}

.contact-form-wrap{
    display:grid;
    grid-template-columns:.8fr 1.2fr;
    gap:60px;
    align-items:start;
}

.contact-form-intro h2{
    font-size:clamp(38px, 5vw, 56px);
    color:#3A2415;
    margin:20px 0;
}

.contact-form-intro p{
    font-size:21px;
    line-height:1.7;
    color:#5A3A24;
}

.contact-form-card{
    background:#fff;
    border:1px solid #C9B08C;
    border-radius:24px;
    padding:45px;
    box-shadow:0 20px 45px rgba(0,0,0,.08);
}

.contact-form{
    display:flex;
    flex-direction:column;
    gap:14px;
}

.contact-form label{
    color:#3A2415;
    font-weight:700;
}

.contact-form input,
.contact-form textarea{
    width:100%;
    box-sizing:border-box;
    border:1px solid #C9B08C;
    border-radius:14px;
    padding:15px 16px;
    font-size:18px;
    font-family:inherit;
    background:#FCFAF6;
    color:#2B1C12;
}

.contact-form input:focus,
.contact-form textarea:focus{
    outline:2px solid #8A6241;
    border-color:#8A6241;
}

.privacy-check{
    display:flex;
    gap:12px;
    align-items:flex-start;
    margin:12px 0;
    font-weight:400 !important;
    line-height:1.6;
}

.privacy-check input{
    width:auto;
    margin-top:6px;
}

.privacy-check a{
    color:#3A2415;
    font-weight:700;
}

.form-message{
    padding:16px 20px;
    border-radius:14px;
    margin-bottom:25px;
    font-weight:700;
}

.form-message-success{
    background:#e8f5e9;
    color:#1b5e20;
}

.form-message-error{
    background:#fdecea;
    color:#8a1f11;
}

@media (max-width: 1100px){
    .header-cta{
        display:none;
    }
}

@media (max-width: 900px){
    .contact-form-wrap{
        grid-template-columns:1fr;
    }
}


/* Honeypot-Feld für Spam-Schutz unsichtbar machen */
.form-honeypot{
    display:none !important;
}

/* ===========================
   Cloudflare Turnstile
=========================== */

.turnstile-wrap{
    min-height:65px;
    margin:12px 0 4px;
    display:flex;
    align-items:center;
}

.cf-turnstile{
    max-width:100%;
}

@media (max-width: 420px){
    .turnstile-wrap{
        overflow-x:auto;
    }
}

