/* themes/bootswatch_materia/css/style.css — Material Design polish.
   Bootswatch Materia skin (Bootstrap 5.3.7) carries the Roboto type + --bs-*
   palette; this layer adds an authentic Material 2 elevation system, a bold
   colored app-bar hero, raised cards, ripple-ish buttons and a FAB accent. */

:root {
    /* Material elevation (dp) — layered umbra + penumbra shadows. */
    --bsw-e1: 0 1px 3px rgba(0,0,0,.12), 0 1px 2px rgba(0,0,0,.24);
    --bsw-e2: 0 3px 6px rgba(0,0,0,.16), 0 3px 6px rgba(0,0,0,.23);
    --bsw-e4: 0 10px 20px rgba(0,0,0,.19), 0 6px 6px rgba(0,0,0,.23);
    --bsw-e8: 0 14px 28px rgba(0,0,0,.25), 0 10px 10px rgba(0,0,0,.22);
    --bsw-e-primary: 0 6px 18px rgba(var(--bs-primary-rgb), .42);
    --bsw-ease: cubic-bezier(.4, 0, .2, 1);
}

/* ---------------------------------------------------------------- rhythm */
.bsw-section { padding: clamp(3rem, 7vw, 5.5rem) 0; }
main > section { scroll-margin-top: 5rem; }

/* ----------------------------------------------------------------- hero
   Material archetype: a bold primary APP BAR band, then a raised white
   CARD overlapping its bottom edge (--bsw-e8), with a circular FAB at the
   card corner. */
.bsw-hero {
    position: relative;
    margin-bottom: clamp(2.5rem, 6vw, 4.5rem);
}

/* Bold colored Material app bar — tall enough for the card to overlap into. */
.bsw-hero__appbar {
    background:
        linear-gradient(135deg,
            var(--bs-primary) 0%,
            color-mix(in srgb, var(--bs-primary) 80%, #000) 100%);
    color: #fff;
    box-shadow: var(--bsw-e4);
    position: relative;
    z-index: 1;
    overflow: hidden;
    padding-bottom: clamp(4.5rem, 11vw, 8rem);
}
.bsw-hero__appbar::after {
    /* subtle Material "ink" highlight */
    content: "";
    position: absolute;
    inset: 0;
    background: radial-gradient(ellipse at 85% -20%, rgba(255,255,255,.2), transparent 55%);
    pointer-events: none;
}
.bsw-hero__appbar-inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    min-height: 56px;
    gap: 1rem;
    position: relative;
    z-index: 1;
}
.bsw-hero__appbar-brand {
    font-weight: 700;
    letter-spacing: .02em;
    font-size: clamp(1rem, 2vw, 1.15rem);
}
.bsw-hero__appbar-tag {
    font-size: .72rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: .12em;
    padding: .25rem .6rem;
    border-radius: 999px;
    background: rgba(255,255,255,.18);
}

/* Stage holds the overlapping card and pulls it up over the app bar. */
.bsw-hero__stage {
    position: relative;
    z-index: 2;
    margin-top: clamp(-4rem, -9vw, -7rem);
}

/* The raised white Material card. */
.bsw-hero__card {
    position: relative;
    background: var(--bs-body-bg);
    color: var(--bs-body-color);
    border-radius: .75rem;
    box-shadow: var(--bsw-e8);
    padding: clamp(1.75rem, 5vw, 3.25rem);
    max-width: 760px;
}
.bsw-hero__eyebrow {
    text-transform: uppercase;
    letter-spacing: .18em;
    font-size: .78rem;
    font-weight: 600;
    color: var(--bs-primary);
    margin-bottom: .75rem;
}
.bsw-hero__title {
    font-weight: 700;
    line-height: 1.08;
    font-size: clamp(2rem, 5vw, 3.25rem);
    margin: 0 0 1rem;
    color: var(--bs-body-color);
}
.bsw-hero__lead {
    font-size: clamp(1.05rem, 2.2vw, 1.25rem);
    line-height: 1.55;
    max-width: 46ch;
    color: var(--bs-secondary-color);
    margin-bottom: 1.75rem;
}
.bsw-hero__actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: .75rem 1rem;
}

