/* Page-specific styles for /confidentialite/ */

.confidentialite-page {
    background-color: var(--surface-primary);
}

/* En-tête de page */
.confidentialite-hero {
    padding-block: var(--space-8) var(--space-6);
}

.confidentialite-hero__inner {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--space-5);
    max-width: 800px;
    margin-inline: auto;
    text-align: center;
}

.confidentialite-hero__title {
    font-size: var(--text-h1);
    line-height: var(--leading-h1);
    margin-block-end: 0;
}

.confidentialite-hero__intro {
    font-size: var(--text-body-large);
    line-height: var(--leading-body-large);
    margin-block-end: 0;
    max-width: 800px;
}

.confidentialite-hero__badge {
    display: flex;
    justify-content: center;
    margin-block-start: var(--space-2);
}

/* Table des matières */
.confidentialite-toc {
    padding-block: var(--space-5);
    background-color: rgba(155, 142, 196, 0.08);
    border-block: 1px solid var(--color-lavender);
}

.confidentialite-toc__inner {
    max-width: 800px;
    margin-inline: auto;
}

.confidentialite-toc__title {
    font-size: var(--text-h3);
    margin-block-end: var(--space-4);
}

.confidentialite-toc__list {
    list-style: none;
    padding-inline-start: 0;
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-3) var(--space-5);
    margin-block-end: 0;
}

.confidentialite-toc__list li {
    margin-block-end: 0;
}

.confidentialite-toc__list a {
    color: var(--color-saffron);
    font-weight: 700;
    text-decoration: none;
    transition: color var(--transition-color);
}

.confidentialite-toc__list a:hover,
.confidentialite-toc__list a:focus-visible {
    color: var(--color-olive);
    text-decoration: underline;
    text-underline-offset: 0.2em;
}

/* Sections génériques */
.confidentialite-section {
    padding-block: var(--space-8);
}

.confidentialite-section__inner {
    max-width: 800px;
    margin-inline: auto;
}

.confidentialite-section__title {
    font-size: var(--text-h2);
    line-height: var(--leading-h2);
    margin-block-end: var(--space-5);
}

/* Données collectées : cartes */
.confidentialite-cards {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: var(--space-5);
}

.confidentialite-card {
    background-color: var(--surface-card);
    border: 1px solid var(--color-lavender);
    border-radius: var(--radius-medium);
    padding: var(--space-5);
    box-shadow: var(--shadow-card);
    display: flex;
    flex-direction: column;
    gap: var(--space-4);
    min-width: 0;
}

.confidentialite-card__title {
    font-size: var(--text-h3);
    line-height: var(--leading-h3);
    margin-block-end: 0;
}

.confidentialite-card__text {
    margin-block-end: 0;
}

.confidentialite-card__list {
    list-style: none;
    padding-inline-start: 0;
    margin-block-end: 0;
    display: flex;
    flex-direction: column;
    gap: var(--space-2);
}

.confidentialite-card__list li {
    position: relative;
    padding-inline-start: var(--space-5);
    margin-block-end: 0;
}

.confidentialite-card__list li::before {
    content: "";
    position: absolute;
    left: 0;
    top: 0.5em;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background-color: var(--color-saffron);
}

.confidentialite-card__note {
    font-size: var(--text-caption);
    line-height: var(--leading-caption);
    margin-block-start: var(--space-2);
    margin-block-end: 0;
}

/* Utilisation des données */
.confidentialite-utilisation {
    display: flex;
    flex-direction: column;
    gap: var(--space-6);
}

.confidentialite-utilisation__block {
    display: flex;
    flex-direction: column;
    gap: var(--space-3);
}

.confidentialite-utilisation__title {
    font-size: var(--text-h3);
    line-height: var(--leading-h3);
    margin-block-end: 0;
}

.confidentialite-utilisation__text {
    margin-block-end: 0;
}

.confidentialite-utilisation__list {
    list-style: none;
    padding-inline-start: 0;
    margin-block-end: 0;
    display: flex;
    flex-direction: column;
    gap: var(--space-2);
}

