:root {
    --public-violet: #0757a5;
    --public-violet-dark: #083f73;
    --public-pink: #d54c80;
    --public-green: #15985a;
    --public-orange: #f29b2f;
    --public-blue: #1472bd;
    --public-ink: #172733;
    --public-muted: #637581;
    --public-line: #e1e9ef;
    --public-soft: #f8f7fc;
    --public-white: #ffffff;
}

.public-site-body {
    min-height: 100vh;
    margin: 0;
    color: var(--public-ink);
    background:
        radial-gradient(circle at 12% 0%, rgba(19, 120, 189, 0.11), transparent 29rem),
        radial-gradient(circle at 92% 8%, rgba(213, 76, 128, 0.09), transparent 26rem),
        #faf9fd;
    font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

.public-site-shell {
    width: min(1180px, calc(100% - 34px));
    margin: 0 auto;
}

.public-site-header {
    position: sticky;
    z-index: 30;
    top: 0;
    border-bottom: 1px solid rgba(230, 228, 239, 0.82);
    background: rgba(255, 255, 255, 0.94);
    backdrop-filter: blur(18px);
}

.public-site-header__inner {
    display: flex;
    min-height: 84px;
    gap: 22px;
    align-items: center;
    justify-content: space-between;
}

.public-site-brand {
    display: flex;
    gap: 12px;
    align-items: center;
    color: var(--public-ink);
    text-decoration: none;
}

.public-site-brand img {
    width: auto;
    height: 62px;
}

.public-site-nav {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    align-items: center;
}

.public-site-nav a {
    padding: 10px 12px;
    border-radius: 10px;
    color: #3e5261;
    font-size: 0.86rem;
    font-weight: 750;
    text-decoration: none;
}

.public-site-nav a:hover,
.public-site-nav a:focus-visible {
    color: var(--public-violet);
    background: #edf5fa;
}

.public-site-nav a[aria-current="page"] {
    color: var(--public-violet-dark);
    background: #e4f0f8;
    box-shadow: inset 0 0 0 1px rgba(7, 95, 168, 0.12);
}

.public-site-nav .public-site-nav__portal {
    color: #fff;
    background: linear-gradient(135deg, #075fa8, #0b4775);
    box-shadow: 0 8px 22px rgba(7, 95, 168, 0.22);
}

.public-site-hero {
    position: relative;
    display: grid;
    overflow: hidden;
    grid-template-columns: minmax(0, 1.2fr) minmax(280px, 0.8fr);
    gap: 35px;
    align-items: center;
    margin: 26px 0 38px;
    padding: clamp(30px, 6vw, 68px);
    border-radius: 28px;
    color: #fff;
    background:
        linear-gradient(135deg, rgba(11, 71, 117, 0.98), rgba(19, 120, 189, 0.96) 58%, rgba(204, 62, 125, 0.92));
    box-shadow: 0 24px 65px rgba(11, 71, 117, 0.24);
}

.public-site-hero::before,
.public-site-hero::after {
    position: absolute;
    border-radius: 999px;
    content: "";
    background: rgba(255, 255, 255, 0.08);
}

.public-site-hero::before {
    width: 330px;
    height: 330px;
    right: -130px;
    top: -150px;
}

.public-site-hero::after {
    width: 190px;
    height: 190px;
    right: 26%;
    bottom: -130px;
}

.public-site-kicker {
    display: inline-flex;
    margin-bottom: 14px;
    padding: 7px 11px;
    border: 1px solid rgba(255, 255, 255, 0.26);
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.1);
    font-size: 0.72rem;
    font-weight: 850;
    letter-spacing: 0.075em;
    text-transform: uppercase;
}

.public-site-hero h1 {
    max-width: 730px;
    margin: 0 0 16px;
    font-size: clamp(2.2rem, 5vw, 4.7rem);
    line-height: 0.99;
    letter-spacing: -0.045em;
}

.public-site-hero p {
    max-width: 700px;
    margin: 0;
    color: rgba(255, 255, 255, 0.86);
    font-size: clamp(1rem, 2vw, 1.18rem);
    line-height: 1.65;
}

.public-site-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 26px;
}

.public-site-button {
    display: inline-flex;
    min-height: 46px;
    gap: 8px;
    align-items: center;
    justify-content: center;
    padding: 11px 18px;
    border: 0;
    border-radius: 12px;
    color: #fff;
    background: var(--public-violet);
    box-shadow: 0 9px 22px rgba(7, 95, 168, 0.18);
    font: inherit;
    font-size: 0.86rem;
    font-weight: 820;
    text-decoration: none;
    cursor: pointer;
}

.public-site-button--light {
    color: var(--public-violet-dark);
    background: #fff;
}

.public-site-button--ghost {
    border: 1px solid rgba(255, 255, 255, 0.42);
    color: #fff;
    background: rgba(255, 255, 255, 0.08);
    box-shadow: none;
}

.public-site-hero__visual {
    position: relative;
    z-index: 1;
    display: grid;
    min-height: 270px;
    place-items: center;
}

.public-site-hero__visual img {
    width: min(100%, 410px);
    padding: 26px;
    border-radius: 28px;
    background: rgba(255, 255, 255, 0.94);
    box-shadow: 0 22px 48px rgba(10, 42, 67, 0.26);
}

.public-site-section {
    padding: 38px 0;
}

.public-site-section--soft {
    margin: 24px 0;
    padding: clamp(28px, 5vw, 52px);
    border: 1px solid var(--public-line);
    border-radius: 25px;
    background: rgba(255, 255, 255, 0.84);
    box-shadow: 0 15px 42px rgba(23, 39, 51, 0.06);
}

.public-site-section__heading {
    display: flex;
    gap: 18px;
    align-items: flex-end;
    justify-content: space-between;
    margin-bottom: 22px;
}

.public-site-section__heading h2 {
    margin: 0;
    font-size: clamp(1.55rem, 3vw, 2.35rem);
    letter-spacing: -0.03em;
}

.public-site-section__heading p {
    max-width: 680px;
    margin: 8px 0 0;
    color: var(--public-muted);
    line-height: 1.65;
}

.public-site-text-link {
    color: var(--public-violet);
    font-size: 0.84rem;
    font-weight: 820;
    text-decoration: none;
}

.public-site-feature-event {
    display: grid;
    grid-template-columns: minmax(150px, 0.32fr) minmax(0, 1fr);
    overflow: hidden;
    border: 1px solid var(--public-line);
    border-radius: 21px;
    background: #fff;
    box-shadow: 0 14px 34px rgba(40, 28, 85, 0.07);
}

.public-site-event-date {
    display: grid;
    min-height: 190px;
    place-content: center;
    padding: 24px;
    color: #fff;
    background: linear-gradient(145deg, #f2912b, #d8604e);
    text-align: center;
}

.public-site-event-date strong {
    font-size: 3rem;
    line-height: 1;
}

.public-site-event-date span {
    margin-top: 8px;
    font-size: 0.85rem;
    font-weight: 850;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.public-site-event-content {
    padding: clamp(24px, 4vw, 38px);
}

.public-site-event-content h3 {
    margin: 8px 0 10px;
    font-size: clamp(1.35rem, 2.5vw, 2rem);
}

.public-site-event-content p {
    color: var(--public-muted);
    line-height: 1.65;
}

.public-site-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 8px 18px;
    margin: 17px 0;
    color: #526673;
    font-size: 0.82rem;
    font-weight: 700;
}

.public-site-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 16px;
}

.public-site-card {
    display: flex;
    min-width: 0;
    flex-direction: column;
    overflow: hidden;
    border: 1px solid var(--public-line);
    border-radius: 17px;
    background: #fff;
    box-shadow: 0 9px 28px rgba(42, 30, 89, 0.055);
}

