/* ==========================================================================
   The Recruiter - Homepage Styles (Pixel Perfect Figma)
   ========================================================================== */

/* Global smooth transition on ALL hover states */
a,
button,
input,
textarea,
select,
.btn,
.hero-card,
.expertise-card,
.expertise-card__title,
.expertise-card__subtitle,
.expertise-card__icon img,
.job-listing-item,
.job-listing-item__arrow,
.job-listing-item__arrow svg,
.news-listing-item,
.news-listing-item__arrow,
.news-listing-item__arrow svg,
.network-card,
.network-card__arrow,
.sector-card,
.sector-card__plus,
.advisory-card__plus,
.site-footer__social-link,
.site-footer__nav-list a,
.site-footer__legal a,
.mobile-nav__close,
.mobile-nav__back,
.mobile-nav__link,
.mobile-nav__btn,
.solution-card,
.filter-dropdown__trigger,
.filter-dropdown__item,
.switch-btn,
.pagination__number,
.pagination__arrow,
.pagination__item a,
.article-share__icon,
.article-back__link,
.article-back__underline,
.contact-form__checkbox label a,
.job-item,
.job-item__arrow,
.check-process-step,
.mission-card,
img {
    transition: all 0.3s ease;
}

/* Buttons: always fit content, never stretch to block width */
.btn {
    width: fit-content !important;
    align-self: flex-start;
}

/* Exceptions: buttons that SHOULD be full-width */
.mobile-nav__actions .btn {
    width: 100% !important;
    align-self: stretch;
}

/* Removed: contact-form and login-form btn full-width override - buttons should be fit-content */

/* ==========================================================================
   Hero Section - Harmonized spacing (menu → H1)
   ========================================================================== */

/* All hero sections get the same top padding for consistency */
.page-hero,
.advisory-hero,
.check-hero,
.contact-hero,
.rejoindre-hero,
.savoir-faire-hero,
.team-hero,
.certifications-page {
    padding-top: 80px !important;
}

/* Homepage hero: no top padding (transparent header overlays) */
.home-hero {
    padding-top: 0;
    padding-bottom: 0;
    background-color: var(--bg-light);
}

.home-hero__content {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 16px;
    max-width: 1208px;
    margin: 0 auto;
    text-align: center;
    margin-bottom: 64px;
}

.home-hero__title {
    font-family: var(--font-heading);
    font-size: 80px;
    font-weight: 400;
    line-height: 110px;
    color: var(--iron-shadow-500);
    margin: 0;
}

.home-hero__subtitle {
    font-family: var(--font-body);
    font-size: 28px;
    font-weight: 300;
    line-height: 32px;
    color: var(--silver-mist-700);
    max-width: 788px;
    margin: 0;
}

/* Hero Cards */
.home-hero__cards {
    display: flex;
    justify-content: space-between;
    gap: 24px;
}

.home-hero__cards-right {
    display: flex;
    flex-direction: column;
    gap: 24px;
}

.hero-card {
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    gap: 48px;
    padding: 48px 32px;
    border-radius: 12px;
    overflow: hidden;
    text-decoration: none;
    background-size: cover;
    background-position: center;
    transition: transform 0.3s ease;
    cursor: pointer;
}

.hero-card:hover {
    transform: scale(1.01);
}

.hero-card--large {
    width: 925px;
    height: 600px;
    background-image: url('../images/hero-advisory.jpg?v=2');
}

.hero-card--recruiter {
    width: 656px;
    height: 250px;
    background-image: url('../images/hero-recruiter.jpg?v=2');
}

.hero-card--check {
    width: 656px;
    height: 326px;
    background-image: url('../images/hero-check.jpg?v=2');
}

/* Hero card overlays - vert olive pour Advisory et Check, gris pour Recruiter */
.hero-card::before {
    content: '';
    position: absolute;
    inset: 0;
    border-radius: 12px;
    z-index: 0;
}

.hero-card--large::before {
    background: rgba(0, 0, 0, 0.2);
}

.hero-card--recruiter::before {
    background: rgba(0, 0, 0, 0.3);
}

.hero-card--check::before {
    background: rgba(0, 0, 0, 0.3);
}

.hero-card__border {
    position: absolute;
    top: 20px;
    left: 20px;
    right: 20px;
    bottom: 20px;
    border: 1px solid var(--silver-dew-500);
    border-radius: 24px;
    pointer-events: none;
    z-index: 1;
    /* Fade vers le bas */
    -webkit-mask-image: linear-gradient(to bottom, white 0%, white 20%, transparent 60%);
    mask-image: linear-gradient(to bottom, white 0%, white 20%, transparent 60%);
    transition: opacity 0.3s ease;
}

.hero-card:hover .hero-card__border {
    opacity: 0;
}

.hero-card__content {
    position: relative;
    z-index: 2;
}

.hero-card__text {
    font-family: var(--font-body);
    font-weight: 300;
    font-style: normal;
    color: var(--silver-dew-500);
    margin: 0;
}

.hero-card--large .hero-card__text {
    font-size: 46px;
    line-height: 52px;
    max-width: 460px;
}

.hero-card--recruiter .hero-card__text,
.hero-card--check .hero-card__text {
    font-size: 38px;
    line-height: 42px;
    max-width: 560px;
}

.hero-card__logo {
    position: absolute;
    z-index: 2;
}

/* HR Advisory logo - bottom right */
.hero-card--large .hero-card__logo {
    right: 24px;
    bottom: 24px;
    width: 169px;
}

/* The Recruiter logo - bottom right */
.hero-card--recruiter .hero-card__logo {
    right: 24px;
    bottom: 24px;
    width: 169px;
}

/* Background Check logo - bottom right */
.hero-card--check .hero-card__logo {
    right: 24px;
    bottom: 24px;
    width: 169px;
}

.hero-card__logo img,
.hero-card__logo svg {
    width: 100%;
    height: auto;
    display: block;
}

/* Bouton hover - apparaît au survol */
.hero-card__hover-btn {
    position: absolute;
    top: 48px;
    right: 48px;
    width: 72px;
    height: 72px;
    background-color: var(--silver-dew-500);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 3;
    opacity: 0;
    transform: scale(0.8);
    transition: opacity 0.3s ease, transform 0.3s ease;
}

.hero-card__hover-btn svg {
    width: 24px;
    height: 24px;
    color: var(--iron-shadow-500);
}

/* Overlay noir au hover */
.hero-card::after {
    content: '';
    position: absolute;
    inset: 0;
    background: rgba(0, 0, 0, 0);
    border-radius: 12px;
    z-index: 1;
    transition: background 0.3s ease;
}

.hero-card:hover::after {
    background: rgba(0, 0, 0, 0.3);
}

.hero-card:hover .hero-card__hover-btn {
    opacity: 1;
    transform: scale(1);
}

.hero-card:hover {
    transform: none;
}

/* ==========================================================================
   Section Styles
   ========================================================================== */

.section-header {
    margin-bottom: 64px;
}

.section-header--center {
    text-align: center;
}

.section-header__title {
    font-family: var(--font-heading);
    font-size: 48px;
    font-weight: 400;
    line-height: 56px;
    color: var(--iron-shadow-500);
    margin: 0 0 16px 0;
}

.section-header__title--white {
    color: var(--silver-dew-500);
}

.section-header__subtitle {
    font-family: var(--font-body);
    font-size: 28px;
    font-weight: 300;
    line-height: 32px;
    color: var(--silver-mist-700);
    margin: 0;
}

.section-footer {
    display: flex;
    justify-content: center;
    margin-top: 48px;
}

/* ==========================================================================
   Expertise Section (Figma exact)
   ========================================================================== */

.expertise-section {
    padding-top: clamp(80px, 10vw, 160px);
    padding-bottom: clamp(80px, 10vw, 160px);
}

.expertise-grid {
    display: flex;
    flex-direction: column;
    gap: clamp(16px, 3vw, 32px);
    max-width: 1326px;
    margin: 0 auto;
}

.expertise-grid__row {
    display: flex;
    gap: clamp(16px, 3vw, 32px);
}

.expertise-grid__row--2 .expertise-card {
    flex: 1;
}

.expertise-grid__row--3 .expertise-card {
    flex: 1;
}

.expertise-card {
    background-color: var(--silver-dew-500);
    border-radius: clamp(12px, 2vw, 20px);
    padding: clamp(20px, 4vw, 40px);
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: clamp(16px, 3vw, 32px);
    text-decoration: none;
    transition: background-color 0.3s ease, box-shadow 0.3s ease;
}

.expertise-card:hover {
    box-shadow: 0 4px 24px rgba(0, 0, 0, 0.06);
}

/* Hover variants */
.expertise-card--hover-gray:hover {
    background-color: #6d6d6d;
}

.expertise-card--hover-beige:hover {
    background-color: #c4a092;
}

.expertise-card--hover-olive:hover {
    background-color: #c0b388;
}

/* Accent card: beige base, light hover */
.expertise-card--accent {
    background-color: #c4a092;
}

.expertise-card--accent:hover {
    background-color: #f4f7f6;
}

/* On hover: text and icon turn white */
.expertise-card--hover-gray:hover .expertise-card__title,
.expertise-card--hover-gray:hover .expertise-card__subtitle,
.expertise-card--hover-beige:hover .expertise-card__title,
.expertise-card--hover-beige:hover .expertise-card__subtitle,
.expertise-card--hover-olive:hover .expertise-card__title,
.expertise-card--hover-olive:hover .expertise-card__subtitle {
    color: #ffffff;
}

.expertise-card--hover-gray:hover .expertise-card__icon img,
.expertise-card--hover-beige:hover .expertise-card__icon img,
.expertise-card--hover-olive:hover .expertise-card__icon img {
    filter: brightness(0) invert(1);
}

/* Accent card: beige base with white text/icons */
.expertise-card--accent .expertise-card__title,
.expertise-card--accent .expertise-card__subtitle {
    color: #ffffff;
}

.expertise-card--accent .expertise-card__icon img {
    filter: brightness(0) invert(1);
}

.expertise-card--accent:hover .expertise-card__title {
    color: var(--iron-shadow-500);
}

.expertise-card--accent:hover .expertise-card__subtitle {
    color: #8c94a5;
}

.expertise-card--accent:hover .expertise-card__icon img {
    filter: none;
}

.expertise-card__icon {
    width: clamp(48px, 8vw, 80px);
    height: clamp(48px, 8vw, 80px);
    flex-shrink: 0;
}

.expertise-card__icon img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    transition: filter 0.3s ease;
}

.expertise-card__icon svg {
    width: 100%;
    height: 100%;
    color: var(--mushroom-beige-500);
}

.expertise-card__content {
    display: flex;
    flex-direction: column;
    gap: clamp(8px, 1.5vw, 12px);
}

.expertise-card__title {
    font-family: var(--font-body);
    font-size: clamp(16px, 2.5vw, 28px);
    font-weight: 400;
    line-height: 1.15;
    color: var(--iron-shadow-500);
    margin: 0;
    transition: color 0.3s ease;
}