/* Material "contained" (raised, filled) button. */
.bsw-btn-contained {
    font-weight: 600;
    box-shadow: var(--bsw-e2);
    transition: box-shadow .2s var(--bsw-ease), transform .2s var(--bsw-ease);
}
.bsw-btn-contained:hover,
.bsw-btn-contained:focus-visible {
    box-shadow: var(--bsw-e8);
    transform: translateY(-2px);
}

/* Material "text" button — flat, tinted on hover. */
.bsw-btn-text {
    font-weight: 600;
    color: var(--bs-primary);
    border: 0;
    background: transparent;
    box-shadow: none;
    transition: background .2s var(--bsw-ease);
}
.bsw-btn-text:hover,
.bsw-btn-text:focus-visible {
    color: var(--bs-primary);
    background: rgba(var(--bs-primary-rgb), .1);
}

/* Floating Action Button — straddles the card corner. */
.bsw-fab {
    position: absolute;
    right: clamp(1rem, 4vw, 1.75rem);
    bottom: -28px;
    z-index: 3;
    width: 56px;
    height: 56px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: var(--bs-primary);
    color: #fff;
    font-size: 1.5rem;
    text-decoration: none;
    box-shadow: var(--bsw-e-primary);
    transition: transform .2s var(--bsw-ease), box-shadow .2s var(--bsw-ease);
}
.bsw-fab:hover,
.bsw-fab:focus-visible {
    color: #fff;
    transform: translateY(-3px) scale(1.04);
    box-shadow: var(--bsw-e8);
}

/* ---------------------------------------------------- Material elevation */
/* Raised cards: shadow at rest, higher elevation on hover (Material lift). */
.card {
    border: 0;
    border-radius: .5rem;
    background: var(--bs-body-bg);
    box-shadow: var(--bsw-e1);
    transition: box-shadow .25s var(--bsw-ease), transform .25s var(--bsw-ease);
}
.card:hover {
    box-shadow: var(--bsw-e4);
    transform: translateY(-4px);
}

/* Section title spacing to match Material density */
.section-title { margin-bottom: clamp(2rem, 4vw, 3rem); text-align: center; }
.section-title h2 { font-weight: 700; }
.section-title p { color: var(--bs-secondary-color); }

/* Ripple-ish bold buttons everywhere else */
.btn {
    font-weight: 600;
    letter-spacing: .02em;
    text-transform: uppercase;
    transition: box-shadow .2s var(--bsw-ease), transform .15s var(--bsw-ease);
}
.btn-primary {
    box-shadow: var(--bsw-e2);
}
.btn-primary:hover,
.btn-primary:focus-visible {
    box-shadow: var(--bsw-e4);
    transform: translateY(-1px);
}
.btn:active { transform: translateY(1px); }

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

/* ---------------------------------------------------------- responsive */
@media (max-width: 575.98px) {
    .bsw-hero__appbar-tag { display: none; }
    .bsw-hero__card { max-width: none; }
    .bsw-hero__actions .btn { width: 100%; }
    .bsw-fab { right: 1rem; bottom: -24px; }
}

@media (prefers-reduced-motion: reduce) {
    .card,
    .btn,
    .bsw-btn-contained,
    .bsw-btn-text,
    .bsw-fab { transition: none; }
    .card:hover,
    .bsw-btn-contained:hover,
    .bsw-fab:hover { transform: none; }
}

/* ================================================================
   PHASE 3 — bespoke home sections (Material cards + elevation)
   projects · team · testimonials · faq
   ================================================================ */

/* Shared Material card surface used across the four sections. */
.bsw-mcard {
    border: 0;
    border-radius: .75rem;
    overflow: hidden;
    background: var(--bs-body-bg);
    box-shadow: var(--bsw-e1);
    transition: box-shadow .25s var(--bsw-ease), transform .25s var(--bsw-ease);
}
.bsw-mcard:hover {
    box-shadow: var(--bsw-e8);
    transform: translateY(-6px);
}
.bsw-mcard__media {
    position: relative;
    overflow: hidden;
}
.bsw-mcard__img {
    display: block;
    width: 100%;
    height: 220px;
    object-fit: cover;
    transition: transform .35s var(--bsw-ease);
}
.bsw-mcard:hover .bsw-mcard__img { transform: scale(1.05); }
.bsw-mcard__meta {
    font-size: .82rem;
    color: var(--bs-secondary-color);
    margin: 0;
}
.bsw-mcard__meta .bi { color: var(--bs-primary); }

