/* =========================================================
   LIGONE – Gemeinschaft
   Zusatzstyles nur für gemeinschaft.php
   Die zentrale /css/ligone.css bleibt unverändert.
   ========================================================= */

.community-page{
    background:var(--bg);
    color:var(--ink);
}

.community-page .community-shell{
    width:min(calc(100% - 32px),var(--max));
    margin-inline:auto;
}

/* Header */
.community-page .community-header{
    background:rgba(244,248,242,.93);
    border-bottom:1px solid var(--line);
    backdrop-filter:blur(12px);
}

.community-page .community-header-inner{
    min-height:72px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:24px;
}

.community-page .community-brand{
    display:inline-flex;
    align-items:center;
    gap:11px;
    text-decoration:none;
    font-weight:900;
    letter-spacing:.05em;
}

.community-page .community-brand img{
    width:48px;
    height:auto;
}

.community-page .community-header-share,
.community-page .community-primary{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-height:50px;
    padding:0 20px;
    border:0;
    border-radius:15px;
    background:var(--green);
    color:#fff;
    text-decoration:none;
    font-weight:850;
    cursor:pointer;
    box-shadow:0 10px 22px rgba(34,107,58,.16);
}

.community-page .community-header-share:hover,
.community-page .community-primary:hover{
    background:var(--green-dark);
}

.community-page .community-primary:disabled{
    opacity:.45;
    cursor:not-allowed;
}

