/* doc-project | projet/assets/css/front-page-simple-catalog.css | styles dedies a la home catalogue simplifiee devenue vue par defaut avec petit header atelier, grille 2 colonnes mobile 3 colonnes desktop, hauteur visible finale sous le nom, tarifs standards affiches en liste verticale simple sans cards separees, tarifs complementaires portillon et coulissant sous les tarifs standards, carte catalogue entiere cliquable vers Voir plus hors CTA, description courte dans un bloc separe tronque a deux lignes avec Voir plus et zone entiere cliquable en conservant les sauts de ligne saisis en admin, double CTA branchant l estimation prix express et la modale produit existantes sans duplication, bouton Reprendre configuration affiche quand un brouillon V2 local valide existe, contours permanents forts sur mobile pour Devis express Configurer et Reprendre configuration, eyebrow catalogue centre sur la largeur de l ecran avec la meme esthétique premium que l animation, clone temporaire retire en fin d animation et respect de prefers-reduced-motion */
.front-page--simple-catalog {
    background:
        radial-gradient(circle at top left, rgba(255, 255, 255, 0.72), transparent 28%),
        linear-gradient(180deg, #f8f3ec 0%, #f6f2ea 100%);
}

.front-page--simple-catalog .site-footer {
    margin-top: 0;
}

.simple-catalog-landing {
    padding: 44px 0 72px;
}

.simple-catalog-landing__header {
    max-width: 760px;
    margin: 0 auto 28px;
}

.simple-catalog-landing__eyebrow {
    display: flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    gap: 10px;
    width: fit-content;
    max-width: calc(100vw - 32px);
    min-height: 48px;
    padding: 0 22px;
    margin: 0 auto 14px;
    border: 3px solid rgba(64, 39, 18, 0.92);
    border-radius: 999px;
    background:
        radial-gradient(circle at top left, rgba(255, 255, 255, 0.72), transparent 40%),
        linear-gradient(180deg, rgba(255, 250, 243, 0.98), rgba(238, 218, 189, 0.98));
    color: var(--accent-dark);
    box-shadow:
        0 0 0 2px rgba(95, 60, 27, 0.10),
        0 10px 24px rgba(31, 26, 23, 0.16),
        inset 0 1px 0 rgba(255, 255, 255, 0.72);
    font-size: clamp(12px, 2.4vw, 15px);
    font-weight: 900;
    letter-spacing: 0.08em;
    line-height: 1.25;
    text-align: center;
    text-transform: uppercase;
}

.simple-catalog-landing__eyebrow--intro-source-hidden {
    visibility: hidden;
}

.simple-catalog-eyebrow-intro-clone {
    position: fixed;
    top: 50%;
    left: 50%;
    z-index: 1200;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    width: auto;
    max-width: calc(100vw - 32px);
    min-height: 48px;
    margin: 0;
    padding: 0 22px;
    border: 3px solid rgba(64, 39, 18, 0.92);
    border-radius: 999px;
    background:
        radial-gradient(circle at top left, rgba(255, 255, 255, 0.72), transparent 40%),
        linear-gradient(180deg, rgba(255, 250, 243, 0.98), rgba(238, 218, 189, 0.98));
    color: var(--accent-dark);
    box-shadow:
        0 0 0 7px rgba(95, 60, 27, 0.16),
        0 22px 58px rgba(31, 26, 23, 0.28),
        inset 0 1px 0 rgba(255, 255, 255, 0.82);
    font-size: clamp(12px, 2.4vw, 15px);
    font-weight: 900;
    letter-spacing: 0.08em;
    line-height: 1.25;
    text-align: center;
    text-transform: uppercase;
    pointer-events: none;
    transform: translate(-50%, -50%) scale(1.08);
    transform-origin: center;
    transition:
        top 1300ms cubic-bezier(0.22, 1, 0.36, 1) 1700ms,
        transform 1300ms cubic-bezier(0.22, 1, 0.36, 1) 1700ms,
        box-shadow 1300ms ease 1700ms;
    will-change: top, transform;
}

.simple-catalog-eyebrow-intro-clone--moving {
    box-shadow:
        0 0 0 2px rgba(95, 60, 27, 0.10),
        0 10px 24px rgba(31, 26, 23, 0.16),
        inset 0 1px 0 rgba(255, 255, 255, 0.72);
}

.simple-catalog-landing__title {
    margin: 0 0 12px;
    color: var(--accent-dark);
    font-size: clamp(28px, 4.8vw, 46px);
    line-height: 1.08;
}

.simple-catalog-landing__lead {
    margin: 0;
    color: var(--muted);
    font-size: 17px;
    line-height: 1.6;
}

.simple-catalog-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 22px;
}