/* Material "chip" badge — pill, elevated, sits over the media. */
.bsw-mchip {
    position: absolute;
    top: .75rem;
    left: .75rem;
    z-index: 2;
    display: inline-flex;
    align-items: center;
    font-size: .68rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .08em;
    padding: .3rem .7rem;
    border-radius: 999px;
    color: #fff;
    background: var(--bs-primary);
    box-shadow: var(--bsw-e2);
}
.bsw-mchip--inline {
    position: static;
    align-self: flex-start;
    margin: 1rem 1rem 0;
}

/* Flat (text) Material button variant for in-card actions. */
.bsw-btn-flat {
    border: 0;
    box-shadow: none;
    background: transparent;
    padding-left: 0;
}
.bsw-btn-flat:hover,
.bsw-btn-flat:focus-visible {
    box-shadow: none;
    transform: none;
    background: rgba(var(--bs-primary-rgb), .08);
    color: var(--bs-primary);
    padding-left: .75rem;
    padding-right: .75rem;
}

/* ---------------------------------------------------------- team */
.bsw-tcard__media {
    position: relative;
    overflow: hidden;
}
.bsw-tcard .bsw-mcard__img { height: 240px; }
.bsw-tcard__placeholder {
    height: 240px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(var(--bs-primary-rgb), .08);
    color: var(--bs-primary);
    font-size: 3rem;
}
.bsw-tcard__social {
    display: flex;
    justify-content: center;
    gap: .35rem;
}
.bsw-iconbtn {
    width: 38px;
    height: 38px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    color: var(--bs-secondary-color);
    text-decoration: none;
    transition: background .2s var(--bsw-ease), color .2s var(--bsw-ease);
}
.bsw-iconbtn:hover,
.bsw-iconbtn:focus-visible {
    background: rgba(var(--bs-primary-rgb), .12);
    color: var(--bs-primary);
}

/* -------------------------------------------------- testimonials */
.bsw-quote .card-body { padding: clamp(1.5rem, 3vw, 2rem); }
.bsw-quote__mark {
    display: block;
    font-size: 2.75rem;
    line-height: 1;
    color: var(--bs-primary);
    opacity: .55;
    margin-bottom: .5rem;
}
.bsw-quote__text {
    font-size: 1.05rem;
    line-height: 1.6;
    color: var(--bs-body-color);
}
.bsw-quote__avatar {
    width: 56px;
    height: 56px;
    border-radius: 50%;
    object-fit: cover;
    box-shadow: var(--bsw-e1);
    flex: 0 0 auto;
}
.bsw-quote__avatar--ph {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: rgba(var(--bs-primary-rgb), .12);
    color: var(--bs-primary);
    font-size: 1.5rem;
}

/* ----------------------------------------------------------- faq */
.bsw-accordion { display: grid; gap: .75rem; }
.bsw-acc-item {
    border: 0;
    border-radius: .5rem;
    overflow: hidden;
    background: var(--bs-body-bg);
    box-shadow: var(--bsw-e1);
    transition: box-shadow .25s var(--bsw-ease);
}
.bsw-acc-item:has(.accordion-button:not(.collapsed)) {
    box-shadow: var(--bsw-e4);
}
.bsw-faq .accordion-button {
    font-weight: 600;
    border-radius: 0;
    background: var(--bs-body-bg);
    color: var(--bs-body-color);
}
.bsw-faq .accordion-button:not(.collapsed) {
    color: var(--bs-primary);
    background: rgba(var(--bs-primary-rgb), .06);
    box-shadow: none;
}
.bsw-faq .accordion-button:focus {
    box-shadow: 0 0 0 .2rem rgba(var(--bs-primary-rgb), .25);
}

/* --------------------------------------------- section responsive */
@media (max-width: 575.98px) {
    .bsw-mcard__img,
    .bsw-tcard .bsw-mcard__img,
    .bsw-tcard__placeholder { height: 200px; }
}

@media (prefers-reduced-motion: reduce) {
    .bsw-mcard,
    .bsw-mcard__img,
    .bsw-iconbtn,
    .bsw-acc-item { transition: none; }
    .bsw-mcard:hover { transform: none; }
    .bsw-mcard:hover .bsw-mcard__img { transform: none; }
}

