/*
 * AG Site System 2.2 – Website V1 content extensions
 * Ergänzt Design System 3.2 nur um V1-spezifische Inhaltsformen.
 */

.ag-result-term,
.ag-text--result-term {
    margin-block-start: var(--ag-space-6);
    font-size: var(--ag-font-h3);
    line-height: 1.2;
    font-weight: 600;
    color: var(--ag-color-accent);
}

.ag-terms-inline,
.ag-text--terms-inline {
    margin-block: var(--ag-space-5);
    font-size: var(--ag-font-body);
    line-height: 1.5;
    font-weight: 600;
    letter-spacing: .01em;
    color: var(--ag-color-heading);
}

/*
 * Gutenberg stores AG Text content as child paragraphs. Astra and other theme
 * styles may assign typography directly to those <p> elements, which wins over
 * values inherited from the semantic wrapper. Apply the semantic typography
 * directly to the child paragraph with higher specificity so frontend and
 * editor remain visually equivalent.
 */
.ag-text.ag-text--result-term > p {
    margin: 0;
    font-size: var(--ag-font-h3);
    line-height: 1.2;
    font-weight: 600;
    color: var(--ag-color-accent);
}

.ag-text.ag-text--terms-inline > p {
    margin: 0;
    font-size: var(--ag-font-body);
    line-height: 1.5;
    font-weight: 600;
    letter-spacing: .01em;
    color: var(--ag-color-heading);
}

.ag-button--pending {
    cursor: default;
    opacity: .78;
}

.ag-project-image {
    margin-block: var(--ag-space-7);
}

.ag-project-image img {
    display: block;
    width: 100%;
    height: auto;
    max-height: 48rem;
    object-fit: contain;
    background: var(--ag-color-bg);
}

.ag-project-image--wide img {
    max-height: none;
}

.ag-project-image figcaption {
    margin-block-start: .75rem;
    max-width: var(--ag-width-content);
    font-size: var(--ag-font-small);
    line-height: 1.5;
    color: var(--ag-color-muted);
}

.ag-archive-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: var(--ag-grid-gap);
    margin-block-start: var(--ag-space-7);
}

.ag-project-card {
    display: block;
    border: 1px solid var(--ag-color-line);
    background: var(--ag-color-bg);
    color: inherit;
    text-decoration: none;
}

.ag-project-card img {
    display: block;
    width: 100%;
    aspect-ratio: 4 / 3;
    object-fit: contain;
    background: var(--ag-color-bg);
    padding: 1rem;
}

.ag-project-card__body {
    padding: 1.5rem;
}

.ag-project-card__body h2 {
    font-size: var(--ag-font-h3);
    line-height: 1.2;
}

.ag-project-card__body p {
    margin-block-start: .75rem;
    font-size: var(--ag-font-body);
    line-height: 1.55;
}

.ag-page-hero .ag-hero-lead {
    max-width: 45rem;
    font-size: var(--ag-font-lead);
    line-height: 1.37;
}

.ag-page-hero__text {
    margin-block-start: var(--ag-space-5);
}

.ag-section-header .ag-subtitle {
    margin-block-start: var(--ag-space-3);
    max-width: 38rem;
    color: var(--ag-color-muted);
}

@media (max-width: 56.25rem) {
    .ag-archive-grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 37.5rem) {
    .ag-project-image {
        margin-block: var(--ag-space-6);
    }

    .ag-project-hero .ag-hero-title {
        font-size: clamp(2.25rem, 9.5vw, 2.75rem);
        hyphens: auto;
        overflow-wrap: break-word;
        word-break: normal;
    }
}

.ag-project-hero-visual {
    margin-block-start: var(--ag-space-7);
}

.ag-project-hero-visual img {
    display: block;
    width: 100%;
    max-height: 42rem;
    object-fit: contain;
    background: var(--ag-color-bg);
}