.simple-catalog-card {
    display: grid;
    grid-template-rows: auto 1fr;
    overflow: hidden;
    min-width: 0;
}

.simple-catalog-card[data-simple-catalog-description-card] {
    cursor: pointer;
}

.simple-catalog-card__media {
    background: #eadfce;
    border-bottom: 1px solid rgba(138, 90, 43, 0.10);
}

.simple-catalog-card__body {
    display: grid;
    gap: 16px;
    padding: 18px;
}

.simple-catalog-card__title {
    margin: 0;
    color: var(--accent-dark);
    font-size: 20px;
    line-height: 1.25;
}

.simple-catalog-card__height {
    margin: -8px 0 0;
    color: var(--accent-dark);
    font-size: 14px;
    font-weight: 800;
    line-height: 1.35;
}

.simple-catalog-card__pricing {
    display: grid;
    gap: 10px;
}

.simple-catalog-card__pricing-list {
    display: grid;
    gap: 6px;
    margin: 0;
    padding: 0;
    list-style: none;
}

.simple-catalog-card__pricing-row {
    margin: 0;
}

.simple-catalog-card__pricing-line {
    display: block;
    color: var(--accent-dark);
    font-size: 15px;
    font-weight: 700;
    line-height: 1.5;
}

.simple-catalog-card__pricing-extra-list {
    display: grid;
    gap: 5px;
    margin: 4px 0 0;
    padding: 10px 0 0;
    border-top: 1px solid rgba(138, 90, 43, 0.16);
    list-style: none;
}

.simple-catalog-card__pricing-extra-row {
    margin: 0;
}

.simple-catalog-card__pricing-extra-line {
    display: block;
    color: var(--accent-dark);
    font-size: 14px;
    font-weight: 800;
    line-height: 1.45;
}

.simple-catalog-card__description-block {
    display: grid;
    gap: 7px;
    margin: -2px 0 0;
    padding: 10px 0 0;
    border-top: 1px solid rgba(138, 90, 43, 0.16);
}

.simple-catalog-card__description-block.is-clickable {
    cursor: pointer;
}

.simple-catalog-card__description-block.is-clickable:hover .simple-catalog-card__description-more,
.simple-catalog-card__description-block.is-clickable:focus-visible .simple-catalog-card__description-more {
    color: var(--accent);
}

.simple-catalog-card__description-block.is-clickable:focus-visible {
    outline: 3px solid rgba(138, 90, 43, 0.30);
    outline-offset: 5px;
    border-radius: 14px;
}

.simple-catalog-card__description {
    display: -webkit-box;
    margin: 0;
    overflow: hidden;
    color: var(--accent-dark);
    font-size: 14px;
    font-weight: 800;
    line-height: 1.45;
    pointer-events: none;
    -webkit-box-orient: vertical;
    white-space: pre-line;
    -webkit-line-clamp: 2;
    line-clamp: 2;
}

.simple-catalog-card__description-more {
    justify-self: start;
    padding: 0;
    border: 0;
    background: transparent;
    color: var(--accent-dark);
    cursor: pointer;
    font: inherit;
    font-size: 13px;
    font-weight: 900;
    line-height: 1.35;
    pointer-events: none;
    text-decoration: underline;
    text-underline-offset: 3px;
}

.simple-catalog-card__description-more:hover,
.simple-catalog-card__description-more:focus-visible {
    color: var(--accent);
}

.simple-catalog-card__pricing-empty {
    margin: 0;
    color: var(--muted);
    font-size: 14px;
}

.simple-catalog-card__actions {
    display: grid;
    gap: 10px;
    margin-top: auto;
    cursor: auto;
}

.simple-catalog-card__cta {
    --simple-catalog-cta-border: rgba(95, 60, 27, 0.72);
    --simple-catalog-cta-ring: rgba(95, 60, 27, 0.16);
    position: relative;
    width: 100%;
    min-height: 44px;
    margin-top: 0;
    border: 2px solid var(--simple-catalog-cta-border);
    transition:
        transform 160ms ease,
        border-color 160ms ease,
        box-shadow 160ms ease,
        background 160ms ease,
        color 160ms ease;
    box-shadow:
        0 0 0 3px var(--simple-catalog-cta-ring),
        0 12px 24px rgba(31, 26, 23, 0.13),
        inset 0 1px 0 rgba(255, 255, 255, 0.78);
    touch-action: manipulation;
}