/* ================================================================
   PHASE 5 — bespoke home sections (Material cards + elevation)
   about · skills · stats · resume · services
   ================================================================ */

/* Reusable Material icon "tile" — soft tinted square, primary glyph. */
.bsw-about__facticon,
.bsw-skill__icon,
.bsw-stat__icon,
.bsw-service__icon,
.bsw-resume__headicon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: .65rem;
    background: rgba(var(--bs-primary-rgb), .1);
    color: var(--bs-primary);
    flex: 0 0 auto;
}

/* ---------------------------------------------------------- about */
/* About is a single broad raised card (no lift — it's a surface, not a tile). */
.bsw-about__card:hover { transform: none; box-shadow: var(--bsw-e2); }
.bsw-about__media {
    min-height: 100%;
    background: rgba(var(--bs-primary-rgb), .06);
}
.bsw-about__img {
    display: block;
    width: 100%;
    height: 100%;
    min-height: 260px;
    object-fit: cover;
}
.bsw-about__body { padding: clamp(1.5rem, 3.5vw, 2.75rem); }
.bsw-about__facts { display: grid; gap: .85rem; margin-bottom: 0; }
.bsw-about__facts li {
    display: flex;
    align-items: center;
    gap: .85rem;
}
.bsw-about__facticon { width: 38px; height: 38px; font-size: 1.05rem; }
.bsw-about__facts a { text-decoration: none; color: var(--bs-primary); }
.bsw-about__facts a:hover { text-decoration: underline; }

/* ---------------------------------------------------------- skills */
.bsw-skill .card-body { padding: 1.25rem 1.35rem; }
.bsw-skill__icon {
    width: 46px;
    height: 46px;
    font-size: 1.35rem;
    margin-right: 1rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: .65rem;
    background: rgba(var(--bs-primary-rgb), .1);
    color: var(--bs-primary);
    flex: 0 0 auto;
}
.bsw-skill__progress {
    height: 6px;
    border-radius: 999px;
    background: rgba(var(--bs-primary-rgb), .12);
}
.bsw-skill__progress .progress-bar { border-radius: 999px; }

/* ----------------------------------------------------------- stats */
.bsw-stat .card-body { padding: clamp(1.25rem, 3vw, 1.85rem) 1rem; }
.bsw-stat__icon {
    width: 56px;
    height: 56px;
    font-size: 1.6rem;
    margin: 0 auto .85rem;
}
.bsw-stat__value {
    font-weight: 700;
    font-size: clamp(1.85rem, 5vw, 2.75rem);
    line-height: 1.05;
}
.bsw-stat__unit { font-size: .55em; font-weight: 600; margin-left: .1em; }

/* ---------------------------------------------------------- resume */
.bsw-resume__card:hover { transform: none; box-shadow: var(--bsw-e2); }
.bsw-resume__card .card-body { padding: clamp(1.5rem, 3.5vw, 2.25rem); }
.bsw-resume__heading {
    display: flex;
    align-items: center;
    gap: .85rem;
    font-weight: 700;
}
.bsw-resume__headicon { width: 44px; height: 44px; font-size: 1.3rem; }

/* Material vertical timeline with connector line + dots. */
.bsw-timeline {
    list-style: none;
    margin: 0;
    padding: 0 0 0 1.5rem;
    position: relative;
}
.bsw-timeline::before {
    content: "";
    position: absolute;
    left: 5px;
    top: .4rem;
    bottom: .4rem;
    width: 2px;
    background: rgba(var(--bs-primary-rgb), .25);
}
.bsw-timeline__item { position: relative; padding-bottom: 1.5rem; }
.bsw-timeline__item:last-child { padding-bottom: 0; }
.bsw-timeline__item::before {
    content: "";
    position: absolute;
    left: calc(-1.5rem + 1px);
    top: .35rem;
    width: 11px;
    height: 11px;
    border-radius: 50%;
    background: var(--bs-primary);
    box-shadow: 0 0 0 4px var(--bs-body-bg), var(--bsw-e1);
}
.bsw-timeline__meta { font-size: .82rem; color: var(--bs-secondary-color); }