/* Hero */
.community-page .community-hero{
    position:relative;
    overflow:hidden;
    text-align:center;
    padding:clamp(70px,9vw,120px) 0 0;
    background:
        radial-gradient(circle at 82% 18%,rgba(201,148,45,.18),transparent 27%),
        radial-gradient(circle at 10% 30%,rgba(34,107,58,.16),transparent 31%),
        linear-gradient(180deg,#fbfdf9 0%,var(--surface-soft) 100%);
}

.community-page .community-hero-bg{
    position:absolute;
    inset:0;
    pointer-events:none;
}

.community-page .community-hero-inner{
    position:relative;
    z-index:1;
}

.community-page .community-kicker{
    margin:0 0 16px;
    color:var(--green);
    font-size:.84rem;
    font-weight:900;
    letter-spacing:.18em;
    text-transform:uppercase;
}

.community-page .community-hero h1{
    max-width:950px;
    margin:0 auto 24px;
    color:var(--ink);
    font-size:clamp(3rem,7vw,6.6rem);
    line-height:.96;
    letter-spacing:-.06em;
}

.community-page .community-intro{
    margin:0 auto 30px;
    color:var(--muted);
    font-size:clamp(1.15rem,2vw,1.4rem);
}

.community-page .community-rating{
    display:flex;
    justify-content:center;
    gap:5px;
    margin:12px 0 22px;
}

.community-page .community-star{
    appearance:none;
    padding:0;
    border:0;
    background:transparent;
    color:#cbd5cc;
    font-size:clamp(2.4rem,5vw,3.5rem);
    line-height:1;
    cursor:pointer;
    transition:transform .15s ease,color .15s ease;
}

.community-page .community-star:hover,
.community-page .community-star:focus-visible,
.community-page .community-star.is-active,
.community-page .community-star.active,
.community-page .community-star.selected{
    color:var(--gold);
    transform:translateY(-2px);
}

.community-page .community-feedback{
    min-height:1.5em;
    margin:10px 0;
    color:var(--muted);
    font-weight:700;
}

.community-page .community-stats{
    max-width:820px;
    margin:54px auto 0;
    display:grid;
    grid-template-columns:repeat(3,1fr);
    overflow:hidden;
    background:var(--surface);
    border:1px solid var(--line);
    border-radius:var(--radius) var(--radius) 0 0;
    box-shadow:var(--shadow);
}

.community-page .community-stats > div{
    padding:24px 18px;
}

.community-page .community-stats > div + div{
    border-left:1px solid var(--line);
}

.community-page .community-stats strong,
.community-page .community-stats span{
    display:block;
}

.community-page .community-stats strong{
    color:var(--green-dark);
    font-size:1.65rem;
}

.community-page .community-stats span{
    margin-top:4px;
    color:var(--muted);
    font-size:.9rem;
}

.community-page .community-together{
    margin:0;
    padding:38px 20px 44px;
    color:var(--muted);
    font-size:1.1rem;
}

.community-page .community-together strong{
    color:var(--green-dark);
    font-size:1.35em;
}

/* Teilen */
.community-page .community-share-strip{
    padding:54px 0;
    background:var(--green-dark);
    color:#fff;
}

.community-page .community-share-strip .community-kicker{
    color:var(--green-light);
}

.community-page .community-share-inner{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:36px;
}

.community-page .community-share-inner h2{
    margin:0 0 8px;
    font-size:clamp(2rem,4vw,3.2rem);
}

.community-page .community-share-inner p:last-child{
    margin:0;
}

.community-page .community-share-buttons{
    display:flex;
    flex-wrap:wrap;
    justify-content:flex-end;
    gap:10px;
}

.community-page .community-share-buttons a,
.community-page .community-share-buttons button{
    min-height:46px;
    padding:0 17px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    border:1px solid rgba(255,255,255,.25);
    border-radius:14px;
    background:rgba(255,255,255,.10);
    color:#fff;
    text-decoration:none;
    font-weight:800;
    cursor:pointer;
}

/* Inhalt */
.community-page .community-content{
    padding-top:72px;
    padding-bottom:82px;
}

.community-page .community-compose,
.community-page .community-suggestion,
.community-page .community-empty{
    background:var(--surface);
    border:1px solid var(--line);
    border-radius:var(--radius);
    box-shadow:var(--shadow);
}

.community-page .community-compose{
    padding:clamp(24px,5vw,48px);
}

.community-page .community-compose h2,
.community-page .community-list-head h2{
    margin:0 0 12px;
    font-size:clamp(2rem,4vw,3rem);
}

.community-page .community-compose > p:not(.community-kicker){
    color:var(--muted);
}

.community-page .community-form{
    margin-top:28px;
}

.community-page .community-form label{
    display:block;
    margin-bottom:18px;
    font-weight:800;
}

.community-page .community-form label > span{
    display:block;
    margin-bottom:7px;
}

.community-page .community-form input,
.community-page .community-form textarea,
.community-page .community-comment-form input,
.community-page .community-comment-form textarea{
    width:100%;
    border:1px solid var(--line);
    border-radius:14px;
    background:#fff;
    color:var(--ink);
    padding:14px 15px;
    outline:none;
}

.community-page .community-form textarea,
.community-page .community-comment-form textarea{
    min-height:140px;
    resize:vertical;
}

.community-page .community-form input:focus,
.community-page .community-form textarea:focus,
.community-page .community-comment-form input:focus,
.community-page .community-comment-form textarea:focus{
    border-color:var(--green);
    box-shadow:0 0 0 3px rgba(34,107,58,.10);
}

.community-page .community-hp{
    position:absolute !important;
    left:-9999px !important;
}

.community-page .community-list-head{
    margin:68px 0 22px;
    display:flex;
    align-items:end;
    justify-content:space-between;
    gap:20px;
}

.community-page .community-list-head > span{
    color:var(--muted);
}

.community-page .community-suggestions{
    display:grid;
    gap:18px;
}

.community-page .community-suggestion,
.community-page .community-empty{
    padding:26px;
}

.community-page .community-suggestion-meta{
    display:flex;
    justify-content:space-between;
    gap:16px;
    color:var(--muted);
    font-size:.9rem;
}

.community-page .community-suggestion-meta strong{
    color:var(--green-dark);
}

.community-page .community-suggestion > p{
    margin:18px 0;
    font-size:1.06rem;
}

.community-page .community-suggestion-actions{
    display:flex;
    flex-wrap:wrap;
    gap:10px;
}

.community-page .community-suggestion-actions button,
.community-page .community-comment-form button{
    min-height:42px;
    padding:0 15px;
    border:1px solid rgba(34,107,58,.20);
    border-radius:13px;
    background:var(--surface-soft);
    color:var(--green-dark);
    font-weight:800;
    cursor:pointer;
}

.community-page .community-comments{
    margin-top:22px;
    padding-top:22px;
    border-top:1px solid var(--line);
}

.community-page .community-comments-list{
    display:grid;
    gap:12px;
    margin-bottom:16px;
}

.community-page .community-comment-form{
    display:grid;
    gap:10px;
}

/* Footer */
.community-page .community-footer{
    padding:44px 0;
    background:#132018;
    color:#dfe9e1;
    text-align:center;
}

.community-page .community-footer p{
    margin:8px 0 0;
}

.community-page .community-footer a{
    color:#fff;
}

/* Mobil */
@media (max-width:760px){
    .community-page .community-shell{
        width:min(calc(100% - 24px),var(--max));
    }

    .community-page .community-header-inner{
        min-height:64px;
    }

    .community-page .community-header-share{
        min-height:42px;
        padding:0 14px;
        font-size:.9rem;
    }

    .community-page .community-brand img{
        width:40px;
    }

    .community-page .community-hero{
        padding-top:58px;
    }

    .community-page .community-hero h1{
        width:100%;
        max-width:100%;
        font-size:clamp(2.65rem,14vw,4.5rem);
        overflow-wrap:normal;
    }

    .community-page .community-stats{
        grid-template-columns:1fr;
        border-radius:22px 22px 0 0;
    }

    .community-page .community-stats > div + div{
        border-left:0;
        border-top:1px solid var(--line);
    }

    .community-page .community-share-inner,
    .community-page .community-list-head{
        align-items:flex-start;
        flex-direction:column;
    }

    .community-page .community-share-buttons{
        justify-content:flex-start;
    }

    .community-page .community-share-buttons > *{
        flex:1 1 calc(50% - 10px);
    }

    .community-page .community-content{
        padding-top:48px;
        padding-bottom:56px;
    }
}

@media (max-width:390px){
    .community-page .community-header-share{
        padding-inline:11px;
        font-size:.82rem;
    }

    .community-page .community-hero h1{
        font-size:2.7rem;
        letter-spacing:-.05em;
    }

    .community-page .community-share-buttons > *{
        flex-basis:100%;
    }
}