.public-site-card__body {
    display: flex;
    min-height: 190px;
    flex: 1;
    flex-direction: column;
    padding: 21px;
}

.public-site-card h3 {
    margin: 8px 0 10px;
    font-size: 1.08rem;
}

.public-site-card p {
    margin: 0;
    color: var(--public-muted);
    line-height: 1.58;
}

.public-site-card__footer {
    margin-top: auto;
    padding-top: 18px;
}

.public-site-badge {
    display: inline-flex;
    align-self: flex-start;
    padding: 6px 9px;
    border-radius: 999px;
    color: #0b4775;
    background: #eaf3f9;
    font-size: 0.67rem;
    font-weight: 850;
    letter-spacing: 0.045em;
    text-transform: uppercase;
}

.public-site-gallery {
    display: grid;
    grid-template-columns: repeat(12, minmax(0, 1fr));
    grid-auto-rows: 155px;
    gap: 12px;
}

.public-site-gallery figure {
    position: relative;
    overflow: hidden;
    grid-column: span 4;
    margin: 0;
    border-radius: 17px;
    background: #e8e5f2;
}

.public-site-gallery figure:first-child {
    grid-column: span 8;
    grid-row: span 2;
}

.public-site-gallery img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 250ms ease;
}

.public-site-gallery figure:hover img {
    transform: scale(1.035);
}

.public-site-gallery figcaption {
    position: absolute;
    right: 0;
    bottom: 0;
    left: 0;
    padding: 32px 14px 12px;
    color: #fff;
    background: linear-gradient(transparent, rgba(17, 12, 38, 0.82));
    font-size: 0.78rem;
    font-weight: 760;
}

.public-site-partners {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
}

.public-site-partner {
    flex: 1 1 210px;
    padding: 18px;
    border: 1px solid var(--public-line);
    border-radius: 15px;
    background: #fff;
}

.public-site-partner strong {
    display: block;
    margin-bottom: 5px;
}

.public-site-partner p {
    margin: 0;
    color: var(--public-muted);
    font-size: 0.84rem;
    line-height: 1.55;
}

.public-site-page-hero {
    margin: 24px 0;
    padding: clamp(27px, 5vw, 52px);
    border-radius: 24px;
    color: #fff;
    background: linear-gradient(135deg, #0b4775, #1378bd 60%, #c5497d);
}

.public-site-page-hero h1 {
    margin: 0 0 10px;
    font-size: clamp(2rem, 4vw, 3.4rem);
}

.public-site-page-hero p {
    max-width: 720px;
    margin: 0;
    color: rgba(255, 255, 255, 0.85);
    line-height: 1.65;
}

.public-site-article {
    width: min(820px, 100%);
    margin: 28px auto;
    padding: clamp(24px, 5vw, 48px);
    border: 1px solid var(--public-line);
    border-radius: 21px;
    background: #fff;
    box-shadow: 0 14px 40px rgba(42, 29, 90, 0.07);
}

.public-site-article h1 {
    margin: 8px 0 13px;
    font-size: clamp(1.8rem, 4vw, 3rem);
    line-height: 1.1;
}

.public-site-article__content {
    color: #344956;
    line-height: 1.78;
    white-space: pre-line;
}

.public-site-form {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
}

.public-site-form .field--wide,
.public-site-form .public-site-form__actions,
.public-site-form .public-site-consent {
    grid-column: 1 / -1;
}

.public-site-form label {
    display: grid;
    gap: 7px;
    color: #2d414e;
    font-size: 0.79rem;
    font-weight: 800;
}

.public-site-form input,
.public-site-form textarea,
.public-site-form select {
    width: 100%;
    min-height: 45px;
    box-sizing: border-box;
    padding: 11px 12px;
    border: 1px solid #dde6ec;
    border-radius: 11px;
    color: var(--public-ink);
    background: #fff;
    font: inherit;
}

.public-site-form textarea {
    min-height: 165px;
    resize: vertical;
}

.public-site-form input:focus,
.public-site-form textarea:focus,
.public-site-form select:focus {
    outline: 3px solid rgba(7, 95, 168, 0.14);
    border-color: #2d8dce;
}

.public-site-consent {
    display: flex !important;
    grid-template-columns: auto 1fr;
    gap: 10px !important;
    align-items: start;
    color: var(--public-muted) !important;
    font-weight: 600 !important;
    line-height: 1.5;
}

.public-site-consent input {
    width: 18px;
    min-height: 18px;
    margin-top: 2px;
}

.public-site-notice,
.public-site-success,
.public-site-error {
    margin: 18px 0;
    padding: 15px 17px;
    border-radius: 13px;
    line-height: 1.55;
}

.public-site-notice {
    border: 1px solid #dce8f0;
    color: #526673;
    background: #f5f8fa;
}

.public-site-success {
    border: 1px solid #a8ddc1;
    color: #075c33;
    background: #e5f8ed;
}

.public-site-error {
    border: 1px solid #edb8bf;
    color: #8c2632;
    background: #fdebed;
}

.public-site-footer {
    margin-top: 45px;
    color: #dce8f0;
    background: #172733;
}

.public-site-footer__inner {
    display: grid;
    grid-template-columns: 1.25fr 0.75fr 0.75fr;
    gap: 30px;
    padding: 44px 0;
}

.public-site-footer h2,
.public-site-footer h3 {
    color: #fff;
}

.public-site-footer h2 {
    margin: 0 0 8px;
}

.public-site-footer h3 {
    margin: 0 0 12px;
    font-size: 0.9rem;
}

.public-site-footer p,
.public-site-footer a {
    color: #cfdbe4;
    font-size: 0.83rem;
    line-height: 1.65;
}

.public-site-footer a {
    display: block;
    margin: 6px 0;
    text-decoration: none;
}

.public-site-footer__bottom {
    padding: 17px 0;
    border-top: 1px solid rgba(255, 255, 255, 0.09);
    color: #8697a3;
    font-size: 0.75rem;
}

@media (max-width: 900px) {
    .public-site-header__inner {
        align-items: flex-start;
        flex-direction: column;
        padding: 12px 0;
    }

    .public-site-nav {
        width: 100%;
        overflow-x: auto;
        flex-wrap: nowrap;
        padding-bottom: 4px;
    }

    .public-site-nav a {
        flex: 0 0 auto;
    }

    .public-site-hero {
        grid-template-columns: 1fr;
    }

    .public-site-hero__visual {
        min-height: 0;
    }

    .public-site-hero__visual img {
        width: min(100%, 330px);
    }

    .public-site-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .public-site-footer__inner {
        grid-template-columns: 1fr 1fr;
    }
}

@media (max-width: 640px) {
    .public-site-shell {
        width: min(100% - 20px, 1180px);
    }

    .public-site-brand img {
        height: 52px;
    }

    .public-site-hero {
        margin-top: 14px;
        padding: 27px 22px;
        border-radius: 20px;
    }

    .public-site-hero__visual {
        display: none;
    }

    .public-site-section {
        padding: 27px 0;
    }

    .public-site-section--soft {
        padding: 23px 18px;
        border-radius: 18px;
    }

    .public-site-section__heading {
        align-items: flex-start;
        flex-direction: column;
    }

    .public-site-feature-event {
        grid-template-columns: 1fr;
    }

    .public-site-event-date {
        min-height: 0;
        grid-auto-flow: column;
        gap: 10px;
        place-content: center start;
        text-align: left;
    }

    .public-site-event-date strong {
        font-size: 2rem;
    }

    .public-site-grid {
        grid-template-columns: 1fr;
    }

    .public-site-gallery {
        grid-template-columns: 1fr;
        grid-auto-rows: 220px;
    }

    .public-site-gallery figure,
    .public-site-gallery figure:first-child {
        grid-column: auto;
        grid-row: auto;
    }

    .public-site-form {
        grid-template-columns: 1fr;
    }

    .public-site-form .field--wide,
    .public-site-form .public-site-form__actions,
    .public-site-form .public-site-consent {
        grid-column: auto;
    }

    .public-site-footer__inner {
        grid-template-columns: 1fr;
    }
}

/* v0.26.0 — demandes publiques d’adhésion */
.public-site-button--secondary {
    color: var(--public-violet-dark);
    background: #eaf3f9;
    box-shadow: none;
}

.public-site-text-button {
    padding: 0;
    border: 0;
    color: var(--public-violet);
    background: transparent;
    font-weight: 800;
    cursor: pointer;
}

.membership-intro-grid,
.membership-choice-grid,
.membership-tracking-actions {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 18px;
}

.membership-intro-card,
.membership-tracking-actions > article {
    padding: 22px;
    border: 1px solid var(--public-line);
    border-radius: 18px;
    background: var(--public-white);
}

.membership-steps-list {
    display: grid;
    gap: 10px;
    margin: 0;
    padding-left: 22px;
    color: var(--public-muted);
    line-height: 1.55;
}

.membership-entry-actions,
.membership-add-actions,
.membership-secondary-actions,
.membership-form-navigation {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    align-items: center;
}

.membership-help-text,
.membership-adult-note,
.membership-legal-note p {
    color: var(--public-muted);
}

.membership-draft-panel {
    display: grid;
    grid-template-columns: minmax(220px, .7fr) minmax(320px, 1.3fr);
    gap: 18px;
    align-items: center;
}

.membership-draft-panel p {
    margin: 6px 0 0;
}

.membership-copy-row {
    display: flex;
    gap: 8px;
}

.membership-copy-row input {
    min-width: 0;
    flex: 1;
}

.membership-form-shell {
    padding: clamp(18px, 4vw, 34px);
}

.membership-progress {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 7px;
    margin-bottom: 28px;
}

.membership-progress button {
    display: flex;
    min-width: 0;
    gap: 7px;
    align-items: center;
    justify-content: center;
    padding: 10px 7px;
    border: 1px solid var(--public-line);
    border-radius: 12px;
    color: var(--public-muted);
    background: var(--public-soft);
    font-size: .82rem;
    font-weight: 800;
    cursor: pointer;
}

.membership-progress button span {
    display: inline-grid;
    width: 24px;
    height: 24px;
    place-items: center;
    border-radius: 999px;
    color: var(--public-violet-dark);
    background: #e8f2f8;
}

.membership-progress button[aria-current="step"] {
    border-color: rgba(7, 95, 168, .32);
    color: var(--public-violet-dark);
    background: #eaf3f9;
}

.membership-choice-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.membership-choice-card {
    display: flex;
    gap: 12px;
    align-items: flex-start;
    padding: 18px;
    border: 1px solid var(--public-line);
    border-radius: 16px;
    background: var(--public-white);
    cursor: pointer;
}

.membership-choice-card:has(input:checked) {
    border-color: rgba(7, 95, 168, .46);
    background: #eef6fb;
    box-shadow: 0 0 0 3px rgba(7, 95, 168, .08);
}

.membership-choice-card strong,
.membership-choice-card small {
    display: block;
}

.membership-choice-card small {
    margin-top: 5px;
    color: var(--public-muted);
    line-height: 1.45;
}

.membership-step-heading,
.membership-person-card > header,
.membership-tracking-summary,
.membership-person-status-list article,
.membership-document-list article {
    display: flex;
    gap: 16px;
    align-items: center;
    justify-content: space-between;
}

.membership-people,
.membership-person-status-list,
.membership-document-list,
.membership-message-thread,
.membership-summary {
    display: grid;
    gap: 14px;
}

.membership-person-card {
    padding: 20px;
    border: 1px solid var(--public-line);
    border-radius: 18px;
    background: #fff;
}

.membership-person-card > header h3 {
    margin: 4px 0 0;
}

.membership-person-number {
    color: var(--public-violet);
    font-size: .74rem;
    font-weight: 850;
    letter-spacing: .06em;
    text-transform: uppercase;
}

.membership-remove-person,
.membership-danger-link {
    border: 0;
    color: #a22131;
    background: transparent;
    font-weight: 800;
    cursor: pointer;
}

.membership-person-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 15px;
}