/* --------------------------------------------------------- services */
.bsw-service .card-body { padding: clamp(1.5rem, 3vw, 2rem); }
.bsw-service__icon {
    width: 56px;
    height: 56px;
    font-size: 1.65rem;
    margin-bottom: 1.1rem;
}

/* ------------------------------------------- phase-5 responsive */
@media (max-width: 991.98px) {
    .bsw-about__img { min-height: 220px; }
}
@media (max-width: 575.98px) {
    .bsw-about__img { min-height: 180px; }
}

@media (prefers-reduced-motion: reduce) {
    .bsw-about__card,
    .bsw-resume__card,
    .bsw-skill,
    .bsw-stat,
    .bsw-service { transition: none; }
}

/* ================================================================
   PHASE 5 — bespoke LIST sections (Material cards + elevation)
   publications · events · resources · blog
   ================================================================ */

/* Small inline chip variant — used in flowing text / headings. */
.bsw-mchip--inline-sm {
    position: static;
    vertical-align: middle;
    padding: .18rem .5rem;
    font-size: .6rem;
    box-shadow: var(--bsw-e1);
}

/* ---------------------------------------------------- publications */
/* Material "list" surface: a single raised sheet with ruled rows. */
.bsw-publist {
    background: var(--bs-body-bg);
    border-radius: .75rem;
    box-shadow: var(--bsw-e2);
    overflow: hidden;
}
.bsw-publist__item {
    padding: clamp(1rem, 2.5vw, 1.4rem) clamp(1.1rem, 3vw, 1.75rem);
    border-bottom: 1px solid rgba(var(--bs-body-color-rgb, 0, 0, 0), .08);
    transition: background .2s var(--bsw-ease);
}
.bsw-publist__item:last-child { border-bottom: 0; }
.bsw-publist__item:hover {
    background: rgba(var(--bs-primary-rgb), .045);
}
.bsw-publist__title a {
    color: var(--bs-body-color);
    font-weight: 600;
}
.bsw-publist__title a:hover { color: var(--bs-primary); }
.bsw-publist__cat { color: var(--bs-primary); font-weight: 600; }

/* --------------------------------------------------------- events */
/* Material date "ticket" — elevated tile pinned over the media. */
.bsw-event__date {
    position: absolute;
    top: .75rem;
    left: .75rem;
    z-index: 2;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-width: 48px;
    padding: .35rem .5rem;
    border-radius: .5rem;
    background: var(--bs-body-bg);
    color: var(--bs-primary);
    box-shadow: var(--bsw-e2);
    line-height: 1;
}
.bsw-event__date-day { font-size: 1.25rem; font-weight: 700; }
.bsw-event__date-mon {
    font-size: .62rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .08em;
}

/* ------------------------------------------------------ resources */
/* Resources have no media — lead each card with a Material icon tile. */
.bsw-resource__icon {
    width: 52px;
    height: 52px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: .65rem;
    font-size: 1.5rem;
    background: rgba(var(--bs-primary-rgb), .1);
    color: var(--bs-primary);
    box-shadow: var(--bsw-e1);
    flex: 0 0 auto;
}

/* ------------------------------- list sections responsive / motion */
@media (max-width: 575.98px) {
    .bsw-event__date { min-width: 42px; }
    .bsw-event__date-day { font-size: 1.1rem; }
}

@media (prefers-reduced-motion: reduce) {
    .bsw-publist__item { transition: none; }
}

/* ================================================================
   PHASE 6 — bespoke PAGES (Material cards + elevation)
   blog_list · blog_detail · project_list · project_detail
   Built on --bsw-e* elevation + --bs-primary/-rgb + --bs-body-*.
   ================================================================ */

/* Page sections share the section-title rhythm; lists default to centered. */
.bsw-blog .section-title,
.bsw-projects .section-title { text-align: center; }

/* ----------------------------------------------- Material filter chips */
/* Outlined / filled pill chips for the category filter row. */
.bsw-chipbtn {
    border-radius: 999px;
    text-transform: none;
    letter-spacing: .01em;
    box-shadow: none;
}
.btn.bsw-chipbtn.btn-primary { box-shadow: var(--bsw-e1); }
.btn.bsw-chipbtn:hover,
.btn.bsw-chipbtn:focus-visible { transform: none; box-shadow: var(--bsw-e2); }

