/**
 * Block: bloc_features_02
 * Description: Feature section with left content (form + cards) and right large image
 * Version: 1.0.0
 * Phase: STATIC (aligned with Figma design)
 *
 * Figma Source: https://www.figma.com/design/I6wtq12NH17BottRCSlGff?node-id=9048:9130
 * Generated: 2026-02-03
 *
 * Color Palette:
 * - Text dark: #232425
 * - Brand blue: #2464D1
 * - Light gray: #E6E7E7
 * - Background: #FFFFFF
 */

/* ========================================
   BASE SECTION
   ======================================== */
.bloc-features-02 {
    width: 100%;
    box-sizing: border-box;
    padding: 80px var(--section-padding-x, 64px);
    background-color: transparent;
    font-family: inherit;
}

.bloc-features-02__container {
    max-width: var(--section-max-width, 1312px);
    margin: 0 auto;
    display: flex;
    flex-direction: row;
    gap: 32px;
    align-items: stretch;
}

.bloc-features-02--wrapped-shell {
    padding-top: 0;
    padding-bottom: 0;
}

.bloc-features-02__container--media-left {
    flex-direction: row-reverse;
}

.bloc-features-02__container--media-right {
    flex-direction: row;
}

/* Hero + cartes verticales sur une même rangée : hauteurs égales (stretch) en desktop */
.bloc-features-02__container--cards-hero-row {
    flex-direction: column;
}

.bloc-features-02__cards-hero-row {
    display: flex;
    flex-direction: row;
    align-items: stretch;
    gap: 32px;
    width: 100%;
    min-width: 0;
}

.bloc-features-02__cards-hero-row--media-left {
    flex-direction: row-reverse;
}

.bloc-features-02__cards-hero-row .bloc-features-02__card-wrap--vertical {
    flex: 1 1 0%;
    min-width: 0;
}

.bloc-features-02__cards-hero-row .bloc-features-02__zone-right--in-row {
    flex: 1 1 0%;
    min-width: 0;
    display: flex;
    flex-direction: column;
}

.bloc-features-02__cards-hero-row .bloc-features-02__hero-image {
    flex: 1 1 auto;
    min-height: 0;
    height: 100%;
    max-height: none;
    aspect-ratio: unset;
    align-self: stretch;
}

/* ========================================
   LEFT COLUMN - CONTENT WITH FORM
   ======================================== */
.bloc-features-02__zone-left {
    flex: 1 1 0%;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 32px;
}

.bloc-features-02__zone-left--wrapped {
    padding: var(--bloc-features-02-zone-wrapper-padding, 24px);
    box-sizing: border-box;
}

/* Zone Icons */
.bloc-features-02__zone-icons {
    display: flex;
    gap: 16px;
    align-items: center;
}

.bloc-features-02__zone-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.bloc-features-02__zone-icon .bloc-features-02__zone-icon-glyph,
.bloc-features-02__zone-icon .icon,
.bloc-features-02__zone-icon img,
.bloc-features-02__zone-icon svg {
    display: block;
    max-width: 100%;
    max-height: 100%;
}