.confidentialite-utilisation__list li {
    position: relative;
    padding-inline-start: var(--space-5);
    margin-block-end: 0;
}

.confidentialite-utilisation__list li::before {
    content: "";
    position: absolute;
    left: 0;
    top: 0.5em;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background-color: var(--color-saffron);
}

/* Base légale et consentement */
.confidentialite-legale {
    display: flex;
    flex-direction: column;
    gap: var(--space-6);
}

.confidentialite-legale__block {
    display: flex;
    flex-direction: column;
    gap: var(--space-3);
}

.confidentialite-legale__title {
    font-size: var(--text-h3);
    line-height: var(--leading-h3);
    margin-block-end: 0;
}

.confidentialite-legale__text {
    margin-block-end: 0;
}

.confidentialite-legale__list {
    list-style: none;
    padding-inline-start: 0;
    margin-block-end: 0;
    display: flex;
    flex-direction: column;
    gap: var(--space-2);
}

.confidentialite-legale__list li {
    position: relative;
    padding-inline-start: var(--space-5);
    margin-block-end: 0;
}

.confidentialite-legale__list li::before {
    content: "";
    position: absolute;
    left: 0;
    top: 0.5em;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background-color: var(--color-saffron);
}

.confidentialite-legale__callout {
    background-color: #F3F0F8;
    border: 1px solid var(--color-lavender);
    border-radius: var(--radius-medium);
    padding: var(--space-5);
    display: flex;
    flex-direction: column;
    gap: var(--space-3);
}

.confidentialite-legale__callout-title {
    font-size: var(--text-h3);
    line-height: var(--leading-h3);
    margin-block-end: 0;
}

.confidentialite-legale__callout-text {
    margin-block-end: 0;
}

.confidentialite-legale__callout-list {
    list-style: none;
    padding-inline-start: 0;
    margin-block-end: 0;
    display: flex;
    flex-direction: column;
    gap: var(--space-2);
}

.confidentialite-legale__callout-list li {
    position: relative;
    padding-inline-start: var(--space-5);
    margin-block-end: 0;
}

.confidentialite-legale__callout-list li::before {
    content: "";
    position: absolute;
    left: 0;
    top: 0.5em;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background-color: var(--color-saffron);
}

/* Partage et conservation */
.confidentialite-partage {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: var(--space-5);
}

.confidentialite-partage__column {
    display: flex;
    flex-direction: column;
    gap: var(--space-3);
    min-width: 0;
}

.confidentialite-partage__title {
    font-size: var(--text-h3);
    line-height: var(--leading-h3);
    margin-block-end: 0;
}

.confidentialite-partage__text {
    margin-block-end: 0;
}

.confidentialite-partage__list {
    list-style: none;
    padding-inline-start: 0;
    margin-block-end: 0;
    display: flex;
    flex-direction: column;
    gap: var(--space-2);
}

.confidentialite-partage__list li {
    position: relative;
    padding-inline-start: var(--space-5);
    margin-block-end: 0;
}

.confidentialite-partage__list li::before {
    content: "";
    position: absolute;
    left: 0;
    top: 0.5em;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background-color: var(--color-saffron);
}

/* Vos droits RGPD */
.confidentialite-droits {
    display: flex;
    flex-direction: column;
    gap: var(--space-6);
}

.confidentialite-droits__block {
    display: flex;
    flex-direction: column;
    gap: var(--space-3);
}

.confidentialite-droits__title {
    font-size: var(--text-h3);
    line-height: var(--leading-h3);
    margin-block-end: 0;
}

.confidentialite-droits__text {
    margin-block-end: 0;
}

.confidentialite-droits__list {
    list-style: none;
    padding-inline-start: 0;
    margin-block-end: 0;
    display: flex;
    flex-direction: column;
    gap: var(--space-2);
}

.confidentialite-droits__list li {
    position: relative;
    padding-inline-start: var(--space-5);
    margin-block-end: 0;
}

.confidentialite-droits__list li::before {
    content: "";
    position: absolute;
    left: 0;
    top: 0.5em;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background-color: var(--color-saffron);
}