/* ----------------------------------------------------- empty state */
/* A flat raised Material "snackbar"-style notice instead of an alert. */
.bsw-empty {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: .65rem;
    text-align: center;
    padding: clamp(2rem, 6vw, 3.5rem) 1rem;
    border-radius: .75rem;
    background: rgba(var(--bs-primary-rgb), .05);
    box-shadow: var(--bsw-e1);
    color: var(--bs-secondary-color);
}
.bsw-empty .bi { font-size: 2rem; color: var(--bs-primary); }

/* ------------------------------------------------- Material pagination */
.bsw-pagination { gap: .35rem; }
.bsw-pagination .page-link {
    border: 0;
    border-radius: 999px;
    min-width: 40px;
    text-align: center;
    color: var(--bs-body-color);
    background: var(--bs-body-bg);
    box-shadow: var(--bsw-e1);
    transition: box-shadow .2s var(--bsw-ease), background .2s var(--bsw-ease);
}
.bsw-pagination .page-link:hover,
.bsw-pagination .page-link:focus-visible {
    background: rgba(var(--bs-primary-rgb), .1);
    box-shadow: var(--bsw-e2);
}
.bsw-pagination .page-item.active .page-link {
    background: var(--bs-primary);
    color: #fff;
    box-shadow: var(--bsw-e2);
}

/* ============================================ blog_detail / project_detail */

/* Material breadcrumb: flat, low-key, primary links. */
.bsw-breadcrumb { margin-bottom: 0; }
.bsw-breadcrumb a { color: var(--bs-primary); text-decoration: none; }
.bsw-breadcrumb a:hover { text-decoration: underline; }

/* Article header */
.bsw-article__title {
    font-weight: 700;
    line-height: 1.12;
    font-size: clamp(1.75rem, 4vw, 2.6rem);
}
.bsw-projectdetail__head h2 { font-weight: 700; }
.bsw-article__meta {
    display: flex;
    flex-wrap: wrap;
    gap: .35rem 1.25rem;
    color: var(--bs-secondary-color);
    font-size: .9rem;
}
.bsw-article__metaitem .bi { color: var(--bs-primary); margin-right: .25rem; }

/* Hero image — raised Material sheet. */
.bsw-article__hero {
    width: 100%;
    border-radius: .75rem;
    box-shadow: var(--bsw-e4);
}

/* Lead + body copy rhythm. */
.bsw-article__lead {
    font-size: clamp(1.05rem, 2.2vw, 1.2rem);
    line-height: 1.6;
    color: var(--bs-body-color);
}
.bsw-article__body { line-height: 1.7; }
.bsw-article__body img { max-width: 100%; height: auto; border-radius: .5rem; }

/* Section sub-headings with a Material primary accent glyph. */
.bsw-shead {
    display: flex;
    align-items: center;
    gap: .55rem;
    font-weight: 700;
}
.bsw-shead .bi { color: var(--bs-primary); }

/* Material tag / tech "chips" — soft tinted pills. */
.bsw-tagchip {
    display: inline-flex;
    align-items: center;
    padding: .3rem .7rem;
    border-radius: 999px;
    font-size: .78rem;
    font-weight: 600;
    color: var(--bs-primary);
    background: rgba(var(--bs-primary-rgb), .1);
    transition: background .2s var(--bsw-ease), box-shadow .2s var(--bsw-ease);
}
a.bsw-tagchip:hover,
a.bsw-tagchip:focus-visible {
    background: rgba(var(--bs-primary-rgb), .18);
    box-shadow: var(--bsw-e1);
}

/* Sidebar info cards — surfaces, not lifting tiles. */
.bsw-aside { box-shadow: var(--bsw-e2); }
.bsw-aside:hover { transform: none; box-shadow: var(--bsw-e2); }
.bsw-aside__title { font-weight: 700; }
.bsw-aside__list { display: grid; gap: .65rem; }
.bsw-aside__list li {
    display: flex;
    align-items: flex-start;
    gap: .6rem;
}
.bsw-aside__list .bi { color: var(--bs-primary); margin-top: .12em; }

