/* themes/bootswatch_litera/css/style.css — Litera = reading-first.
   Typographie au premier plan : mesure de lecture généreuse, hiérarchie
   typo soignée, filets fins, rythme de section calme, cartes discrètes.
   Tout repose sur les variables --bs-* du skin Bootswatch Litera. */

:root {
    --bsw-measure: 38rem;          /* mesure de lecture confortable (~70ch) */
    --bsw-measure-wide: 52rem;
    --bsw-rule: rgba(var(--bs-primary-rgb), 0.55);
}

/* ---------- Rythme & ancrage global ---------- */
main > section { scroll-margin-top: 5rem; }

.bsw-section {
    padding: clamp(3.5rem, 8vw, 6rem) 0;
    border-top: 1px solid var(--bs-border-color);
}

/* Centre la matière textuelle des sections partagées sur une mesure lisible */
main .section-title { text-align: center; }
main .section-title p {
    max-width: var(--bsw-measure);
    margin-inline: auto;
    color: var(--bs-secondary-color);
}

/* ---------- Hero éditorial : meta-rail latéral + colonne de lecture ----------
   Asymétrique, calé à gauche. Un filet vertical fin porte les méta en
   petites capitales ; à droite, un très grand titre + un chapô à la mesure
   de lecture et des liens soulignés discrets (pas de boutons pleins). */
.bsw-hero {
    padding: clamp(4.5rem, 12vw, 9rem) 0 clamp(3rem, 7vw, 5rem);
    border-bottom: 1px solid var(--bs-border-color);
}

.bsw-hero__grid {
    display: grid;
    grid-template-columns: minmax(8rem, 12rem) minmax(0, 1fr);
    gap: clamp(1.75rem, 5vw, 4rem);
    align-items: start;
}

/* Meta-rail : filet vertical + petites capitales empilées */
.bsw-hero__rail {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 1rem;
    padding-top: 0.6rem;
}
.bsw-hero__rail-mark {
    width: 2px;
    align-self: stretch;
    min-height: 3.5rem;
    background: var(--bsw-rule);
}
.bsw-hero__meta {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 0.7rem;
}
.bsw-hero__meta li {
    font-size: 0.72rem;
    font-weight: 600;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    line-height: 1.3;
    color: var(--bs-secondary-color);
}

.bsw-hero__body { min-width: 0; }

.bsw-hero__title {
    margin: 0;
    font-size: clamp(2.6rem, 7vw, 4.75rem);
    font-weight: 700;
    line-height: 1.04;
    letter-spacing: -0.02em;
    text-wrap: balance;
    color: var(--bs-body-color);
}

.bsw-hero__lead {
    max-width: var(--bsw-measure);
    margin: 1.5rem 0 0;
    font-size: clamp(1.15rem, 2.4vw, 1.5rem);
    font-weight: 400;
    line-height: 1.55;
    color: var(--bs-secondary-color);
    text-wrap: pretty;
}

.bsw-hero__actions {
    display: flex;
    align-items: baseline;
    flex-wrap: wrap;
    gap: 1rem 2rem;
    margin-top: clamp(2rem, 4vw, 2.75rem);
}

.bsw-hero__link {
    font-weight: 600;
    text-decoration: none;
    color: var(--bs-primary);
    border-bottom: 1px solid rgba(var(--bs-primary-rgb), 0.35);
    transition: border-color 0.15s ease;
}
.bsw-hero__link--lead { color: var(--bs-body-color); border-bottom-color: var(--bs-border-color); }
.bsw-hero__link span { transition: transform 0.15s ease; display: inline-block; }
.bsw-hero__link:hover { border-bottom-color: currentColor; }
.bsw-hero__link:hover span { transform: translateX(0.25rem); }

/* Responsive : le rail passe au-dessus, en bandeau horizontal */
@media (max-width: 767.98px) {
    .bsw-hero__grid { grid-template-columns: 1fr; gap: 1.5rem; }
    .bsw-hero__rail {
        flex-direction: row;
        align-items: center;
        flex-wrap: wrap;
        gap: 0.6rem 1.25rem;
        padding-top: 0;
        padding-left: 0.85rem;
        border-left: 2px solid var(--bsw-rule);
    }
    .bsw-hero__rail-mark { display: none; }
    .bsw-hero__meta { flex-direction: row; flex-wrap: wrap; gap: 0.4rem 1.25rem; }
}

/* ---------- Hiérarchie typographique des sections ---------- */
main h2 {
    font-weight: 700;
    letter-spacing: -0.015em;
    line-height: 1.12;
    text-wrap: balance;
}
main p { text-wrap: pretty; }

/* Filets fins sous les titres de section partagés */
main .section-title h2 {
    display: inline-block;
    padding-bottom: 0.6rem;
    border-bottom: 2px solid var(--bsw-rule);
}

/* ---------- Cartes discrètes (services, etc.) ---------- */
main .card {
    border: 1px solid var(--bs-border-color);
    border-radius: 0;
    background: var(--bs-body-bg);
    transition: border-color 0.2s ease, transform 0.2s ease;
}
main .card:hover {
    border-color: var(--bsw-rule);
    transform: translateY(-2px);
}
main .card .card-title a {
    color: var(--bs-body-color);
    border-bottom: 1px solid transparent;
}
main .card .card-title a:hover {
    color: var(--bs-primary);
    border-bottom-color: currentColor;
}

/* ---------- Contact ---------- */
#contact a[href^="mailto:"] {
    color: var(--bs-primary);
    text-decoration: none;
    border-bottom: 1px solid rgba(var(--bs-primary-rgb), 0.35);
}
#contact a[href^="mailto:"]:hover { border-bottom-color: currentColor; }

/* ---------- Footer ---------- */
.bsw-footer a { text-decoration: none; }
.bsw-footer a:hover { color: var(--bs-primary) !important; }