.expertise-card__subtitle {
    font-family: var(--font-body);
    font-size: clamp(14px, 1.8vw, 20px);
    font-weight: 300;
    line-height: 1.3;
    color: var(--iron-shadow-500);
    margin: 0;
    transition: color 0.3s ease;
}

/* Responsive: Tablet */
@media (max-width: 1024px) {
    .expertise-grid__row--3 {
        flex-wrap: wrap;
    }

    .expertise-grid__row--3 .expertise-card {
        flex: 1 1 calc(50% - 16px);
        min-width: 280px;
    }
}

/* Responsive: Mobile */
@media (max-width: 768px) {
    .expertise-grid__row {
        flex-direction: column;
    }

    .expertise-grid__row--2 .expertise-card,
    .expertise-grid__row--3 .expertise-card {
        flex: 1 1 100%;
    }
}

/* Responsive: hero spacing mobile */
@media (max-width: 768px) {
    .page-hero,
    .advisory-hero,
    .check-hero,
    .contact-hero,
    .rejoindre-hero,
    .savoir-faire-hero,
    .team-hero,
    .certifications-page {
        padding-top: 40px !important;
    }
}

/* Responsive: Ultra small */
@media (max-width: 375px) {
    .expertise-card {
        padding: 16px;
        gap: 12px;
        border-radius: 10px;
    }

    .expertise-card__icon {
        width: 40px;
        height: 40px;
    }

    .expertise-card__title {
        font-size: 14px;
    }

    .expertise-card__subtitle {
        font-size: 12px;
    }

    .expertise-card__content {
        gap: 8px;
    }
}

/* ==========================================================================
   Approach Section (Figma exact)
   ========================================================================== */

.approach-section {
    padding-top: 160px;
    padding-bottom: 160px;
    background-color: #171717;
}

.approach-section__image {
    position: relative;
    width: 100%;
    max-width: 1330px;
    height: clamp(280px, 30vw, 480px);
    margin: 0 auto 96px auto;
    background-image: url('../images/approach-bg.jpg');
    background-size: cover;
    background-position: center;
    border-radius: 12px;
    overflow: hidden;
    padding: 60px;
}

.approach-section__image::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(0, 0, 0, 0.2);
    z-index: 1;
}

.approach-section__image-border {
    position: absolute;
    top: 20px;
    left: 20px;
    right: 20px;
    bottom: 20px;
    border: 1px solid var(--silver-dew-500);
    border-radius: 24px;
    z-index: 2;
    pointer-events: none;
    -webkit-mask-image: linear-gradient(to bottom, white 0%, white 30%, transparent 70%);
    mask-image: linear-gradient(to bottom, white 0%, white 30%, transparent 70%);
}

.approach-section__content {
    display: flex;
    justify-content: space-between;
    gap: 16px;
    max-width: 1330px;
    margin: 0 auto;
}

.approach-section__text {
    display: flex;
    flex-direction: column;
    gap: 48px;
    flex-shrink: 0;
    width: fit-content;
}

.approach-section__text .btn {
    white-space: nowrap;
}

@media (max-width: 768px) {
    .approach-section__text {
        width: auto !important;
    }
    .approach-section__text .btn {
        white-space: normal;
    }
    .btn--primary {
        font-size: clamp(14px, 3.5vw, 22px);
        padding: 12px 16px;
    }
    .news-listing-item__arrow,
    .job-item__arrow,
    .job-listing-item__arrow {
        display: none !important;
    }
    .network-card__logo {
        top: auto !important;
        left: auto !important;
        bottom: 20px !important;
        right: 20px !important;
        transform: none !important;
    }

    /* Check page mobile fixes */
    .check-why__actions {
        flex-direction: column !important;
        gap: 16px !important;
    }
    .check-why__left {
        width: 100% !important;
        flex: none !important;
    }
    .check-why__image-wrapper,
    .check-why__image {
        width: 100% !important;
        max-width: 100% !important;
    }
    .check-why__image img {
        width: 100% !important;
        height: auto !important;
    }
    .check-why__left {
        width: 100% !important;
        flex: none !important;
        max-width: 100% !important;
    }
    .check-why__image-wrapper {
        width: 100% !important;
        height: 400px !important;
        overflow: hidden !important;
    }
    .check-why__image {
        width: 100% !important;
        height: 100% !important;
    }
    .check-why__image img {
        width: 100% !important;
        height: 100% !important;
        object-fit: cover !important;
    }
    .check-why__border-frame {
        top: 5% !important;
        left: 5% !important;
        right: 5% !important;
        bottom: 5% !important;
    }
    .check-why__glass-overlay {
        width: 100% !important;
        left: 0 !important;
        transform: none !important;
        height: auto !important;
        padding: 12px 16px !important;
        border-radius: 0 !important;
        overflow: hidden !important;
    }
    .check-why__glass-overlay h3 {
        font-size: 18px !important;
        line-height: 1 !important;
        margin: 2px 0 0 !important;
    }
    .check-why__glass-overlay .check-why__badge {
        font-size: 10px !important;
        line-height: 1 !important;
    }
    .check-why__glass-overlay .check-why__badge img {
        width: 8px !important;
        height: 8px !important;
    }
    .check-worldwide__image-wrapper {
        width: 100% !important;
        height: 300px !important;
        flex: none !important;
    }
    .check-worldwide__image-wrapper img {
        width: 100% !important;
        height: 100% !important;
    }
    .check-worldwide__image-overlay {
        top: auto !important;
        left: 0 !important;
        right: 0 !important;
        bottom: 0 !important;
        border-radius: 0 0 20px 20px !important;
    }
    .check-process__left {
        position: static !important;
        padding-top: 40px !important;
        padding-bottom: 40px !important;
    }
    .check-stat-card:not(.check-stat-card--large) {
        height: auto !important;
        min-height: auto !important;
    }
    .check-stat-card__number {
        font-size: 48px !important;
    }
    .btn--check {
        font-size: clamp(14px, 3.5vw, 22px) !important;
    }
    .network-card__logo img {
        width: 80px !important;
        height: auto !important;
    }
    .btn--primary .btn__text {
        height: 26px;
    }

    /* Job items mobile fix */
    .job-item {
        flex-direction: column !important;
        gap: 16px !important;
        padding: 24px !important;
    }
    .job-item__inner {
        flex-direction: column !important;
        align-items: flex-start !important;
        gap: 16px !important;
    }
    .job-item__left {
        flex-direction: column !important;
        align-items: flex-start !important;
        width: 100% !important;
    }
    .job-item__image {
        width: 100% !important;
        height: 180px !important;
    }
    .job-item__content {
        width: 100% !important;
    }
}

.approach-section__title {
    font-family: var(--font-heading);
    font-size: 48px;
    font-weight: 400;
    line-height: 56px;
    color: #f7f7f7;
    margin: 0;
}

.approach-section__description {
    width: 100%;
    max-width: 790px;
    font-family: var(--font-body);
    font-size: 22px;
    font-weight: 300;
    line-height: 26px;
    color: #c4c9d1;
}

.approach-section__description p {
    margin: 0 0 26px 0;
}

.approach-section__description p:last-child {
    margin-bottom: 0;
}

.approach-section__highlight {
    font-size: 28px;
    line-height: 32px;
    color: #ffffff;
}

.approach-section__description p + .approach-section__list {
    margin-top: -26px;
}

.approach-section__list {
    margin: 0 0 26px 0;
    padding-left: 20px;
    font-family: var(--font-body);
    font-size: 22px;
    font-weight: 300;
    line-height: 26px;
    color: #c4c9d1;
    list-style-type: square;
}

.approach-section__list li {
    margin-bottom: 0;
}

.approach-section__list li::marker {
    font-size: 12px;
}

/* ==========================================================================
   Opportunities Section (Figma exact)
   ========================================================================== */

.opportunities-section {
    padding-top: 96px;
    padding-bottom: 160px;
    background-color: #ebddd7;
}

.opportunities-section .section-header {
    margin-bottom: 96px;
}

.opportunities-section .section-header__title {
    font-family: var(--font-heading);
    font-size: 48px;
    font-weight: 400;
    line-height: 56px;
    color: var(--iron-shadow-500);
    margin: 0 0 16px 0;
}

.opportunities-section .section-header__subtitle {
    font-family: var(--font-body);
    font-size: 28px;
    font-weight: 300;
    line-height: 32px;
    color: #8c94a5;
    margin: 0;
}

.job-listing {
    display: flex;
    flex-direction: column;
    gap: 16px;
    max-width: 1330px;
    margin: 0 auto;
}

.job-listing-item {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 16px 32px;
    text-decoration: none;
    border-radius: 20px;
    transition: background-color 0.3s ease;
}

.job-listing-item--light {
    background-color: rgba(244, 247, 246, 0.35);
}

.job-listing-item--filled {
    background-color: rgba(244, 247, 246, 0.75);
}

.job-listing-item__inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    gap: 32px;
}

.job-listing-item__left {
    display: flex;
    align-items: center;
    gap: 32px;
}

.job-listing-item__image {
    width: 160px;
    height: 120px;
    border-radius: 20px;
    overflow: hidden;
    flex-shrink: 0;
}

.job-listing-item__image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.job-listing-item__title {
    font-family: var(--font-body);
    font-size: clamp(18px, 3vw, 28px);
    font-weight: 300;
    line-height: clamp(22px, 3.5vw, 32px);
    color: #735e59;
    margin: 0;
}

.job-listing-item__arrow {
    width: 40px;
    height: 40px;
    flex-shrink: 0;
    border: 1.2px solid #735e59;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.3s ease;
}

.job-listing-item__arrow svg {
    width: 22px;
    height: 22px;
    color: #735e59;
}

.job-listing-item:hover .job-listing-item__arrow {
    background-color: #735e59;
    border-color: #735e59;
}

.job-listing-item:hover .job-listing-item__arrow svg {
    color: #ffffff;
}

.job-listing__empty {
    text-align: center;
    padding: 64px 32px;
    color: var(--silver-mist-700);
    border-radius: 20px;
    background-color: #f4f7f6;
}

.opportunities-section .section-footer {
    margin-top: 48px;
}

/* ==========================================================================
   News Section (Figma exact)
   ========================================================================== */

.news-section {
    padding-top: 160px;
    padding-bottom: 160px;
}

.news-listing {
    display: flex;
    flex-direction: column;
    max-width: 1124px;
    margin: 0 auto;
}

.news-listing-item {
    display: block;
    padding: 64px 32px;
    text-decoration: none;
    border-radius: 20px;
    transition: background-color 0.3s ease;
}

.news-listing-item--light {
    background-color: rgba(244, 247, 246, 0.75);
}

.news-listing-item--filled {
    background-color: rgba(234, 236, 239, 0.75);
}

.news-listing-item__inner {
    display: flex;
    align-items: center;
    gap: 48px;
    width: 100%;
}

.news-listing-item__image {
    width: 240px;
    height: 180px;
    border-radius: 20px;
    overflow: hidden;
    flex-shrink: 0;
}

.news-listing-item__image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.news-listing-item__content {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 24px;
    min-width: 0;
}