.membership-wide-label,
.membership-child-fields,
.membership-adult-note,
.membership-address-fields,
.membership-inline-fieldset {
    grid-column: 1 / -1;
}

.membership-address-fields,
.membership-child-fields {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 15px;
    padding: 15px;
    border-radius: 14px;
    background: var(--public-soft);
}

.membership-inline-fieldset {
    display: flex;
    flex-wrap: wrap;
    gap: 12px 20px;
    padding: 14px 16px;
    border: 1px solid var(--public-line);
    border-radius: 14px;
}

.membership-inline-fieldset legend {
    padding: 0 6px;
    font-weight: 800;
}

.membership-inline-fieldset label,
.public-site-consent {
    display: flex;
    gap: 9px;
    align-items: flex-start;
}

.membership-summary article,
.membership-person-status-list article,
.membership-document-list article {
    padding: 14px 16px;
    border: 1px solid var(--public-line);
    border-radius: 14px;
    background: var(--public-soft);
}

.membership-summary article strong,
.membership-summary article span,
.membership-summary article small,
.membership-person-status-list article strong,
.membership-person-status-list article span,
.membership-person-status-list article small {
    display: block;
}

.membership-summary article span,
.membership-summary article small,
.membership-person-status-list article span,
.membership-person-status-list article small {
    color: var(--public-muted);
}

.membership-consents {
    display: grid;
    gap: 13px;
    margin-top: 18px;
}

.membership-form-navigation {
    justify-content: space-between;
    margin-top: 26px;
    padding-top: 20px;
    border-top: 1px solid var(--public-line);
}

.membership-tracking-summary {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
}

.membership-tracking-summary > div:last-child {
    display: grid;
    min-width: 150px;
    text-align: right;
}

.membership-tracking-summary > div:last-child strong {
    color: var(--public-violet-dark);
    font-size: 2rem;
}

.membership-status-pill {
    display: inline-flex;
    padding: 6px 9px;
    border-radius: 999px;
    color: var(--public-violet-dark);
    background: #eaf3f9;
    font-size: .78rem;
    font-weight: 850;
}

.membership-message-thread article {
    max-width: 82%;
    padding: 14px 16px;
    border-radius: 16px;
    background: #f4f7f9;
}

.membership-message-thread article.from-association {
    justify-self: start;
    border-bottom-left-radius: 4px;
}

.membership-message-thread article.from-applicant {
    justify-self: end;
    border-bottom-right-radius: 4px;
    background: #e8f2f8;
}

.membership-message-thread p {
    margin: 8px 0;
}

.membership-cancel-details,
.membership-link-management {
    margin-top: 16px;
}

.membership-cancel-details summary {
    color: #a22131;
    font-weight: 800;
    cursor: pointer;
}

.membership-danger-button {
    background: #a22131;
}