/* ---------- Accessibilité / responsive ---------- */
@media (prefers-reduced-motion: reduce) {
    .bsw-hero__link span,
    main .card { transition: none; }
    .bsw-hero__link:hover span { transform: none; }
}

@media (max-width: 575.98px) {
    .bsw-hero__actions { gap: 1rem; }
    .bsw-hero__actions .btn { width: 100%; }
}

/* ============================================================
   Phase 3 — overrides bespoke des 4 sections home (style Litera)
   Filets fins, mesure de lecture, espacement généreux, sans cartes.
   ============================================================ */

/* Lien « lire plus / tout voir » — souligné typographique */
.bsw-readmore {
    display: inline-flex;
    align-items: baseline;
    gap: 0.4rem;
    font-weight: 600;
    text-decoration: none;
    color: var(--bs-primary);
    border-bottom: 1px solid transparent;
    transition: border-color 0.15s ease;
}
.bsw-readmore span { transition: transform 0.15s ease; }
.bsw-readmore:hover { color: var(--bs-primary); border-bottom-color: currentColor; }
.bsw-readmore:hover span { transform: translateX(0.25rem); }
.bsw-readmore--strong { font-size: 1.05rem; }

.bsw-section-foot {
    margin-top: clamp(2.5rem, 5vw, 3.5rem);
    padding-top: 1.75rem;
    border-top: 1px solid var(--bs-border-color);
    text-align: center;
}

/* ---------- Projects : liste de notices, filet séparateur ---------- */
.bsw-projects { margin-inline: auto; max-width: var(--bsw-measure-wide); }
.bsw-project {
    display: grid;
    grid-template-columns: minmax(0, 14rem) 1fr;
    gap: clamp(1.25rem, 4vw, 2.5rem);
    padding: clamp(1.75rem, 4vw, 2.5rem) 0;
    border-top: 1px solid var(--bs-border-color);
}
.bsw-project:first-child { border-top: 0; }
.bsw-project__media {
    display: block;
    overflow: hidden;
    border: 1px solid var(--bs-border-color);
}
.bsw-project__media img {
    display: block;
    width: 100%;
    height: 100%;
    min-height: 9rem;
    object-fit: cover;
    transition: transform 0.4s ease;
}
.bsw-project__media:hover img { transform: scale(1.03); }
.bsw-project__body { min-width: 0; }
.bsw-project__meta {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.5rem 0.9rem;
    margin-bottom: 0.4rem;
    font-size: 0.78rem;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}
.bsw-project__cat { color: var(--bs-secondary-color); font-weight: 600; }
.bsw-project__featured { color: var(--bs-primary); font-weight: 700; }
.bsw-project__title {
    margin: 0 0 0.5rem;
    font-size: clamp(1.3rem, 2.5vw, 1.7rem);
    font-weight: 700;
    letter-spacing: -0.015em;
    line-height: 1.2;
}
.bsw-project__title a {
    color: var(--bs-body-color);
    text-decoration: none;
    border-bottom: 1px solid transparent;
}
.bsw-project__title a:hover { color: var(--bs-primary); border-bottom-color: currentColor; }
.bsw-project__desc {
    max-width: var(--bsw-measure);
    margin: 0 0 0.9rem;
    color: var(--bs-secondary-color);
    line-height: 1.6;
}

/* ---------- Team : portraits ronds, notices sobres ---------- */
.bsw-team {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(15rem, 1fr));
    gap: clamp(2rem, 4vw, 3rem) clamp(1.75rem, 4vw, 2.75rem);
    margin-inline: auto;
    max-width: var(--bsw-measure-wide);
}
.bsw-team__member { min-width: 0; }
.bsw-team__photo {
    display: block;
    width: 6rem;
    height: 6rem;
    margin-bottom: 1rem;
    border-radius: 50%;
    object-fit: cover;
    border: 1px solid var(--bs-border-color);
}
.bsw-team__photo--placeholder {
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 2rem;
    color: var(--bs-primary);
    background: rgba(var(--bs-primary-rgb), 0.08);
}
.bsw-team__name {
    margin: 0 0 0.15rem;
    font-size: 1.15rem;
    font-weight: 700;
    letter-spacing: -0.01em;
}
.bsw-team__role {
    margin: 0 0 0.6rem;
    font-size: 0.82rem;
    font-weight: 600;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--bs-primary);
}
.bsw-team__bio {
    margin: 0 0 0.75rem;
    font-size: 0.95rem;
    line-height: 1.6;
    color: var(--bs-secondary-color);
}
.bsw-team__links { display: flex; gap: 0.9rem; font-size: 1.05rem; }
.bsw-team__links a {
    color: var(--bs-secondary-color);
    text-decoration: none;
    transition: color 0.15s ease;
}
.bsw-team__links a:hover { color: var(--bs-primary); }

/* ---------- Testimonials : citations détachées ---------- */
.bsw-quotes {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 22rem), 1fr));
    gap: clamp(2rem, 5vw, 3.5rem);
    margin-inline: auto;
    max-width: var(--bsw-measure-wide);
}
.bsw-quote__fig {
    margin: 0;
    padding-left: 1.5rem;
    border-left: 2px solid var(--bsw-rule);
}
.bsw-quote__text {
    margin: 0 0 1.25rem;
    font-size: clamp(1.1rem, 2.2vw, 1.3rem);
    font-style: italic;
    line-height: 1.55;
    color: var(--bs-body-color);
    text-wrap: pretty;
}
.bsw-quote__text::before { content: "\201C"; }
.bsw-quote__text::after { content: "\201D"; }
.bsw-quote__cite {
    display: flex;
    align-items: center;
    gap: 0.9rem;
}
.bsw-quote__avatar {
    width: 3rem;
    height: 3rem;
    border-radius: 50%;
    object-fit: cover;
    border: 1px solid var(--bs-border-color);
}
.bsw-quote__who { display: flex; flex-direction: column; line-height: 1.3; }
.bsw-quote__name { font-weight: 700; color: var(--bs-body-color); }
.bsw-quote__org {
    font-size: 0.82rem;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--bs-secondary-color);
}