/* Tags */
.bloc-features-02__tags {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.bloc-features-02__tag {
    display: inline-flex;
    padding: 4px 12px;
    border-radius: var(--badge-border-radius, 9999px);
    font-size: 14px;
    font-weight: 600;
}

/* Content All */
.bloc-features-02__content-all {
    display: flex;
    flex-direction: column;
    gap: 24px;
    color: inherit;
}

.bloc-features-02__content-all:empty {
    display: none;
}

.bloc-features-02__tagline {
    font-size: 16px;
    font-weight: 700;
    line-height: 1.5;
    margin: 0;
}

.bloc-features-02__headline {
    font-size: 48px;
    font-weight: 500;
    line-height: 1;
    margin: 0;
}

.bloc-features-02__description {
    font-size: 18px;
    font-weight: 400;
    line-height: 1.5;
    margin: 0;
}

/* ========================================
   FORM SECTION
   ======================================== */
.bloc-features-02__form-section {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.bloc-features-02__form-label {
    font-size: 14px;
    font-weight: 400;
    line-height: 1.5;
    color: #232425;
}

.bloc-features-02__form-row {
    display: flex;
    gap: 0;
}

.bloc-features-02__form-input {
    flex: 1;
    height: 48px;
    padding: 12px 16px;
    font-size: 16px;
    font-weight: 400;
    color: #232425;
    background-color: #ffffff;
    border: 1px solid #232425;
    border-right: none;
    outline: none;
}

.bloc-features-02__form-input::placeholder {
    color: var(--bloc-features-02-placeholder-color, #999);
}

.bloc-features-02__form-input:focus {
    border-color: #3C0314;
}

/* ========================================
   DETAILS LIST
   ======================================== */
.bloc-features-02__details {
    display: flex;
    flex-direction: column;
    gap: 12px;                       /* FIX: tighter vertical spacing */
}

/* FIX: icon-text items as horizontal lines with check icon */
.bloc-features-02__details .icon-text {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 12px;
    width: 100%;
}

.bloc-features-02__details .icon-text__icon {
    width: var(--us-icon-size, 24px);
    height: var(--us-icon-size, 24px);
    flex-shrink: 0;
    background-color: transparent;
    border-radius: 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
}

.bloc-features-02__details .icon-text__icon.icon--wrapped {
    padding: var(--us-icon-wrap-padding, 8px);
    box-sizing: content-box;
}

.bloc-features-02__details .icon-text__icon svg,
.bloc-features-02__details .icon-text__icon img {
    width: 14px;
    height: 14px;
    color: inherit;
}

.bloc-features-02__details .icon-text__text {
    flex: 1 1 auto;
    min-width: 0;
    font-size: 16px;
    line-height: 1.5;
    color: inherit;
}

/* ========================================
   FEATURE CARDS
   ======================================== */

/* Card Wrap (container for cards) */
.bloc-features-02__card-wrap {
    display: flex;
    flex-direction: column;
    gap: 32px;
}
.bloc-features-02__card-wrap--horizontal {
    flex-direction: column;
}
.bloc-features-02__card-wrap--vertical {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 32px;
}

/* Card Base */
.bloc-features-02__card {
    background-color: var(--card-bg, transparent);
    border: none;
    overflow: hidden;
    width: 100%;
}

/* Horizontal Card */
.bloc-features-02__card--horizontal {
    display: flex;
    flex-direction: row;
}

.bloc-features-02__card--horizontal .bloc-features-02__card-image {
    flex: 1 1 50%;
    width: 50%;
    min-width: 0;
    min-height: 200px;
}

.bloc-features-02__card--horizontal .bloc-features-02__card-content {
    flex: 1 1 50%;
    width: 50%;
    min-width: 0;
}

/* Sans visuel (pas de .card-image dans l’article) : le contenu occupe toute la largeur */
.bloc-features-02__card--horizontal .bloc-features-02__card-content:only-child {
    flex: 1 1 100%;
    width: 100%;
    max-width: 100%;
}

/* Vertical Card */
.bloc-features-02__card--vertical {
    display: flex;
    flex-direction: column;
}

.bloc-features-02__card--vertical .bloc-features-02__card-image {
    width: 100%;
    aspect-ratio: 16 / 9;
}

/* Card Media Position Variants */
.bloc-features-02__card--media-bottom {
    flex-direction: column-reverse;
}

.bloc-features-02__card--media-background {
    position: relative;
}

.bloc-features-02__card--media-background .bloc-features-02__card-image {
    position: absolute;
    inset: 0;
    z-index: 0;
}

.bloc-features-02__card--media-background .bloc-features-02__card-content {
    position: relative;
    z-index: 1;
}

.bloc-features-02__card--horizontal-reverse {
    flex-direction: row-reverse;
}

/* Card Image */
.bloc-features-02__card-image {
    background-color: transparent;
    overflow: hidden;
}

.bloc-features-02__card-image--wrapped {
    padding: var(--bloc-features-02-card-image-wrapper-padding, 24px);
    box-sizing: border-box;
}

.bloc-features-02__card-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* Card Content */
.bloc-features-02__card-content {
    display: flex;
    flex-direction: column;
    gap: 32px;
    padding: 24px;
    min-width: 0;
    box-sizing: border-box;
}

.bloc-features-02__card-shell-link {
    display: block;
    width: 100%;
    color: inherit;
    text-decoration: none;
}

.bloc-features-02__card-number-wrap {
    align-self: flex-start;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 8px;
}

/* Card Icon */
.bloc-features-02__card-icon {
    width: 48px;
    height: 48px;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: #ffffff;
    box-sizing: border-box;
}

.bloc-features-02__card-icon svg {
    width: 36px;
    height: 36px;
    color: #232425;
}

/*
 * Stack texte 01 + features 02 : prop_icon #9F2B2C, espacements carte (icône→titre 24px, titre→texte 8px)
 */
.usine-bloc-stack--text01-feat02 .bloc-features-02__card-icon,
.usine-bloc-stack--text01-feat02 .bloc-features-02__card-icon svg {
    color: #9f2b2c !important;
    fill: #9f2b2c !important;
}

.usine-bloc-stack--text01-feat02 .bloc-features-02__card-icon svg path,
.usine-bloc-stack--text01-feat02 .bloc-features-02__card-icon svg circle,
.usine-bloc-stack--text01-feat02 .bloc-features-02__card-icon svg rect,
.usine-bloc-stack--text01-feat02 .bloc-features-02__card-icon svg line,
.usine-bloc-stack--text01-feat02 .bloc-features-02__card-icon svg polyline,
.usine-bloc-stack--text01-feat02 .bloc-features-02__card-icon svg polygon {
    fill: currentColor !important;
    stroke: currentColor !important;
}

/* gap: 0 sans !important — battu par usine-components [class*="__card"] sur __card-content (gap 16–18px !important). Renfort ≤1024 plus bas. */
.usine-bloc-stack--text01-feat02 .bloc-features-02__card-content {
    gap: 0;
}

.usine-bloc-stack--text01-feat02 .bloc-features-02__card-number-wrap + .bloc-features-02__card-details {
    margin-top: 16px;
}

.usine-bloc-stack--text01-feat02 .bloc-features-02__card-details {
    gap: 8px;
}

.usine-bloc-stack--text01-feat02 .bloc-features-02__card-icon + .bloc-features-02__card-title {
    margin-top: 24px;
}

.usine-bloc-stack--text01-feat02 .bloc-features-02__card-title + .bloc-features-02__card-description {
    margin-top: 8px;
}

.usine-bloc-stack--text01-feat02 .bloc-features-02__card-description + * {
    margin-top: 32px;
}

/*
 * Stack text01+feat02 : titres carte — Unbounded Regular (même principe que bloc_features_04).
 * Les styles inline ACF (Figtree) passent devant une feuille sans !important sur font-family.
 */
.usine-bloc-stack--text01-feat02 .bloc-features-02 .bloc-features-02__card-title {
    font-family: "Figtree", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif !important;
    font-weight: 400 !important;
    font-size: 20px !important;
    line-height: 1.5 !important;
}

@media (max-width: 1024px) {
    .usine-bloc-stack--text01-feat02 .bloc-features-02 .bloc-features-02__card-title {
        font-size: var(--typ-h5, 20px) !important;
        line-height: 1.16 !important;
    }
}

@media (max-width: 768px) {
    .usine-bloc-stack--text01-feat02 .bloc-features-02 .bloc-features-02__card-title {
        font-size: var(--typ-h5, 18px) !important;
        line-height: 1.16 !important;
    }
}

/* Carrés d’icône des cartes verticales (rangée hero) : coins 8px */
.usine-bloc-stack--text01-feat02
    .bloc-features-02__cards-hero-row
    .bloc-features-02__card--vertical
    .bloc-features-02__card-icon {
    border-radius: 8px;
}

/* "Comment ça marche" (stack text01 + feat02) :
   remplacer les SVG des subicons par la coche fournie, en conservant le wrapper. */
main#primary > .page-content-wrapper > .entry-content > .usine-bloc-stack--text01-feat02 > section.bloc-features-02 .bloc-features-02__card-details .icon-text__icon.icon--fallback {
    background-image: url("../../assets/icons/features02-check.png");
    background-repeat: no-repeat;
    background-position: center;
    background-size: 14px 14px;
}

main#primary > .page-content-wrapper > .entry-content > .usine-bloc-stack--text01-feat02 > section.bloc-features-02 .bloc-features-02__card-details .icon-text__icon.icon--fallback > svg {
    display: none !important;
}

/* 1re carte verticale affichée : icône header fallback → globe + pin (data-index = rang métier, pas nth-child). */
main#primary
    > .page-content-wrapper
    > .entry-content
    > .usine-bloc-stack--text01-feat02
    > section.bloc-features-02
    article.bloc-features-02__card--vertical[data-bloc-features-02-card-index="1"]
    .bloc-features-02__card-icon
    .bloc-features-02__card-icon-img.icon--fallback
    > svg {
    display: none !important;
}

main#primary
    > .page-content-wrapper
    > .entry-content
    > .usine-bloc-stack--text01-feat02
    > section.bloc-features-02
    article.bloc-features-02__card--vertical[data-bloc-features-02-card-index="1"]
    .bloc-features-02__card-icon
    .bloc-features-02__card-icon-img.icon--fallback {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    box-sizing: border-box;
    background-image: url("assets/f02-stack-text01-feat02-card0-globe-pin.png");
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
}

/* 2e carte verticale affichée : icône header fallback → crayon */
main#primary
    > .page-content-wrapper
    > .entry-content
    > .usine-bloc-stack--text01-feat02
    > section.bloc-features-02
    article.bloc-features-02__card--vertical[data-bloc-features-02-card-index="2"]
    .bloc-features-02__card-icon
    .bloc-features-02__card-icon-img.icon--fallback
    > svg {
    display: none !important;
}

main#primary
    > .page-content-wrapper
    > .entry-content
    > .usine-bloc-stack--text01-feat02
    > section.bloc-features-02
    article.bloc-features-02__card--vertical[data-bloc-features-02-card-index="2"]
    .bloc-features-02__card-icon
    .bloc-features-02__card-icon-img.icon--fallback {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    box-sizing: border-box;
    background-image: url("assets/f02-stack-text01-feat02-card1-pencil.png");
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
}

/* 3e carte verticale affichée : icône header fallback → T typo */
main#primary
    > .page-content-wrapper
    > .entry-content
    > .usine-bloc-stack--text01-feat02
    > section.bloc-features-02
    article.bloc-features-02__card--vertical[data-bloc-features-02-card-index="3"]
    .bloc-features-02__card-icon
    .bloc-features-02__card-icon-img.icon--fallback
    > svg {
    display: none !important;
}

main#primary
    > .page-content-wrapper
    > .entry-content
    > .usine-bloc-stack--text01-feat02
    > section.bloc-features-02
    article.bloc-features-02__card--vertical[data-bloc-features-02-card-index="3"]
    .bloc-features-02__card-icon
    .bloc-features-02__card-icon-img.icon--fallback {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    box-sizing: border-box;
    background-image: url("assets/f02-stack-text01-feat02-card2-text-t.png");
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
}

/* 4e carte verticale affichée : icône header fallback → cadre + curseur */
main#primary
    > .page-content-wrapper
    > .entry-content
    > .usine-bloc-stack--text01-feat02
    > section.bloc-features-02
    article.bloc-features-02__card--vertical[data-bloc-features-02-card-index="4"]
    .bloc-features-02__card-icon
    .bloc-features-02__card-icon-img.icon--fallback
    > svg {
    display: none !important;
}

main#primary
    > .page-content-wrapper
    > .entry-content
    > .usine-bloc-stack--text01-feat02
    > section.bloc-features-02
    article.bloc-features-02__card--vertical[data-bloc-features-02-card-index="4"]
    .bloc-features-02__card-icon
    .bloc-features-02__card-icon-img.icon--fallback {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    box-sizing: border-box;
    background-image: url("assets/f02-stack-text01-feat02-card3-click.png");
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
}

.usine-bloc-stack--text01-feat02 .bloc-features-02__hero-image {
    background-color: transparent !important;
}

/* Stack text01-feat02 : conserver les PNG fallback et les teinter en orange #FF5700 */
main#primary > .page-content-wrapper > .entry-content > .usine-bloc-stack--text01-feat02 > section.bloc-features-02 .bloc-features-02__card-icon .bloc-features-02__card-icon-img.icon--fallback {
    filter: invert(45%) sepia(97%) saturate(3712%) hue-rotate(2deg) brightness(103%) contrast(103%) !important;
}