@media (max-width: 840px) {
    .membership-choice-grid,
    .membership-intro-grid,
    .membership-tracking-actions,
    .membership-draft-panel,
    .membership-person-grid,
    .membership-address-fields,
    .membership-child-fields,
    .membership-tracking-summary {
        grid-template-columns: 1fr;
    }

    .membership-progress {
        display: flex;
        overflow-x: auto;
        padding-bottom: 5px;
    }

    .membership-progress button {
        min-width: 118px;
    }

    .membership-step-heading,
    .membership-person-card > header,
    .membership-person-status-list article,
    .membership-document-list article {
        align-items: flex-start;
        flex-direction: column;
    }

    .membership-copy-row {
        align-items: stretch;
        flex-direction: column;
    }

    .membership-tracking-summary > div:last-child {
        text-align: left;
    }
}

.membership-guardian-list {
    display: grid;
    gap: 12px;
    margin-bottom: 12px;
}

.membership-guardian-row {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr)) auto;
    gap: 12px;
    align-items: end;
    padding: 14px;
    border: 1px solid var(--public-line);
    border-radius: 14px;
    background: #fff;
}

.membership-remove-guardian {
    min-height: 42px;
    padding: 8px 10px;
    border: 0;
    color: #a22131;
    background: transparent;
    font-weight: 800;
    cursor: pointer;
}

@media (max-width: 840px) {
    .membership-guardian-row {
        grid-template-columns: 1fr;
        align-items: stretch;
    }
}

/* v0.26.1 — lisibilité et simplification du formulaire d’adhésion */
.membership-form-shell {
    max-width: 1040px;
    margin-inline: auto;
    border: 1px solid rgba(7, 95, 168, .09);
    box-shadow: 0 18px 45px rgba(42, 31, 78, .07);
}

.membership-form-guide {
    display: grid;
    gap: 4px;
    margin-bottom: 18px;
    padding: 14px 16px;
    border-left: 4px solid var(--public-violet);
    border-radius: 12px;
    color: #526673;
    background: #f5f8fa;
}

.membership-form-guide strong {
    color: var(--public-violet-dark);
}

.membership-draft-panel--compact {
    max-width: 1040px;
    margin-inline: auto;
    padding: 16px 18px;
    grid-template-columns: minmax(0, 1fr) auto;
}

.membership-draft-status {
    display: flex;
    gap: 12px;
    align-items: center;
}

.membership-draft-status__mark {
    display: grid;
    width: 34px;
    height: 34px;
    flex: 0 0 34px;
    place-items: center;
    border-radius: 999px;
    color: #075c33;
    background: #e5f8ed;
    font-weight: 900;
}

.membership-draft-url {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    padding: 0 !important;
    border: 0 !important;
    overflow: hidden;
    clip: rect(0 0 0 0);
    white-space: nowrap;
}

.membership-step-intro {
    margin-bottom: 20px;
}

.membership-step-intro--compact {
    margin-bottom: 0;
}

.membership-step-intro > span {
    display: block;
    margin-bottom: 6px;
    color: var(--public-violet);
    font-size: .75rem;
    font-weight: 900;
    letter-spacing: .07em;
    text-transform: uppercase;
}

.membership-step-intro h2 {
    margin: 0;
    color: var(--public-violet-dark);
    font-size: clamp(1.45rem, 3vw, 2rem);
}

.membership-step-intro p {
    max-width: 760px;
    margin: 8px 0 0;
    color: var(--public-muted);
    line-height: 1.55;
}

.membership-choice-card {
    min-height: 128px;
    transition: border-color .18s ease, background .18s ease, transform .18s ease, box-shadow .18s ease;
}

.membership-choice-card:hover {
    border-color: rgba(7, 95, 168, .32);
    transform: translateY(-1px);
}

.membership-person-card {
    padding: clamp(18px, 3vw, 28px);
    border-top: 4px solid rgba(7, 95, 168, .42);
    box-shadow: 0 10px 28px rgba(42, 31, 78, .06);
}

.membership-person-card[data-person-role="child"] {
    border-top-color: rgba(225, 94, 46, .55);
}

.membership-person-card > header {
    margin-bottom: 8px;
    padding-bottom: 15px;
    border-bottom: 1px solid var(--public-line);
}

.membership-person-grid {
    gap: 18px 16px;
}

.membership-fields-heading {
    display: grid;
    gap: 3px;
    margin: 10px 0 -2px;
    padding: 11px 13px;
    border-radius: 11px;
    background: #f5f8fa;
}

.membership-fields-heading strong {
    color: var(--public-violet-dark);
    font-size: .92rem;
}

.membership-fields-heading span {
    color: var(--public-muted);
    font-size: .78rem;
    line-height: 1.45;
}

.membership-person-grid label small,
.membership-child-fields label small {
    color: #637581;
    font-size: .72rem;
    font-weight: 600;
    line-height: 1.45;
}

.public-site-form input::placeholder,
.public-site-form textarea::placeholder {
    color: #8b9aa5;
    opacity: 1;
}

.membership-option-box {
    padding: 13px 14px;
    border: 1px solid #dde7ee;
    border-radius: 12px;
    background: #fbfcfd;
}

.membership-address-fields {
    grid-template-columns: minmax(230px, 2fr) minmax(120px, .7fr) minmax(180px, 1.2fr);
    padding: 18px;
    border: 1px solid #e2e9ee;
    background: #faf9fd;
}

.membership-child-fields {
    margin-top: 18px;
    padding: 20px;
    border: 1px solid #dbe7ef;
    background: #f5f8fa;
}

.membership-child-heading {
    grid-column: 1 / -1;
    margin-bottom: 2px;
}

.membership-child-heading > span {
    display: block;
    margin-bottom: 5px;
    color: #9b4c24;
    font-size: .73rem;
    font-weight: 900;
    letter-spacing: .06em;
    text-transform: uppercase;
}

.membership-child-heading h4 {
    margin: 0;
    color: var(--public-violet-dark);
    font-size: 1.1rem;
}

.membership-child-heading p {
    margin: 6px 0 0;
    color: var(--public-muted);
    line-height: 1.5;
}

.membership-guardian-row {
    grid-template-columns: minmax(210px, 1.2fr) minmax(210px, 1fr) minmax(200px, 1fr) auto;
    box-shadow: 0 5px 16px rgba(42, 31, 78, .04);
}


@media (max-width: 840px) {
    .membership-draft-panel--compact,
    .membership-address-fields {
        grid-template-columns: 1fr;
    }

    .membership-draft-panel--compact {
        align-items: stretch;
    }

    .membership-copy-row .public-site-button {
        width: 100%;
    }

    .membership-person-card {
        padding: 17px;
    }

    .membership-fields-heading {
        margin-top: 6px;
    }
}

@media (max-width: 560px) {
    .membership-progress button {
        min-width: 96px;
        padding-inline: 6px;
    }

    .membership-add-actions {
        width: 100%;
    }

    .membership-add-actions .public-site-button {
        flex: 1 1 145px;
    }

    .membership-form-navigation {
        align-items: stretch;
        flex-direction: column;
    }

    .membership-form-navigation .public-site-button {
        width: 100%;
    }

}

/* v0.26.3 — fiches de personnes repliables et autorisation parentale réorganisée */
.membership-request-form [hidden] {
    display: none !important;
}

.membership-person-card > header {
    align-items: flex-start;
}

.membership-person-heading {
    min-width: 0;
}

.membership-person-heading h3 {
    line-height: 1.3;
}

.membership-person-header-actions {
    display: flex;
    flex: 0 0 auto;
    gap: 9px;
    align-items: center;
}

.membership-edit-person,
.membership-remove-person {
    min-height: 38px;
    padding: 8px 12px;
    border-radius: 10px;
}

.membership-edit-person {
    border: 1px solid rgba(7, 95, 168, .24);
    color: var(--public-violet-dark);
    background: #eef6fb;
    font-weight: 850;
    cursor: pointer;
}