/* ---------- FAQ : accordéon dépouillé, filets fins ---------- */
.bsw-faq { --bs-accordion-border-width: 0; }
.bsw-faq__item {
    background: transparent;
    border: 0;
    border-bottom: 1px solid var(--bs-border-color);
}
.bsw-faq__item:first-child { border-top: 1px solid var(--bs-border-color); }
.bsw-faq__btn {
    padding: 1.25rem 0.25rem;
    font-size: clamp(1.05rem, 2vw, 1.2rem);
    font-weight: 600;
    color: var(--bs-body-color);
    background: transparent;
    box-shadow: none;
}
.bsw-faq__btn:not(.collapsed) {
    color: var(--bs-primary);
    background: transparent;
    box-shadow: none;
}
.bsw-faq__btn:focus { box-shadow: 0 0 0 0.2rem rgba(var(--bs-primary-rgb), 0.25); }
.bsw-faq__body {
    max-width: var(--bsw-measure);
    padding: 0 0.25rem 1.5rem;
    color: var(--bs-secondary-color);
    line-height: 1.65;
}

/* ---------- Responsive ---------- */
@media (max-width: 575.98px) {
    .bsw-project { grid-template-columns: 1fr; }
    .bsw-project__media img { min-height: 12rem; }
}

@media (prefers-reduced-motion: reduce) {
    .bsw-readmore span,
    .bsw-project__media img { transition: none; }
    .bsw-readmore:hover span { transform: none; }
    .bsw-project__media:hover img { transform: none; }
}

/* ============================================================
   Phase 5 — overrides bespoke : about, skills, stats, resume,
   services. Style Litera : filets fins, mesure de lecture,
   pas de cartes, hiérarchie typographique calme.
   ============================================================ */

/* ---------- About : portrait + corps de texte sur une mesure ---------- */
.bsw-about {
    display: grid;
    grid-template-columns: minmax(0, 18rem) 1fr;
    gap: clamp(1.75rem, 5vw, 3.5rem);
    align-items: start;
    margin-inline: auto;
    max-width: var(--bsw-measure-wide);
}
.bsw-about:not(:has(.bsw-about__media)) { grid-template-columns: 1fr; }
.bsw-about__media {
    border: 1px solid var(--bs-border-color);
    overflow: hidden;
}
.bsw-about__media img {
    display: block;
    width: 100%;
    height: auto;
    object-fit: cover;
}
.bsw-about__body { min-width: 0; }
.bsw-about__title {
    margin: 0 0 1rem;
    font-size: clamp(1.5rem, 3vw, 2rem);
    font-weight: 700;
    letter-spacing: -0.015em;
    line-height: 1.15;
}
.bsw-about__lead {
    max-width: var(--bsw-measure);
    font-size: 1.1rem;
    line-height: 1.7;
    color: var(--bs-secondary-color);
}
.bsw-about__lead :last-child { margin-bottom: 0; }
.bsw-about__facts {
    margin: 1.75rem 0 0;
    padding-top: 1.5rem;
    border-top: 1px solid var(--bs-border-color);
}
.bsw-about__fact {
    display: grid;
    grid-template-columns: minmax(7rem, 10rem) 1fr;
    gap: 0.5rem 1.25rem;
    padding: 0.55rem 0;
    border-bottom: 1px solid var(--bs-border-color);
}
.bsw-about__fact:last-child { border-bottom: 0; }
.bsw-about__fact dt {
    margin: 0;
    font-size: 0.78rem;
    font-weight: 600;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--bs-primary);
}
.bsw-about__fact dd {
    margin: 0;
    color: var(--bs-body-color);
}
.bsw-about__fact dd a {
    color: var(--bs-primary);
    text-decoration: none;
    border-bottom: 1px solid rgba(var(--bs-primary-rgb), 0.35);
}
.bsw-about__fact dd a:hover { border-bottom-color: currentColor; }

/* ---------- Skills : lignes typographiques + jauge fine ---------- */
.bsw-skills {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(min(100%, 22rem), 1fr));
    gap: clamp(1.5rem, 4vw, 2.5rem) clamp(2rem, 5vw, 3.5rem);
    margin-inline: auto;
    max-width: var(--bsw-measure-wide);
}
.bsw-skill { min-width: 0; }
.bsw-skill__head {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 0.75rem;
    padding-bottom: 0.55rem;
    border-bottom: 1px solid var(--bs-border-color);
}
.bsw-skill__name {
    margin: 0;
    font-size: 1.05rem;
    font-weight: 600;
    letter-spacing: -0.005em;
}
.bsw-skill__name i { color: var(--bs-primary); margin-right: 0.4rem; }
.bsw-skill__pct {
    font-size: 0.85rem;
    font-variant-numeric: tabular-nums;
    color: var(--bs-secondary-color);
}
.bsw-skill__track {
    margin-top: 0.6rem;
    height: 3px;
    background: var(--bs-border-color);
}
.bsw-skill__fill {
    display: block;
    height: 100%;
    background: var(--bs-primary);
}

/* ---------- Stats : chiffres en grand, filets séparateurs ---------- */
.bsw-stats {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 11rem), 1fr));
    gap: clamp(1.5rem, 4vw, 2.5rem);
    margin: 0;
    margin-inline: auto;
    max-width: var(--bsw-measure-wide);
    text-align: center;
}
.bsw-stat {
    padding: 0.5rem clamp(0.5rem, 2vw, 1.5rem);
    border-left: 1px solid var(--bs-border-color);
}
.bsw-stat:first-child { border-left: 0; }
.bsw-stat__value {
    margin: 0 0 0.35rem;
    font-size: clamp(2.4rem, 6vw, 3.5rem);
    font-weight: 700;
    line-height: 1;
    letter-spacing: -0.02em;
    color: var(--bs-primary);
}
.bsw-stat__value i {
    display: block;
    margin-bottom: 0.5rem;
    font-size: 1.6rem;
}
.bsw-stat__unit { font-size: 0.5em; font-weight: 600; }
.bsw-stat__label {
    margin: 0;
    font-size: 0.85rem;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--bs-secondary-color);
}

