.page-wrap {
    padding-top: calc(64px + clamp(3rem, 6vw, 6rem));
    padding-bottom: clamp(3rem, 6vw, 6rem);
    min-height: calc(100vh - 64px);
}

.apropos-container {
    max-width: 760px;
}

.page-eyebrow {
    font-family: var(--mono);
    font-size: 0.68rem;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--or);
    margin-bottom: 1rem;
}

.page-title {
    font-family: var(--serif);
    font-size: clamp(1.6rem, 3.2vw, 2.4rem);
    font-weight: 300;
    line-height: 1.22;
    color: var(--corps);
    margin-bottom: 1.5rem;
}

.page-intro {
    font-size: 0.92rem;
    color: var(--gris-texte);
    line-height: 1.8;
    margin-bottom: 2.5rem;
}

.apropos-section {
    margin-top: 3rem;
    padding-top: 2rem;
    border-top: 1px solid rgba(44, 44, 44, 0.1);
}

.apropos-section:first-of-type {
    margin-top: 0;
    padding-top: 0;
    border-top: none;
}

.apropos-section-title {
    font-family: var(--serif);
    font-size: 1.3rem;
    font-weight: 400;
    color: var(--corps);
    margin-bottom: 1.75rem;
}

.apropos-qa {
    margin-bottom: 1.75rem;
}

.apropos-qa:last-child {
    margin-bottom: 0;
}

.apropos-question {
    font-family: var(--sans);
    font-size: 1.02rem;
    font-weight: 600;
    color: var(--corps);
    margin-bottom: 0.5rem;
}

.apropos-answer-courte {
    font-size: 0.92rem;
    color: var(--gris-texte);
    line-height: 1.8;
    text-align: justify;
}

.apropos-answer-courte a,
.apropos-answer-longue a {
    color: var(--or);
    text-decoration: underline;
    text-underline-offset: 2px;
    text-decoration-color: rgba(200, 169, 110, 0.4);
}

.apropos-answer-courte a:hover,
.apropos-answer-longue a:hover {
    text-decoration-color: var(--or);
}

.apropos-details {
    margin-top: 0.75rem;
}

.apropos-toggle {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    cursor: pointer;
    list-style: none;
    font-family: var(--mono);
    font-size: 0.72rem;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--or);
    user-select: none;
}

.apropos-toggle::-webkit-details-marker {
    display: none;
}

.apropos-chevron {
    width: 9px;
    height: 6px;
    fill: var(--or);
    transition: transform 0.2s ease;
}

.apropos-details[open] .apropos-chevron {
    transform: rotate(180deg);
}

.apropos-answer-longue {
    font-size: 0.92rem;
    color: var(--gris-texte);
    line-height: 1.8;
    margin-top: 0.85rem;
    text-align: justify;
}

.apropos-answer-longue + .apropos-answer-longue {
    margin-top: 1rem;
}