.membership-remove-person:hover,
.membership-edit-person:hover {
    filter: brightness(.98);
}

.membership-person-collapsed-summary {
    margin: 7px 0 0;
    color: var(--public-muted);
    font-size: .84rem;
    font-weight: 650;
    line-height: 1.45;
}

.membership-person-content {
    padding-top: 6px;
}

.membership-person-card.is-collapsed {
    padding-block: 16px;
    border-top-width: 3px;
    background: #fbfcfd;
    box-shadow: 0 5px 16px rgba(42, 31, 78, .04);
}

.membership-person-card.is-collapsed > header {
    margin: 0;
    padding: 0;
    border-bottom: 0;
}

.membership-person-card.is-collapsed .membership-person-content {
    display: none;
}

.membership-person-validation {
    display: flex;
    gap: 14px;
    align-items: center;
    justify-content: flex-end;
    margin-top: 22px;
    padding-top: 18px;
    border-top: 1px solid var(--public-line);
}

.membership-person-validation span {
    max-width: 360px;
    color: var(--public-muted);
    font-size: .78rem;
    line-height: 1.45;
}

.membership-child-fields {
    display: block;
    margin-top: 22px;
    padding: clamp(17px, 3vw, 24px);
    overflow: hidden;
}

.membership-child-heading {
    margin-bottom: 18px;
}

.membership-guardian-list {
    width: 100%;
    margin-bottom: 12px;
}

.membership-guardian-row {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px 16px;
    align-items: start;
    width: 100%;
    box-sizing: border-box;
    padding: 16px;
}

.membership-guardian-row > [data-guardian-relationship-other],
.membership-guardian-row > .membership-remove-guardian {
    grid-column: 1 / -1;
}

.membership-remove-guardian {
    justify-self: end;
    min-height: 36px;
    padding: 7px 10px;
    border: 1px solid rgba(162, 33, 49, .17);
    border-radius: 9px;
    background: #fff8f9;
}

.membership-child-fields > [data-add-guardian] {
    margin-bottom: 22px;
}

.membership-child-authorization {
    grid-template-columns: 1fr;
    gap: 16px;
    padding-top: 20px;
    border-top: 1px solid #dbe7ef;
}

.membership-child-authorization .membership-signer-field select {
    max-width: 520px;
}

.membership-child-authorization .membership-inline-fieldset {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
    padding: 14px;
}

.membership-child-authorization .membership-inline-fieldset legend {
    margin-bottom: 4px;
}

.membership-child-authorization .membership-inline-fieldset label {
    min-width: 0;
    padding: 12px 13px;
    border: 1px solid #dce6ed;
    border-radius: 11px;
    background: #fff;
    line-height: 1.4;
}

.membership-child-authorization .membership-inline-fieldset label:has(input:checked) {
    border-color: rgba(7, 95, 168, .42);
    background: #eef6fb;
    box-shadow: 0 0 0 3px rgba(7, 95, 168, .07);
}

.membership-child-authorization .membership-inline-fieldset input {
    width: 19px;
    min-width: 19px;
    min-height: 19px;
    margin-top: 1px;
    padding: 0;
}

@media (max-width: 840px) {
    .membership-person-card > header {
        width: 100%;
        gap: 12px;
    }

    .membership-person-header-actions {
        width: 100%;
        justify-content: flex-end;
    }

    .membership-guardian-row,
    .membership-child-authorization .membership-inline-fieldset {
        grid-template-columns: 1fr;
    }

    .membership-guardian-row > [data-guardian-relationship-other],
    .membership-guardian-row > .membership-remove-guardian {
        grid-column: auto;
    }

    .membership-remove-guardian {
        justify-self: stretch;
    }

    .membership-person-validation {
        align-items: stretch;
        flex-direction: column;
    }

    .membership-person-validation .public-site-button {
        width: 100%;
    }
}

/* ========================================================================== 
   v0.28.0 — site public et formulaires plus compacts, thème VIVALDI bleu
   ========================================================================== */

.public-site-body {
    background:
        radial-gradient(circle at 8% 0%, rgba(7, 87, 165, .08), transparent 24rem),
        radial-gradient(circle at 94% 5%, rgba(20, 114, 189, .06), transparent 22rem),
        #f6f8fb;
    font-size: 15px;
}

.public-site-shell {
    width: min(1220px, calc(100% - 28px));
}

.public-site-header {
    box-shadow: 0 2px 12px rgba(15, 61, 96, .035);
}

.public-site-header__inner {
    min-height: 68px;
    gap: 14px;
}

.public-site-brand {
    gap: 9px;
}

.public-site-brand img {
    height: 50px;
}

.public-site-nav {
    gap: 3px;
}

.public-site-nav a {
    padding: 8px 10px;
    border-radius: 8px;
    font-size: .8rem;
}

.public-site-nav a:hover,
.public-site-nav a:focus-visible,
.public-site-nav a[aria-current="page"] {
    color: var(--public-violet-dark);
    background: #e8f2fb;
}

.public-site-nav .public-site-nav__portal {
    background: var(--public-violet);
    box-shadow: 0 4px 12px rgba(7, 87, 165, .16);
}