/* Desktop uniquement: égaliser strictement la hauteur gauche/droite */
@media (min-width: 1201px) {
    .usine-bloc-stack--text01-feat02 .bloc-features-02__container--media-right {
        align-items: stretch;
    }

    .usine-bloc-stack--text01-feat02 .bloc-features-02__zone-left,
    .usine-bloc-stack--text01-feat02 .bloc-features-02__zone-right {
        display: flex;
        flex-direction: column;
        min-height: 0;
    }

    .usine-bloc-stack--text01-feat02 .bloc-features-02__card-wrap--horizontal {
        flex: 1 1 auto;
        height: 100%;
        min-height: 0;
    }

    .usine-bloc-stack--text01-feat02 .bloc-features-02__hero-image {
        height: 100%;
        min-height: 0;
    }
}

/*
 * Stack text01-feat02 + section.bloc-features-02 — tablette & mobile uniquement (≤1024px).
 * usine-components cible [class*="__card"] : matche __card-wrap, __card-content, __card-details, __card-number-wrap → padding forcé.
 * number-wrap : padding 4px ; chiffre/libellé (.card-number) : 28px (type H3) ; espace number-wrap → card-details : 8px.
 * Puces .card-details : .icon-text__text — 14px (20px ACF − 6px).
 * .card-details : gap entre les lignes de puces → 8px (bat usine-components [class*="__card"] gap: 18px !important).
 * Desktop inchangé.
 */
