:root {
    --botlink-primary-color:#00f0d4;
    --botlink-secondary-color:#566868;
}
.article-main {
    font-family:inherit;color:var(--botlink-secondary-color);line-height:1.4;font-size:1rem;margin:0 auto;max-width:50rem;padding-inline:2rem;border-radius:.5rem;transition:all 0.3s ease;
    & article {
        margin-bottom:6rem;
        & h1, & h2, & h3 {
            text-align:center;margin-top:2rem;margin-bottom:2rem;width:100%;text-align:center;
        }
        & h2, & h3 {
            margin-bottom:10px;color:var(--botlink-primary-color);padding-inline:0;margin-inline:auto;font-weight:700;line-height:1.2;text-transform:uppercase;
        }
        & h1 {
            font-size:1.8rem;margin-bottom:10px;color:var(--botlink-secondary-color);font-weight:700;text-transform:uppercase;
        }
        & h2 {
            font-size:1.6rem;margin:3rem 0 1rem 0;
        }
        & h3 {
            font-size:1.4rem;
        }
        & p {
            margin-bottom:1rem;color:var(--botlink-secondary-color);
            & a {
                color:var(--botlink-primary-color);
            }
        }
        & hr {display:none;}
        & img {
            max-width:100%;display:block;margin:2rem auto;border-radius:1rem;aspect-ratio:16 / 9;object-fit:cover;object-position:center;
        }
        & footer {
            margin-top:2rem;background:none;
            & p {
                text-align:center;width:100%;
            }
            & a.cta {
                background:var(--botlink-primary-color);color:white;padding:1rem 2rem;border-radius:2rem;display:inline-block;margin:0 auto;text-transform:uppercase;font-weight:700;
                &:hover {
                    background:var(--botlink-secondary-color);color:white;
                }
            }
        }
    }
}

body:has([aria-label="Formulaire de contact"]) {
    & a.cta[href*="contact"] {
        display:none;
    }
}


.article-main {
    display:flex;flex-direction:row;max-width:85vw;flex-wrap:wrap;
    & article {
        position:relative;display:flex;align-items:flex-start;justify-content:stretch;flex-direction:column;padding-right:400px!important;
        & h1, & h2, & h3 {
            text-align:left;
        }
        & .encart-contact {
            display:flex;flex-direction:column;align-items:center;justify-content:center;padding:1.5rem;margin-top:2rem;border-radius:1rem;background-color:var(--botlink-secondary-color);color:var(--botlink-primary-color);position:absolute;bottom:0;right:calc(0rem - 2rem + 6px);width:380px;
            & p {
                font-size:1.2rem;font-weight:700;margin-bottom:1rem;color:white;
            }
            & a.btn {
                background:white;color:var(--botlink-secondary-color);padding:.75rem 1.5rem;border-radius:2rem;display:inline-block;text-transform:uppercase;font-weight:700;
                &:hover {
                    background:var(--botlink-primary-color);color:white;
                }
            }
        }
    }
    & sidebar {
        width:380px;position:fixed;right:7.5%;z-index:2;
        & .stickyPanel {
            display:flex;flex-direction:column;color:var(--botlink-secondary-color);
            &>div {
                padding:1.5rem;margin-bottom:1rem;border-radius:1rem;background-color:var(--botlink-primary-color);color:var(--botlink-secondary-color);
            }
            & p, & a {
                color:var(--botlink-secondary-color);
            }
        }
    }

    & .otherPost, & .anchor-container {
        display:flex;flex-direction:column;align-items:flex-start;
        & p {
            display:inline-block;font-size:1rem;margin-bottom:.5rem;text-transform:uppercase;font-weight:700;width:100%;max-width:100%;
        }
        & a {
            margin:.3rem 0;font-size:1rem;font-weight:500;text-decoration:underline;margin-left:1rem;line-height:1.1;
        }
    }

    & .anchor-container {
        justify-content:center
        & p {
            margin-top:0;
        }
        & a {
            margin:.25rem 0;display:flex;align-items:flex-start;justify-content:flex-start;text-decoration:none;
            & strong {
                font-weight:400;
            }
            & i {
                width:1rem;height:1rem;min-width:1rem;margin-top:3px;margin-right:.5rem;transform:translateX(0);transition:transform 0.2s ease-in-out;
            }
            & svg {
                width:100%;
                & path, & circle {
                    fill:none;stroke-linecap:round;stroke-width:2px;stroke:var(--botlink-secondary-color);
                }
            }
        }
    }
}

@media screen and (max-width:1500px) {
    .article-main {
        max-width:90%;
        article {
            padding-right:300px!important;
            & .encart-contact {
                width:280px;right:-2rem;
                & p {
                    font-size:1rem;
                }
            }
        }
        & sidebar {
            width:280px;right:5%;
        }
    }
}

@media screen and (max-width:980px) {
    .article-main {
        max-width:100%;
        & sidebar {
            position:static;width:100%;margin-top:2rem;order:2;
        }
        & .anchor-container {
            padding:1.5rem;width:100%;margin-bottom:2rem;border-radius:1rem;background-color:var(--botlink-primary-color);color:var(--botlink-secondary-color);
            & a, & p {
                color:var(--botlink-secondary-color);width:100%;
            }
        }
        & article {
            order:1;padding-right:0!important;margin-bottom:0;
            & h1, & h2, & h3, p {
                text-align:center;
            }
            & .cta-all-links {
                display:none!important;
            }
            & footer.article-footer {
                padding:1rem 0;width:100%;
            }
            & .encart-contact {
                position:static;width:100%;margin-top:2rem;order:3;
            }
        }
    }
}