.cb-empty-assistance-page {
    background: #f4f7fc;
}

.celtiis-breadcrumb {
    margin: 0 0 32px;
    padding: 24px 0;
    background-color: #fff;
    color: var(--celtiis-color-muted, #54627f);
    font-family: 'Gotham', sans-serif;
    font-size: 14px;
}

.celtiis-breadcrumb > .container {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
}

.celtiis-breadcrumb__link {
    color: var(--celtiis-color-muted, #54627f);
    text-decoration: none;
    transition: color .2s ease;
}

.celtiis-breadcrumb__link:hover,
.celtiis-breadcrumb__link:focus {
    color: var(--celtiis-color-primary, var(--bs-secondary, #002f87));
}

.celtiis-breadcrumb__current {
    color: var(--celtiis-color-primary, var(--bs-secondary, #002f87));
    font-weight: 600;
}

.celtiis-breadcrumb .caret-right {
    display: inline-block;
    width: 6px;
    height: 10px;
    background-image: url("data:image/svg+xml,%3Csvg%20width%3D%226%22%20height%3D%2210%22%20viewBox%3D%220%200%206%2010%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M1%201L5%205L1%209%22%20stroke%3D%22%2354627F%22%20stroke-width%3D%221.5%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%2F%3E%3C%2Fsvg%3E");
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
}

.cb-empty-assistance-page__content {
    padding: 0 0 72px;
    font-family: 'Gotham', 'Montserrat', sans-serif;
}

.cb-static-recommendation {
    max-width: 1140px;
    margin: 0 auto;
    overflow: hidden;
    border: 1px solid #dce4f0;
    border-radius: 18px;
    background: #fff;
    color: var(--bs-secondary);
}

.cb-static-recommendation__header {
    padding: 38px 44px 28px;
    text-align: center;
}

.cb-static-recommendation__eyebrow {
    margin: 0 0 14px;
    color: var(--bs-secondary);
    font-size: 13px;
    font-weight: 700;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.cb-static-recommendation h1 {
    margin: 0;
    color: var(--bs-secondary);
    font-size: clamp(28px, 2.6vw, 36px);
    font-weight: 700;
    line-height: 1.12;
}

.cb-static-recommendation__intro {
    max-width: 760px;
    margin: 5px auto 0;
    color: #7787a4;
    font-size: 17px;
    line-height: 1.4;
}

.cb-static-recommendation__steps {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    max-width: 870px;
    margin: 56px auto 0;
    padding: 0;
    list-style: none;
    text-align: left;
}

.cb-static-recommendation__steps li {
    position: relative;
    display: flex;
    align-items: center;
    gap: 13px;
    min-width: 0;
}

.cb-static-recommendation__steps li:not(:last-child)::after {
    position: absolute;
    top: 18px;
    right: 16px;
    width: 43px;
    height: 2px;
    background: #e1e7f0;
    content: '';
}

.cb-static-recommendation__step-number {
    display: grid;
    flex: 0 0 38px;
    width: 38px;
    height: 38px;
    place-items: center;
    border-radius: 50%;
    background: #e8eef6;
    color: #65758d;
    font-size: 15px;
    font-weight: 700;
}

.cb-static-recommendation__steps .is-active .cb-static-recommendation__step-number {
    background: var(--bs-secondary);
    color: #fff;
}

.cb-static-recommendation__steps .is-complete .cb-static-recommendation__step-number {
    background: var(--bs-primary);
    color: var(--bs-secondary);
}

.cb-static-recommendation__steps .is-complete::after {
    background: var(--bs-primary);
}

.cb-static-recommendation__step-copy {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.cb-static-recommendation__step-copy strong {
    color: #5d6f8c;
    font-size: 15px;
    font-weight: 400;
    line-height: 1.25;
}

.cb-static-recommendation__steps .is-active strong {
    color: var(--bs-secondary);
}

.cb-static-recommendation__steps .is-complete strong {
    color: var(--bs-primary);
}

.cb-static-recommendation__step-copy small {
    margin-top: 2px;
    color: #9aa8bd;
    font-size: 12px;
    line-height: 1.2;
}

.cb-static-recommendation__form {
    background: #f9fbfe;
}

.cb-static-recommendation__panel[hidden] {
    display: none !important;
}

.cb-static-recommendation__grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 36px 28px;
    padding: 44px;
}

.cb-static-recommendation__field {
    min-width: 0;
    margin: 0;
    padding: 0;
    border: 0;
}

.cb-static-recommendation__field > label:first-child,
.cb-static-recommendation__choices legend {
    display: block;
    width: 100%;
    margin: 0 0 8px;
    color: #405473;
    font-size: 14px;
    font-weight: 600;
    line-height: 1.4;
}

.cb-static-recommendation select {
    width: 100%;
    height: 49px;
    padding: 0 17px;
    border: 1px solid #ced9e8;
    border-radius: 9px;
    outline: none;
    background-color: #fff;
    color: var(--bs-secondary);
    font: inherit;
    font-size: 15px;
    transition: border-color .2s ease, box-shadow .2s ease;
}

.cb-static-recommendation select {
    appearance: none;
    background-image: url("data:image/svg+xml,%3Csvg%20width%3D%2212%22%20height%3D%228%22%20viewBox%3D%220%200%2012%208%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M2%202L6%206L10%202%22%20stroke%3D%22%235F718E%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%2F%3E%3C%2Fsvg%3E");
    background-repeat: no-repeat;
    background-position: right 18px center;
}

.cb-static-recommendation select:focus {
    border-color: var(--bs-secondary);
    box-shadow: 0 0 0 3px rgba(29, 66, 120, .1);
}

.cb-static-recommendation__choices {
    display: grid;
    gap: 12px;
}

.cb-static-recommendation__choices label {
    display: flex;
    min-height: 50px;
    margin: 0;
    padding: 10px 14px;
    align-items: center;
    gap: 12px;
    border: 1px solid #d8e1ed;
    border-radius: 9px;
    background: #fff;
    color: #4e607c;
    cursor: pointer;
    font-size: 15px;
    line-height: 1.3;
}

.cb-static-recommendation__choices input {
    width: 21px;
    height: 21px;
    flex: 0 0 21px;
    margin: 0;
    accent-color: var(--bs-secondary);
}

.cb-static-recommendation__choices label:has(input:checked) {
    color: var(--bs-secondary);
    font-weight: 600;
}

.cb-static-recommendation__footer {
    display: flex;
    min-height: 104px;
    padding: 24px 44px;
    align-items: center;
    justify-content: flex-end;
    border-top: 1px solid #dce4f0;
    background: #fff;
}

.cb-static-recommendation__footer--between {
    justify-content: space-between;
    gap: 18px;
}

.cb-static-recommendation__previous,
.cb-static-recommendation__prev,
.cb-static-recommendation__next {
    display: inline-flex;
    min-width: 160px;
    min-height: 48px;
    padding: 12px 28px;
    align-items: center;
    justify-content: center;
    gap: 14px;
    border: 0;
    border-radius: 999px;
    background: var(--bs-primary);
    color: #fff;
    font: inherit;
    font-size: 15px;
    font-weight: 500;
    cursor: pointer;
}

.cb-static-recommendation__previous,
.cb-static-recommendation__prev {
    border: 1px solid #cdd8e7;
    background: #fff;
    color: var(--bs-secondary);
}

.cb-static-recommendation__previous:hover,
.cb-static-recommendation__previous:focus-visible,
.cb-static-recommendation__prev:hover,
.cb-static-recommendation__prev:focus-visible {
    border-color: var(--bs-secondary);
}

.cb-static-recommendation__next {
    border: 0;
    background: var(--bs-primary);
    color: #fff;
}

.cb-static-recommendation__previous:focus-visible,
.cb-static-recommendation__prev:focus-visible,
.cb-static-recommendation__next:focus-visible {
    outline: 3px solid rgba(var(--bs-secondary-rgb), .18);
    outline-offset: 2px;
}

.cb-static-recommendation__previous i,
.cb-static-recommendation__prev i,
.cb-static-recommendation__next i {
    font-size: 19px;
    line-height: 1;
}

.cb-static-recommendation__services {
    min-width: 0;
    margin: 0;
    padding: 44px;
    border: 0;
}

.cb-static-recommendation__services > h2 {
    width: 100%;
    margin: 0 0 34px;
    padding: 0;
    color: var(--bs-secondary);
    font-size: 18px;
    font-weight: 500;
    line-height: 1.35;
}

.cb-static-recommendation__service-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 24px;
}

.cb-static-recommendation__service {
    position: relative;
    display: flex;
    min-width: 0;
    min-height: 182px;
    padding: 26px;
    flex-direction: column;
    align-items: flex-start;
    border: 1px solid #d9e2ed;
    border-radius: 14px;
    background: #fff;
    box-shadow: 0 2px 5px rgba(27, 52, 91, .02);
    cursor: pointer;
    transition: border-color .18s ease, box-shadow .18s ease, transform .18s ease;
}

.cb-static-recommendation__service:hover {
    border-color: rgba(var(--bs-secondary-rgb), .48);
    transform: translateY(-1px);
}

.cb-static-recommendation__service:has(input:checked) {
    padding: 25px;
    border: 2px solid var(--bs-secondary);
    box-shadow: 0 8px 16px rgba(var(--bs-secondary-rgb), .12);
}

.cb-static-recommendation__service > input {
    position: absolute;
    width: 1px;
    height: 1px;
    opacity: 0;
    pointer-events: none;
}

.cb-static-recommendation__service-icon {
    display: grid;
    width: 54px;
    height: 54px;
    margin-bottom: 19px;
    place-items: center;
    border-radius: 50%;
    background: #f3f6fa;
    color: var(--bs-secondary);
}

.cb-static-recommendation__service-icon i {
    font-size: 22px;
    line-height: 1;
}

.cb-static-recommendation__service strong {
    color: var(--bs-secondary);
    font-size: 17px;
    font-weight: 500;
    line-height: 1.3;
}

.cb-static-recommendation__service small {
    color: #7787a4;
    font-size: 14px;
    line-height: 1.45;
}

.cb-static-recommendation__budget {
    min-width: 0;
    margin: 0;
    padding: 44px;
    border: 0;
}

.cb-static-recommendation__budget > h2 {
    width: 100%;
    margin: 0 0 20px;
    padding: 0;
    color: var(--bs-secondary);
    font-size: 18px;
    font-weight: 700;
    line-height: 1.35;
}

.cb-static-recommendation__budget-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 14px;
}

.cb-static-recommendation__budget-option {
    position: relative;
    display: flex;
    min-width: 0;
    min-height: 76px;
    padding: 14px 12px;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    border: 1px solid #cdd9e8;
    border-radius: 8px;
    background: #fff;
    color: #5f6f88;
    cursor: pointer;
    text-align: center;
    transition: border-color .18s ease, box-shadow .18s ease, color .18s ease;
}

.cb-static-recommendation__budget-option:hover {
    border-color: rgba(var(--bs-secondary-rgb), .55);
}

.cb-static-recommendation__budget-option:has(input:checked) {
    padding: 13px 11px;
    border: 2px solid var(--bs-secondary);
    color: var(--bs-secondary);
    box-shadow: 0 4px 10px rgba(var(--bs-secondary-rgb), .08);
}

.cb-static-recommendation__budget-option > input {
    position: absolute;
    width: 1px;
    height: 1px;
    opacity: 0;
    pointer-events: none;
}

.cb-static-recommendation__budget-option strong {
    font-size: 14px;
    font-weight: 500;
    line-height: 1.3;
}

.cb-static-recommendation__budget-option small {
    margin-top: 7px;
    color: #a3aec0;
    font-size: 12px;
    line-height: 1.25;
}

.cb-static-recommendation__contact {
    padding: 44px;
    /* Fond de l'étape déjà gris clair : champs blancs et bordure plus marquée
       pour qu'ils se détachent (mêmes coins, hauteur et focus qu'ailleurs). */
    --cbf-bg: #fff;
    --cbf-notch-bg: #fff;
    --cbf-border: #d9e2ec;
}

.cb-static-recommendation__contact-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px 18px;
    max-width: 760px;
    margin: 0 auto;
}

.cb-static-recommendation__contact > .cb-static-recommendation__legal,
.cb-static-recommendation__contact > .cb-static-recommendation__error {
    max-width: 760px;
    margin-right: auto;
    margin-left: auto;
}

/* Champs : même rendu que les autres formulaires du site (main.css, variables
   --cbf-*) - label flottant dans le champ, remonté sur la bordure au focus ou
   dès qu'il y a une valeur. */
.cb-static-recommendation__contact-field {
    position: relative;
    min-width: 0;
}

.cb-static-recommendation__contact-field--full {
    grid-column: 1 / -1;
}

.cb-static-recommendation__contact-field > label {
    position: absolute;
    top: 24px;
    left: 18px;
    z-index: 2;
    margin: 0;
    padding: 0;
    background: transparent;
    color: var(--cbf-label, #64748b);
    font-family: 'Montserrat', sans-serif;
    font-size: 14px;
    font-weight: 400;
    line-height: 1;
    pointer-events: none;
    transform: translateY(-50%);
    transition: top .22s cubic-bezier(.16, 1, .3, 1), left .18s ease, padding .16s ease,
        background-color .16s ease, font-size .18s ease, font-weight .18s ease, color .18s ease;
}

.cb-static-recommendation__contact-field:has(> input:focus, > input:not(:placeholder-shown)) > label {
    top: 0;
    left: 14px;
    padding: 0 6px;
    background: var(--cbf-notch-bg, #f7f9fc);
    color: var(--cbf-text, #1d3d70);
    font-size: 12.5px;
    font-weight: 500;
}

.cb-static-recommendation__required {
    color: #d93b3b;
}

.cb-static-recommendation__contact-field > input,
.cb-static-recommendation__phone {
    width: 100%;
    height: var(--cbf-height, 48px);
    border: 1px solid var(--cbf-border, #edf1f6);
    border-radius: var(--cbf-radius, 9px);
    background: var(--cbf-bg, #f7f9fc);
    color: var(--cbf-text, #1d3d70);
    font-family: 'Montserrat', sans-serif;
    font-size: 15px;
    font-weight: 400;
}

.cb-static-recommendation__contact-field > input {
    padding: 8px 18px;
    outline: 0;
    transition: border-color .18s ease, box-shadow .18s ease;
}

/* Le label tient lieu de placeholder ; l'exemple n'apparaît qu'au focus. */
.cb-static-recommendation__contact-field > input::placeholder {
    color: transparent;
}

.cb-static-recommendation__contact-field > input:focus::placeholder {
    color: var(--cbf-label, #64748b);
    opacity: .7;
}

.cb-static-recommendation__contact-field > input:focus,
.cb-static-recommendation__phone:focus-within {
    border-color: var(--cbf-border-focus, #8dc63f);
    box-shadow: 0 0 0 3px rgba(141, 198, 63, .15);
}

.cb-static-recommendation__phone {
    display: flex;
    align-items: center;
    overflow: hidden;
}

.cb-static-recommendation__phone > span {
    flex: 0 0 auto;
    margin-left: 15px;
    padding-right: 12px;
    border-right: 1px solid #d9e2ed;
    color: #72819a;
}

.cb-static-recommendation__phone > input {
    min-width: 0;
    height: 100%;
    padding: 0 12px;
    flex: 1 1 auto;
    border: 0;
    outline: 0;
    background: transparent;
    color: var(--bs-secondary);
    font: inherit;
    font-size: 15px;
}

.cb-static-recommendation__consent {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    color: #7787a4;
    cursor: pointer;
    font-size: 13px;
    line-height: 1.45;
}

.cb-static-recommendation__consent input {
    width: 20px;
    height: 20px;
    flex: 0 0 20px;
    margin: 0;
    border-radius: 4px;
    accent-color: var(--bs-secondary);
}

.cb-empty-assistance-page__assistance {
    padding: 8px 20px 36px;
    background: #fff;
}

@media (min-width: 768px) and (max-width: 991px) {
    .cb-static-recommendation__service-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .cb-static-recommendation__budget-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 767px) {
    .celtiis-breadcrumb {
        margin-bottom: 12px;
    }

    .cb-empty-assistance-page__content {
        padding: 0 0 42px;
    }

    .cb-static-recommendation {
        border-radius: 14px;
    }

    .cb-static-recommendation__header {
        padding: 30px 20px 24px;
    }

    .cb-static-recommendation__eyebrow {
        font-size: 11px;
    }

    .cb-static-recommendation h1 {
        font-size: 26px;
    }

    .cb-static-recommendation__intro {
        font-size: 15px;
    }

    .cb-static-recommendation__steps {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 22px 12px;
        margin-top: 34px;
    }

    .cb-static-recommendation__steps li::after {
        display: none;
    }

    .cb-static-recommendation__step-copy strong {
        font-size: 14px;
    }

    .cb-static-recommendation__grid {
        grid-template-columns: 1fr;
        gap: 25px;
        padding: 28px 20px;
    }

    .cb-static-recommendation__footer {
        min-height: auto;
        padding: 20px;
    }

    .cb-static-recommendation__services {
        padding: 28px 20px;
    }

    .cb-static-recommendation__budget {
        padding: 28px 20px;
    }

    .cb-static-recommendation__contact {
        padding: 28px 20px;
    }

    .cb-static-recommendation__services > h2 {
        margin-bottom: 24px;
        font-size: 16px;
    }

    .cb-static-recommendation__budget > h2 {
        font-size: 16px;
    }

    .cb-static-recommendation__service-grid {
        grid-template-columns: 1fr;
        gap: 18px;
    }

    .cb-static-recommendation__budget-grid {
        grid-template-columns: 1fr;
        gap: 12px;
    }

    .cb-static-recommendation__contact-grid {
        grid-template-columns: 1fr;
        gap: 16px;
    }

    .cb-static-recommendation__contact-field--full {
        grid-column: auto;
    }

    .cb-static-recommendation__service {
        min-height: 170px;
    }

    .cb-static-recommendation__footer--between {
        align-items: stretch;
    }

    .cb-static-recommendation__previous,
    .cb-static-recommendation__prev,
    .cb-static-recommendation__next {
        min-width: 0;
        flex: 1 1 0;
        padding-right: 16px;
        padding-left: 16px;
    }

    .cb-empty-assistance-page__assistance {
        padding: 0 16px 25px;
    }
}