@media (max-width: 1024px) {
    main#primary
        > .page-content-wrapper
        > .entry-content
        > .usine-bloc-stack.usine-bloc-stack--text01-feat02
        > section.bloc-features-02
        .bloc-features-02__card-wrap.bloc-features-02__card-wrap--horizontal,
    body.home
        main#primary
        > .page-content-wrapper
        > .entry-content
        > .usine-bloc-stack.usine-bloc-stack--text01-feat02
        > section.bloc-features-02
        .bloc-features-02__card-wrap.bloc-features-02__card-wrap--horizontal {
        padding: 0 !important;
        box-sizing: border-box;
    }

    main#primary
        > .page-content-wrapper
        > .entry-content
        > .usine-bloc-stack.usine-bloc-stack--text01-feat02
        > section.bloc-features-02
        .bloc-features-02__card-details,
    body.home
        main#primary
        > .page-content-wrapper
        > .entry-content
        > .usine-bloc-stack.usine-bloc-stack--text01-feat02
        > section.bloc-features-02
        .bloc-features-02__card-details {
        padding: 0 !important;
        box-sizing: border-box;
        gap: 8px !important;
        row-gap: 8px !important;
        column-gap: 8px !important;
    }

    main#primary
        > .page-content-wrapper
        > .entry-content
        > .usine-bloc-stack.usine-bloc-stack--text01-feat02
        > section.bloc-features-02
        .bloc-features-02__card-content,
    body.home
        main#primary
        > .page-content-wrapper
        > .entry-content
        > .usine-bloc-stack.usine-bloc-stack--text01-feat02
        > section.bloc-features-02
        .bloc-features-02__card-content {
        padding: 0 !important;
        box-sizing: border-box;
        /* Bat usine-components : .__card-content matche [class*="__card"] → gap forcé sinon 16–18px entre icône / titre / texte. */
        gap: 0 !important;
        row-gap: 0 !important;
        column-gap: 0 !important;
    }

    main#primary
        > .page-content-wrapper
        > .entry-content
        > .usine-bloc-stack.usine-bloc-stack--text01-feat02
        > section.bloc-features-02
        .bloc-features-02__card-number-wrap,
    body.home
        main#primary
        > .page-content-wrapper
        > .entry-content
        > .usine-bloc-stack.usine-bloc-stack--text01-feat02
        > section.bloc-features-02
        .bloc-features-02__card-number-wrap {
        padding: 4px !important;
        box-sizing: border-box;
    }

    main#primary
        > .page-content-wrapper
        > .entry-content
        > .usine-bloc-stack.usine-bloc-stack--text01-feat02
        > section.bloc-features-02
        .bloc-features-02__card-number,
    body.home
        main#primary
        > .page-content-wrapper
        > .entry-content
        > .usine-bloc-stack.usine-bloc-stack--text01-feat02
        > section.bloc-features-02
        .bloc-features-02__card-number {
        font-size: 28px !important;
        line-height: 1 !important;
    }

    main#primary
        > .page-content-wrapper
        > .entry-content
        > .usine-bloc-stack.usine-bloc-stack--text01-feat02
        > section.bloc-features-02
        .bloc-features-02__card-number-wrap
        + .bloc-features-02__card-details,
    body.home
        main#primary
        > .page-content-wrapper
        > .entry-content
        > .usine-bloc-stack.usine-bloc-stack--text01-feat02
        > section.bloc-features-02
        .bloc-features-02__card-number-wrap
        + .bloc-features-02__card-details {
        margin-top: 8px !important;
    }

    main#primary
        > .page-content-wrapper
        > .entry-content
        > .usine-bloc-stack.usine-bloc-stack--text01-feat02
        > section.bloc-features-02
        .bloc-features-02__card-details
        .icon-text__text,
    main#primary
        > .page-content-wrapper
        > .entry-content
        > .usine-bloc-stack.usine-bloc-stack--text01-feat02
        > section.bloc-features-02
        .bloc-features-02__card-details
        .icon-text
        h5.icon-text__text,
    body.home
        main#primary
        > .page-content-wrapper
        > .entry-content
        > .usine-bloc-stack.usine-bloc-stack--text01-feat02
        > section.bloc-features-02
        .bloc-features-02__card-details
        .icon-text__text,
    body.home
        main#primary
        > .page-content-wrapper
        > .entry-content
        > .usine-bloc-stack.usine-bloc-stack--text01-feat02
        > section.bloc-features-02
        .bloc-features-02__card-details
        .icon-text
        h5.icon-text__text {
        font-size: 14px !important;
        line-height: 1.5 !important;
    }

    /*
     * Tablette (≤1024) : usine-components cible [class*="__card"] → padding parasite sur
     * .__card-title / .__card-description — contre-pass strict (stack text01-feat02 seulement).
     */
    main#primary
        > .page-content-wrapper
        > .entry-content
        > .usine-bloc-stack.usine-bloc-stack--text01-feat02
        > section.bloc-features-02
        .bloc-features-02__card-title,
    body.home
        main#primary
        > .page-content-wrapper
        > .entry-content
        > .usine-bloc-stack.usine-bloc-stack--text01-feat02
        > section.bloc-features-02
        .bloc-features-02__card-title,
    main#primary
        > .page-content-wrapper
        > .entry-content
        > .usine-bloc-stack.usine-bloc-stack--text01-feat02
        > section.bloc-features-02
        .bloc-features-02__card-description,
    body.home
        main#primary
        > .page-content-wrapper
        > .entry-content
        > .usine-bloc-stack.usine-bloc-stack--text01-feat02
        > section.bloc-features-02
        .bloc-features-02__card-description {
        padding: 0 !important;
        padding-inline: 0 !important;
        padding-block: 0 !important;
    }
}