/* ---------- Resume : deux colonnes, frises verticales ---------- */
.bsw-resume {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 22rem), 1fr));
    gap: clamp(2.5rem, 5vw, 4rem);
    margin-inline: auto;
    max-width: var(--bsw-measure-wide);
}
.bsw-resume__col { min-width: 0; }
.bsw-resume__head {
    margin: 0 0 1.5rem;
    padding-bottom: 0.55rem;
    font-size: 0.85rem;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--bs-primary);
    border-bottom: 2px solid var(--bsw-rule);
}
.bsw-timeline {
    padding-left: 1.5rem;
    border-left: 1px solid var(--bs-border-color);
}
.bsw-timeline__item { position: relative; padding-bottom: 1.75rem; }
.bsw-timeline__item:last-child { padding-bottom: 0; }
.bsw-timeline__item::before {
    content: "";
    position: absolute;
    top: 0.45rem;
    left: calc(-1.5rem - 4px);
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: var(--bs-primary);
}
.bsw-timeline__title {
    margin: 0 0 0.2rem;
    font-size: 1.1rem;
    font-weight: 600;
    letter-spacing: -0.005em;
}
.bsw-timeline__meta {
    margin: 0 0 0.5rem;
    font-size: 0.82rem;
    color: var(--bs-secondary-color);
}
.bsw-timeline__sep { margin: 0 0.4rem; }
.bsw-timeline__desc {
    margin: 0;
    max-width: var(--bsw-measure);
    font-size: 0.95rem;
    line-height: 1.6;
    color: var(--bs-secondary-color);
}

/* ---------- Services : notices alignées, filets séparateurs ---------- */
.bsw-services {
    margin-inline: auto;
    max-width: var(--bsw-measure-wide);
}
.bsw-service {
    display: grid;
    grid-template-columns: auto 1fr;
    gap: clamp(1rem, 3vw, 1.75rem);
    padding: clamp(1.5rem, 4vw, 2.25rem) 0;
    border-top: 1px solid var(--bs-border-color);
}
.bsw-service:first-child { border-top: 0; }
.bsw-service:not(:has(.bsw-service__icon)) { grid-template-columns: 1fr; }
.bsw-service__icon {
    font-size: 1.75rem;
    line-height: 1;
    color: var(--bs-primary);
}
.bsw-service__body { min-width: 0; }
.bsw-service__title {
    margin: 0 0 0.5rem;
    font-size: clamp(1.25rem, 2.5vw, 1.6rem);
    font-weight: 700;
    letter-spacing: -0.015em;
    line-height: 1.2;
}
.bsw-service__title a {
    color: var(--bs-body-color);
    text-decoration: none;
    border-bottom: 1px solid transparent;
}
.bsw-service__title a:hover { color: var(--bs-primary); border-bottom-color: currentColor; }
.bsw-service__desc {
    max-width: var(--bsw-measure);
    margin: 0 0 0.9rem;
    color: var(--bs-secondary-color);
    line-height: 1.6;
}

/* ---------- Responsive Phase 5 ---------- */
@media (max-width: 575.98px) {
    .bsw-about { grid-template-columns: 1fr; }
    .bsw-about__fact { grid-template-columns: 1fr; gap: 0.15rem; }
    .bsw-stat { border-left: 0; }
    .bsw-service { grid-template-columns: 1fr; }
    .bsw-service__icon { font-size: 1.5rem; }
}

/* ============================================================
   Phase 5 (list sections) — overrides bespoke : publications,
   events, resources, blog. Style Litera : filets fins, mesure
   de lecture, pas de cartes, hiérarchie typographique calme.
   ============================================================ */

/* ---------- Publications : notices façon bibliographie ---------- */
.bsw-pubs { margin-inline: auto; max-width: var(--bsw-measure-wide); }
.bsw-pub {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: start;
    gap: 0.75rem 1.75rem;
    padding: clamp(1.25rem, 3vw, 1.75rem) 0;
    border-top: 1px solid var(--bs-border-color);
}
.bsw-pub:first-child { border-top: 0; }
.bsw-pub__body { min-width: 0; }
.bsw-pub__title {
    margin: 0 0 0.4rem;
    font-size: clamp(1.1rem, 2vw, 1.3rem);
    font-weight: 700;
    letter-spacing: -0.01em;
    line-height: 1.3;
}
.bsw-pub__title a {
    color: var(--bs-body-color);
    text-decoration: none;
    border-bottom: 1px solid transparent;
}
.bsw-pub__title a:hover { color: var(--bs-primary); border-bottom-color: currentColor; }
.bsw-pub__featured {
    display: inline-block;
    margin-left: 0.5rem;
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--bs-primary);
    vertical-align: middle;
}
.bsw-pub__meta {
    margin: 0 0 0.5rem;
    font-size: 0.92rem;
    color: var(--bs-secondary-color);
    line-height: 1.5;
}
.bsw-pub__authors { font-weight: 600; color: var(--bs-body-color); }
.bsw-pub__sep { margin: 0 0.4rem; opacity: 0.6; }
.bsw-pub__cat {
    font-size: 0.78rem;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}