/* Sécurité des données */
.confidentialite-securite {
    background-color: rgba(155, 142, 196, 0.08);
    border: 1px solid var(--color-lavender);
    border-radius: var(--radius-medium);
    padding: var(--space-5);
    display: flex;
    flex-direction: column;
    gap: var(--space-3);
}

.confidentialite-securite__title {
    font-size: var(--text-h3);
    line-height: var(--leading-h3);
    margin-block-end: 0;
}

.confidentialite-securite__text {
    margin-block-end: 0;
}

.confidentialite-securite__list {
    list-style: none;
    padding-inline-start: 0;
    margin-block-end: 0;
    display: flex;
    flex-direction: column;
    gap: var(--space-2);
}

.confidentialite-securite__list li {
    position: relative;
    padding-inline-start: var(--space-5);
    margin-block-end: 0;
}

.confidentialite-securite__list li::before {
    content: "";
    position: absolute;
    left: 0;
    top: 0.5em;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background-color: var(--color-saffron);
}

/* Contact et modifications */
.confidentialite-contact {
    display: flex;
    flex-direction: column;
    gap: var(--space-6);
}

.confidentialite-contact__card {
    background-color: #F3F0F8;
    border: 1px solid var(--color-lavender);
    border-radius: var(--radius-medium);
    padding: var(--space-5);
    display: flex;
    flex-direction: column;
    gap: var(--space-3);
}

.confidentialite-contact__title {
    font-size: var(--text-h3);
    line-height: var(--leading-h3);
    margin-block-end: 0;
}

.confidentialite-contact__text {
    margin-block-end: 0;
}

.confidentialite-contact__list {
    list-style: none;
    padding-inline-start: 0;
    margin-block-end: 0;
    display: flex;
    flex-direction: column;
    gap: var(--space-2);
}

.confidentialite-contact__list li {
    position: relative;
    padding-inline-start: var(--space-5);
    margin-block-end: 0;
}

.confidentialite-contact__list li::before {
    content: "";
    position: absolute;
    left: 0;
    top: 0.5em;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background-color: var(--color-saffron);
}

.confidentialite-contact__block {
    display: flex;
    flex-direction: column;
    gap: var(--space-3);
}

.confidentialite-contact__date {
    font-weight: 700;
    color: var(--color-saffron);
    margin-block-end: 0;
}

/* Responsive */
@media (max-width: 1023px) {
    .confidentialite-cards {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 767px) {
    .confidentialite-hero {
        padding-block: var(--space-7) var(--space-5);
    }

    .confidentialite-hero__title {
        font-size: 1.75rem;
    }

    .confidentialite-hero__intro {
        font-size: var(--text-body);
        line-height: var(--leading-body);
    }

    .confidentialite-toc {
        padding-block: var(--space-4);
    }

    .confidentialite-toc__list {
        flex-direction: column;
        gap: var(--space-2);
    }

    .confidentialite-section {
        padding-block: var(--space-7);
    }

    .confidentialite-cards {
        grid-template-columns: 1fr;
        gap: var(--space-4);
    }

    .confidentialite-card {
        padding: var(--space-4);
    }

    .confidentialite-partage {
        grid-template-columns: 1fr;
        gap: var(--space-4);
    }

    .confidentialite-legale__callout,
    .confidentialite-contact__card,
    .confidentialite-securite {
        padding: var(--space-4);
    }
}

@media (max-width: 479px) {
    .confidentialite-hero__title {
        font-size: 1.5rem;
    }

    .confidentialite-section__title {
        font-size: 1.5rem;
    }

    .confidentialite-card__title,
    .confidentialite-utilisation__title,
    .confidentialite-legale__title,
    .confidentialite-legale__callout-title,
    .confidentialite-partage__title,
    .confidentialite-droits__title,
    .confidentialite-securite__title,
    .confidentialite-contact__title {
        font-size: 1.25rem;
    }
}

@media (prefers-reduced-motion: reduce) {
    .confidentialite-page *,
    .confidentialite-page *::before,
    .confidentialite-page *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
        scroll-behavior: auto !important;
    }
}