.public-site-hero {
    grid-template-columns: minmax(0, 1.3fr) minmax(240px, .7fr);
    gap: 24px;
    margin: 18px 0 26px;
    padding: clamp(24px, 4vw, 46px);
    border-radius: 18px;
    background: linear-gradient(135deg, #073f73, #0757a5 58%, #1472bd);
    box-shadow: 0 12px 34px rgba(7, 63, 115, .18);
}

.public-site-hero h1 {
    margin-bottom: 12px;
    font-size: clamp(1.95rem, 4.5vw, 3.65rem);
    line-height: 1.04;
}

.public-site-hero p {
    font-size: clamp(.95rem, 1.5vw, 1.08rem);
    line-height: 1.55;
}

.public-site-kicker {
    margin-bottom: 10px;
    padding: 5px 9px;
    font-size: .66rem;
}

.public-site-actions {
    gap: 8px;
    margin-top: 18px;
}

.public-site-button {
    min-height: 40px;
    padding: 8px 14px;
    border-radius: 8px;
    background: var(--public-violet);
    box-shadow: 0 4px 12px rgba(7, 87, 165, .15);
    font-size: .8rem;
}

.public-site-button--secondary {
    border-color: #cfe1f1;
    color: var(--public-violet-dark);
    background: #eef6fc;
    box-shadow: none;
}

.public-site-hero__visual {
    min-height: 220px;
}

.public-site-hero__visual img {
    width: min(100%, 330px);
    padding: 18px;
    border-radius: 18px;
    box-shadow: 0 12px 28px rgba(13, 42, 72, .2);
}

.public-site-section {
    padding: 26px 0;
}

.public-site-section--soft {
    margin: 16px 0;
    padding: clamp(20px, 3.5vw, 36px);
    border-radius: 16px;
    box-shadow: 0 6px 20px rgba(15, 61, 96, .045);
}

.public-site-section__heading {
    gap: 12px;
    margin-bottom: 16px;
}

.public-site-section__heading h2 {
    font-size: clamp(1.35rem, 2.5vw, 1.95rem);
}

.public-site-section__heading p {
    margin-top: 5px;
    line-height: 1.5;
}

.public-site-page-hero {
    margin: 18px 0;
    padding: clamp(22px, 4vw, 40px);
    border-radius: 16px;
}

.public-site-grid {
    gap: 14px;
}

.public-site-card,
.public-site-feature-event,
.public-site-article,
.public-site-partner {
    border-radius: 12px;
    box-shadow: 0 4px 14px rgba(15, 61, 96, .045);
}

.public-site-card__body,
.public-site-card__footer,
.public-site-event-content,
.public-site-article__content {
    padding: 15px;
}

.public-site-badge,
.membership-status-pill {
    padding: 4px 7px;
    font-size: .68rem;
    background: #e5f0fa;
    color: var(--public-violet-dark);
}

/* Formulaires publics */
.public-site-form {
    gap: 12px;
}

.public-site-form label {
    margin-bottom: 4px;
    font-size: .76rem;
}

.public-site-form input,
.public-site-form select,
.public-site-form textarea {
    min-height: 40px;
    padding: 8px 10px;
    border-radius: 8px;
    font-size: .88rem;
}

.public-site-form textarea {
    min-height: 88px;
}

.public-site-form input:focus,
.public-site-form select:focus,
.public-site-form textarea:focus {
    border-color: var(--public-violet);
    box-shadow: 0 0 0 3px rgba(7, 87, 165, .09);
}

.membership-form-shell {
    max-width: 1120px;
    padding: clamp(14px, 2.6vw, 24px);
    border-color: #dfe8f1;
    border-radius: 14px;
    box-shadow: 0 6px 22px rgba(15, 61, 96, .055);
}

.membership-form-guide {
    gap: 2px;
    margin-bottom: 12px;
    padding: 10px 12px;
    border-left-width: 3px;
    border-radius: 8px;
    color: #4d6073;
    background: #f2f7fb;
}

.membership-progress {
    gap: 5px;
    margin-bottom: 18px;
}

.membership-progress button {
    gap: 6px;
    padding: 7px 6px;
    border-radius: 8px;
    font-size: .75rem;
}

.membership-progress button span {
    width: 21px;
    height: 21px;
    color: var(--public-violet-dark);
    background: #dcebf8;
}

.membership-progress button[aria-current="step"] {
    border-color: #a8cce9;
    color: var(--public-violet-dark);
    background: #e9f3fb;
}

.membership-step-intro {
    margin-bottom: 14px;
}

.membership-step-intro > span {
    margin-bottom: 4px;
    color: var(--public-violet);
    font-size: .68rem;
}

.membership-step-intro h2 {
    font-size: clamp(1.2rem, 2.4vw, 1.65rem);
}

.membership-step-intro p {
    margin-top: 5px;
    line-height: 1.45;
}

.membership-people,
.membership-person-status-list,
.membership-document-list,
.membership-message-thread,
.membership-summary {
    gap: 10px;
}

.membership-person-card {
    padding: 15px;
    border-top: 3px solid #9ac5e7;
    border-radius: 11px;
    box-shadow: none;
}

.membership-person-card[data-person-role="child"] {
    border-top-color: #e3a26f;
}

.membership-person-card > header {
    gap: 10px;
    margin-bottom: 5px;
    padding-bottom: 10px;
}

.membership-person-number {
    color: var(--public-violet);
    font-size: .68rem;
}

.membership-person-heading h3 {
    margin-top: 2px;
    font-size: 1rem;
}

.membership-person-grid {
    gap: 11px 12px;
}

.membership-fields-heading {
    margin: 7px 0 0;
    padding: 8px 10px;
    border-radius: 8px;
    background: #f2f7fb;
}

.membership-fields-heading strong {
    color: var(--public-violet-dark);
    font-size: .84rem;
}

.membership-fields-heading span,
.membership-person-grid label small,
.membership-child-fields label small {
    font-size: .69rem;
}

.membership-option-box,
.membership-address-fields,
.membership-child-fields,
.membership-inline-fieldset,
.membership-guardian-row,
.membership-summary article,
.membership-person-status-list article,
.membership-document-list article {
    border-radius: 9px;
}

.membership-option-box {
    padding: 9px 10px;
    background: #f7fafc;
}

.membership-address-fields {
    grid-template-columns: minmax(220px, 2fr) minmax(110px, .7fr) minmax(170px, 1.15fr);
    gap: 11px;
    padding: 12px;
    border-color: #dfe7ef;
    background: #f7f9fc;
}

.membership-child-fields {
    margin-top: 14px;
    padding: 14px;
    border-color: #d9e4ee;
    background: #f5f9fc;
}

.membership-child-heading {
    margin-bottom: 12px;
}

.membership-child-heading > span {
    margin-bottom: 3px;
    font-size: .67rem;
}

.membership-child-heading h4 {
    color: var(--public-violet-dark);
    font-size: 1rem;
}

.membership-child-heading p {
    margin-top: 4px;
    line-height: 1.45;
}

.membership-guardian-list {
    gap: 8px;
    margin-bottom: 9px;
}

.membership-guardian-row {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px 12px;
    padding: 11px;
    border-color: #dfe7ef;
    box-shadow: none;
}

.membership-remove-guardian,
.membership-edit-person,
.membership-remove-person {
    min-height: 34px;
    padding: 6px 9px;
    border-radius: 7px;
    font-size: .73rem;
}

.membership-edit-person {
    border-color: #bdd7ec;
    color: var(--public-violet-dark);
    background: #edf5fb;
}

.membership-person-card.is-collapsed {
    padding-block: 11px;
    background: #fbfcfe;
    box-shadow: none;
}

.membership-person-collapsed-summary {
    margin-top: 4px;
    font-size: .76rem;
}

.membership-person-validation {
    gap: 10px;
    margin-top: 14px;
    padding-top: 12px;
}

.membership-person-validation span {
    font-size: .72rem;
}

.membership-child-authorization {
    gap: 11px;
    padding-top: 14px;
    border-top-color: #d9e4ee;
}

.membership-child-authorization .membership-inline-fieldset {
    gap: 8px;
    padding: 10px;
}

.membership-child-authorization .membership-inline-fieldset label {
    padding: 9px 10px;
    border-radius: 8px;
}

.membership-child-authorization .membership-inline-fieldset label:has(input:checked),
.membership-choice-card:has(input:checked) {
    border-color: #93bee0;
    background: #eaf4fb;
    box-shadow: 0 0 0 2px rgba(7, 87, 165, .06);
}

.membership-consent-cards {
    gap: 10px;
    margin: 10px 0 16px;
}

.membership-consent-card {
    gap: 9px;
    padding: 13px;
    border-color: #dce7f0;
    border-radius: 10px;
    background: #fff;
    box-shadow: none;
}

.membership-consent-card .public-site-consent,
.membership-consent-card .check-row {
    padding-top: 8px;
    border-top-color: #e3ebf2;
}

.membership-form-navigation {
    margin-top: 18px;
    padding-top: 14px;
}

.membership-summary article,
.membership-person-status-list article,
.membership-document-list article,
.membership-message-thread article {
    padding: 10px 12px;
}

.membership-message-thread article {
    border-radius: 10px;
    background: #edf3f8;
}

.membership-message-thread article.from-applicant {
    background: #e5f0fa;
}

.public-site-notice,
.public-site-success,
.public-site-error {
    padding: 10px 12px;
    border-radius: 8px;
    font-size: .83rem;
}

.public-site-footer {
    margin-top: 28px;
}

@media (max-width: 840px) {
    .public-site-shell {
        width: min(100% - 20px, 1220px);
    }

    .public-site-header__inner {
        min-height: 60px;
    }

    .public-site-hero {
        grid-template-columns: 1fr;
        padding: 22px;
    }

    .public-site-hero__visual {
        min-height: 150px;
    }

    .membership-address-fields,
    .membership-guardian-row,
    .membership-child-authorization .membership-inline-fieldset {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 560px) {
    .public-site-body {
        font-size: 14px;
    }

    .public-site-shell {
        width: min(100% - 14px, 1220px);
    }

    .public-site-section,
    .public-site-section--soft {
        padding-block: 18px;
    }

    .public-site-section--soft,
    .membership-form-shell {
        padding-inline: 11px;
        border-radius: 11px;
    }

    .membership-progress button {
        min-width: 94px;
    }

    .membership-person-card,
    .membership-child-fields {
        padding: 11px;
    }

    .public-site-button,
    .public-site-form input,
    .public-site-form select {
        min-height: 42px;
    }
}

/* v0.29.0 — vérification publique des cartes annuelles */
.card-verification-hero {
    padding-bottom: 18px;
}

.card-verification {
    max-width: 720px;
    margin: 0 auto;
    overflow: hidden;
    border: 1px solid #d8e2ec;
    border-radius: 12px;
    background: #fff;
}

.card-verification__status {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 16px;
    border-bottom: 1px solid #d8e2ec;
    background: #f5f8fb;
}

.card-verification__status > div {
    display: grid;
    gap: 2px;
}

.card-verification__status span:not(.card-verification__icon) {
    color: #5e6f80;
    font-size: .78rem;
    text-transform: uppercase;
    letter-spacing: .05em;
}

.card-verification__status strong {
    color: #163652;
    font-size: 1.08rem;
}

.card-verification__icon {
    display: grid;
    width: 38px;
    height: 38px;
    place-items: center;
    flex: 0 0 38px;
    border-radius: 50%;
    background: #1f6f45;
    color: #fff;
    font-size: 1.25rem;
    font-weight: 800;
}

.card-verification:not(.card-verification--valid) .card-verification__icon {
    background: #a33a36;
}

.card-verification--unavailable .card-verification__icon {
    background: #946200;
}

.card-verification__details {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0;
    padding: 4px 16px 16px;
}

.card-verification__details > div {
    padding: 12px 0;
    border-bottom: 1px solid #e5ebf1;
}

.card-verification__details > div:nth-child(odd) {
    padding-right: 16px;
}

.card-verification__details > div:nth-child(even) {
    padding-left: 16px;
    border-left: 1px solid #e5ebf1;
}

.card-verification__details dt {
    color: #5e6f80;
    font-size: .78rem;
}

.card-verification__details dd {
    margin: 3px 0 0;
    color: #163652;
    font-weight: 750;
}

@media (max-width: 620px) {
    .card-verification__details {
        grid-template-columns: 1fr;
    }

    .card-verification__details > div:nth-child(odd),
    .card-verification__details > div:nth-child(even) {
        padding-right: 0;
        padding-left: 0;
        border-left: 0;
    }
}

/* v0.31.0 - formulaires bénévoles */
.public-site-body .form-section {
    margin-bottom: 14px;
    padding: 14px;
    border: 1px solid #d8e4f0;
    border-radius: 12px;
    background: #f8fbff;
}

.public-site-body .form-section legend {
    padding: 0 7px;
    color: #164c78;
    font-weight: 800;
}

.public-site-body .volunteer-public-form {
    display: grid;
    gap: 10px;
}

.public-site-body .volunteer-guardian[hidden] {
    display: none !important;
}

/* v0.35.0 — site public éditorial et événements */
.public-site-hero--visual{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(280px,.85fr);gap:clamp(1rem,3vw,2.5rem);align-items:center;overflow:hidden}
.public-site-hero__content{min-width:0}.public-site-hero__image{margin:0;min-height:260px;height:100%;border-radius:18px;overflow:hidden;background:#e8f1fb}.public-site-hero__image img{width:100%;height:100%;object-fit:cover;display:block}
.public-featured-event{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(240px,.8fr);gap:1.2rem;align-items:stretch;background:#fff;border:1px solid var(--public-border,#dbe5ef);border-radius:18px;overflow:hidden;box-shadow:0 10px 30px rgba(20,55,90,.08)}
.public-featured-event>img{width:100%;height:100%;min-height:250px;object-fit:cover}.public-featured-event>div{padding:1.4rem;display:flex;flex-direction:column;justify-content:center;align-items:flex-start;gap:.6rem}
.public-site-about{display:grid;grid-template-columns:minmax(0,1fr) minmax(320px,.85fr);gap:2rem;align-items:start}.public-site-mini-grid{display:grid;gap:.75rem}.public-site-mini-grid article{padding:1rem;border-radius:14px;background:#f4f8fc;border:1px solid #dbe7f2}.public-site-mini-grid p{margin:.25rem 0 0}
.public-site-join{display:flex;justify-content:space-between;gap:1.5rem;align-items:center;background:linear-gradient(135deg,#eaf4ff,#f7fbff);border:1px solid #cfe3f5;border-radius:18px;padding:1.5rem}.public-site-join h2{margin-top:0}
.public-event-cover,.public-news-cover{margin:0 0 1.25rem;border-radius:18px;overflow:hidden;max-height:560px;background:#edf3f8}.public-event-cover img,.public-news-cover img{width:100%;height:100%;max-height:560px;object-fit:cover;display:block}.public-event-badges{display:flex;flex-wrap:wrap;gap:.45rem;margin-bottom:.55rem}.public-event-program,.public-event-documents{margin-top:1.5rem;padding-top:1.25rem;border-top:1px solid #dbe5ef}
.public-download-list{display:grid;gap:.6rem}.public-download-list>a{display:flex;gap:.65rem;align-items:center;padding:.8rem 1rem;border:1px solid #dbe5ef;border-radius:12px;background:#fff;text-decoration:none}.public-download-list>a:hover{border-color:#4384bd;background:#f5faff}
.public-news-detail{max-width:880px;margin:0 auto;padding:1.5rem 0 3rem}.public-news-detail h1{font-size:clamp(2rem,5vw,3.4rem);line-height:1.08}.public-news-lead{font-size:1.2rem;color:#465b70}.public-news-content{font-size:1.04rem;line-height:1.75}.public-legal-page{max-width:900px;margin-inline:auto}.public-legal-page .pre-line{line-height:1.7}
.public-site-card progress{width:100%;height:.7rem;margin-top:.6rem}.public-site-card--compact .public-site-card__body{min-height:0}.badge--danger{background:#fde8e8;color:#9b1c1c}
@media (max-width:900px){.public-site-hero--visual,.public-featured-event,.public-site-about{grid-template-columns:1fr}.public-site-hero__image{min-height:210px}.public-site-join{align-items:flex-start;flex-direction:column}.public-featured-event>img{min-height:210px;max-height:340px}}
@media (max-width:560px){.public-site-hero--visual{padding:1rem}.public-event-detail__head{gap:.8rem}.public-event-detail__date{min-width:76px}.public-site-actions{width:100%}.public-site-actions a{width:100%;justify-content:center}}


/* ==========================================================================\n   Site public VIVALDI v0.37.0 — même langage visuel que le portail\n   ========================================================================== */
:root {
    --public-violet: #075fa8;
    --public-violet-dark: #0b3f68;
    --public-blue: #1378bd;
    --public-pink: #c54f78;
    --public-ink: #172733;
    --public-muted: #637581;
    --public-line: #e1e9ef;
    --public-soft: #f3f7fa;
}
.public-site-body { background: #f5f8fa; }
.public-site-shell { width: min(1160px, calc(100% - 28px)); }
.public-site-header { border-bottom-color: var(--public-line); background: rgba(255,255,255,.97); backdrop-filter: blur(10px); }
.public-site-header__inner { min-height: 70px; gap: 14px; }
.public-site-brand img { height: 50px; }
.public-site-nav { gap: 3px; }
.public-site-nav a { padding: 8px 10px; border-radius: 7px; font-size: .8rem; font-weight: 720; }
.public-site-nav a:hover, .public-site-nav a:focus-visible, .public-site-nav a[aria-current="page"] { color: var(--public-violet-dark); background: #edf5fa; box-shadow: none; }
.public-site-nav .public-site-nav__portal { background: var(--public-violet); box-shadow: none; }
.public-site-hero { grid-template-columns: minmax(0,1.35fr) minmax(240px,.65fr); gap: 24px; margin: 18px 0 26px; padding: clamp(24px,5vw,48px); border-radius: 14px; background: linear-gradient(135deg,#0b4775,#0867ad 68%,#1684c3); box-shadow: 0 12px 34px rgba(11,71,117,.16); }
.public-site-hero h1 { margin-bottom: 12px; font-size: clamp(2rem,4.2vw,3.7rem); line-height: 1.02; }
.public-site-hero p { font-size: clamp(.96rem,1.8vw,1.08rem); line-height: 1.55; }
.public-site-hero__visual { min-height: 220px; }
.public-site-hero__visual img { width: min(100%,330px); padding: 18px; border-radius: 14px; box-shadow: 0 12px 30px rgba(10,42,67,.2); }
.public-site-actions { gap: 8px; margin-top: 20px; }
.public-site-button { min-height: 40px; padding: 9px 14px; border-radius: 7px; box-shadow: none; font-size: .81rem; }
.public-site-section { padding: 26px 0; }
.public-site-section--soft { margin: 16px 0; padding: clamp(20px,4vw,34px); border-radius: 12px; box-shadow: 0 2px 10px rgba(23,39,51,.05); }
.public-site-section__heading { margin-bottom: 15px; }
.public-site-section__heading h2 { font-size: clamp(1.35rem,2.6vw,1.9rem); }
.public-site-card, .public-event-card, .public-news-card, .public-gallery-card, .public-partner-card, .public-form-card, .public-content-card { border: 1px solid var(--public-line); border-radius: 10px; box-shadow: 0 1px 4px rgba(23,39,51,.05); }
.public-site-grid { gap: 12px; }
.public-site-body input, .public-site-body select, .public-site-body textarea { min-height: 40px; padding: 8px 10px; border: 1px solid #cfdbe4; border-radius: 7px; font-size: .86rem; }
.public-site-body input:focus, .public-site-body select:focus, .public-site-body textarea:focus { border-color: var(--public-violet); box-shadow: 0 0 0 3px rgba(7,95,168,.1); }
.public-site-body label, .public-site-body legend { color: #3e5261; font-size: .78rem; font-weight: 750; }
.public-site-body fieldset { padding: 14px; border: 1px solid var(--public-line); border-radius: 8px; background: #f8fafc; }
.public-site-body .notice, .public-site-body .success, .public-site-body .warning, .public-site-body .error { border-radius: 7px; }
.public-site-footer { margin-top: 28px; }
@media (max-width: 760px) {
    .public-site-shell { width: min(100% - 20px,1160px); }
    .public-site-header__inner { min-height: 62px; }
    .public-site-brand img { height: 44px; }
    .public-site-hero { grid-template-columns: 1fr; margin-top: 10px; padding: 22px 18px; border-radius: 10px; }
    .public-site-hero__visual { min-height: 160px; }
    .public-site-section { padding: 20px 0; }
    .public-site-section--soft { padding: 18px 14px; }
}


/* ==========================================================================
   Portail VIVALDI v0.40.0 — cohérence du site public et des formulaires
   ========================================================================== */
:root {
    --public-radius-sm: 8px;
    --public-radius-md: 12px;
    --public-radius-lg: 18px;
    --public-shadow-sm: 0 2px 10px rgba(23, 39, 51, 0.06);
    --public-shadow-md: 0 12px 34px rgba(23, 39, 51, 0.09);
}

.public-site-shell {
    width: min(1180px, calc(100% - 28px));
}

.public-site-header__inner {
    min-height: 72px;
}

.public-site-brand img {
    height: 54px;
}

.public-site-nav a {
    min-height: 40px;
    display: inline-flex;
    align-items: center;
    border-radius: var(--public-radius-sm);
}

.public-site-hero {
    gap: 28px;
    margin-top: 20px;
    padding: clamp(26px, 5vw, 54px);
    border-radius: 22px;
    box-shadow: var(--public-shadow-md);
}

.public-site-hero h1 {
    font-size: clamp(2rem, 4.5vw, 4rem);
}

.public-site-section {
    padding: 30px 0;
}

.public-site-section--soft {
    border-radius: var(--public-radius-lg);
    box-shadow: var(--public-shadow-sm);
}

.public-site-card,
.public-site-feature-event,
.public-site-form-card,
.public-form-card,
.public-request-card {
    border-radius: var(--public-radius-md);
    box-shadow: var(--public-shadow-sm);
}

.public-site-button,
.public-form button,
.public-form .button,
.public-site-form button,
.public-site-form .button {
    min-height: 44px;
    border-radius: var(--public-radius-sm);
    box-shadow: none;
}

.public-form input,
.public-form select,
.public-form textarea,
.public-site-form input,
.public-site-form select,
.public-site-form textarea,
.public-site-body input,
.public-site-body select,
.public-site-body textarea {
    width: 100%;
    min-height: 44px;
    border: 1px solid var(--public-line);
    border-radius: var(--public-radius-sm);
    background: #fff;
}

.public-form input:focus,
.public-form select:focus,
.public-form textarea:focus,
.public-site-form input:focus,
.public-site-form select:focus,
.public-site-form textarea:focus,
.public-site-body input:focus,
.public-site-body select:focus,
.public-site-body textarea:focus {
    border-color: var(--public-violet);
    outline: 3px solid rgba(20, 114, 189, 0.12);
    outline-offset: 0;
}

.public-form fieldset,
.public-site-form fieldset,
.public-site-body fieldset {
    border-color: var(--public-line);
    border-radius: var(--public-radius-md);
}

.public-form-actions,
.public-site-form-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    align-items: center;
    justify-content: flex-end;
    margin-top: 18px;
    padding-top: 16px;
    border-top: 1px solid var(--public-line);
}

.public-site-empty,
.public-form-empty {
    padding: 24px 18px;
    border: 1px dashed var(--public-line);
    border-radius: var(--public-radius-md);
    color: var(--public-muted);
    background: var(--public-soft);
    text-align: center;
}

@media (max-width: 820px) {
    .public-site-header__inner {
        min-height: 64px;
    }

    .public-site-hero {
        grid-template-columns: 1fr;
    }

    .public-site-hero__visual {
        min-height: 190px;
    }

    .public-site-section__heading {
        align-items: flex-start;
        flex-direction: column;
    }
}

@media (max-width: 620px) {
    .public-site-shell {
        width: min(100% - 20px, 1180px);
    }

    .public-site-header__inner {
        gap: 10px;
    }

    .public-site-brand img {
        height: 46px;
    }

    .public-site-hero {
        margin-top: 12px;
        padding: 24px 18px;
        border-radius: 16px;
    }

    .public-site-section,
    .public-site-section--soft {
        padding-block: 22px;
    }

    .public-site-section--soft {
        padding-inline: 16px;
        border-radius: 14px;
    }

    .public-site-actions,
    .public-form-actions,
    .public-site-form-actions {
        align-items: stretch;
        flex-direction: column;
    }

    .public-site-actions > *,
    .public-form-actions > *,
    .public-site-form-actions > * {
        width: 100%;
    }

    .public-site-button,
    .public-form button,
    .public-form .button,
    .public-site-form button,
    .public-site-form .button {
        width: 100%;
        justify-content: center;
        font-size: 16px;
    }

    .public-site-body input,
    .public-site-body select,
    .public-site-body textarea {
        font-size: 16px;
    }
}