/* Card Number */
.bloc-features-02__card-number {
    display: block;
    font-size: 40px;
    font-weight: 500;
    line-height: 1;
    color: #232425;
    margin: 0;
}

/* Card Title */
.bloc-features-02__card-title {
    font-size: 20px;
    font-weight: 500;
    line-height: 1.5;
    color: #232425;
    margin: 0;
    overflow-wrap: break-word;
    word-break: break-word;
}

/* Card Description */
.bloc-features-02__card-description {
    font-size: 16px;
    font-weight: 400;
    line-height: 1.5;
    color: inherit;
    margin: 0;
    overflow-wrap: break-word;
    word-break: break-word;
}

.bloc-features-02 .icon-text__text {
    overflow-wrap: break-word;
    word-break: break-word;
}

/* Card Details */
.bloc-features-02__card-details {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.bloc-features-02__card-details .icon-text {
    display: flex;
    gap: 8px;
    align-items: center;
    width: 100%;
}

.bloc-features-02__card-details .icon-text__icon {
    width: var(--us-icon-size, 24px);
    height: var(--us-icon-size, 24px);
    padding: 2px;
    border-radius: 32px;
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
}

.bloc-features-02__card-details .icon-text__icon.icon--wrapped {
    padding: 2px;
    box-sizing: content-box;
}

.bloc-features-02__card-details .icon-text__icon svg,
.bloc-features-02__card-details .icon-text__icon img {
    width: 20px;
    height: 20px;
}

.bloc-features-02__card-details .icon-text__text {
    flex: 1 1 auto;
    min-width: 0;
}

/* Card Link */
.bloc-features-02__card-link {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size: 16px;
    font-weight: 400;
    line-height: 1.5;
    color: #3C0314;
    text-decoration: none;
    transition: color 0.2s ease;
}

.bloc-features-02__card-link:hover {
    color: #2a020e;
}

.bloc-features-02__card-link-icon {
    width: 20px;
    height: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.bloc-features-02__card-link-icon svg {
    width: 10px;
    height: 10px;
}

/* ========================================
   ACTIONS (BUTTONS)
   ======================================== */
.bloc-features-02__actions {
    display: flex;
    gap: 16px;
    flex-wrap: wrap;
}

/* ========================================
   RIGHT COLUMN - LARGE IMAGE
   ======================================== */
.bloc-features-02__zone-right {
    flex: 1 1 0%;
    width: 100%;
    min-width: 0;
    display: flex;
    overflow: hidden;
    border-radius: 0;
}

.bloc-features-02__hero-image {
    width: 100%;
    height: 100%;
    background-color: transparent;
    display: flex;
    align-items: stretch;
    justify-content: center;
    min-height: 616px;
    aspect-ratio: 654 / 616;
    border-radius: 0;
    overflow: hidden;
}

.bloc-features-02__hero-image--wrapped {
    padding: var(--bloc-features-02-hero-wrapper-padding, 24px);
    box-sizing: border-box;
}

.bloc-features-02__hero-image img,
.bloc-features-02__hero-img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 0;
}

.bloc-features-02__hero-image-placeholder {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.bloc-features-02__hero-image-placeholder svg {
    width: 64px;
    height: 64px;
    color: #999;
    opacity: 0.5;
}

/* ========================================
   RESPONSIVE - Large Desktop
   ======================================== */
@media (max-width: 1400px) {
    .bloc-features-02__container {
        gap: 32px;
    }

    .bloc-features-02__headline {
        font-size: 40px;
    }
}

/* ========================================
   RESPONSIVE - Desktop
   ======================================== */
@media (max-width: 1200px) {
    .bloc-features-02 {
        padding: 64px var(--section-padding-x, 64px);
    }

    .bloc-features-02__container {
        flex-direction: column-reverse; /* Keep image first in the mobile flow */
        gap: 48px;
    }

    .bloc-features-02__container--cards-hero-row {
        flex-direction: column-reverse;
    }

    .bloc-features-02__cards-hero-row {
        flex-direction: column-reverse;
        gap: 48px;
    }

    .bloc-features-02__cards-hero-row .bloc-features-02__hero-image {
        min-height: 400px;
        aspect-ratio: 654 / 616;
    }

    .bloc-features-02__zone-left,
    .bloc-features-02__zone-right {
        width: 100%;
        max-width: none;
    }

    .bloc-features-02__headline {
        font-size: 36px;
    }

    .bloc-features-02__hero-image {
        min-height: 400px;
    }
}

/* Stack text01-feat02 : tablette uniquement, réduire encore la hauteur du hero image (~20%) */
@media (min-width: 769px) and (max-width: 1024px) {
    main#primary > .page-content-wrapper > .entry-content > .usine-bloc-stack.usine-bloc-stack--text01-feat02 > section.bloc-features-02 .bloc-features-02__hero-image,
    body.home main#primary > .page-content-wrapper > .entry-content > .usine-bloc-stack.usine-bloc-stack--text01-feat02 > section.bloc-features-02 .bloc-features-02__hero-image {
        min-height: 0 !important;
        aspect-ratio: 5 / 2 !important; /* 2.0 -> 2.5 => ~20% moins haut */
    }

    main#primary > .page-content-wrapper > .entry-content > .usine-bloc-stack.usine-bloc-stack--text01-feat02 > section.bloc-features-02 .bloc-features-02__hero-image img,
    main#primary > .page-content-wrapper > .entry-content > .usine-bloc-stack.usine-bloc-stack--text01-feat02 > section.bloc-features-02 .bloc-features-02__hero-img,
    body.home main#primary > .page-content-wrapper > .entry-content > .usine-bloc-stack.usine-bloc-stack--text01-feat02 > section.bloc-features-02 .bloc-features-02__hero-image img,
    body.home main#primary > .page-content-wrapper > .entry-content > .usine-bloc-stack.usine-bloc-stack--text01-feat02 > section.bloc-features-02 .bloc-features-02__hero-img {
        width: 100% !important;
        height: 100% !important;
        object-fit: cover !important;
    }
}

