.services-box {
    min-height: 300px;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-between;
}

/* The parallax overlay ships with asymmetric side padding (60px right, 0 left),
   which pushed the centered quote off-center horizontally. Make it symmetric. */
#quote .parallax-overlay-dark {
    padding-left: 0;
    padding-right: 0;
}

/* Quote slider — pager below the author */
#quote .bx-wrapper {
    margin: 0 auto;
    box-shadow: none;
    border: none;
    background: transparent;
}
#quote .bx-viewport {
    background: transparent;
}
#quote .bx-pager {
    position: static;
    text-align: center;
    padding-top: 30px;
    font-size: 0;
}
#quote .bx-pager .bx-pager-item {
    display: inline-block;
    margin: 0 6px;
    vertical-align: middle;
}
#quote .bx-pager .bx-pager-item a {
    display: block;
    width: 12px;
    height: 12px;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.4);
    text-indent: -9999px;
    overflow: hidden;
    transition: background 0.2s ease;
}
#quote .bx-pager .bx-pager-item a:hover,
#quote .bx-pager .bx-pager-item a.active {
    background: #D97955;
}

/* ===== Feature carousel ===== */
#feature-list-carousel {
    position: relative;
}

/* Pagination dots (all screens) */
#feature-list-carousel .owl-controls .owl-pagination {
    margin-top: 18px;
    text-align: center;
}
#feature-list-carousel .owl-controls .owl-page {
    display: inline-block;
}
#feature-list-carousel .owl-controls .owl-page span {
    display: block;
    width: 12px;
    height: 12px;
    margin: 4px;
    border-radius: 50%;
    background: #ccc;
    transition: background 0.2s ease;
}
#feature-list-carousel .owl-controls .owl-page.active span,
#feature-list-carousel .owl-controls.clickable .owl-page:hover span {
    background: #D97955;
}

/* Mobile (default): full/vertical images, NO arrows.
   Navigation via swipe + dots only. */
#feature-list-carousel .owl-controls .owl-buttons {
    display: none;
}

/* ---- Wide screens: fixed height + left/right arrows ---- */
@media (min-width: 768px) {
    /* Every tile keeps the same height, regardless of text length */
    #feature-list-carousel .feature-box {
        height: 360px;
        overflow: hidden;
    }
    /* Image cropped to a constant height */
    #feature-list-carousel .feature-box-image img {
        width: 100%;
        height: 190px;
        object-fit: cover;
    }
    #feature-list-carousel .feature-box-image h4 {
        margin-top: 15px;
    }

    /* Arrows visible only on wide screens */
    #feature-list-carousel .owl-controls .owl-buttons {
        display: block;
    }
    #feature-list-carousel .owl-controls .owl-buttons div {
        position: absolute;
        top: 95px;
        transform: translateY(-50%);
        -webkit-transform: translateY(-50%);
        width: 44px;
        height: 44px;
        line-height: 44px;
        margin: 0;
        padding: 0;
        text-align: center;
        font-size: 22px;
        color: #fff;
        background: #D97955;
        border-radius: 50%;
        opacity: 0.85;
        z-index: 10;
        transition: opacity 0.2s ease, background 0.2s ease;
    }
    #feature-list-carousel .owl-controls .owl-buttons div:hover {
        opacity: 1;
        background: #262626;
        text-decoration: none;
    }
    #feature-list-carousel .owl-controls .owl-buttons .owl-prev {
        left: 0;
    }
    #feature-list-carousel .owl-controls .owl-buttons .owl-next {
        right: 0;
    }
}

/* ===== Mobile dropdown menu ===== */
/* The open menu sat white-on-white over the white page, which was confusing.
   Give it a very light gray background so the panel is clearly separated. */
@media only screen and (max-width: 991px) {
    .white-nav .nav-inner div.nav-menu,
    .white-nav .nav-inner div.nav-menu ul.nav {
        background: #f2f2f2;
    }
    .white-nav .nav-inner div.nav-menu {
        border-bottom: 1px solid #dcdcdc;
        box-shadow: 0 6px 10px rgba(0, 0, 0, 0.06);
    }
    /* Size the panel to its content instead of a fixed 400px, so it does
       not cover the page below. Cap it on short screens with a scroll. */
    .nav-inner div.nav-menu {
        height: auto;
        max-height: calc(100vh - 70px);
        overflow-y: auto;
    }
}