.simple-catalog-card__cta--express {
    --simple-catalog-cta-border: rgba(95, 60, 27, 0.82);
    --simple-catalog-cta-ring: rgba(138, 90, 43, 0.18);
    background: linear-gradient(180deg, rgba(255, 251, 245, 1), rgba(244, 230, 209, 0.98));
    color: var(--accent-dark);
}

.simple-catalog-card__cta--configure {
    --simple-catalog-cta-border: rgba(95, 60, 27, 0.92);
    --simple-catalog-cta-ring: rgba(95, 60, 27, 0.20);
    background: linear-gradient(135deg, var(--accent), var(--accent-dark));
    color: #fff;
    box-shadow:
        0 0 0 3px var(--simple-catalog-cta-ring),
        0 14px 28px rgba(95, 60, 27, 0.22),
        inset 0 1px 0 rgba(255, 255, 255, 0.22);
}

.simple-catalog-card__cta--resume {
    --simple-catalog-cta-border: rgba(138, 90, 43, 0.92);
    --simple-catalog-cta-ring: rgba(138, 90, 43, 0.20);
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(250, 240, 225, 0.98));
    color: var(--accent-dark);
    font-weight: 900;
}

.simple-catalog-card__cta--resume[hidden] {
    display: none !important;
}

.simple-catalog-card__cta:focus-visible {
    outline: none;
    box-shadow:
        0 0 0 4px rgba(95, 60, 27, 0.24),
        0 18px 34px rgba(31, 26, 23, 0.18),
        inset 0 1px 0 rgba(255, 255, 255, 0.88);
}

.simple-catalog-card__cta:active {
    transform: translateY(1px);
    border-color: rgba(95, 60, 27, 0.98);
    box-shadow:
        0 0 0 3px rgba(95, 60, 27, 0.22),
        0 7px 15px rgba(31, 26, 23, 0.12),
        inset 0 2px 6px rgba(31, 26, 23, 0.18);
}

@media (hover: hover) and (pointer: fine) {
    .simple-catalog-card__cta:hover {
        transform: translateY(-2px);
    }

    .simple-catalog-card__cta--express:hover {
        background: linear-gradient(180deg, rgba(255, 248, 238, 1), rgba(239, 218, 190, 1));
        box-shadow:
            0 0 0 4px rgba(138, 90, 43, 0.18),
            0 18px 34px rgba(31, 26, 23, 0.18),
            inset 0 1px 0 rgba(255, 255, 255, 0.88);
    }

    .simple-catalog-card__cta--configure:hover {
        background: linear-gradient(135deg, #9b6735, var(--accent-dark));
        box-shadow:
            0 0 0 4px rgba(95, 60, 27, 0.20),
            0 18px 34px rgba(95, 60, 27, 0.26),
            inset 0 1px 0 rgba(255, 255, 255, 0.24);
    }
}

@media (max-width: 980px) {
    .simple-catalog-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 640px) {
    .simple-catalog-landing {
        padding: 28px 0 56px;
    }

    .simple-catalog-landing__eyebrow,
    .simple-catalog-eyebrow-intro-clone {
        max-width: calc(100vw - 24px);
        min-height: 46px;
        padding: 0 16px;
        border-width: 3px;
        font-size: 11px;
    }

    .simple-catalog-grid {
        gap: 14px;
    }

    .simple-catalog-card__body {
        gap: 14px;
        padding: 14px;
    }

    .simple-catalog-card__title {
        font-size: 17px;
    }

    .simple-catalog-card__height {
        font-size: 13px;
    }

    .simple-catalog-card__pricing-line {
        font-size: 14px;
    }

    .simple-catalog-card__pricing-extra-line {
        font-size: 13px;
    }

    .simple-catalog-card__description,
    .simple-catalog-card__description-more {
        font-size: 13px;
    }

    .simple-catalog-card__actions {
        gap: 8px;
    }

    .simple-catalog-card__cta {
        min-height: 42px;
        padding-left: 10px;
        padding-right: 10px;
        border-width: 2px;
        font-size: 12px;
        box-shadow:
            0 0 0 2px var(--simple-catalog-cta-ring),
            0 9px 18px rgba(31, 26, 23, 0.13),
            inset 0 1px 0 rgba(255, 255, 255, 0.76);
    }
}

@media (prefers-reduced-motion: reduce) {
    .simple-catalog-landing__eyebrow--intro-source-hidden {
        visibility: visible;
    }

    .simple-catalog-eyebrow-intro-clone {
        display: none !important;
    }
}