/* ========================================
   RESPONSIVE - Tablet
   ======================================== */
@media (max-width: 992px) {
    .bloc-features-02 {
        padding: 48px var(--section-padding-x, 64px);
    }

    .bloc-features-02__headline {
        font-size: 32px;
    }

    .bloc-features-02__card--horizontal {
        flex-direction: column;
    }

    .bloc-features-02__card--horizontal .bloc-features-02__card-image {
        flex: none;
        width: 100%;
        aspect-ratio: 16 / 9;
        min-height: auto;
    }
}

/* ========================================
   RESPONSIVE - Mobile
   ======================================== */
@media (max-width: 768px) {
    .bloc-features-02 {
        padding: 40px var(--section-padding-x, 64px);
    }

    .bloc-features-02__zone-left {
        gap: 24px;
    }

    .bloc-features-02__headline {
        font-size: 28px;
    }

    .bloc-features-02__description {
        font-size: 16px;
    }

    .bloc-features-02__form-row {
        flex-direction: column;
    }

    .bloc-features-02__form-input {
        border-right: 1px solid #232425;
        border-bottom: none;
    }

    .bloc-features-02__actions {
        flex-direction: column;
    }

    .bloc-features-02__card-number {
        font-size: 20px;
    }

    .bloc-features-02__card-wrap--vertical {
        grid-template-columns: 1fr;
    }

    .bloc-features-02__hero-image {
        min-height: 300px;
    }

    /*
     * Stack text01-feat02 + .bloc-features-02 uniquement (mobile) :
     * usine-components [class*="__card"] impose gap:16px sur article.__card — on remet 0.
     * Marge icône → titre du stack (24px) : 0 sur mobile pour cette section seule.
     */
    main#primary > .page-content-wrapper > .entry-content > .usine-bloc-stack.usine-bloc-stack--text01-feat02 > section.bloc-features-02 article.bloc-features-02__card--vertical,
    body.home main#primary > .page-content-wrapper > .entry-content > .usine-bloc-stack.usine-bloc-stack--text01-feat02 > section.bloc-features-02 article.bloc-features-02__card--vertical {
        gap: 0 !important;
    }

    main#primary > .page-content-wrapper > .entry-content > .usine-bloc-stack.usine-bloc-stack--text01-feat02 > section.bloc-features-02 .bloc-features-02__card-title,
    body.home main#primary > .page-content-wrapper > .entry-content > .usine-bloc-stack.usine-bloc-stack--text01-feat02 > section.bloc-features-02 .bloc-features-02__card-title {
        margin-top: 0 !important;
        padding: 0 !important;
    }

    /* Icône → titre : 16px (plus spécifique que la règle margin-top: 0 ci-dessus). */
    main#primary > .page-content-wrapper > .entry-content > .usine-bloc-stack.usine-bloc-stack--text01-feat02 > section.bloc-features-02 .bloc-features-02__card-content > .bloc-features-02__card-icon + .bloc-features-02__card-title,
    body.home main#primary > .page-content-wrapper > .entry-content > .usine-bloc-stack.usine-bloc-stack--text01-feat02 > section.bloc-features-02 .bloc-features-02__card-content > .bloc-features-02__card-icon + .bloc-features-02__card-title {
        margin-top: 16px !important;
    }

    main#primary > .page-content-wrapper > .entry-content > .usine-bloc-stack.usine-bloc-stack--text01-feat02 > section.bloc-features-02 .bloc-features-02__card-description,
    body.home main#primary > .page-content-wrapper > .entry-content > .usine-bloc-stack.usine-bloc-stack--text01-feat02 > section.bloc-features-02 .bloc-features-02__card-description {
        padding: 0 !important;
    }

    /* Titre (h5/h3) → description : exactement 8px (neutralise marges navigateur / feuilles globales). */
    main#primary > .page-content-wrapper > .entry-content > .usine-bloc-stack.usine-bloc-stack--text01-feat02 > section.bloc-features-02 .bloc-features-02__card-content > .bloc-features-02__card-title,
    body.home main#primary > .page-content-wrapper > .entry-content > .usine-bloc-stack.usine-bloc-stack--text01-feat02 > section.bloc-features-02 .bloc-features-02__card-content > .bloc-features-02__card-title {
        margin-bottom: 0 !important;
    }

    main#primary > .page-content-wrapper > .entry-content > .usine-bloc-stack.usine-bloc-stack--text01-feat02 > section.bloc-features-02 .bloc-features-02__card-title + .bloc-features-02__card-description,
    body.home main#primary > .page-content-wrapper > .entry-content > .usine-bloc-stack.usine-bloc-stack--text01-feat02 > section.bloc-features-02 .bloc-features-02__card-title + .bloc-features-02__card-description {
        margin-top: 8px !important;
        margin-bottom: 0 !important;
    }

    /* Renfort mobile : __card-content matche toujours [class*="__card"] (gap 16px !important en ≤768). */
    main#primary > .page-content-wrapper > .entry-content > .usine-bloc-stack.usine-bloc-stack--text01-feat02 > section.bloc-features-02 .bloc-features-02__card-content,
    body.home main#primary > .page-content-wrapper > .entry-content > .usine-bloc-stack.usine-bloc-stack--text01-feat02 > section.bloc-features-02 .bloc-features-02__card-content {
        gap: 0 !important;
        row-gap: 0 !important;
        column-gap: 0 !important;
    }

    /*
     * Même stack (mobile) : __cards-hero-row matche usine-components [class*="__card"] → padding/gap parasites.
     * Pleine largeur des colonnes ; visuel hero carré (1/1) comme à l’origine.
     */
    main#primary > .page-content-wrapper > .entry-content > .usine-bloc-stack.usine-bloc-stack--text01-feat02 > section.bloc-features-02 .bloc-features-02__cards-hero-row.bloc-features-02__cards-hero-row--media-left,
    body.home main#primary > .page-content-wrapper > .entry-content > .usine-bloc-stack.usine-bloc-stack--text01-feat02 > section.bloc-features-02 .bloc-features-02__cards-hero-row.bloc-features-02__cards-hero-row--media-left {
        padding: 0 !important;
        width: 100% !important;
        max-width: 100% !important;
        box-sizing: border-box !important;
    }

    main#primary > .page-content-wrapper > .entry-content > .usine-bloc-stack.usine-bloc-stack--text01-feat02 > section.bloc-features-02 .bloc-features-02__cards-hero-row .bloc-features-02__card-wrap--vertical,
    body.home main#primary > .page-content-wrapper > .entry-content > .usine-bloc-stack.usine-bloc-stack--text01-feat02 > section.bloc-features-02 .bloc-features-02__cards-hero-row .bloc-features-02__card-wrap--vertical {
        padding: 0 !important;
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        flex: 0 0 auto !important;
        align-self: stretch !important;
        box-sizing: border-box !important;
        grid-template-columns: minmax(0, 1fr) !important;
    }

    main#primary > .page-content-wrapper > .entry-content > .usine-bloc-stack.usine-bloc-stack--text01-feat02 > section.bloc-features-02 .bloc-features-02__cards-hero-row .bloc-features-02__zone-right--in-row,
    body.home main#primary > .page-content-wrapper > .entry-content > .usine-bloc-stack.usine-bloc-stack--text01-feat02 > section.bloc-features-02 .bloc-features-02__cards-hero-row .bloc-features-02__zone-right--in-row {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        flex: 0 0 auto !important;
        align-self: stretch !important;
        box-sizing: border-box !important;
    }

    main#primary > .page-content-wrapper > .entry-content > .usine-bloc-stack.usine-bloc-stack--text01-feat02 > section.bloc-features-02 .bloc-features-02__cards-hero-row article.bloc-features-02__card--vertical,
    body.home main#primary > .page-content-wrapper > .entry-content > .usine-bloc-stack.usine-bloc-stack--text01-feat02 > section.bloc-features-02 .bloc-features-02__cards-hero-row article.bloc-features-02__card--vertical {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        justify-self: stretch !important;
        box-sizing: border-box !important;
    }

    main#primary > .page-content-wrapper > .entry-content > .usine-bloc-stack.usine-bloc-stack--text01-feat02 > section.bloc-features-02 .bloc-features-02__cards-hero-row .bloc-features-02__hero-image,
    body.home main#primary > .page-content-wrapper > .entry-content > .usine-bloc-stack.usine-bloc-stack--text01-feat02 > section.bloc-features-02 .bloc-features-02__cards-hero-row .bloc-features-02__hero-image {
        aspect-ratio: 1 / 1 !important;
        min-height: 0 !important;
        height: auto !important;
        max-height: none !important;
        width: 100% !important;
        flex: 0 0 auto !important;
    }

    main#primary > .page-content-wrapper > .entry-content > .usine-bloc-stack.usine-bloc-stack--text01-feat02 > section.bloc-features-02 .bloc-features-02__cards-hero-row .bloc-features-02__hero-image img,
    main#primary > .page-content-wrapper > .entry-content > .usine-bloc-stack.usine-bloc-stack--text01-feat02 > section.bloc-features-02 .bloc-features-02__cards-hero-row .bloc-features-02__hero-img,
    body.home main#primary > .page-content-wrapper > .entry-content > .usine-bloc-stack.usine-bloc-stack--text01-feat02 > section.bloc-features-02 .bloc-features-02__cards-hero-row .bloc-features-02__hero-image img,
    body.home main#primary > .page-content-wrapper > .entry-content > .usine-bloc-stack.usine-bloc-stack--text01-feat02 > section.bloc-features-02 .bloc-features-02__cards-hero-row .bloc-features-02__hero-img {
        width: 100% !important;
        height: 100% !important;
        object-fit: cover !important;
    }
}