.bsw-pub__abstract {
    max-width: var(--bsw-measure);
    margin: 0;
    font-size: 0.95rem;
    line-height: 1.6;
    color: var(--bs-secondary-color);
}
.bsw-pub__ext {
    flex-shrink: 0;
    font-weight: 600;
    font-size: 0.9rem;
    white-space: nowrap;
    text-decoration: none;
    color: var(--bs-primary);
    border-bottom: 1px solid transparent;
    transition: border-color 0.15s ease;
}
.bsw-pub__ext:hover { color: var(--bs-primary); border-bottom-color: currentColor; }

/* ---------- Events : date détachée + notice ---------- */
.bsw-events { margin-inline: auto; max-width: var(--bsw-measure-wide); }
.bsw-event {
    display: grid;
    grid-template-columns: minmax(0, 6rem) 1fr;
    gap: clamp(1.25rem, 4vw, 2.5rem);
    padding: clamp(1.5rem, 4vw, 2.25rem) 0;
    border-top: 1px solid var(--bs-border-color);
}
.bsw-event:first-child { border-top: 0; }
.bsw-event__date {
    display: flex;
    flex-direction: column;
    padding-right: 1.25rem;
    border-right: 2px solid var(--bsw-rule);
    line-height: 1.1;
}
.bsw-event__day {
    font-size: clamp(2rem, 5vw, 2.75rem);
    font-weight: 700;
    letter-spacing: -0.02em;
    color: var(--bs-primary);
}
.bsw-event__mon {
    margin-top: 0.2rem;
    font-size: 0.78rem;
    font-weight: 600;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--bs-secondary-color);
}
.bsw-event__time {
    margin-top: 0.35rem;
    font-size: 0.82rem;
    font-variant-numeric: tabular-nums;
    color: var(--bs-secondary-color);
}
.bsw-event__body { min-width: 0; }
.bsw-event__title {
    margin: 0 0 0.4rem;
    font-size: clamp(1.25rem, 2.5vw, 1.6rem);
    font-weight: 700;
    letter-spacing: -0.015em;
    line-height: 1.2;
    color: var(--bs-body-color);
}
.bsw-event__loc {
    margin: 0 0 0.5rem;
    font-size: 0.88rem;
    color: var(--bs-secondary-color);
}
.bsw-event__loc i { color: var(--bs-primary); }
.bsw-event__desc {
    max-width: var(--bsw-measure);
    margin: 0 0 0.9rem;
    color: var(--bs-secondary-color);
    line-height: 1.6;
}

/* ---------- Resources : notices alignées, métadonnées sobres ---------- */
.bsw-resources { margin-inline: auto; max-width: var(--bsw-measure-wide); }
.bsw-resource {
    padding: clamp(1.5rem, 4vw, 2.25rem) 0;
    border-top: 1px solid var(--bs-border-color);
}
.bsw-resource:first-child { border-top: 0; }
.bsw-resource__body { min-width: 0; }
.bsw-resource__meta {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.5rem 1rem;
    margin-bottom: 0.5rem;
    font-size: 0.78rem;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}
.bsw-resource__type { color: var(--bs-primary); font-weight: 700; }
.bsw-resource__size { color: var(--bs-secondary-color); font-weight: 600; }
.bsw-resource__title {
    margin: 0 0 0.5rem;
    font-size: clamp(1.25rem, 2.5vw, 1.6rem);
    font-weight: 700;
    letter-spacing: -0.015em;
    line-height: 1.2;
    color: var(--bs-body-color);
}
.bsw-resource__desc {
    max-width: var(--bsw-measure);
    margin: 0 0 0.9rem;
    color: var(--bs-secondary-color);
    line-height: 1.6;
}

/* ---------- Blog : notices avec vignette latérale ---------- */
.bsw-posts { margin-inline: auto; max-width: var(--bsw-measure-wide); }
.bsw-posts > li {
    padding: clamp(1.75rem, 4vw, 2.5rem) 0;
    border-top: 1px solid var(--bs-border-color);
}
.bsw-posts > li:first-child { border-top: 0; }
.bsw-post {
    display: grid;
    grid-template-columns: minmax(0, 14rem) 1fr;
    gap: clamp(1.25rem, 4vw, 2.5rem);
    align-items: start;
}
.bsw-post:not(:has(.bsw-post__media)) { grid-template-columns: 1fr; }
.bsw-post__media {
    display: block;
    overflow: hidden;
    border: 1px solid var(--bs-border-color);
}
.bsw-post__media img {
    display: block;
    width: 100%;
    height: 100%;
    min-height: 9rem;
    object-fit: cover;
    transition: transform 0.4s ease;
}
.bsw-post__media:hover img { transform: scale(1.03); }
.bsw-post__body { min-width: 0; }
.bsw-post__meta {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.5rem 0.9rem;
    margin-bottom: 0.5rem;
    font-size: 0.78rem;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--bs-secondary-color);
}
.bsw-post__featured { color: var(--bs-primary); font-weight: 700; }
.bsw-post__cat { font-weight: 600; }
.bsw-post__cat i { color: var(--bs-primary); }
.bsw-post__date { font-variant-numeric: tabular-nums; }
.bsw-post__title {
    margin: 0 0 0.5rem;
    font-size: clamp(1.3rem, 2.5vw, 1.7rem);
    font-weight: 700;
    letter-spacing: -0.015em;
    line-height: 1.2;
}
.bsw-post__title a {
    color: var(--bs-body-color);
    text-decoration: none;
    border-bottom: 1px solid transparent;
}
.bsw-post__title a:hover { color: var(--bs-primary); border-bottom-color: currentColor; }
.bsw-post__desc {
    max-width: var(--bsw-measure);
    margin: 0 0 0.9rem;
    color: var(--bs-secondary-color);
    line-height: 1.6;
}

/* ---------- Responsive Phase 5 (list sections) ---------- */
@media (max-width: 575.98px) {
    .bsw-pub { grid-template-columns: 1fr; }
    .bsw-event { grid-template-columns: 1fr; }
    .bsw-event__date {
        flex-direction: row;
        align-items: baseline;
        gap: 0.5rem;
        padding-right: 0;
        padding-bottom: 0.75rem;
        border-right: 0;
        border-bottom: 2px solid var(--bsw-rule);
    }
    .bsw-event__day { font-size: 1.75rem; }
    .bsw-post { grid-template-columns: 1fr; }
    .bsw-post__media img { min-height: 12rem; }
}