/* ===== Header slider: mobile background images ===== */
/* On desktop the wide landscape photos are set as the <li> background by JS.
   On phones a centered "cover" crop drops the subject (usually on the right),
   so swap in dedicated square crops composed around each subject.
   !important is required to override the inline background set by script.js. */
@media only screen and (max-width: 767px) {
    #home .fullwidth-slider li.slide-hdr-0 {
        background-image: url(../images/custom/header-0-mobile.jpg) !important;
    }
    #home .fullwidth-slider li.slide-hdr-1 {
        background-image: url(../images/custom/header-1-mobile.jpg) !important;
    }
    #home .fullwidth-slider li.slide-hdr-2 {
        background-image: url(../images/custom/header-2-mobile.jpg) !important;
    }
    #home .fullwidth-slider li.slide-hdr-3 {
        background-image: url(../images/custom/header-3-mobile.jpg) !important;
    }
    #home .fullwidth-slider li.slide-hdr-4 {
        background-image: url(../images/custom/header-4-mobile.jpg) !important;
    }
    #home .fullwidth-slider li.slide-hdr-5 {
        background-image: url(../images/custom/header-5-mobile.jpg) !important;
    }
    #home .fullwidth-slider li.slide-hdr-6 {
        background-image: url(../images/custom/header-6-mobile.jpg) !important;
    }

    /* Raise the hero caption on phones so it sits higher over the image. */
    #home .fullwidth-slider .slide-caption {
        -webkit-transform: translateY(-110px);
        transform: translateY(-110px);
    }
}

/* ============================================================
   BLOG / BLOGUE
   Shared styles for the blog listing and article pages
   (fr/blogue/). All rules are scoped under .nc-blog* so they
   never leak into the rest of the site.
   ============================================================ */

/* Interior page title band (sits below the sticky nav) */
.nc-blog-head {
    background: #262626;
    color: #fff;
    padding: 60px 0 50px;
    text-align: center;
}
.nc-blog-head h1 {
    margin: 0 0 12px;
    font-size: 40px;
    line-height: 1.15;
    color: #fff; /* override the theme's dark global h1 color on this dark band */
}
.nc-blog-head p {
    margin: 0 auto;
    max-width: 640px;
    color: #cfcfcf;
    font-size: 17px;
}
.nc-blog-head .nc-blog-kicker {
    display: inline-block;
    margin-bottom: 14px;
    color: #D97955;
    text-transform: uppercase;
    letter-spacing: 2px;
    font-size: 13px;
    font-weight: 700;
}