.news-listing-item__title {
    font-family: var(--font-body);
    font-size: 28px;
    font-weight: 300;
    line-height: 32px;
    color: #000000;
    margin: 0;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.news-listing-item__excerpt {
    font-family: var(--font-body);
    font-size: 22px;
    font-weight: 300;
    line-height: 26px;
    color: #8c94a5;
    margin: 0;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.news-listing-item__arrow {
    width: 40px;
    height: 40px;
    flex-shrink: 0;
    border: 1.2px solid #cccccc;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.3s ease;
}

.news-listing-item__arrow svg {
    width: 22px;
    height: 22px;
    color: var(--iron-shadow-500);
}

.news-listing-item:hover .news-listing-item__arrow {
    background-color: var(--iron-shadow-500);
    border-color: var(--iron-shadow-500);
}

.news-listing-item:hover .news-listing-item__arrow svg {
    color: #ffffff;
}

a.news-listing-item.news-listing-item--hover-gray:hover {
    background-color: rgba(109, 109, 109, 0.35);
}

a.news-listing-item.news-listing-item--hover-advisory:hover {
    background-color: rgba(156, 138, 120, 0.35);
}

a.news-listing-item.news-listing-item--hover-check:hover {
    background-color: rgba(192, 179, 136, 0.35);
}

.news-listing__empty {
    text-align: center;
    padding: 64px 32px;
    color: #8c94a5;
    border-radius: 20px;
    background-color: rgba(244, 247, 246, 0.75);
}

/* ==========================================================================
   Network Section (Figma exact)
   ========================================================================== */

.network-section {
    padding-top: clamp(80px, 10vw, 160px);
    padding-bottom: 0;
    margin-bottom: -1px;
}

.network-section .section-header {
    margin-bottom: 66px;
}

.text-muted {
    color: var(--silver-mist-700);
}

.network-cards {
    display: flex;
    gap: clamp(12px, 2vw, 24px);
    justify-content: center;
    flex-wrap: wrap;
}

.network-card {
    position: relative;
    width: clamp(280px, 30vw, 460px);
    height: 308px;
    background-color: var(--iron-shadow-300);
    border-radius: 8px;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    padding: 24px;
    text-decoration: none;
    flex: 1 1 clamp(280px, 30vw, 460px);
    max-width: 460px;
}

.network-card__background {
    position: absolute;
    inset: 0;
    background-color: var(--iron-shadow-300);
    transition: background-color 0.3s ease, opacity 0.3s ease;
}

.network-card__arrow {
    position: absolute;
    top: 24px;
    right: 24px;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background-color: var(--silver-dew-500);
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 0;
    transition: opacity 0.3s ease;
}

.network-card:hover .network-card__arrow {
    opacity: 1;
}

.network-card__arrow svg {
    width: 22px;
    height: 22px;
    color: var(--iron-shadow-500);
}

.network-card__logo {
    position: absolute;
    top: 64px;
    left: 50%;
    transform: translateX(-50%);
    width: 200px;
}

.network-card__logo img {
    width: 100%;
    height: auto;
}

.network-card__content {
    position: absolute;
    bottom: 24px;
    left: 24px;
    right: 24px;
    z-index: 1;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.network-card__title {
    font-family: var(--font-heading);
    font-size: 22px;
    font-weight: 400;
    line-height: 24px;
    color: var(--silver-dew-500);
    margin: 0;
}

.network-card__description {
    font-family: var(--font-body);
    font-size: 20px;
    font-weight: 300;
    line-height: 22px;
    color: var(--soft-silver-400);
    margin: 0;
}

.network-card--recruiter .network-card__description {
    color: #dfdfdf;
}

.network-card--advisory .network-card__description {
    color: #ebddd7;
}

.network-card--check .network-card__description {
    color: #dfd9c4;
}

.network-card:hover .network-card__description {
    color: #ffffff;
}

.network-card--recruiter:hover .network-card__background {
    background-color: #b0b0b0;
    opacity: 0.6;
}

.network-card--advisory:hover .network-card__background {
    background-color: #c4a092;
    opacity: 0.6;
}

.network-card--check:hover .network-card__background {
    background-color: #d9d1b9;
    opacity: 0.6;
}

/* Network section responsive */
@media (max-width: 1024px) {
    .network-cards {
        flex-direction: column;
        gap: 16px;
        max-width: 600px;
        margin: 0 auto;
    }

    .network-card {
        flex: none;
        width: 100%;
        max-width: 100%;
        height: auto;
        min-height: auto;
        padding: clamp(20px, 5vw, 32px);
        padding-bottom: 48px;
        border-radius: 12px;
    }

    .network-card__logo {
        position: absolute;
        top: auto;
        left: auto;
        bottom: 12px;
        right: 12px;
        transform: none;
        width: 80px;
    }

    .network-card__arrow {
        display: none;
    }

    .network-card__content {
        position: static;
        margin-bottom: clamp(16px, 4vw, 32px);
        gap: clamp(8px, 2vw, 12px);
    }

    .network-card__title {
        font-size: clamp(16px, 4.5vw, 20px);
        line-height: 1.3;
    }

    .network-card__description {
        font-size: clamp(14px, 3.8vw, 18px);
        line-height: 1.3;
    }
}

@media (max-width: 768px) {
    .approach-section__image {
        padding: 16px !important;
    }
    .approach-section__image-border {
        border-radius: 12px !important;
    }
    .site-footer {
        padding-top: 40px !important;
        padding-bottom: 24px !important;
    }
    .site-footer__divider {
        margin-bottom: 40px !important;
    }
    .site-footer__contact-links {
        flex-direction: column;
        align-items: flex-start;
    }
    .site-footer__contact-links span {
        display: none;
    }
}

/* ==========================================================================
   Responsive Styles
   ========================================================================== */

@media (max-width: 1650px) {
    .home-hero__cards {
        flex-direction: column;
    }

    .hero-card--large {
        width: 100%;
    }

    .home-hero__cards-right {
        flex-direction: row;
        align-items: stretch;
    }

    .hero-card--recruiter,
    .hero-card--check {
        flex: 1;
        width: auto;
        height: 300px;
    }
}

@media (max-width: 1400px) {
    .home-hero__title {
        font-size: 60px;
        line-height: 68px;
    }

    .home-hero__subtitle {
        font-size: 24px;
        line-height: 28px;
    }

    .hero-card--large .hero-card__text {
        font-size: 36px;
        line-height: 42px;
        width: auto;
    }

    .hero-card--recruiter .hero-card__text,
    .hero-card--check .hero-card__text {
        font-size: 28px;
        line-height: 34px;
        width: auto;
    }

}

@media (max-width: 1200px) {
    .approach-section__description {
        width: 100%;
        max-width: none;
    }

    .approach-section__content {
        flex-direction: column;
        gap: 48px;
    }

    .job-listing-item__title {
        width: auto;
        margin-right: 48px;
    }

    .news-listing-item__content {
        margin-right: 48px;
    }
}

@media (max-width: 992px) {
    .home-hero {
        padding-top: 0;
    }

    .home-hero__cards-right {
        flex-direction: column;
    }

    .hero-card--recruiter,
    .hero-card--check {
        width: 100%;
    }

    .hero-card__border {
        display: none;
    }

    .approach-section__image {
        width: 100%;
        height: 300px;
    }

    .job-listing-item {
        flex-wrap: wrap;
        gap: 24px;
    }

    .job-listing-item__content {
        flex: auto;
        width: 100%;
        margin-right: 0;
    }

    .news-listing-item__inner {
        gap: 24px;
    }
}

@media (max-width: 768px) {
    .home-hero {
        padding-top: 0;
    }

    .home-hero__title {
        font-size: 40px;
        line-height: 46px;
    }

    .home-hero__subtitle {
        font-size: 20px;
        line-height: 24px;
    }

    .hero-card {
        height: auto;
        min-height: 250px;
    }

    .hero-card--large .hero-card__text {
        font-size: 22px;
        line-height: 28px;
    }

    .hero-card--recruiter .hero-card__text,
    .hero-card--check .hero-card__text {
        font-size: 20px;
        line-height: 26px;
    }

    .hero-card {
        padding: 20px;
        min-height: 180px;
    }

    .hero-card--recruiter,
    .hero-card--check {
        padding-bottom: 56px;
    }

    .hero-card__logo {
        width: 110px !important;
        bottom: 16px !important;
        right: 16px !important;
    }

    .section-header__title {
        font-size: 32px;
        line-height: 40px;
    }

    .section-header__subtitle {
        font-size: 20px;
        line-height: 26px;
    }

    .expertise-card {
        padding: 24px;
    }

    .expertise-card__title {
        font-size: 22px;
        line-height: 28px;
    }

    .approach-section__title {
        font-size: 32px;
        line-height: 40px;
    }

    .approach-section__description {
        font-size: 18px;
        line-height: 24px;
    }

    /* Job listing responsive */
    .job-listing-item {
        padding: 16px;
    }

    .job-listing-item__inner {
        gap: 16px;
    }

    .job-listing-item__left {
        gap: 16px;
        min-width: 0;
    }

    .job-listing-item__image {
        width: 100px;
        height: 75px;
    }

    .job-listing-item__title {
        font-size: clamp(16px, 4.5vw, 22px);
        line-height: clamp(20px, 5vw, 26px);
    }

    .job-listing-item__arrow {
        width: 32px;
        height: 32px;
    }

    .job-listing-item__arrow svg {
        width: 16px;
        height: 16px;
    }

    /* News listing responsive */
    .news-listing-item__inner {
        flex-direction: column;
        gap: clamp(16px, 4vw, 24px);
    }

    .news-listing-item__image {
        width: 100%;
        flex-direction: column;
        align-items: flex-start;
        gap: clamp(12px, 3vw, 24px);
    }

    .news-listing-item__image {
        width: 100%;
        height: clamp(150px, 40vw, 200px);
    }

    .news-listing-item__content {
        padding: 0;
        gap: clamp(12px, 3vw, 24px);
    }

    .news-listing-item__title {
        font-size: clamp(18px, 5vw, 28px);
        line-height: clamp(22px, 5.5vw, 32px);
    }

    .news-listing-item__excerpt {
        font-size: clamp(14px, 4vw, 22px);
        line-height: clamp(18px, 4.5vw, 26px);
    }

    .news-listing-item__arrow {
        align-self: flex-end;
        width: clamp(32px, 8vw, 40px);
        height: clamp(32px, 8vw, 40px);
    }

    .news-listing-item__arrow svg {
        width: clamp(16px, 4vw, 22px);
        height: clamp(16px, 4vw, 22px);
    }
}

/* Spontaneous section content switching */
.spontaneous-section .spontaneous-section__content-block {
    display: none !important;
}

.spontaneous-section .spontaneous-section__content-block--active {
    display: flex !important;
    flex-direction: column;
}

.spontaneous-section .spontaneous-section__right.spontaneous-section__content-block--active {
    display: flex !important;
}

.spontaneous-section .btn.spontaneous-section__content-block--active {
    display: inline-flex !important;
    flex-direction: row;
}

/* Job items - horizontal layout like Figma */
.job-item {
    flex-direction: row;
    align-items: center;
    gap: 48px;
    padding: 64px 32px;
    border-radius: 20px;
}

.job-item--light {
    background-color: rgba(244, 247, 246, 0.75);
}

.job-item--alt {
    background-color: rgba(234, 236, 239, 0.75);
}

.job-item__image {
    width: 160px;
    height: 120px;
    border-radius: 20px;
    overflow: hidden;
    flex-shrink: 0;
}

.job-item__content {
    flex: 1;
    min-width: 0;
}

.job-item__arrow {
    flex-shrink: 0;
}

/* Job excerpt - 2 lines with ellipsis, extra space for descenders (g, p, y) */
.job-item__excerpt {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    padding-bottom: 6px;
    margin-bottom: -6px;
}

/* Contact page */
.contact-form-wrapper {
    gap: 128px;
}

.contact-form-section {
    padding-bottom: 160px;
}

.contact-form__image-inner img {
    object-position: 60% center;
}

/* Contact page divider */
.contact-divider {
    background-color: #171717;
}

.contact-divider__line {
    border: none;
    border-top: 1px solid #4a4a4a;
    margin: 0;
    max-width: 1600px;
}

/* Footer - no bottom padding */
.site-footer {
    padding-bottom: 24px !important;
}

/* ==========================================================================
   Pagination (Figma match)
   ========================================================================== */

.jobs-archive__pagination {
    gap: 24px;
    margin-top: 160px;
    margin-bottom: 0;
}

.pagination__arrow {
    width: 31px;
    height: 31px;
    border-radius: 4px;
    background-color: #b0b0b0;
    border: none;
    color: #ffffff;
}

.pagination__arrow:hover {
    background-color: var(--iron-shadow-500);
    border-color: var(--iron-shadow-500);
}

.pagination__arrow svg {
    width: 16px;
    height: 16px;
}

.pagination__numbers {
    gap: 8px;
}

.pagination__number {
    width: auto;
    height: auto;
    border-radius: 0;
    background: none;
    border: none;
    font-family: var(--font-body);
    font-size: 22px;
    font-weight: 300;
    line-height: 26px;
    color: #8c94a5;
    text-decoration: none;
}

.pagination__number:hover {
    background: none;
    color: var(--iron-shadow-500);
}

.pagination__number--active {
    background: none;
    color: var(--iron-shadow-500);
}

/* Filter badge counter */
.filter-badge {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 18px;
    height: 18px;
    border-radius: 4px;
    background-color: #0a0d11;
    color: #ffffff;
    font-family: var(--font-body);
    font-size: 10px;
    font-weight: 300;
    line-height: 1;
}

.singularity-item__content strong {
    font-weight: 400;
    color: var(--iron-shadow-500);
}

/* ==========================================================================
   Sector Cards (Recrutement page)
   ========================================================================== */

.sector-grid {
    display: flex;
    flex-direction: column;
    gap: 32px;
    max-width: 1326px;
    margin: 0 auto;
}

.sector-grid-section .section-header {
    text-align: center;
    max-width: 1330px;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 64px;
}

.sector-grid__row {
    display: flex;
    gap: 32px;
}

.sector-grid__row--2 .sector-card {
    flex: 1;
}

.sector-grid__row--3 .sector-card {
    flex: 1;
}

.sector-card {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    background-color: #ffffff;
    border-radius: 20px;
    padding: 40px;
    border: none;
    cursor: pointer;
    text-align: left;
    font: inherit;
    transition: box-shadow 0.3s ease;
    max-height: 224px;
    overflow: hidden;
    position: relative;
}

.sector-card::after {
    content: '';
    position: absolute;
    inset: 0;
    border-radius: 20px;
    background: linear-gradient(to left, #6d6d6d, #8f8f8f 50%);
    opacity: 0;
    transition: opacity 0.3s ease;
    pointer-events: none;
}

.sector-card:hover::after {
    opacity: 1;
}

.sector-card__left,
.sector-card__plus {
    position: relative;
    z-index: 1;
}

.sector-card:hover .sector-card__title {
    color: #ffffff;
}

.sector-card:hover .sector-card__icon img {
    filter: brightness(0) invert(1);
}

.sector-card__left {
    display: flex;
    flex-direction: column;
    gap: 32px;
}

.sector-card__icon {
    width: 80px;
    height: 80px;
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
}

.sector-card__icon img {
    object-fit: contain;
    filter: brightness(0) saturate(100%) invert(95%) sepia(5%) saturate(200%) hue-rotate(190deg) brightness(95%) contrast(90%);
    transition: filter 0.3s ease;
}

.sector-card__title {
    font-family: var(--font-body);
    font-size: 28px;
    font-weight: 300;
    line-height: 32px;
    color: var(--iron-shadow-500);
    margin: 0;
    white-space: nowrap;
    transition: color 0.3s ease;
}

.sector-card__plus {
    width: 42px;
    height: 42px;
    border-radius: 50%;
    border: 1.2px solid #cccccc;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 24px;
    font-weight: 300;
    color: var(--iron-shadow-500);
    flex-shrink: 0;
    padding-bottom: 3px;
    flex-shrink: 0;
    transition: all 0.3s ease;
}

.sector-card:hover .sector-card__plus {
    border-color: #dadde3;
    color: #ffffff;
}


@media (max-width: 1024px) {
    .sector-grid__row {
        flex-wrap: wrap;
    }

    .sector-grid__row--3 .sector-card {
        flex: 1 1 calc(50% - 16px);
        min-width: calc(50% - 16px);
    }
}

@media (max-width: 768px) {
    .sector-grid {
        gap: 16px;
    }

    .sector-grid__row {
        flex-direction: column;
        gap: 16px;
    }

    .sector-grid__row--3 .sector-card {
        flex: 1 1 100%;
        min-width: 100%;
    }

    .sector-card {
        padding: 24px;
    }

    .sector-card__icon {
        width: 60px;
        height: 60px;
    }

    .sector-card__title {
        font-size: 22px;
        line-height: 28px;
    }
}

/* ==========================================================================
   Footer Social Links
   ========================================================================== */

.site-footer__social {
    display: flex;
    flex-direction: column;
    gap: 16px;
    align-items: flex-start;
}

.site-footer__social .site-footer__social-link {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 8px;
    height: 40px;
    border-radius: 4px;
    color: #ffffff;
    text-decoration: none;
    font-family: var(--font-body);
    font-size: 18px;
    font-weight: 300;
    line-height: 1;
    transition: opacity 0.3s ease;
}

.site-footer__social .site-footer__social-link:hover {
    opacity: 0.85;
    color: #ffffff;
}

.site-footer__social-link--linkedin {
    background-color: #115589;
}

.site-footer__social-link--instagram {
    background-color: #e1306c;
}

.site-footer__social-link svg {
    width: 24px;
    height: 24px;
    flex-shrink: 0;
    fill: #ffffff;
}

/* ==========================================================================
   HR Advisory Page - Rebuilt from Figma
   ========================================================================== */

/* Utility: Copper text color (Figma #c4a092) */
.text-copper {
    color: #c4a092;
}

/* Hero separator line */
.advisory-hero__separator {
    width: 600px;
    height: 1px;
    background-color: #c4a092;
    margin: 0 auto;
}

/* Hero: reorder - title/subtitle at top, then separator, then logo */
.advisory-hero__content {
    gap: 48px;
}

.advisory-hero__logo {
    margin-bottom: 0;
}

/* Intro buttons row */
.advisory-intro__buttons {
    display: flex;
    gap: 32px;
    align-items: center;
}

/* Advisory title uses copper for second line instead of text-muted */
.advisory-intro__title .text-copper {
    color: #c4a092;
}

/* ==========================================================================
   Advisory Domain Sections (Talent Management + Conseil et stratégie)
   ========================================================================== */

.advisory-domain {
    padding: 0;
}

.advisory-domain--dark {
    background-color: var(--bg-dark);
}

.advisory-domain--light {
    background-color: #f6f3ee;
}

.advisory-domain__inner {
    max-width: 1330px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    gap: 96px;
    padding: 160px 0;
}

.advisory-domain__header {
    display: flex;
    gap: 48px;
    align-items: flex-start;
    justify-content: space-between;
}

.advisory-domain__header-left {
    flex: 0 0 287px;
}

.advisory-domain__header-right {
    flex: 0 0 790px;
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.advisory-domain__title {
    font-family: var(--font-heading);
    font-size: 48px;
    font-weight: 400;
    line-height: 56px;
    margin: 0;
}

.advisory-domain--dark .advisory-domain__title {
    color: var(--silver-dew-500);
}

.advisory-domain--light .advisory-domain__title {
    color: var(--iron-shadow-500);
}

.advisory-domain__description {
    font-family: var(--font-body);
    font-size: 24px;
    font-weight: 300;
    line-height: 32px;
    margin: 0;
}

.advisory-domain--dark .advisory-domain__description,
.advisory-domain--dark .advisory-domain__header-right,
.advisory-domain--dark .advisory-domain__header-right p {
    color: var(--silver-dew-500);
}

.advisory-domain--light .advisory-domain__description {
    color: var(--iron-shadow-500);
}

.advisory-domain--light .advisory-domain__header-right p {
    font-weight: 500;
}

/* Advisory Cards Grid */
.advisory-domain__cards {
    display: flex;
    gap: 16px;
}

.advisory-card {
    flex: 1;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    padding: 48px 32px;
    border-radius: var(--radius-xl);
    position: relative;
    min-height: 400px;
    cursor: pointer;
}

.advisory-card--dark {
    background: linear-gradient(80.37deg, #2e2e2e 13.55%, #0a0d11 187.95%);
    transition: background 0.3s ease;
}

.advisory-card--dark:hover {
    background: #4a4a4a;
}

.advisory-card--light {
    background-color: var(--silver-dew-500);
}

.advisory-card__header {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.advisory-card__step {
    font-family: var(--font-body);
    font-size: 22px;
    font-weight: 300;
    line-height: 26px;
}

.advisory-card--dark .advisory-card__step {
    color: var(--silver-mist-500);
}

.advisory-card--light .advisory-card__step {
    color: var(--silver-mist-500);
}

.advisory-card__title {
    font-family: var(--font-body);
    font-size: 32px;
    font-weight: 300;
    line-height: 36px;
    margin: 0;
}

.advisory-card--dark .advisory-card__title {
    color: var(--silver-dew-500);
}

.advisory-card--light .advisory-card__title {
    color: var(--iron-shadow-500);
}

.advisory-card__details {
    margin-top: auto;
    list-style-type: square;
    padding-left: 20px;
    font-family: var(--font-body);
    font-size: 22px;
    font-weight: 300;
    line-height: 26px;
    margin-bottom: 0;
}

.advisory-card__details li {
    margin-bottom: 0;
}

.advisory-card--dark .advisory-card__details {
    color: var(--silver-mist-500);
}

.advisory-card--light .advisory-card__details {
    color: var(--silver-mist-700);
}

/* Plus button */
.advisory-card__plus {
    position: absolute;
    top: 32px;
    right: 32px;
    width: 42px;
    height: 42px;
    border-radius: var(--radius-pill);
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: background-color 0.3s ease;
}

.advisory-card--dark .advisory-card__plus {
    background-color: transparent;
    border: 1.2px solid var(--silver-mist-400, #dadde3);
    color: var(--silver-dew-500);
}

.advisory-card--light .advisory-card__plus {
    background-color: transparent;
    border: 1.2px solid var(--silver-mist-300);
    color: var(--iron-shadow-500);
}

.advisory-card--dark:hover .advisory-card__plus {
    background-color: #ffffff;
    border-color: #ffffff;
    color: #000000;
}

.advisory-card--light:hover .advisory-card__plus {
    background-color: rgba(0, 0, 0, 0.05);
}

/* Advisory domain action button */
.advisory-domain__action {
    display: flex;
    margin-top: -32px;
    margin-left: 50px;
}

/* Advisory Detail Modals - content-specific styles */
.modal__body--advisory {
    gap: 24px;
}

.modal__body--advisory p {
    font-family: var(--font-body);
    font-size: 22px;
    font-weight: 300;
    line-height: 26px;
    color: var(--silver-mist-500);
    margin: 0;
}

.modal-adv__subtitle {
    font-weight: 400;
}

.modal-adv__quote {
    font-family: var(--font-body);
    font-size: 22px;
    font-weight: 300;
    line-height: 26px;
    color: var(--silver-mist-500);
    margin: 0;
    padding-left: 16px;
    border-left: 1px solid var(--silver-mist-500);
}

.modal-adv__list {
    list-style: disc;
    padding-left: 24px;
    font-family: var(--font-body);
    font-size: 22px;
    font-weight: 300;
    line-height: 26px;
    color: var(--silver-mist-500);
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.modal-adv__list strong {
    color: white;
    font-weight: 400;
}

.modal-adv__timeline {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: 16px;
    font-family: var(--font-body);
    font-size: 22px;
    font-weight: 300;
    line-height: 26px;
    color: white;
}

.modal-adv__timeline li {
    position: relative;
    padding-left: 42px;
}

.modal-adv__timeline li::before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    width: 26px;
    height: 26px;
    background: radial-gradient(circle, #fff 1.95px, #2E2E2E 1.95px);
    border: 1px solid #fff;
    border-radius: 50%;
    box-sizing: border-box;
    z-index: 1;
}

.modal-adv__timeline li::after {
    content: "";
    position: absolute;
    left: 12px;
    top: 26px;
    width: 1px;
    height: calc(100% - 10px);
    background-color: #fff;
}

.modal-adv__timeline li:last-child::after {
    display: none;
}

.modal-adv__timeline--detailed li {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.modal-adv__timeline--detailed li:last-child::after {
    display: block;
    height: calc(100% - 26px);
}

.modal-adv__timeline--detailed li strong {
    font-weight: 400;
}

.modal-adv__timeline--detailed li span,
.modal-adv__timeline--detailed li ul {
    color: var(--silver-mist-500);
}

.modal-adv__timeline--detailed li > ul {
    list-style: none;
    padding-left: 16px;
    margin: 8px 0 0;
    display: flex;
    flex-direction: column;
    gap: 4px;
    font-size: 20px;
    line-height: 22px;
}

.modal-adv__timeline--detailed li ul li {
    position: relative;
    padding-left: 12px;
}

.modal-adv__timeline--detailed li ul li::before {
    content: "";
    position: absolute;
    left: 0;
    top: 9px;
    width: 4px;
    height: 4px;
    background: #fff;
    border: none;
    border-radius: 0;
}

.modal-adv__timeline--detailed li ul li::after {
    display: none;
}

@media (max-width: 768px) {
    .modal__body--advisory {
        gap: 16px;
    }

    .modal__body--advisory p,
    .modal-adv__quote,
    .modal-adv__list,
    .modal-adv__timeline {
        font-size: 16px;
        line-height: 22px;
    }

    .modal-adv__timeline li {
        padding-left: 32px;
    }

    .modal-adv__timeline li::before {
        width: 22px;
        height: 22px;
    }

    .modal-adv__timeline li::after {
        left: 10px;
        top: 22px;
        height: calc(100% - 6px);
    }

    .modal-adv__timeline--detailed li > ul {
        font-size: 16px;
        line-height: 22px;
    }

}

/* Competences page */
.competences-page__list {
    list-style-type: square;
    padding-left: 20px;
    font-family: var(--font-body);
    font-size: 22px;
    font-weight: 300;
    line-height: 26px;
    color: var(--iron-shadow-500);
    margin: 0;
}

.competences-page__list li {
    margin-bottom: 4px;
}

.competences-page__list li::marker {
    font-size: 12px;
}

.competences-page__separator {
    border: none;
    border-top: 1px solid #cccccc;
    margin: 48px 0;
}

.competences-page__separator--inner {
    max-width: 1060px;
    margin: 32px 0;
}

.competences-page__body strong {
    font-weight: 400;
    color: var(--iron-shadow-500);
}

.competences-page__assessment {
    align-items: flex-end;
}

.competences-page__bottom-spacing {
    height: 160px;
}

/* ==========================================================================
   Formation / Outplacement Page
   ========================================================================== */

/* Body text should be black not gray on all advisory sub-pages */
.competences-page__body p {
    color: #8C94A5 !important;
}

.competences-page__body--black p,
.competences-page--black .competences-page__body p {
    color: var(--iron-shadow-500) !important;
    margin: 0 !important;
}

.competences-page__body--large p,
p.competences-page__body--large {
    font-family: var(--font-body);
    font-size: clamp(18px, 2.5vw, 28px) !important;
    line-height: clamp(24px, 3vw, 34px) !important;
    font-weight: 300;
    color: var(--iron-shadow-500);
    margin: 0;
    white-space: pre-line;
}

.etude-section {
    display: flex;
    flex-direction: column;
    gap: 24px;
}

.competences-page--black .competences-page__content {
    gap: 0 !important;
}

.competences-page--black .competences-page__back {
    margin-bottom: 48px;
}

.competences-page--black .competences-page__title {
    font-size: clamp(32px, 4vw, 48px) !important;
    line-height: clamp(40px, 4.5vw, 56px) !important;
}

.competences-page--black .formation-page__intro-text {
    font-size: clamp(20px, 2.5vw, 28px) !important;
    line-height: clamp(26px, 3vw, 34px) !important;
}

.competences-page--black .formation-page__subtitle {
    font-size: clamp(20px, 2.5vw, 28px) !important;
    line-height: clamp(26px, 3vw, 34px) !important;
}

.competences-page--black p.competences-page__body,
.competences-page--black .competences-page__list li {
    font-size: clamp(16px, 2vw, 22px) !important;
    line-height: clamp(22px, 2.5vw, 26px) !important;
}

.gestion-remuneration__main {
    display: flex;
    flex-direction: column;
    gap: 48px;
}

.gestion-remuneration__analyse {
    display: flex;
    flex-direction: column;
    gap: 24px;
    padding: 24px 0;
}

.competences-page--black .formation-page__body-section {
    padding: 0 !important;
    gap: 0 !important;
}

.competences-page--black .competences-page__body {
    margin-top: 0 !important;
}

p.competences-page__body {
    font-family: var(--font-body);
    font-size: 22px !important;
    font-weight: 300;
    line-height: 26px;
    color: var(--iron-shadow-500);
    margin: 0;
    white-space: pre-line;
}

.competences-page--black .competences-page__body p {
    white-space: pre-line;
}

.competences-page--black .competences-page__list {
    color: var(--iron-shadow-500) !important;
    list-style: none !important;
    padding-left: 0 !important;
}

.competences-page--black .competences-page__list li {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    font-weight: 400 !important;
}

.competences-page--black .competences-page__list li::before {
    content: '';
    width: 6px;
    height: 6px;
    background-color: var(--iron-shadow-500);
    border-radius: 1px;
    flex-shrink: 0;
    margin-top: 10px;
}

.competences-page--black .competences-page__list li {
    margin-bottom: 16px !important;
}

.competences-page--black .competences-page__list li:last-child {
    margin-bottom: 0 !important;
}

/* Horizontal inline list with square bullets */
.formation-page__horizontal-list {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    list-style: none;
    padding: 0;
    margin: 0;
    font-family: var(--font-body);
    font-size: 22px;
    font-weight: 300;
    line-height: 26px;
    color: var(--iron-shadow-500);
}

.formation-page__horizontal-list li {
    display: flex;
    align-items: center;
    gap: 16px;
}

.formation-page__horizontal-list li::before {
    content: '';
    width: 6px;
    height: 6px;
    background-color: var(--iron-shadow-500);
    border-radius: 1px;
    flex-shrink: 0;
}

/* Intro text - 28px like Figma */
.formation-page__intro-text {
    font-family: var(--font-body);
    font-size: 28px;
    font-weight: 300;
    line-height: 34px;
    color: var(--iron-shadow-500);
    margin: 0;
}

/* Body section with top/bottom padding matching Figma (24px) */
.formation-page__body-section {
    display: flex;
    flex-direction: column;
    gap: 24px;
    padding: 24px 0;
}

/* Subtitle - 28px Halyard Display 300 */
.formation-page__subtitle {
    font-family: var(--font-body);
    font-size: 28px;
    font-weight: 300;
    line-height: 34px;
    color: var(--iron-shadow-500);
    margin: 0;
}

/* Body text - 22px */
.formation-page__body-text {
    font-family: var(--font-body);
    font-size: 22px;
    font-weight: 300;
    line-height: 26px;
    color: var(--iron-shadow-500);
    margin: 0;
}

/* Combinations wrapper */
.formation-page__combinations-wrapper {
    display: flex;
    flex-direction: column;
    gap: 48px;
}

/* Combinations section */
.formation-page__combinations {
    display: flex;
    flex-direction: column;
    gap: 24px;
}

.formation-page__combinations-label {
    font-family: var(--font-body);
    font-size: 22px;
    font-weight: 400;
    line-height: 26px;
    color: var(--iron-shadow-500);
    margin: 0;
}

.formation-page__combinations-list {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

/* Combination item */
.formation-page__combination-item {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.formation-page__combination-header {
    display: flex;
    align-items: center;
    gap: 16px;
}

.formation-page__combination-bullet {
    width: 6px;
    height: 6px;
    background-color: var(--iron-shadow-500);
    flex-shrink: 0;
}

.formation-page__combination-title {
    font-family: var(--font-body);
    font-size: 22px;
    font-weight: 400;
    line-height: 26px;
    color: var(--iron-shadow-500);
}

.formation-page__combination-desc {
    padding-left: 22px;
}

.formation-page__combination-desc p {
    font-family: var(--font-body);
    font-size: 20px;
    font-weight: 300;
    line-height: 24px;
    color: var(--iron-shadow-500);
    margin: 0;
    white-space: pre-line;
}

/* Method section */
.formation-page__method {
    display: flex;
    flex-direction: column;
    gap: 24px;
}

.formation-page__step {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.formation-page__step-header {
    display: flex;
    align-items: center;
    gap: 16px;
}

.formation-page__step-bullet {
    width: 6px;
    height: 6px;
    background-color: var(--iron-shadow-500);
    flex-shrink: 0;
}

.formation-page__step-title {
    font-family: var(--font-body);
    font-size: 20px;
    font-weight: 400;
    line-height: 24px;
    color: var(--iron-shadow-500);
}

.formation-page__step-items {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.formation-page__step-item {
    display: flex;
    align-items: center;
    gap: 16px;
    padding-left: 22px;
}

.formation-page__step-item-bullet {
    width: 6px;
    height: 6px;
    background-color: #ebddd7;
    flex-shrink: 0;
}

.formation-page__step-item span:last-child {
    font-family: var(--font-body);
    font-size: 20px;
    font-weight: 300;
    line-height: 24px;
    color: var(--iron-shadow-500);
}

/* Follow-up */
.formation-page__followup {
    display: flex;
    align-items: center;
    gap: 16px;
    padding: 0 22px;
}

.formation-page__followup-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    width: 24px;
    height: 24px;
    background-color: #f6f3ee;
    border-radius: 4px;
}

.formation-page__followup-text {
    font-family: var(--font-body);
    font-size: 20px;
    font-weight: 400;
    line-height: 24px;
    color: var(--iron-shadow-500);
}

/* Solutions section */
.formation-page__solutions {
    display: flex;
    flex-direction: column;
    gap: 24px;
    background-color: #ebddd7;
    padding: 24px;
    border-radius: 20px;
}

.formation-page__solutions-title {
    font-family: var(--font-body);
    font-size: 28px;
    font-weight: 400;
    line-height: 34px;
    color: #9c8a78;
    margin: 0;
}

.formation-page__solutions-cards {
    display: flex;
    gap: 24px;
}

.formation-page__solutions-card {
    flex: 1;
    background-color: #ffffff;
    padding: 16px;
    border-radius: 12px;
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.formation-page__solutions-card-title {
    font-family: var(--font-body);
    font-size: 22px;
    font-weight: 400;
    line-height: 26px;
    color: #9c8a78;
    margin: 0;
}

.formation-page__solutions-card-text {
    font-family: var(--font-body);
    font-size: 22px;
    font-weight: 300;
    line-height: 26px;
    color: #9c8a78;
    margin: 0;
    white-space: pre-line;
}

/* Formation page responsive */
@media (max-width: 768px) {
    .formation-page__intro-text {
        font-size: 22px;
        line-height: 28px;
    }

    .formation-page__subtitle {
        font-size: 22px;
        line-height: 28px;
    }

    .formation-page__solutions-cards {
        flex-direction: column;
    }
}

.btn--advisory {
    background-color: #c4a092;
}

.btn--advisory:hover {
    background-color: #b0897b;
}

.btn--advisory-dark {
    background-color: #9c8a78;
    color: var(--silver-dew-500);
    padding: 16px 24px;
    border-radius: 4px;
}

.btn--advisory-dark:hover {
    background-color: #b09e8c;
}

.btn--advisory-dark .btn__text {
    height: 25px;
    overflow: hidden;
    gap: 10px;
}

.btn--advisory-dark .btn__text > span {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-shrink: 0;
    height: 25px;
}

.btn--advisory-dark .btn__text > span svg {
    width: 24px;
    height: 24px;
    flex-shrink: 0;
}

.btn--advisory-dark:hover .btn__text > span {
    transform: translateY(calc(-100% - 10px));
}

/* ==========================================================================
   Advisory Page Responsive
   ========================================================================== */

@media (max-width: 1400px) {
    .advisory-hero__separator {
        width: 400px;
    }

    .advisory-domain__header {
        gap: 32px;
    }

    .advisory-domain__header-left {
        flex: 0 0 250px;
    }

    .advisory-domain__header-right {
        flex: 1;
    }
}

@media (max-width: 1200px) {
    .advisory-domain__header {
        flex-direction: column;
    }

    .advisory-domain__header-left {
        flex: none;
        width: 100%;
    }

    .advisory-domain__header-right {
        flex: none;
        width: 100%;
    }

    .advisory-domain__cards {
        flex-direction: column;
    }

    .advisory-card {
        min-height: 300px;
    }

    .advisory-domain__inner {
        padding: 80px 0;
        gap: 64px;
    }
}

@media (max-width: 768px) {
    .advisory-hero__separator {
        width: 80%;
    }

    .advisory-intro__buttons {
        flex-direction: column;
        align-items: flex-start;
        gap: 16px;
    }

    .advisory-domain__inner {
        padding: 60px 0;
        gap: 48px;
    }

    .advisory-card__title {
        font-size: 26px;
        line-height: 32px;
    }

    .advisory-domain__title {
        font-size: 36px;
        line-height: 44px;
    }

    .advisory-domain__description {
        font-size: 20px;
        line-height: 28px;
    }
}

/* ==========================================================================
   Consultance RH stratégique Page (temps-partage-missions)
   ========================================================================== */

/* Service cards container */
.consultance-page__cards {
    display: flex;
    flex-direction: column;
}

/* Individual service card */
.consultance-page__card {
    background-color: #f4f7f6;
    padding: 24px 0;
}

.consultance-page__card-content {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 40px;
}

.consultance-page__card-text {
    display: flex;
    flex-direction: column;
    gap: 24px;
    flex: 1;
    min-width: 0;
}

.consultance-page__card-title {
    font-family: var(--font-body);
    font-size: 28px;
    font-weight: 300;
    line-height: 34px;
    color: var(--iron-shadow-500);
    margin: 0;
}

.consultance-page__card-desc {
    font-family: var(--font-body);
    font-size: 20px;
    font-weight: 300;
    line-height: 24px;
    color: var(--iron-shadow-500);
    margin: 0;
}

.consultance-page__card-icon {
    width: 80px;
    height: 80px;
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #f7f7f7;
}

.consultance-page__card-icon svg {
    width: 50px;
    height: 64px;
}

.consultance-page__card-separator {
    border: none;
    border-top: 1px solid #cccccc;
    margin: 24px 0 0;
}

/* Last card: show separator like others */

/* Bullet list for service RH externalisé */
.consultance-page__list {
    list-style-type: square;
    color: var(--iron-shadow-500) !important;
    font-weight: 400 !important;
}

.consultance-page__list li {
    font-family: var(--font-body);
    font-size: 22px;
    font-weight: 400;
    line-height: 26px;
    color: var(--iron-shadow-500);
    margin-bottom: 16px;
    margin-bottom: 8px;
}

/* Solution text */
.consultance-page__solution-text {
    font-family: var(--font-body);
    font-size: 22px;
    font-weight: 300;
    line-height: 26px;
    color: #9c8a78;
    margin: 0;
}

/* Responsive */
@media (max-width: 768px) {
    .consultance-page__card-content {
        flex-direction: column;
        gap: 24px;
    }

    .consultance-page__card-icon {
        align-self: flex-end;
        width: 48px;
        height: 48px;
    }

    .consultance-page__card-icon svg {
        width: 32px;
        height: 40px;
    }

    .consultance-page__card-title {
        font-size: 22px;
        line-height: 28px;
    }
}

/* Fix sticky positioning: overflow-x:hidden on html/body breaks position:sticky.
   Use overflow-x:clip instead which prevents horizontal scroll without creating a scroll container. */
html,
body {
    overflow-x: clip !important;
}

/* Check page - desktop sticky fix */
@media (min-width: 1201px) {
    .check-process .check-process__content .check-process__left {
        position: sticky !important;
        top: 120px !important;
        align-self: flex-start !important;
    }
}

/* Check page */
.check-features__cta .btn--check-text {
    color: #ffffff;
}
.check-process-step__desc {
    font-family: var(--font-body);
    font-size: 22px;
    font-weight: 300;
    line-height: 26px;
    color: #8c94a5;
    margin: 8px 0 0 0;
}

.check-stats__divider,
.check-features__divider {
    width: 1330px;
    max-width: 100%;
    margin-left: auto;
    margin-right: auto;
}

.check-worldwide {
    background: #ffffff;
    padding: 160px 0;
}

.check-worldwide__content {
    gap: 96px;
    max-width: 1330px;
    margin: 0 auto;
}

.check-worldwide__title {
    margin-bottom: 48px;
}

.check-worldwide__highlight {
    font-size: 28px;
    line-height: 32px;
    color: var(--iron-shadow-500);
    margin-bottom: 24px;
}

.check-worldwide__body p {
    color: #8c94a5;
}

.check-worldwide__image-wrapper {
    width: 540px;
    height: 560px;
    position: relative;
    flex-shrink: 0;
}

.check-worldwide__image-wrapper img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 20px;
}

.check-worldwide__image-overlay {
    position: absolute;
    top: 20px;
    left: 20px;
    right: 20px;
    bottom: 20px;
    border: 1px solid rgba(255,255,255,0.5);
    border-radius: 24px;
    pointer-events: none;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    padding: 24px;
}

.check-worldwide__card-title {
    font-family: var(--font-heading);
    font-size: 36px;
    font-weight: 400;
    line-height: 44px;
    color: #ffffff;
    margin: 0 0 12px 0;
}

.check-worldwide__card-badge {
    display: flex;
    align-items: center;
    gap: 8px;
    font-family: var(--font-body);
    font-size: 20px;
    font-weight: 300;
    line-height: 22px;
    color: #ffffff;
}

.check-worldwide__card-dot {
    width: 12px;
    height: 12px;
    border-radius: 50%;
    background: #ffffff;
    flex-shrink: 0;
}
.check-intro {
    background: #f4f7f6;
}

/* ==========================================================================
   Check Page - Color & styling fixes per Figma
   ========================================================================== */

/* Gold accent color for title spans */
.text-gold {
    color: #c0b388;
}

/* Light gold for dark backgrounds */
.text-gold-light {
    color: #d9d1b9;
}

/* --- Section: check-intro (3244-4130) --- */
.check-intro__title .text-gold {
    color: #c0b388;
}

/* --- Section: check-features (3049-8398) --- */
/* Feature card description: Figma #c4c9d1 */
.check-feature-card__description {
    color: #c4c9d1;
}

/* Highlight card: Figma bg #c0b388 (gold, not olive green) */
.check-feature-card--highlight {
    background: #c0b388;
}

/* Highlight card title: stays white */
.check-feature-card--highlight .check-feature-card__title {
    color: #ffffff;
}

/* Highlight card description: Figma #eaecef */
.check-feature-card--highlight .check-feature-card__description {
    color: #eaecef;
}

/* Features subtitle: Figma #c4c9d1 */
/* Navbar mega menu logos */
.mega-menu__logo img {
    width: 220px;
    height: auto;
    object-fit: contain;
}

.check-feature-card__icon {
    --fill-0: #D9D1B9;
}

.check-features__header {
    text-align: left;
    max-width: 800px;
}

.check-features__subtitle {
    color: #c4c9d1;
    margin-left: 0;
    margin-right: 0;
}

/* --- Section: check-worldwide image overlay (4436-8923) --- */
.check-worldwide__image-wrapper {
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
}

/* Gradient overlay on image */
.check-worldwide__image-wrapper::after {
    content: '';
    position: absolute;
    inset: 0;
    background: rgba(0, 0, 0, 0.1);
    border-radius: 20px;
    pointer-events: none;
    z-index: 1;
}

/* White border frame inset 20px */
.check-worldwide__border-frame {
    position: absolute;
    top: 20px;
    left: 20px;
    right: 20px;
    bottom: 20px;
    border: 1px solid rgba(255, 255, 255, 0.6);
    border-radius: 24px;
    overflow: hidden;
    z-index: 2;
    pointer-events: none;
}

/* Glass card at bottom of border frame */
.check-worldwide__image-overlay {
    position: absolute;
    bottom: -1px;
    left: 0;
    right: 0;
    top: auto;
    border: none;
    border-radius: 0;
    background: rgba(255, 255, 255, 0.2);
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
    display: flex;
    flex-direction: column;
    padding: 24px;
    padding-top: 20px;
    gap: 8px;
    overflow: hidden;
}

.check-worldwide__globe-pattern {
    position: absolute;
    top: 0;
    right: 0;
    width: 258px;
    height: 131px;
    max-width: 258px;
    max-height: 131px;
    pointer-events: none;
    z-index: 0;
    object-fit: none;
    border-radius: 0;
}

.check-worldwide__card-title {
    font-family: var(--font-heading);
    font-size: 36px;
    font-weight: 400;
    line-height: 44px;
    color: #ffffff;
    margin: 0;
    position: relative;
    z-index: 1;
}

.check-worldwide__card-badge {
    display: flex;
    align-items: center;
    gap: 8px;
    font-family: var(--font-body);
    font-size: 20px;
    font-weight: 300;
    line-height: 22px;
    color: #ffffff;
    position: relative;
    z-index: 1;
}

.check-worldwide__card-dot {
    width: 12px;
    height: 12px;
    border-radius: 50%;
    background: #ffffff;
    flex-shrink: 0;
}

/* --- Section: check-process (3049-3430) --- */
.check-process__title .text-gold {
    color: #c0b388;
}

/* --- Section: check-stats / Indicateurs clés (3421-8076) --- */
/* Large card: Figma bg #d9d1b9 (warm beige, not olive green) */
/* Small cards */
.check-stat-card {
    background: #EEEAE0 !important;
    height: 400px;
}

.check-stat-card__number {
    color: #D9D1B9 !important;
}

.check-stat-card__label {
    color: #D9D1B9 !important;
}

.check-stat-card__icon {
    --fill-0: #D9D1B9 !important;
}

/* Large card (38%) - must come after small cards to override */
.check-stat-card.check-stat-card--large {
    background: #D9D1B9 !important;
}

.check-stat-card--large .check-stat-card__number {
    color: #4D4E4E !important;
    font-size: 120px;
}

.check-stat-card--large .check-stat-card__label {
    color: #4D4E4E !important;
}

.check-stat-card--large .check-stat-card__icon {
    --fill-0: #4D4E4E !important;
}

/* Stats subtitle: Figma #8c94a5 - already correct */

/* --- Section: check-rgpd (3049-9111) --- */
.check-rgpd__title .text-gold {
    color: #c0b388;
}

/* All check page primary buttons: Figma bg #c0b388 (gold, not olive) */
.btn--check {
    background: #c0b388;
}

.btn--check:hover {
    background: #b3a47a;
}

/* RGPD item descriptions: Figma #8c94a5 - already correct via --silver-mist-700 */

/* RGPD divider */
.check-rgpd__divider {
    background: #e0e0e0;
}

/* History section: sticky header on scroll */
.history-section__header {
    position: sticky;
    top: 120px;
    align-self: flex-start;
}

@media (max-width: 1200px) {
    .history-section__header {
        position: static;
    }
}

/* ==========================================================================
   Certifications Page
   ========================================================================== */

.certifications-page {
    background-color: var(--bg-light);
    padding-top: 0;
    padding-bottom: 0;
}

.certifications-page > .container {
    max-width: 1330px;
    padding: 0;
}

.certifications-page__content {
    max-width: 1330px;
    margin: 0 auto;
    padding: 0;
}

/* Hero Section */
.certifications-page__hero {
    display: flex;
    gap: 96px;
    align-items: stretch;
    margin-bottom: 160px;
    place-items: center;
}

.certifications-page__hero-text {
    display: flex;
    flex-direction: column;
    gap: 48px;
    width: 655px;
    flex-shrink: 1;
}

.certifications-page__title {
    font-family: var(--font-heading);
    font-size: 64px;
    font-weight: 400;
    line-height: 72px;
    color: var(--iron-shadow-500);
    margin: 0;
}

.certifications-page__description {
    display: flex;
    flex-direction: column;
    gap: 24px;
    max-width: 581px;
}

.certifications-page__description p {
    font-family: var(--font-body);
    font-size: 22px;
    font-weight: 300;
    line-height: 26px;
    color: #8C94A5;
    margin: 0;
    white-space: pre-line;
}

.certifications-page__hero-image {
    width: 540px;
    height: 500px;
    flex-shrink: 0;
    border-radius: var(--radius-lg);
    overflow: hidden;
    background-color: #000;
}

.certifications-page__hero-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* Certification Cards */
.certifications-page__cards {
    display: flex;
    flex-direction: column;
    gap: 24px;
    margin-bottom: 0;
}

.cert-card {
    display: flex;
    border-radius: var(--radius-lg);
    overflow: hidden;
    min-height: 390px;
}

.cert-card--gray {
    background-color: #e6e6e6;
}

.cert-card--white {
    background-color: #ffffff;
}

.cert-card__logo {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0 32px;
    flex-shrink: 0;
    width: 264px;
}

.cert-card__logo-img {
    max-width: 200px;
    max-height: 200px;
    object-fit: contain;
}

.cert-card__logo-img--disc {
    width: 141px;
    height: 141px;
}

.cert-card__logo-img--mbti {
    width: 200px;
    height: auto;
}

.cert-card__logo-img--shl {
    width: 200px;
    height: auto;
}

.cert-card__content {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 32px;
    padding: 32px;
}

.cert-card__body {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.cert-card__title {
    font-family: var(--font-body);
    font-size: 38px;
    font-weight: 300;
    line-height: 42px;
    color: var(--iron-shadow-500);
    margin: 0;
}

.cert-card__text {
    font-family: var(--font-body);
    font-size: 20px;
    font-weight: 300;
    line-height: 22px;
    color: #8C94A5;
    margin: 0;
}

.cert-card__list {
    list-style: disc;
    padding-left: 20px;
    margin: 0;
    font-family: var(--font-body);
    font-size: 20px;
    font-weight: 300;
    line-height: 22px;
    color: #8C94A5;
}

.cert-card__list li {
    margin-bottom: 4px;
}

.cert-card__meta {
    display: flex;
    align-items: center;
    gap: 48px;
    margin-top: auto;
}

.cert-card__meta-info {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.cert-card__meta-label {
    font-family: var(--font-body);
    font-size: 20px;
    font-weight: 300;
    line-height: 22px;
    color: var(--iron-shadow-500);
}

.cert-card__meta-value {
    font-family: var(--font-body);
    font-size: 20px;
    font-weight: 300;
    line-height: 22px;
    color: var(--iron-shadow-500);
}

.cert-card__meta-logo {
    display: flex;
    align-items: center;
}

.cert-card__meta-logo img {
    height: 40px;
    width: auto;
}

.certifications-page__bottom-spacing {
    height: 160px;
}

/* Certifications Responsive */
@media (max-width: 1200px) {
    .certifications-page > .container {
        padding: 0 var(--space-xxl);
    }

    .certifications-page__hero {
        gap: 48px;
    }

    .certifications-page__hero-text {
        width: auto;
        flex: 1;
    }

    .certifications-page__hero-image {
        width: 400px;
        height: 400px;
    }

    .certifications-page__title {
        font-size: 48px;
        line-height: 56px;
    }
}

@media (max-width: 900px) {
    .certifications-page__hero {
        flex-direction: column;
        gap: 48px;
        align-items: center;
    }

    .certifications-page__hero-text {
        width: 100%;
    }

    .certifications-page__hero-image {
        width: 100%;
        height: 350px;
    }

    .certifications-page__description {
        max-width: 100%;
    }

    .certifications-page__title {
        font-size: 40px;
        line-height: 48px;
    }

    .cert-card {
        flex-direction: column;
    }

    .cert-card--reversed {
        flex-direction: column-reverse;
    }

    .cert-card__logo {
        padding: 32px;
        display: flex;
        justify-content: center;
        width: 100%;
        flex-shrink: 1;
    }

    .cert-card__meta {
        flex-direction: column;
        align-items: flex-start;
        gap: 16px;
    }
}

@media (max-width: 480px) {
    .certifications-page > .container {
        padding: 0 var(--space-medium);
    }

    .certifications-page__hero {
        margin-bottom: 80px;
    }

    .certifications-page__title {
        font-size: 32px;
        line-height: 40px;
    }

    .certifications-page__description p {
        font-size: 18px;
        line-height: 24px;
    }

    .cert-card__title {
        font-size: 28px;
        line-height: 34px;
    }

    .cert-card__text,
    .cert-card__list {
        font-size: 16px;
        line-height: 20px;
    }

    .cert-card__meta-label,
    .cert-card__meta-value {
        font-size: 18px;
        line-height: 22px;
    }

    .certifications-page__bottom-spacing {
        height: 80px;
    }
}

/* ==========================================================================
   Single Job Offer - Fix spacing between text blocks (match Figma)
   ========================================================================== */

/* Remove double spacing: gap already handles base 24px between elements */
.article-content p {
    margin: 0 !important;
}

.article-content ul,
.article-content ol {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
}

.article-content ul {
    list-style: none;
    padding-left: 0;
}

.article-content ul li {
    display: flex;
    align-items: flex-start;
    gap: 10px;
}

.article-content ul li::before {
    content: '';
    width: 5px;
    height: 5px;
    background-color: #8C94A5;
    border-radius: 1px;
    flex-shrink: 0;
    margin-top: 8px;
}

/* Headings get extra top margin for section separation (24px gap + 24px margin = 48px total) */
.article-content h2,
.article-content h3,
.article-content h4 {
    margin: var(--space-large) 0 0 !important;
}

/* First heading: no extra top margin */
.article-content h2:first-child,
.article-content h3:first-child,
.article-content h4:first-child {
    margin-top: 0 !important;
}

/* ==========================================================================
   Competences Page - Fix titles vs body text distinction & list styles
   ========================================================================== */

/* List styling: gray color, square bullets, proper spacing */
.competences-page__list {
    font-family: var(--font-body);
    font-size: 22px;
    font-weight: 300;
    line-height: 26px;
    color: var(--silver-mist-700);
    list-style: disc;
    padding-left: 33px;
    margin: 0;
}

.competences-page__list li {
    margin-bottom: 0;
}

/* In Nos solutions: underline labels instead of bold */
.competences-page__body p strong {
    font-weight: 300;
    text-decoration: none;
}

/* Underlined labels in Nos solutions section */
.competences-page__label {
    font-family: var(--font-body);
    font-size: 22px;
    font-weight: 300;
    line-height: 26px;
    color: var(--silver-mist-700);
    text-decoration: underline;
}

/* ==========================================================================
   Solution Modals - Match Figma design (dark gradient + image)
   ========================================================================== */

.modal--solution .modal__container--solution {
    max-width: 1445px;
    width: 90vw;
    background: linear-gradient(71deg, #2e2e2e 13.5%, #0a0d11 188%);
    border: 1.5px solid rgba(255, 255, 255, 0.15);
    border-radius: 20px;
    padding: 0 64px 96px;
    box-shadow: 0px 4px 24px 0px rgba(0, 0, 0, 0.06);
    position: relative;
}

.modal--solution .modal__close {
    position: sticky;
    top: 23px;
    align-self: flex-end;
    z-index: 10;
    margin-top: 23px;
    margin-right: calc(-64px + 32px);
    margin-bottom: calc(96px - 23px - 32px);
}

.modal--solution .modal__solution-content {
    display: flex;
    gap: 64px;
    align-items: center;
    justify-content: center;
}

.modal--solution .modal__solution-left {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 48px;
}

.modal--solution .modal__solution-header {
    display: flex;
    gap: 16px;
    align-items: center;
}

.modal--solution .modal__solution-icon {
    width: 60px;
    height: 60px;
    flex-shrink: 0;
}

.modal--solution .modal__solution-icon img {
    width: 60px;
    height: 60px;
    filter: brightness(0) invert(1);
}

.modal--solution .modal__solution-title {
    font-family: var(--font-body);
    font-size: 32px;
    font-weight: 400;
    line-height: 32px;
    color: white;
    margin: 0;
}

.modal--solution .modal__solution-body {
    display: flex;
    flex-direction: column;
}

.modal--solution .modal__solution-body p {
    font-family: var(--font-body);
    font-size: 22px;
    font-weight: 300;
    line-height: 26px;
    color: #c4c9d1;
    margin: 0 0 26px;
}

.modal--solution .modal__solution-body p:last-child {
    margin-bottom: 0;
}

.modal--solution .modal__solution-image {
    width: 467px;
    height: 467px;
    flex-shrink: 0;
    border-radius: 20px;
    overflow: hidden;
    position: relative;
}

.modal--solution .modal__solution-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.modal--solution .modal__solution-image::after {
    content: '';
    position: absolute;
    inset: 0;
    background: rgba(0, 0, 0, 0.1);
    border-radius: 20px;
}

/* Responsive */
@media (max-width: 1100px) {
    .modal--solution .modal__container--solution {
        padding: 0 32px 48px;
    }
    .modal--solution .modal__close {
        margin-top: 23px;
        margin-right: calc(-32px + 32px);
        margin-bottom: calc(48px - 23px - 32px);
    }
    .modal--solution .modal__solution-content {
        flex-direction: column;
        gap: 32px;
    }
    .modal--solution .modal__solution-image {
        width: 100%;
        height: 300px;
    }
}

@media (max-width: 768px) {
    .modal--solution .modal__container--solution {
        padding: 0 24px 32px;
    }
    .modal--solution .modal__close {
        margin-top: 16px;
        margin-right: calc(-24px + 16px);
        margin-bottom: calc(32px - 16px - 32px);
        top: 16px;
    }
    .modal--solution .modal__solution-title {
        font-size: 24px;
        line-height: 28px;
    }
    .modal--solution .modal__solution-body p {
        font-size: 18px;
        line-height: 24px;
    }
    .modal--solution .modal__solution-image {
        height: 220px;
    }
}

/* ==========================================================================
   Login Modal - Background Check (pixel perfect all breakpoints)
   ========================================================================== */

/* Container: transparent, no padding, no border */
.modal__container--login {
    max-width: 1330px;
    width: 90vw;
    background: transparent !important;
    padding: 0 !important;
    border: none !important;
    border-radius: 20px;
    box-shadow: none !important;
}

/* Close button outside modal card */
.modal__close--outside {
    position: absolute;
    top: -48px;
    right: 0;
    z-index: 10;
    background: none;
    border: none;
    cursor: pointer;
    padding: 0;
}

.modal__close--outside img {
    width: 32px;
    height: 32px;
}

/* Login card: white container with form + brand */
.login-card {
    display: flex;
    border-radius: 20px;
    overflow: hidden;
    background: white;
    min-height: 500px;
}

/* Left: form area */
.login-card__form {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 64px 48px;
    gap: 20px;
    min-width: 0;
}

/* Tabs: Se connecter / Creer un compte */
.login-card__tabs {
    display: flex;
    gap: 8px;
    background: #f4f7f6;
    border-radius: 8px;
    padding: 8px;
    width: fit-content;
}

.login-card__tab {
    font-family: var(--font-body);
    font-size: 18px;
    font-weight: 300;
    line-height: 22px;
    padding: 12px 16px;
    border: none;
    border-radius: 4px;
    cursor: pointer;
    background: transparent;
    color: #a3aab7;
    white-space: nowrap;
}

.login-card__tab--active {
    background: #d9d1b9;
    color: white;
}

/* Form fields container */
.login-card__fields {
    display: flex;
    flex-direction: column;
    gap: 12px;
    width: 100%;
    max-width: 385px;
}

/* Input wrapper */
.login-card__input {
    display: flex;
    flex-direction: column;
    border: 1px solid #8c94a5;
    border-radius: 8px;
    padding: 8px 16px;
    min-height: 50px;
    justify-content: center;
}

.login-card__label {
    font-family: var(--font-body);
    font-size: 13px;
    font-weight: 400;
    color: #8c94a5;
    line-height: 1;
    margin-bottom: 2px;
}

.login-card__field {
    font-family: var(--font-body);
    font-size: 18px;
    font-weight: 300;
    line-height: 22px;
    color: #0a0d11;
    border: none;
    outline: none;
    background: transparent;
    padding: 0;
    width: 100%;
}

/* Captcha placeholder */
.login-card__captcha {
    background: #f9f9f9;
    border: 1px solid #d3d3d3;
    border-radius: 3px;
    padding: 8px 12px;
    min-height: 50px;
    display: flex;
    align-items: center;
    box-shadow: 0 0 4px rgba(0,0,0,0.08);
    font-family: var(--font-body);
    font-size: 14px;
    color: #555;
}

/* Remember me */
.login-card__remember {
    display: flex;
    gap: 12px;
    align-items: center;
    width: 100%;
    max-width: 385px;
}

.login-card__remember input[type=checkbox] {
    width: 20px;
    height: 20px;
    border: 1px solid #8c94a5;
    border-radius: 4px;
    flex-shrink: 0;
    appearance: none;
    -webkit-appearance: none;
    cursor: pointer;
    margin: 0;
}

.login-card__remember label {
    font-family: var(--font-body);
    font-size: 16px;
    font-weight: 300;
    line-height: 20px;
    color: #8c94a5;
    cursor: pointer;
}

/* Submit button */
.login-card__submit {
    background: #c0b388;
    color: white;
    border: none;
    border-radius: 4px;
    padding: 14px 24px;
    cursor: pointer;
    font-family: var(--font-body);
    font-size: 20px;
    font-weight: 300;
    line-height: 26px;
    width: fit-content !important;
    align-self: center;
    max-width: none;
}

.login-card__submit .btn__text {
    display: flex;
    flex-direction: column;
    height: 25px;
    overflow: hidden;
    align-items: center;
}

/* Forgot password */
.login-card__forgot {
    font-family: var(--font-body);
    font-size: 16px;
    font-weight: 300;
    line-height: 20px;
    color: #8c94a5;
    text-decoration: none;
}

.login-card__forgot:hover {
    text-decoration: underline;
}

/* Right: brand panel */
.login-card__brand {
    width: 50%;
    max-width: 655px;
    flex-shrink: 0;
    background: linear-gradient(to left, #c0b388 0%, #c6bd9b 50%, #d9d1b9 100%);
    border-radius: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 40px;
}

.login-card__brand img {
    max-width: 100%;
    height: auto;
    width: 350px;
}

/* ==========================================================================
   Responsive - Login Modal
   ========================================================================== */

/* Desktop HD / Ultrawide (>1409px) */
@media (min-width: 1410px) {
    .modal__container--login {
        max-width: 1330px;
    }
    .login-card__brand img {
        width: 413px;
    }
}

/* Laptop (1280px) */
@media (max-width: 1300px) {
    .modal__container--login {
        width: 92vw;
        max-width: 1100px;
    }
    .login-card__brand {
        width: 45%;
    }
}

/* Small Tablet / Tablet (< 768px) */
@media (max-width: 768px) {
    .modal__container--login {
        width: 95vw;
        max-width: 500px;
        max-height: 90vh;
        overflow-y: auto;
    }
    .login-card {
        flex-direction: column;
        min-height: auto;
    }
    .login-card__form {
        padding: 32px 24px;
        gap: 16px;
    }
    .login-card__brand {
        width: 100%;
        max-width: 100%;
        height: 160px;
        border-radius: 0 0 20px 20px;
    }
    .login-card__brand img {
        width: 250px;
    }
    .login-card__fields {
        max-width: 100%;
    }
    .login-card__remember {
        max-width: 100%;
    }
    .login-card__tab {
        font-size: 15px;
        padding: 10px 12px;
    }
    .login-card__submit {
        font-size: 18px;
        padding: 12px 20px;
    }
    .login-card__forgot {
        font-size: 14px;
    }
    .modal__close--outside {
        top: -40px;
        right: 4px;
    }
    .modal__close--outside img {
        width: 24px;
        height: 24px;
    }
}

/* Mobile Phone (< 420px) */
@media (max-width: 420px) {
    .modal__container--login {
        width: 96vw;
        max-width: 386px;
    }
    .login-card__form {
        padding: 24px 16px;
        gap: 12px;
    }
    .login-card__brand {
        height: 150px;
    }
    .login-card__brand img {
        width: 200px;
    }
    .login-card__input {
        min-height: 44px;
        padding: 6px 12px;
    }
    .login-card__captcha {
        min-height: 44px;
    }
    .login-card__label {
        font-size: 11px;
    }
    .login-card__field {
        font-size: 16px;
    }
}

/* ==========================================================================
   Contact Form - Fix overflow on laptop/desktop HD
   ========================================================================== */

/* Prevent form from overflowing on smaller desktop screens */
@media (max-width: 1600px) {
    .contact-form-wrapper {
        gap: 64px !important;
    }
    .contact-form__image-inner {
        width: 600px;
        height: 760px;
    }
    .contact-form__image-border {
        top: 20px;
        left: 20px;
        right: 20px;
        bottom: 20px;
    }
}

@media (max-width: 1300px) {
    .contact-form-wrapper {
        gap: 48px !important;
    }
    .contact-form__image-inner {
        width: 480px;
        height: 640px;
    }
    .contact-form__content {
        max-width: none;
    }
}

/* ==========================================================================
   Check page - Fix button alignment in CTA groups
   ========================================================================== */
.check-why__actions .btn,
.check-features__cta .btn {
    align-self: center !important;
}