@media (prefers-reduced-motion: reduce) {
    .bsw-post__media img { transition: none; }
    .bsw-post__media:hover img { transform: none; }
}

/* ============================================================
   Phase 6 — pages bespoke Litera : blog_list, blog_detail,
   project_list, project_detail. Reading-first : filets fins,
   mesure de lecture généreuse, pas de cartes pleines.
   ============================================================ */

/* ---------- Filtres de catégorie : onglets typographiques ---------- */
.bsw-filters {
    display: flex;
    flex-wrap: wrap;
    gap: 0.4rem 1.4rem;
    margin-inline: auto;
    max-width: var(--bsw-measure-wide);
    margin-bottom: clamp(1.5rem, 4vw, 2.5rem);
    padding-bottom: 0.85rem;
    border-bottom: 1px solid var(--bs-border-color);
}
.bsw-filter {
    font-size: 0.82rem;
    font-weight: 600;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    text-decoration: none;
    color: var(--bs-secondary-color);
    padding-bottom: 0.2rem;
    border-bottom: 2px solid transparent;
    transition: color 0.15s ease, border-color 0.15s ease;
}
.bsw-filter:hover { color: var(--bs-primary); }
.bsw-filter.is-active {
    color: var(--bs-primary);
    border-bottom-color: var(--bsw-rule);
}

/* ---------- État vide ---------- */
.bsw-empty {
    margin-inline: auto;
    max-width: var(--bsw-measure);
    padding: clamp(2.5rem, 6vw, 4rem) 0;
    text-align: center;
    color: var(--bs-secondary-color);
}
.bsw-empty p { margin: 0; }

/* ---------- Pagination : repères discrets ---------- */
.bsw-pager {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 1rem;
    margin-inline: auto;
    max-width: var(--bsw-measure-wide);
    margin-top: clamp(2.5rem, 5vw, 3.5rem);
    padding-top: 1.5rem;
    border-top: 1px solid var(--bs-border-color);
}
.bsw-pager__edge {
    font-weight: 600;
    text-decoration: none;
    color: var(--bs-primary);
    border-bottom: 1px solid transparent;
    transition: border-color 0.15s ease;
}
.bsw-pager__edge:hover { border-bottom-color: currentColor; }
.bsw-pager__edge.is-disabled {
    color: var(--bs-secondary-color);
    opacity: 0.45;
    pointer-events: none;
}
.bsw-pager__nums {
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem;
    margin: 0;
    padding: 0;
    list-style: none;
}
.bsw-pager__num {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 2.1rem;
    padding: 0.25rem 0.5rem;
    font-variant-numeric: tabular-nums;
    text-decoration: none;
    color: var(--bs-secondary-color);
    border-bottom: 2px solid transparent;
    transition: color 0.15s ease, border-color 0.15s ease;
}
.bsw-pager__num:hover { color: var(--bs-primary); }
.bsw-pager__num.is-current {
    color: var(--bs-primary);
    font-weight: 700;
    border-bottom-color: var(--bsw-rule);
}

/* ---------- Fil d'Ariane ---------- */
.bsw-crumbs {
    margin-inline: auto;
    max-width: var(--bsw-measure-wide);
    margin-bottom: clamp(1.5rem, 4vw, 2.25rem);
}
.bsw-crumbs ol {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.35rem 0.5rem;
    margin: 0;
    padding: 0;
    list-style: none;
    font-size: 0.8rem;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--bs-secondary-color);
}
.bsw-crumbs li + li::before {
    content: "/";
    margin-right: 0.5rem;
    opacity: 0.5;
}
.bsw-crumbs a {
    color: var(--bs-secondary-color);
    text-decoration: none;
    border-bottom: 1px solid transparent;
    transition: color 0.15s ease, border-color 0.15s ease;
}
.bsw-crumbs a:hover { color: var(--bs-primary); border-bottom-color: currentColor; }
.bsw-crumbs li[aria-current] { color: var(--bs-body-color); }

/* ---------- En-tête d'article long format ---------- */
.bsw-article {
    margin-inline: auto;
    max-width: var(--bsw-measure-wide);
}
.bsw-article__head { margin-bottom: clamp(1.75rem, 4vw, 2.5rem); }
.bsw-article__kicker {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.5rem 1rem;
    margin-bottom: 0.9rem;
    font-size: 0.78rem;
    font-weight: 600;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}
.bsw-article__cat { color: var(--bs-secondary-color); }
.bsw-article__featured,
.bsw-article__status { color: var(--bs-primary); }
.bsw-article__title {
    margin: 0;
    font-size: clamp(2.1rem, 5.5vw, 3.5rem);
    font-weight: 700;
    line-height: 1.08;
    letter-spacing: -0.02em;
    text-wrap: balance;
    color: var(--bs-body-color);
    max-width: var(--bsw-measure-wide);
}
.bsw-article__byline {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem 1.5rem;
    margin: 1.25rem 0 0;
    padding: 0;
    list-style: none;
    font-size: 0.88rem;
    color: var(--bs-secondary-color);
}
.bsw-article__byline i { color: var(--bs-primary); margin-right: 0.15rem; }

.bsw-article__hero {
    margin: 0 0 clamp(2rem, 5vw, 3rem);
    border: 1px solid var(--bs-border-color);
    overflow: hidden;
}
.bsw-article__hero img { display: block; width: 100%; height: auto; }