/* ---- Listing grid ---- */
.nc-blog-list {
    padding: 60px 0 70px;
    background: #f4f6f8;
}
.nc-blog-grid {
    display: flex;
    flex-wrap: wrap;
    margin: 0 -15px;
}
.nc-blog-card-col {
    width: 50%;
    padding: 15px;
    box-sizing: border-box;
}
@media (max-width: 767px) {
    .nc-blog-card-col { width: 100%; }
    .nc-blog-head h1 { font-size: 30px; }
}
.nc-blog-card {
    display: flex;
    flex-direction: column;
    height: 100%;
    background: #fff;
    border-radius: 8px;
    overflow: hidden;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.08);
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}
.nc-blog-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 10px 26px rgba(0, 0, 0, 0.14);
}
.nc-blog-card a.nc-card-img {
    display: block;
    overflow: hidden;
}
.nc-blog-card a.nc-card-img img {
    width: 100%;
    height: 210px;
    object-fit: cover;
    display: block;
    transition: transform 0.4s ease;
}
.nc-blog-card:hover a.nc-card-img img { transform: scale(1.04); }
.nc-blog-card .nc-card-body {
    padding: 22px 24px 26px;
    display: flex;
    flex-direction: column;
    flex: 1;
}
.nc-blog-card .nc-card-meta {
    color: #D97955;
    text-transform: uppercase;
    letter-spacing: 1.5px;
    font-size: 12px;
    font-weight: 700;
    margin-bottom: 8px;
}
.nc-blog-card h2 {
    font-size: 21px;
    line-height: 1.3;
    margin: 0 0 10px;
}
.nc-blog-card h2 a { color: #262626; }
.nc-blog-card h2 a:hover { color: #D97955; }
.nc-blog-card p {
    color: #555;
    font-size: 15px;
    line-height: 1.55;
    margin: 0 0 18px;
}
.nc-blog-card .nc-card-more {
    margin-top: auto;
    color: #D97955;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1px;
    font-size: 13px;
}
.nc-blog-card .nc-card-more i { margin-left: 6px; }

/* ---- Single article ---- */
.nc-article {
    padding: 0 0 70px;
    background: #fff;
}
.nc-article-banner {
    width: 100%;
    max-height: 460px;
    overflow: hidden;
}
.nc-article-banner img {
    width: 100%;
    height: auto;
    display: block;
    object-fit: cover;
}
.nc-blog-wrap {
    max-width: 760px;
    margin: 0 auto;
    padding: 0 20px;
}
.nc-article-meta {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px 16px;
    padding: 26px 0 6px;
    color: #888;
    font-size: 14px;
    border-bottom: 1px solid #ececec;
    margin-bottom: 30px;
}
.nc-article-meta .nc-tag {
    color: #D97955;
    text-transform: uppercase;
    letter-spacing: 1.5px;
    font-weight: 700;
    font-size: 12px;
}
.nc-article-meta .nc-sep { color: #ccc; }
.nc-article-body {
    color: #333;
    font-size: 17px;
    line-height: 1.7;
}
.nc-article-body p { margin: 0 0 20px; }
.nc-article-body h2 {
    font-size: 25px;
    line-height: 1.3;
    margin: 38px 0 16px;
    color: #262626;
}
.nc-article-body h2::after {
    content: "";
    display: block;
    width: 48px;
    height: 3px;
    background: #D97955;
    margin-top: 10px;
}
.nc-article-body ul,
.nc-article-body ol {
    margin: 0 0 20px;
    padding-left: 22px;
}
.nc-article-body li { margin-bottom: 8px; }
.nc-article-body strong { color: #262626; }
.nc-article-body .nc-lead {
    font-size: 19px;
    color: #555;
    line-height: 1.6;
}
/* In-text links: always the brand accent, underlined, and a DARKER accent on
   hover — never the theme's default white hover, which is invisible on the
   white article background. */
.nc-article-body a {
    color: #D97955;
    text-decoration: underline;
}
.nc-article-body a:hover,
.nc-article-body a:focus {
    color: #b85f3d;
    text-decoration: underline;
}

/* Author signature block */
.nc-signature {
    margin-top: 40px;
    padding-top: 22px;
    border-top: 1px solid #ececec;
    color: #555;
    font-size: 15px;
}
.nc-signature strong { color: #262626; }

/* Prev / next within the series */
.nc-series-nav {
    display: flex;
    justify-content: space-between;
    gap: 16px;
    margin-top: 40px;
}
.nc-series-nav a {
    flex: 1;
    padding: 16px 18px;
    background: #f4f6f8;
    border-radius: 8px;
    color: #262626;
    line-height: 1.4;
    transition: background 0.2s ease, color 0.2s ease;
}
.nc-series-nav a:hover { background: #D97955; color: #fff; }
.nc-series-nav a.nc-next { text-align: right; }
.nc-series-nav a span {
    display: block;
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: 1px;
    color: #999;
    margin-bottom: 4px;
}
.nc-series-nav a:hover span { color: #ffe4d8; }
.nc-series-nav a.nc-disabled {
    visibility: hidden;
}
@media (max-width: 560px) {
    .nc-series-nav { flex-direction: column; }
    .nc-series-nav a.nc-next { text-align: left; }
}

.nc-back-blog {
    display: inline-block;
    margin: 30px 0 0;
    color: #D97955;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1px;
    font-size: 13px;
}
.nc-back-blog i { margin-right: 6px; }

/* Related-articles box shown inside each article. Links the posts together
   without imposing a fixed "part N of M" sequence, so a reader can jump to
   whichever topic they want to explore next. */
.nc-related {
    margin-top: 44px;
    padding: 24px 26px 10px;
    background: #f4f6f8;
    border-radius: 8px;
    border-left: 4px solid #D97955;
}
.nc-related h3 {
    margin: 0 0 16px;
    font-size: 15px;
    text-transform: uppercase;
    letter-spacing: 1.5px;
    color: #262626;
}
.nc-related ul { list-style: none; margin: 0; padding: 0; }
.nc-related li { margin-bottom: 14px; }
.nc-related li a {
    display: block;
    position: relative;
    padding-left: 24px;
    color: #262626;
    font-weight: 600;
    font-size: 16px;
    line-height: 1.4;
    transition: color 0.2s ease;
}
.nc-related li a::before {
    content: "\f105"; /* FontAwesome angle-right */
    font-family: FontAwesome;
    font-weight: normal;
    position: absolute;
    left: 2px;
    top: 1px;
    color: #D97955;
}
.nc-related li a:hover { color: #D97955; }


/* ---------- Bandeau de consentement (Loi 25) ---------- */
.nc-consent {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 9999;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    gap: 20px;
    padding: 18px 24px;
    background: #262626;
    color: #EFE9E3;
    box-shadow: 0 -4px 20px rgba(0, 0, 0, 0.20);
    font-family: 'Source Sans Pro', Arial, sans-serif;
    font-size: 14.5px;
    line-height: 1.55;
}
.nc-consent p {
    margin: 0;
    max-width: 720px;
}
.nc-consent a {
    color: #E9A98D;
    text-decoration: underline;
}
.nc-consent a:hover,
.nc-consent a:focus { color: #fff; }
.nc-consent-actions {
    display: flex;
    gap: 10px;
    flex-shrink: 0;
}
.nc-consent button {
    font-family: 'Montserrat', Arial, sans-serif;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.09em;
    text-transform: uppercase;
    border: 0;
    border-radius: 3px;
    padding: 12px 22px;
    cursor: pointer;
    transition: background 0.2s ease, color 0.2s ease;
}
.nc-consent .nc-accept {
    background: #D97955;
    color: #fff;
}
.nc-consent .nc-accept:hover { background: #C56642; }
.nc-consent .nc-decline {
    background: transparent;
    color: #EFE9E3;
    border: 1px solid #635B54;
}
.nc-consent .nc-decline:hover { border-color: #EFE9E3; }
@media (max-width: 700px) {
    .nc-consent {
        justify-content: flex-start;
        gap: 14px;
        padding: 16px 18px;
        font-size: 14px;
    }
    .nc-consent-actions { width: 100%; }
    .nc-consent button { flex: 1; }
}

/* ---------- Lien legal dans le pied de page ---------- */
.nc-legal {
    margin: 6px 0 0;
    font-size: 13px;
}
.nc-legal a {
    color: #8C8279;
    text-decoration: none;
    border-bottom: 1px solid rgba(140, 130, 121, 0.45);
}
.nc-legal a:hover,
.nc-legal a:focus { color: #D97955; border-bottom-color: #D97955; }

/* Bouton  modifier mon choix  dans la politique de confidentialite */
.nc-consent-reopen {
    font-family: Montserrat, Arial, sans-serif;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.09em;
    text-transform: uppercase;
    color: #fff;
    background: #D97955;
    border: 0;
    border-radius: 3px;
    padding: 12px 22px;
    cursor: pointer;
    transition: background 0.2s ease;
}
.nc-consent-reopen:hover { background: #C56642; }

/* ---------- Page 404 ---------- */
.nc-404 {
    min-height: 62vh;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 70px 20px 90px;
    background: #fff;
}
.nc-404-inner {
    max-width: 620px;
    text-align: center;
}
.nc-404-code {
    font-family: Montserrat, Arial, sans-serif;
    font-size: 96px;
    font-weight: 700;
    line-height: 1;
    color: #F0E2DA;
    letter-spacing: 0.02em;
}
.nc-404 h1 {
    font-family: Montserrat, Arial, sans-serif;
    font-size: 30px;
    font-weight: 700;
    color: #262626;
    margin: 10px 0 0;
}
.nc-404 h1::after {
    content: "";
    display: block;
    width: 46px;
    height: 3px;
    background: #D97955;
    margin: 18px auto 0;
}
.nc-404 p {
    font-family: 'Source Sans Pro', Arial, sans-serif;
    font-size: 17px;
    line-height: 1.7;
    color: #5F5951;
    margin: 22px 0 0;
}
.nc-404-actions {
    margin-top: 34px;
    display: flex;
    gap: 12px;
    justify-content: center;
    flex-wrap: wrap;
}
.nc-404-actions a {
    font-family: Montserrat, Arial, sans-serif;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.09em;
    text-transform: uppercase;
    padding: 13px 24px;
    border-radius: 3px;
    text-decoration: none;
    transition: background 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}
.nc-404-actions .nc-404-primary {
    background: #D97955;
    color: #fff;
}
.nc-404-actions .nc-404-primary:hover { background: #C56642; color: #fff; }
.nc-404-actions .nc-404-secondary {
    color: #6B625B;
    border: 1px solid #DDD4CC;
}
.nc-404-actions .nc-404-secondary:hover { color: #D97955; border-color: #D97955; }
@media (max-width: 600px) {
    .nc-404-code { font-size: 72px; }
    .nc-404 h1 { font-size: 24px; }
    .nc-404-actions a { width: 100%; }
}