/* ========================================
   RESPONSIVE - Small Mobile
   ======================================== */
@media (max-width: 480px) {
    .bloc-features-02__headline {
        font-size: 24px;
    }

    .bloc-features-02__tagline {
        font-size: 14px;
    }

    .bloc-features-02__card-content {
        padding: 16px;
    }
}

/* Typo demandee — stack text01-feat02 (titres des 4 cartes) */
main#primary > .page-content-wrapper > .entry-content > .usine-bloc-stack.usine-bloc-stack--text01-feat02 > section.bloc-features-02 .bloc-features-02__card-title,
body.home main#primary > .page-content-wrapper > .entry-content > .usine-bloc-stack.usine-bloc-stack--text01-feat02 > section.bloc-features-02 .bloc-features-02__card-title {
    font-family: "Inter Tight", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif !important;
    font-weight: 500 !important;
    line-height: 1 !important;
}

/* Tablette uniquement : image hero 60% moins haute dans le stack text01-feat02 */
@media (min-width: 769px) and (max-width: 1024px) {
    main#primary > .page-content-wrapper > .entry-content > .usine-bloc-stack.usine-bloc-stack--text01-feat02 > section.bloc-features-02 .bloc-features-02__cards-hero-row .bloc-features-02__hero-image,
    body.home main#primary > .page-content-wrapper > .entry-content > .usine-bloc-stack.usine-bloc-stack--text01-feat02 > section.bloc-features-02 .bloc-features-02__cards-hero-row .bloc-features-02__hero-image {
        width: 100% !important;
        max-width: 100% !important;
        height: 248px !important; /* ~40% de 621px => -60% */
        min-height: 248px !important;
        max-height: 248px !important;
        align-self: start !important;
    }

    main#primary > .page-content-wrapper > .entry-content > .usine-bloc-stack.usine-bloc-stack--text01-feat02 > section.bloc-features-02 .bloc-features-02__cards-hero-row .bloc-features-02__hero-image img,
    main#primary > .page-content-wrapper > .entry-content > .usine-bloc-stack.usine-bloc-stack--text01-feat02 > section.bloc-features-02 .bloc-features-02__cards-hero-row .bloc-features-02__hero-img,
    body.home main#primary > .page-content-wrapper > .entry-content > .usine-bloc-stack.usine-bloc-stack--text01-feat02 > section.bloc-features-02 .bloc-features-02__cards-hero-row .bloc-features-02__hero-image img,
    body.home main#primary > .page-content-wrapper > .entry-content > .usine-bloc-stack.usine-bloc-stack--text01-feat02 > section.bloc-features-02 .bloc-features-02__cards-hero-row .bloc-features-02__hero-img {
        width: 100% !important;
        height: 100% !important;
        object-fit: cover !important;
    }
}