/* ---------- Corps de lecture (prose) — mesure ~70ch ---------- */
.bsw-prose {
    max-width: var(--bsw-measure);
    font-size: 1.125rem;
    line-height: 1.75;
    color: var(--bs-body-color);
}
.bsw-prose__lead {
    margin: 0 0 1.75rem;
    font-size: clamp(1.25rem, 2.4vw, 1.5rem);
    line-height: 1.55;
    font-weight: 400;
    color: var(--bs-secondary-color);
    text-wrap: pretty;
}
.bsw-prose > * + * { margin-top: 1.35rem; }
.bsw-prose p { text-wrap: pretty; }
.bsw-prose h2,
.bsw-prose h3,
.bsw-prose__h {
    margin: 2.5rem 0 0.85rem;
    font-weight: 700;
    line-height: 1.2;
    letter-spacing: -0.015em;
    color: var(--bs-body-color);
}
.bsw-prose__h {
    display: flex;
    align-items: baseline;
    gap: 0.5rem;
    font-size: clamp(1.35rem, 2.6vw, 1.7rem);
    padding-bottom: 0.5rem;
    border-bottom: 1px solid var(--bs-border-color);
}
.bsw-prose__h i { color: var(--bs-primary); font-size: 0.85em; }
.bsw-prose h2 { font-size: clamp(1.4rem, 2.8vw, 1.85rem); }
.bsw-prose h3 { font-size: clamp(1.2rem, 2.2vw, 1.45rem); }
.bsw-prose a {
    color: var(--bs-primary);
    text-decoration: none;
    border-bottom: 1px solid rgba(var(--bs-primary-rgb), 0.35);
}
.bsw-prose a:hover { border-bottom-color: currentColor; }
.bsw-prose ul,
.bsw-prose ol { padding-left: 1.4rem; }
.bsw-prose li + li { margin-top: 0.5rem; }
.bsw-prose img { max-width: 100%; height: auto; border: 1px solid var(--bs-border-color); }
.bsw-prose blockquote {
    margin: 1.75rem 0;
    padding-left: 1.5rem;
    border-left: 2px solid var(--bsw-rule);
    font-style: italic;
    color: var(--bs-body-color);
}
.bsw-prose pre,
.bsw-prose code {
    font-size: 0.92em;
    background: rgba(var(--bs-primary-rgb), 0.06);
}
.bsw-prose pre { padding: 1rem 1.25rem; overflow-x: auto; }
.bsw-prose hr { margin: 2.5rem 0; border: 0; border-top: 1px solid var(--bs-border-color); }

/* ---------- Tags d'article + pied ---------- */
.bsw-article__tags,
.bsw-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
}
.bsw-article__tags { margin-top: clamp(2rem, 4vw, 2.75rem); }
.bsw-tag {
    display: inline-block;
    padding: 0.25rem 0.7rem;
    font-size: 0.82rem;
    font-weight: 600;
    text-decoration: none;
    color: var(--bs-secondary-color);
    background: transparent;
    border: 1px solid var(--bs-border-color);
    transition: color 0.15s ease, border-color 0.15s ease;
}
a.bsw-tag:hover { color: var(--bs-primary); border-color: var(--bsw-rule); }
.bsw-article__foot {
    margin-top: clamp(2.5rem, 5vw, 3.5rem);
    padding-top: 1.75rem;
    border-top: 1px solid var(--bs-border-color);
}
.bsw-readmore--back span { transition: transform 0.15s ease; }
.bsw-readmore--back:hover span { transform: translateX(-0.25rem); }

/* ---------- Project detail : grille lecture + colonne info ---------- */
.bsw-detail {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 17rem);
    gap: clamp(2rem, 5vw, 4rem);
    align-items: start;
}
.bsw-detail__main { min-width: 0; }
.bsw-detail__aside {
    min-width: 0;
    position: sticky;
    top: 5.5rem;
}

.bsw-meta-block {
    padding-bottom: 1.5rem;
    margin-bottom: 1.5rem;
    border-bottom: 1px solid var(--bs-border-color);
}
.bsw-meta-block:last-child { border-bottom: 0; margin-bottom: 0; padding-bottom: 0; }
.bsw-meta-block__head {
    margin: 0 0 1rem;
    font-size: 0.78rem;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--bs-primary);
}
.bsw-meta-list { margin: 0; }
.bsw-meta-list__row {
    display: grid;
    grid-template-columns: minmax(5rem, 7rem) 1fr;
    gap: 0.4rem 0.85rem;
    padding: 0.5rem 0;
    border-top: 1px solid var(--bs-border-color);
}
.bsw-meta-list__row:first-child { border-top: 0; padding-top: 0; }
.bsw-meta-list dt {
    margin: 0;
    font-size: 0.74rem;
    font-weight: 600;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--bs-secondary-color);
}
.bsw-meta-list dd { margin: 0; font-size: 0.95rem; color: var(--bs-body-color); }

.bsw-links { display: flex; flex-direction: column; gap: 0.75rem; }

/* ---------- Project detail : métriques (réutilise .bsw-stat) ---------- */
.bsw-stats--detail { text-align: left; max-width: none; margin: 0; }
.bsw-stats--detail .bsw-stat {
    padding: 1rem 0;
    border-left: 0;
    border-top: 1px solid var(--bs-border-color);
}
.bsw-stats--detail .bsw-stat__value { font-size: clamp(1.8rem, 4vw, 2.5rem); }
.bsw-stats--detail .bsw-stat__label { letter-spacing: 0.06em; }
.bsw-stat__note {
    margin: 0.4rem 0 0;
    font-size: 0.88rem;
    line-height: 1.5;
    color: var(--bs-secondary-color);
}

/* ---------- Timeline en contexte detail ---------- */
.bsw-timeline--detail { margin: 1.5rem 0 0; max-width: var(--bsw-measure); }