/* Gallery figures — raised Material image sheets. */
.bsw-figure__img {
    width: 100%;
    border-radius: .5rem;
    box-shadow: var(--bsw-e1);
    transition: box-shadow .25s var(--bsw-ease);
}
.bsw-figure:hover .bsw-figure__img { box-shadow: var(--bsw-e4); }

/* ------------------------------------------- phase-6 responsive / motion */
@media (max-width: 575.98px) {
    .bsw-pagination .page-link { min-width: 36px; }
}

@media (prefers-reduced-motion: reduce) {
    .bsw-chipbtn,
    .bsw-pagination .page-link,
    .bsw-tagchip,
    .bsw-figure__img { transition: none; }
}

/* ================================================================
   PHASE 7 — content pages (Material cards + elevation)
   events · faq · jobs · publications · resources · services · team
   Built on --bsw-e* elevation + --bs-primary/-rgb + --bs-body-*.
   Reuses bsw-mcard / -aside / -breadcrumb / -shead / -tagchip /
   -empty / -publist / -event__date / -resource__icon / -tcard from
   earlier phases; only genuinely new classes are defined here.
   ================================================================ */

/* List pages share the centered section-title rhythm. */
.bsw-events .section-title,
.bsw-jobs .section-title,
.bsw-publications .section-title,
.bsw-resources .section-title,
.bsw-services .section-title,
.bsw-team .section-title,
.bsw-faq .section-title { text-align: center; }

/* ---------------------------------------------------------- jobs */
/* Danger chip variant for "Urgent" — keeps the Material pill shape. */
.bsw-mchip--urgent { background: var(--bs-danger); }

/* Compact icon-led fact list inside job cards. */
.bsw-joblist__facts,
.bsw-resource__facts { display: grid; gap: .35rem; color: var(--bs-secondary-color); margin-bottom: 1rem; }
.bsw-joblist__facts li,
.bsw-resource__facts li { display: flex; align-items: center; gap: .5rem; }
.bsw-joblist__facts .bi,
.bsw-resource__facts .bi { color: var(--bs-primary); }

/* ------------------------------------------------- service detail */
/* "What's included" — Material check rows with a tinted icon tile. */
.bsw-feature-list { display: grid; gap: .85rem; margin-bottom: 0; }
.bsw-feature-list__item { display: flex; align-items: flex-start; gap: .85rem; }
.bsw-feature-list__icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    width: 36px;
    height: 36px;
    border-radius: .55rem;
    font-size: 1rem;
    background: rgba(var(--bs-primary-rgb), .1);
    color: var(--bs-primary);
}

/* --------------------------------------------- publication detail */
/* Definition list rhythm on the raised publication sheet. */
.bsw-deflist dt { font-weight: 700; color: var(--bs-secondary-color); }
.bsw-deflist dd { margin-bottom: .35rem; }

/* ----------------------------------------------- team member detail */
/* Fixed-height portrait so the profile media reads as a Material sheet. */
.bsw-memberdetail__photo { height: 320px; }
.bsw-memberdetail__role { color: var(--bs-secondary-color); margin-bottom: 0; }

/* ------------------------------------------ phase-7 responsive / motion */
@media (max-width: 575.98px) {
    .bsw-memberdetail__photo { height: 260px; }
}

@media (prefers-reduced-motion: reduce) {
    .bsw-feature-list__icon { transition: none; }
}

/* AUDIT CONTRASTE — WCAG AA : accent bleu #2196f3 (3.0) + muté #bbb trop clairs. */
:root:not([data-bs-theme="dark"]) {
    --bs-primary: #0d6fc4; --bs-primary-rgb: 13, 111, 196;
    --bs-secondary-color: #6c6c6c; --bs-secondary-color-rgb: 108, 108, 108;
}
:root:not([data-bs-theme="dark"]) .btn-outline-primary {
    --bs-btn-color: #0d6fc4; --bs-btn-border-color: #0d6fc4;
    color: #0d6fc4 !important; border-color: #0d6fc4 !important;
}
:root:not([data-bs-theme="dark"]) .btn-primary { --bs-btn-bg: #0d6fc4; --bs-btn-border-color: #0d6fc4; }
:root:not([data-bs-theme="dark"]) .btn-primary, :root:not([data-bs-theme="dark"]) .bg-primary { color: #fff !important; }