/* Tablette + mobile : image hero ~50% moins haute dans le stack text01-feat02 */
@media (max-width: 1024px) {
    /* Cible exacte du DOM actuel : container--media-right > zone-right > hero-image */
    main#primary > .page-content-wrapper > .entry-content > .usine-bloc-stack.usine-bloc-stack--text01-feat02 > section.bloc-features-02 .bloc-features-02__container--media-right .bloc-features-02__zone-right .bloc-features-02__hero-image,
    body.home main#primary > .page-content-wrapper > .entry-content > .usine-bloc-stack.usine-bloc-stack--text01-feat02 > section.bloc-features-02 .bloc-features-02__container--media-right .bloc-features-02__zone-right .bloc-features-02__hero-image {
        aspect-ratio: 2 / 1 !important; /* ~50% moins haut */
        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;
    }

    main#primary > .page-content-wrapper > .entry-content > .usine-bloc-stack.usine-bloc-stack--text01-feat02 > section.bloc-features-02 .bloc-features-02__container--media-right .bloc-features-02__zone-right .bloc-features-02__hero-image > .bloc-features-02__hero-img,
    main#primary > .page-content-wrapper > .entry-content > .usine-bloc-stack.usine-bloc-stack--text01-feat02 > section.bloc-features-02 .bloc-features-02__container--media-right .bloc-features-02__zone-right .bloc-features-02__hero-image > img,
    body.home main#primary > .page-content-wrapper > .entry-content > .usine-bloc-stack.usine-bloc-stack--text01-feat02 > section.bloc-features-02 .bloc-features-02__container--media-right .bloc-features-02__zone-right .bloc-features-02__hero-image > .bloc-features-02__hero-img,
    body.home main#primary > .page-content-wrapper > .entry-content > .usine-bloc-stack.usine-bloc-stack--text01-feat02 > section.bloc-features-02 .bloc-features-02__container--media-right .bloc-features-02__zone-right .bloc-features-02__hero-image > img {
        width: 100% !important;
        height: 100% !important;
        object-fit: cover !important;
    }

    main#primary > .page-content-wrapper > .entry-content > .usine-bloc-stack.usine-bloc-stack--text01-feat02 > section.bloc-features-02 .bloc-features-02__cards-hero-row .bloc-features-02__hero-image,
    body.home main#primary > .page-content-wrapper > .entry-content > .usine-bloc-stack.usine-bloc-stack--text01-feat02 > section.bloc-features-02 .bloc-features-02__cards-hero-row .bloc-features-02__hero-image {
        aspect-ratio: 2 / 1 !important; /* 1/1 -> 2/1 = ~50% de hauteur en moins */
        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;
    }

    main#primary > .page-content-wrapper > .entry-content > .usine-bloc-stack.usine-bloc-stack--text01-feat02 > section.bloc-features-02 .bloc-features-02__cards-hero-row .bloc-features-02__hero-image img,
    main#primary > .page-content-wrapper > .entry-content > .usine-bloc-stack.usine-bloc-stack--text01-feat02 > section.bloc-features-02 .bloc-features-02__hero-img,
    body.home main#primary > .page-content-wrapper > .entry-content > .usine-bloc-stack.usine-bloc-stack--text01-feat02 > section.bloc-features-02 .bloc-features-02__cards-hero-row .bloc-features-02__hero-image img,
    body.home main#primary > .page-content-wrapper > .entry-content > .usine-bloc-stack.usine-bloc-stack--text01-feat02 > section.bloc-features-02 .bloc-features-02__hero-img {
        width: 100% !important;
        height: 100% !important;
        object-fit: cover !important;
    }
}