/* ---------- Gallery ---------- */
.bsw-gallery {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 16rem), 1fr));
    gap: clamp(1rem, 3vw, 1.75rem);
    margin-top: 1.5rem;
}
.bsw-gallery__fig { margin: 0; }
.bsw-gallery__fig img {
    display: block;
    width: 100%;
    height: auto;
    border: 1px solid var(--bs-border-color);
}
.bsw-gallery__cap {
    margin-top: 0.5rem;
    font-size: 0.85rem;
    color: var(--bs-secondary-color);
}

/* ---------- Related projects ---------- */
.bsw-related {
    margin-top: clamp(3rem, 6vw, 4.5rem);
    padding-top: clamp(2rem, 4vw, 2.75rem);
    border-top: 1px solid var(--bs-border-color);
}
.bsw-related__head {
    margin: 0 0 1.5rem;
    font-size: clamp(1.4rem, 3vw, 1.9rem);
    font-weight: 700;
    letter-spacing: -0.015em;
}

/* ---------- Responsive Phase 6 ---------- */
@media (max-width: 991.98px) {
    .bsw-detail { grid-template-columns: 1fr; }
    .bsw-detail__aside {
        position: static;
        padding-top: 1.75rem;
        border-top: 1px solid var(--bs-border-color);
    }
}
@media (max-width: 575.98px) {
    .bsw-pager { justify-content: center; }
    .bsw-meta-list__row { grid-template-columns: 1fr; gap: 0.15rem; }
}
@media (prefers-reduced-motion: reduce) {
    .bsw-readmore--back span { transition: none; }
    .bsw-readmore--back:hover span { transform: none; }
}

/* ============================================================
   Phase 7 — pages restantes Litera : services, team, events,
   jobs, publications, resources, faq. Reading-first : filets
   fins, mesure de lecture, pas de cartes pleines.
   ============================================================ */

/* ---------- Service detail : « ce qui est inclus » ---------- */
.bsw-included { margin: 1.5rem 0 0; max-width: var(--bsw-measure); }
.bsw-included__item {
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 0.25rem 1rem;
    padding: 0.85rem 0;
    border-top: 1px solid var(--bs-border-color);
}
.bsw-included__item:first-child { border-top: 0; }
.bsw-included__item:not(:has(.bsw-included__icon)) { grid-template-columns: 1fr; }
.bsw-included__icon { color: var(--bs-primary); font-size: 1.1rem; line-height: 1.5; }
.bsw-included__title { display: block; font-weight: 600; color: var(--bs-body-color); }
.bsw-included__desc {
    margin: 0.2rem 0 0;
    font-size: 0.95rem;
    line-height: 1.55;
    color: var(--bs-secondary-color);
}

/* ---------- Formulaire de contact (aside) — champs dépouillés ---------- */
.bsw-form__intro {
    margin: 0 0 1rem;
    font-size: 0.92rem;
    line-height: 1.55;
    color: var(--bs-secondary-color);
}
.bsw-form__row { margin-bottom: 0.75rem; }
.bsw-form .form-control {
    border-radius: 0;
    border-color: var(--bs-border-color);
    background: var(--bs-body-bg);
}
.bsw-form .form-control:focus {
    border-color: var(--bsw-rule);
    box-shadow: 0 0 0 0.2rem rgba(var(--bs-primary-rgb), 0.15);
}

/* ---------- Team member detail : portrait dans l'aside ---------- */
.bsw-portrait {
    display: block;
    width: 100%;
    height: auto;
    margin-bottom: 1rem;
    object-fit: cover;
    border: 1px solid var(--bs-border-color);
}
.bsw-portrait--placeholder {
    display: flex;
    align-items: center;
    justify-content: center;
    aspect-ratio: 1 / 1;
    font-size: 3rem;
    color: var(--bs-primary);
    background: rgba(var(--bs-primary-rgb), 0.08);
}

/* ---------- Jobs : liste de notices, filet séparateur ---------- */
.bsw-jobs { margin-inline: auto; max-width: var(--bsw-measure-wide); }
.bsw-job {
    padding: clamp(1.5rem, 4vw, 2.25rem) 0;
    border-top: 1px solid var(--bs-border-color);
}
.bsw-job:first-child { border-top: 0; }
.bsw-job__body { min-width: 0; }
.bsw-job__flag {
    color: var(--bs-primary);
    font-weight: 700;
}
.bsw-job__flag--urgent { color: var(--bs-danger); }
.bsw-job__facts {
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem 1.5rem;
    margin: 0 0 0.85rem;
    font-size: 0.9rem;
    color: var(--bs-secondary-color);
}
.bsw-job__facts i { color: var(--bs-primary); }

/* ---------- Bouton d'action principal (apply / lien externe) ---------- */
.bsw-apply {
    margin-top: clamp(2rem, 4vw, 2.75rem);
    max-width: var(--bsw-measure);
}
.bsw-apply .btn { border-radius: 0; }

/* ---------- Liste méta en pleine largeur (publication detail) ---------- */
.bsw-meta-list--inline {
    margin: 0 0 clamp(1.75rem, 4vw, 2.5rem);
    max-width: var(--bsw-measure-wide);
    padding-bottom: 1.5rem;
    border-bottom: 1px solid var(--bs-border-color);
}
.bsw-meta-list--inline .bsw-meta-list__row {
    grid-template-columns: minmax(6rem, 9rem) 1fr;
}

/* ---------- Responsive Phase 7 ---------- */
@media (max-width: 575.98px) {
    .bsw-included__item { grid-template-columns: 1fr; }
    .bsw-meta-list--inline .bsw-meta-list__row { grid-template-columns: 1fr; gap: 0.15rem; }
    .bsw-apply .btn { width: 100%; }
}

/* AUDIT AA : muté #adb5bd -> lisible sur blanc. */
:root:not([data-bs-theme="dark"]) { --bs-secondary-color: #6c757d; --bs-secondary-color-rgb: 108,117,125; }
:root:not([data-bs-theme="dark"]) .text-secondary { color: #6c757d !important; }
