/*
Theme Name: Ascobloc Debag France
Theme URI: 
Author: Joris Lamaque – Jorboo
Author URI: 
Description: 
Requires at least: 7.0
Tested up to: 7.0
Requires PHP: 5.7
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: ascobloc-debag-france
Tags: 
*/

:root {
    --card-radius: 4px;
}

html {
    scroll-behavior: smooth;
}

section, .u-section-spacing {
    padding-block: var(--wp--preset--spacing--xl);
    margin-top: 0;
}

.wp-block-jorboo-blocks-jb-site-header {
    max-width:1200px;
    margin:auto;
}

.wp-block-breadcrumbs {
    margin-block-end: 1.25rem!important;
}

.wp-block-paragraph a {
    color: var(--wp--preset--color--accent);
}

.jb-flex-60 {
    flex: 60%;
}

.jb-flex-40 {
    flex: 40%;
}

.jb-partner-logo__svg {
  width: 160px;
  height: auto;
  display: block;
}

.jb-max-width-logo {
    max-width:220px!important;
}

.jb-hotline-contacts > a {
    font-size: 1.4rem;
    font-weight: 700;
}
.jb-has-contact-link > a {
    color: var(--wp--preset--color--text-primary);
    text-decoration: none;
}
.jb-has-contact-link > a:hover {
    color: var(--wp--preset--color--accent);
    text-decoration: underline;
}

.jb-contact-item-icon {
    display: inline-flex;
    align-items: center;
    vertical-align: middle;
    gap: 12px;
    position: relative;
    line-height: 1;
}

.jb-contact-item-icon::before {
    content: "";
    display: inline-block;
    width: 24px;
    height: 24px;
    background-color: currentColor;
    flex-shrink: 0;

    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-position: center;
    mask-position: center;
    -webkit-mask-size: contain;
    mask-size: contain;
}

.jb-contact-item-icon--mail::before {
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3Structure%3E%3Cpath stroke='none' d='M0 0h24v24H0z' fill='none' /%3E%3Cpath d='M3 7a2 2 0 0 1 2 -2h14a2 2 0 0 1 2 2v10a2 2 0 0 1 -2 2h-14a2 2 0 0 1 -2 -2v-10' /%3E%3Cpath d='M3 7l9 6l9 -6' /%3E%3C/svg%3E");
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath stroke='none' d='M0 0h24v24H0z' fill='none' /%3E%3Cpath d='M3 7a2 2 0 0 1 2 -2h14a2 2 0 0 1 2 2v10a2 2 0 0 1 -2 2h-14a2 2 0 0 1 -2 -2v-10' /%3E%3Cpath d='M3 7l9 6l9 -6' /%3E%3C/svg%3E");
}

.jb-contact-item-icon--tel::before {
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath stroke='none' d='M0 0h24v24H0z' fill='none'%3E%3C/path%3E%3Cpath d='M5 4h4l2 5l-2.5 1.5a11 11 0 0 0 5 5l1.5 -2.5l5 2v4a2 2 0 0 1 -2 2a16 16 0 0 1 -15 -15a2 2 0 0 1 2 -2'%3E%3C/path%3E%3C/svg%3E");
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath stroke='none' d='M0 0h24v24H0z' fill='none'%3E%3C/path%3E%3Cpath d='M5 4h4l2 5l-2.5 1.5a11 11 0 0 0 5 5l1.5 -2.5l5 2v4a2 2 0 0 1 -2 2a16 16 0 0 1 -15 -15a2 2 0 0 1 2 -2'%3E%3C/path%3E%3C/svg%3E");
}

.jb-contact-item-icon--building::before {
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath stroke='none' d='M0 0h24v24H0z' fill='none'/%3E%3Cpath d='M3 21l18 0' /%3E%3Cpath d='M9 8l1 0' /%3E%3Cpath d='M9 12l1 0' /%3E%3Cpath d='M9 16l1 0' /%3E%3Cpath d='M14 8l1 0' /%3E%3Cpath d='M14 12l1 0' /%3E%3Cpath d='M14 16l1 0' /%3E%3Cpath d='M5 21v-16a2 2 0 0 1 2 -2h10a2 2 0 0 1 2 2v16' /%3E%3C/svg%3E");
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath stroke='none' d='M0 0h24v24H0z' fill='none'/%3E%3Cpath d='M3 21l18 0' /%3E%3Cpath d='M9 8l1 0' /%3E%3Cpath d='M9 12l1 0' /%3E%3Cpath d='M9 16l1 0' /%3E%3Cpath d='M14 8l1 0' /%3E%3Cpath d='M14 12l1 0' /%3E%3Cpath d='M14 16l1 0' /%3E%3Cpath d='M5 21v-16a2 2 0 0 1 2 -2h10a2 2 0 0 1 2 2v16' /%3E%3C/svg%3E");
}

/* Background Inox */

.jb-bg-inox, .jb-page-header .wp-block-media-text__content {
    --inox-border: #454850;
    --inox-border-top: #6a6e72;
    --inox-text: #f2f2f2;

    position: relative;
    overflow: clip;
    isolation: isolate;
    color: var(--inox-text) !important;
    background-image:
            repeating-linear-gradient(0deg, rgba(255, 255, 255, 0.05) 0px, rgba(255, 255, 255, 0.05) 1px, transparent 1px, transparent 2px),
            linear-gradient(100deg, #1e2022 0%, #292c2e 25%, #2d3035 48%, #2b2e35 58%, #2b2d30 80%, #1a1c1e 100%) !important;
    border-color: var(--inox-border) !important;
    border-top-color: var(--inox-border-top) !important;

    &::before {
        display: none;
    }

    &.jb-bg-inox--card {
        background-image:
                repeating-linear-gradient(0deg, rgba(255, 255, 255, 0.05) 0px, rgba(255, 255, 255, 0.05) 1px, transparent 1px, transparent 2px),
                linear-gradient(100deg, #323337 0%, #323437 25%, #393c43 48%, #393c42 58%, #313336 80%, #282a2c 100%) !important;
    }

    &.jb-bg-inox--footer {
        background-image:
                repeating-linear-gradient(0deg, rgba(255, 255, 255, 0.07) 0px, rgba(255, 255, 255, 0.07) 1px, transparent 1px, transparent 2px),
                linear-gradient(100deg, #202125 0%, #242429 25%, #24242c 48%, #24252b 58%, #313336 80%, #282a2c 100%) !important;
    }

    &.jb-bg-inox--light {
        --inox-border: #e6e7e8;
        --inox-border-top: #ffffff;
        --inox-text: #1b1d1f;
        background-image:
                repeating-linear-gradient(0deg, rgba(0, 0, 0, 0.02) 0px, rgba(0, 0, 0, 0.02) 1px, transparent 1px, transparent 2px),
                linear-gradient(100deg, #f3f4f4 0%, #f9f9f9 25%, #fafafa 48%, #f9f9fa 58%, #f7f7f7 80%, #eeefef 100%) !important;
    }


}
.jb-bg-inox.jb-bg-inox--adf, .jb-page-header.jb-page-header--adf .wp-block-media-text__content {
    --inox-border: #b7b9ba;
    --inox-border-top: #ffffff;
    --inox-text: #2a2b2c;
    background-image:
            repeating-linear-gradient(0deg, rgba(0, 0, 0, 0.05) 0px, rgba(0, 0, 0, 0.05) 1px, transparent 1px, transparent 2px),
            linear-gradient(100deg, #aeb1b3 0%, #d5d7d8 25%, #f4f4f5 48%, #e8e9ea 58%, #c7c9cb 80%, #a9acae 100%) !important;
}

.jb-bg-inox.jb-bg-inox--blue, .jb-page-header.jb-page-header--blue .wp-block-media-text__content {
    --inox-border: #274a73;
    --inox-border-top: #3f6da0;
    --inox-text: #ffffff;
    background-image:
            repeating-linear-gradient(0deg, rgba(255, 255, 255, 0.045) 0px, rgba(255, 255, 255, 0.045) 1px, transparent 1px, transparent 2px),
            linear-gradient(100deg, #163a63 0%, #02274e 25%, #022a53 48%, #0d2749 58%, #16386a 80%, #1a3f6d 100%) !important;
}

.jb-logo-gallery {
    flex-wrap: wrap;
    justify-content:center;
    gap:var(--wp--preset--spacing--sm);

    
    figure {
        width:186px;
        height:78px;
        padding: 4px 8px;
        background-color:white;
        border-radius: var(--card-radius);
        display: flex;
        align-content: center;
        justify-content: center;
        transition: transform 0.2s ease;
        
        &:has(a):hover {
          transform: translateY(-4px);
        }   
        
        img {
    object-fit:contain;
}
    }
}

.jb-bg-inox.jb-bg-inox--red, .jb-page-header.jb-page-header--red .wp-block-media-text__content {
    --inox-border: #8f3630;
    --inox-border-top: #c96a62;
    --inox-text: #ffffff;
    background-image:
            repeating-linear-gradient(0deg, rgba(159, 34, 34, 0.6) 0px, rgba(159, 39, 39, 0.65) 1px, transparent 1px, transparent 2px),
            linear-gradient(100deg, #712020 0%, #832d29 25%, #9f3b36 48%, #9e3b34 58%, #601f1e 80%, #3d1010 100%) !important;
}

.jb-bg-inox.jb-bg-inox--black, .jb-page-header.jb-page-header--black .wp-block-media-text__content {
    --inox-border: #2a2c2e;
    --inox-border-top: #4a4c4e;
    --inox-text: #f2f2f2;
    background-image:
            repeating-linear-gradient(0deg, rgba(255, 255, 255, 0.035) 0px, rgba(255, 255, 255, 0.035) 1px, transparent 1px, transparent 2px),
            linear-gradient(100deg, #0a0b0c 0%, #1c1d1f 25%, #36383a 48%, #2a2c2e 58%, #17181a 80%, #060607 100%) !important;
}

@media (max-width: 782px) {
    .jb-bg-inox {
        background-size: auto, 1400px 100% !important;
        background-position: 0 0, center !important;
        background-repeat: repeat, no-repeat !important;
    }
}

.jb-stack {
    gap: 0!important;
}
.jb-stack > * {
    margin-top: 0 !important;
}
.jb-stack > p + p {
    margin-top: 1rem !important;
}
.jb-stack > :where(h1, h2, h3, h4, h5, h6, .wp-block-image) + p,
.jb-stack > :where(h1, h2, h3, h4, h5, h6, .wp-block-image) + .wp-block-jorboo-blocks-faq {
    margin-top: 1.25rem !important;
}
.jb-stack > .wp-block-image + :where(h1, h2, h3, h4, h5, h6), .jb-stack > .wp-block-site-logo + :where(h1, h2, h3, h4, h5, h6) {
    margin-top: 1rem !important;
}
.jb-stack > :where(h1, h2, h3, h4, h5, h6) + .wp-block-buttons, .jb-stack > p + .wp-block-buttons {
    margin-top: 2.5rem !important;
}
.jb-stack > .jb-space-lg {
    margin-top: 4rem !important;
}

.jb-carousel-full .jb-card-carousel__swiper {
    overflow:visible!important;
}

.wp-block-heading .has-heading-small-font-size {
    display: block;
}

@media (max-width: 767px) {
    .jb-page-header {
        grid-template-columns: 1fr!important;
    }

    .jb-mobile-column {
        display: flex!important;
        flex-direction: column;

        &.jb-mobile-column--center > * {
            align-items: center;
            text-align: center;
        }

        &.jb-mobile-column--reverse {
            flex-direction: column-reverse;
        }
    }
}
@media (max-width: 1023px) {
    .jb-tablette-column {
        flex-direction: column;

        &.jb-tablette-column--center > * {
            align-items: center;
            text-align: center;
        }

        &.jb-tablette-column--reverse {
            flex-direction: column-reverse;
        }
    }
}

/* Hero Media Grid */
.jb-hero-media-text {
    min-height: 350px;
    grid-template-columns: 500px auto!important;
}

.jb-hero-media-text.jb-hero-media-text--primary {
    min-height: 500px;
    grid-template-columns: 45% 55%!important;
}

.jb-hero-media-text.wp-block-media-text .wp-block-media-text__media {
    height: 100%;
    min-height: auto;
    background-color: white;
}

.jb-hero-media-text.wp-block-media-text .wp-block-media-text__content {
    padding-block: 4rem;
    height: 100%;
    box-sizing: border-box;
    align-content: center;
}

@media (max-width: 1023px) {
    .jb-hero-media-text.jb-hero-media-text--neutre figure {
        display: none;
    }

    .jb-hero-media-text:not(.jb-hero-media-text--primary).wp-block-media-text {
        display: flex;
        flex-direction: column-reverse;
        min-height: auto;
    }

    .jb-hero-media-text:not(.jb-hero-media-text--primary).wp-block-media-text .wp-block-media-text__media {
        aspect-ratio: 3/2;
        max-width: 500px;
        width: 100%;
        margin-top: -7rem;
        z-index: 1;
    }

    .jb-hero-media-text:not(.jb-hero-media-text--neutre):not(.jb-hero-media-text--primary).wp-block-media-text .wp-block-media-text__content {
        grid-column: 1;
        grid-row: 1;
        width: 100%;
        padding-inline: clamp(15px, 4vw, 40px);
        padding-block-end: 10rem;
    }

    .jb-hero-media-text.wp-block-media-text:not(.jb-hero-media-text--primary) .wp-block-media-text__content {
        * {
            text-align: center;
            align-items: center;
            justify-content: center;
        }
    }
}

@media (min-width: 501px) and (max-width: 1023px) {
    .jb-hero-media-text.jb-hero-media-text--article figure.wp-block-media-text__media {
        border-radius: var(--card-radius);
        box-shadow: var(--wp--preset--shadow--card);
        overflow: clip;
    }
}

@media (max-width: 899px) {
    .jb-hero-media-text.jb-hero-media-text--primary.wp-block-media-text {
        grid-template-columns: 100%!important;
    }

    .jb-hero-media-text.jb-hero-media-text--primary.wp-block-media-text .wp-block-media-text__media {
        grid-column: 1;
        grid-row: 2;
        min-height: 400px;
    }

    .jb-hero-media-text.jb-hero-media-text--primary.wp-block-media-text .wp-block-media-text__content {
        grid-column: 1;
        grid-row: 1;
        padding-inline: clamp(15px, 4vw, 40px);
    }

    .jb-hero-media-text .wp-block-media-text__content {
        * {
            text-align: center;
            align-items: center;
            justify-content: center;
        }
    }
}


/* Block Numbers */
.wp-block-jorboo-blocks-jb-key-figures {
    background: var(--wp--preset--gradient--inox);
    color: white;

    .jb-key-figures > dd:not(:last-child), .jb-key-figures>dt:not(:last-of-type) {
        border-bottom-color: #45444E;
    }

    dd {
        color: var(--wp--preset--color--text-inverse);
    }
}

/* Jorboo Media Grid */
.jb-media-grid {
    .jb-media-grid__row {
        align-items: stretch;
        max-width: 1100px;
        margin-inline: auto;
        gap: 0;
    }

    .jb-media-grid__row:nth-child(even) {
        flex-direction: row-reverse;
    }

    .jb-media-grid__image,
    .jb-media-grid__content {
        flex: 1 0 50%;
        min-width: 0;
    }

    .jb-media-grid__image {
        position: relative;
        height: auto;
        overflow: clip;
        min-height: 550px;

        img {
            position: absolute;
            inset: 0;
            display: block;
            width: 100%;
            height: 100%;
            object-fit: cover;
            object-position: center !important;
        }

        &.jb-media-grid__image--top img {
            object-position: center top !important;
        }
        &.jb-media-grid__image--bottom img {
            object-position: center bottom !important;
        }
        &.jb-media-grid__image--left img {
            object-position: left center !important;
        }
        &.jb-media-grid__image--right img {
            object-position: right center !important;
        }
        &.jb-media-grid__image--top-left img {
            object-position: left top !important;
        }
        &.jb-media-grid__image--top-right img {
            object-position: right top !important;
        }
        &.jb-media-grid__image--bottom-left img {
            object-position: left bottom !important;
        }
        &.jb-media-grid__image--bottom-right img {
            object-position: right bottom !important;
        }
    }

    .jb-media-grid__content {
        padding: clamp(1rem, 4vw, 2rem);
    }

    @media (max-width: 767px) {
        .jb-media-grid__row {
            flex-direction: column !important;
        }

        .jb-media-grid__image {
            height: clamp(280px, 60vw, 500px);
            max-height: 500px;
        }

        .jb-media-grid__content {
            padding-block: 5rem;
        }
    }
}

/* Cards */
.jb-card--equipment {
    flex-wrap: nowrap;
    max-width: 320px;
    background-color: var(--wp--preset--color--white);
    overflow: clip;
    border-radius: var(--card-radius);
    box-shadow: var(--wp--preset--shadow--card);

    .jb-card__media {
        position: relative;
        height: 280px;
        width: 100%;
        flex-shrink: 0;

        &:after {
            content: "";
            position: absolute;
            inset: 0;
            pointer-events: none;
            background: linear-gradient(to bottom, transparent, rgba(196, 196, 196, 0.1));
        }
    }
    .jb-card__content {
        padding: 0 1rem 1rem 1rem;
    }
}

/* Made in Germany */
.jb-made-in-germany {
    position: relative;
    display: block;
    font-weight: 400;
    font-size: 1.1rem;
    text-transform: uppercase;
    letter-spacing: 0.02em;
    border-bottom: 6px solid #000000;
    width: fit-content;
    margin-bottom: 0.75rem!important;
}

.jb-made-in-germany::before,
.jb-made-in-germany::after {
    content: "";
    position: absolute;
    bottom: -6px;
    height: 6px;
}

.jb-made-in-germany::before {
    left: 33.333%;
    width: 33.333%;
    background: #DD0000; /* rouge */
}

.jb-made-in-germany::after {
    left: 66.666%;
    width: 33.334%;
    background: #FFCE00; /* or/jaune */
}

/* Banner Video */
.jb-banner-video {
    position:relative;
    .wp-block-cover__inner-container, .wp-block-cover__inner-container > .wp-block-group {
        height: 100%;
        flex: 1;
        display: flex;
        flex-direction: column;
    }
    .jb-banner-video__wikotool {
        position:absolute;
        top: clamp(8px, 2vw, 24px);
        left: clamp(12px, 3vw, 48px);
        width: clamp(80px, 10vw, 128px);
        aspect-ratio: 1 / 1;
    }
    .jb-banner-video__content {
        justify-content: space-between;
        height: 100%;
        padding-block: 2rem;
    }
    h1, p {
        text-shadow: 0 2px 4px rgba(0, 0, 0, 0.5), 0 4px 8px rgba(0, 0, 0, 0.35);
    }
}

/* Brand Card*/
.jb-brand-card {
    background-color: var(--wp--preset--color--white);
    overflow: clip;
    border-radius: var(--card-radius);
    padding: 1rem;
    box-shadow: var(--wp--preset--shadow--card);

    .jb-brand-card__logo {
        width: 175px;
        height: 48px;

        img {
            object-fit: contain;
        }
    }
    .jb-brand-card__content {
        flex: 1;
    }
    .jb-brand-card__description {
        font-weight: 500;
    }

    @media (max-width: 767px) {
        padding: 1.5rem 1rem;
    }
}

/* Section FAQ */
.jb-section-faq{
    .jb-section-faq__media {
        height: 400px;
        margin-inline: auto;
        overflow: clip;

        img {
            max-height: 400px;
            object-position: center;
        }
    }
}

.blog .wp-block-post-template {
    row-gap: 2.5rem;
}
.blog .wp-block-post:first-of-type {
    grid-column: 1/-1;
}
.wp-block-post {
    height: 100%;
    container-type: inline-size;
    container-name: jb-card;
}

*:has(>.jb-card-stretched-link) {
    position: relative;
}

.jb-card-stretched-link {
    position: absolute;
    inset: 0;
    z-index: 2;
    cursor: pointer;
}

.jb-card {
    display: flex;
    flex-direction: column;
    height: 100%;

    .jb-card__image {
        width: 100%;
        img {
            aspect-ratio: 3 / 2;
            object-fit: cover;
        }
    }

    .jb-card__content {
        width: 100%;
        display: flex;
        flex-direction: column;
        flex: 1;
        margin-block: 1rem;

        > * {
            width: 100%;
        }
    }

    .jb-card__date {
        color: var(--wp--preset--color--text-secondary);
        font-size: 0.9rem;
    }

    .jb-card__text, .jb-card__excerpt {
        flex: 1;
        display: flex;
        flex-direction: column;
        margin-top: 0.5rem;
        color: var(--wp--preset--color--text-secondary);
    }

    .wp-block-post-excerpt__excerpt {
        width: 100%;
        margin: 0;
        line-height: 1.5;
        display: -webkit-box;
        -webkit-line-clamp: 3;
        line-clamp: 3;
        -webkit-box-orient: vertical;
        overflow: hidden;
        font-size: 0.95rem;
    }

    .wp-block-post-excerpt__more-text {
        margin-top: auto;
    }

    .jb-card__excerpt .wp-block-post-excerpt__more-link {
        display: flex;
        align-items: center;
        gap: 0.5rem;
        padding-top: 0.75rem;
        margin-top: 1.5rem;
        border-top: 2px solid var(--wp--preset--color--border, #D9D9D9);
        color: var(--wp--preset--color--accent);
        text-decoration: none;
        font-weight: 500;
        text-transform: uppercase;

        &::after {
            content: "";
            width: 1.1em;
            height: 1.1em;
            flex-shrink: 0;
            background-color: currentColor;
            mask-image: url("data:image/svg+xml,%3Csvg%20viewBox='0%200%2024%2024'%20fill='none'%20xmlns='http://www.w3.org/2000/svg'%3E%3Cpath%20d='M5%2012H19M19%2012L12%205M19%2012L12%2019'%20stroke='black'%20stroke-width='2'%20stroke-linecap='round'%20stroke-linejoin='round'/%3E%3C/svg%3E");
            mask-repeat: no-repeat;
            mask-size: contain;
            -webkit-mask-image: url("data:image/svg+xml,%3Csvg%20viewBox='0%200%2024%2024'%20fill='none'%20xmlns='http://www.w3.org/2000/svg'%3E%3Cpath%20d='M5%2012H19M19%2012L12%205M19%2012L12%2019'%20stroke='black'%20stroke-width='2'%20stroke-linecap='round'%20stroke-linejoin='round'/%3E%3C/svg%3E");
            -webkit-mask-repeat: no-repeat;
            -webkit-mask-size: contain;
            transition: transform 0.2s ease;
        }

        &:hover::after {
            transform: translateX(4px);
        }
    }

    .jb-card__title {
        margin-top: 0;
    }
    .jb-card__title a {
        margin-top: 0.75rem;
        font-size: 1.2rem;
        font-weight: 700;
        line-height: 1.4;
        color: var(--wp--preset--color--text-primary);
        display: -webkit-box;
        -webkit-line-clamp: 3;
        line-clamp: 3;
        -webkit-box-orient: vertical;
        overflow: hidden;
        text-transform: none;
        font-style: normal;
    }

    @container jb-card (min-width: 624px) {
        .jb-card__title,
        .jb-card__title a {
            font-size: 1.5rem;
        }

        .jb-card__date {
            font-size: 0.95rem;
        }

        .wp-block-post-excerpt__excerpt {
            font-size: 1rem;
        }
    }

    @container jb-card (min-width: 860px) {
        flex-direction: row;
        gap: 2rem;
        align-items: stretch;
        padding-bottom: 2rem;

        .jb-card__image {
            width: 50%;
            flex-shrink: 0;

            img {
                height: 100%;
            }
        }
        
        .

        .jb-card__content {
            width: auto;
            flex: 1;
            padding-left: 2rem;
            justify-content: center;

            .wp-block-post-excerpt__more-text {
                margin-top: 0;
            }
        }
    }
}


/* Accordéon (core) — équivalent jb-faq */
.wp-block-accordion-item {
    position: relative;
    width: 100%;
    padding-block: 1rem;
}
.wp-block-accordion-item:first-of-type {
    padding-top: 0;
}
.wp-block-accordion-item:not(:last-of-type)::after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    width: 120px;
    max-width: 100%;
    height: 1px;
    background-color: #E5E5E5;
}

/* --- Question --- */
.wp-block-accordion-heading {
    margin: 0;
}
.wp-block-accordion-heading__toggle {
    font-size: 1.125rem;
    font-weight: 700;
    transition: margin-bottom 0.2s ease-out;
    padding: 0;
}
.wp-block-accordion-heading__toggle:not(:focus-visible) {
    outline: none;
}
.wp-block-accordion-heading__toggle:focus-visible {
    outline-offset: 4px;
    border-radius: var(--card-radius);
}
.wp-block-accordion-item.is-open .wp-block-accordion-heading__toggle {
    margin-bottom: 0.75rem;
}

/* Icône (cercle + chevron) */
.wp-block-accordion-heading__toggle-icon {
    position: relative;
    width: 2rem;
    height: 2rem;
    flex: none;
    font-size: 0;
    line-height: 0;
}
.wp-block-accordion-heading__toggle-icon::after {
    content: "";
    position: absolute;
    inset: 0;
    background-color: currentColor;
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none'%3E%3Cpath d='M6 9L12 15L18 9' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none'%3E%3Cpath d='M6 9L12 15L18 9' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-position: center;
    mask-position: center;
    -webkit-mask-size: 28px;
    mask-size: 28px;
    transition: transform 0.3s ease;
}
.wp-block-accordion-item.is-open > .wp-block-accordion-heading .wp-block-accordion-heading__toggle-icon {
    transform: none !important;
}
.wp-block-accordion-item.is-open .wp-block-accordion-heading__toggle-icon::after {
    transform: rotate(180deg);
}

.wp-block-accordion-panel {
    display: grid !important;
    grid-template-columns: 1fr;
    grid-template-rows: 0fr;
    overflow: hidden;
    transition: grid-template-rows 0.2s ease-out;
    color: var(--wp--preset--color--text-secondary);
}
.wp-block-accordion-panel > * {
    min-height: 0;
    overflow: hidden;
}
.wp-block-accordion-item.is-open .wp-block-accordion-panel {
    grid-template-rows: 1fr;
}

@media (prefers-reduced-motion: reduce) {
    .wp-block-accordion-panel,
    .wp-block-accordion-heading__toggle-icon::after {
        transition: none;
    }
}


/*Footer*/
.jb-site-footer {
    --footer-text-muted: var(--wp--preset--color--text-inverse);
    --footer-border: rgba(255, 255, 255, 0.12);

    .is-layout-constrained {
        max-width: 1200px;
        width: 100%;
        margin-inline: auto;
    }

    .alignwide.is-horizontal {
        justify-content: space-between;
        align-items: flex-start;
        gap: 48px;
        padding-block: 8px;

        > .is-vertical:first-child {
            gap: 14px;
            max-width: 340px;

            .wp-block-image img {
                display: block;
                height: auto;
            }

            > p.wp-block-paragraph {
                margin: 0;
                font-size: 14px;
                line-height: 1.6;
                color: var(--footer-text-muted);
            }
        }

        > .is-vertical:last-child {
            gap: 32px;
            flex: 1 1 auto;
            max-width: 720px;
        }

        @media (max-width: 800px) {
            flex-wrap: wrap;
            gap: 32px;

            > .is-vertical:first-child,
            > .is-vertical:last-child {
                max-width: none;
                width: 100%;
            }
        }
    }

    .jb-site-footer__logo {
        width: 240px;
    }

    .jb-site-footer__contact-details, .jb-site-footer__column ul.wp-block-list {
        list-style: none;
        margin: 0;
        padding: 0;
        display: flex;
        flex-direction: column;
        gap: 10px;

        li {
            font-size: 14px;
            color: var(--footer-text-muted);

            a {
                color: inherit;
                text-decoration: none;
                &:hover,
                a:hover {
                    color: white;
                }
            }
        }
    }

    .is-content-justification-right {
        justify-content: space-between;
        flex-wrap: wrap;
        gap: 32px;
        width: 100%;
    }

    .jb-site-footer__column {
        min-width: 130px;
        gap: 14px;

        p.wp-block-paragraph {
            margin: 0;
            font-size: 1.125rem;
            font-weight: 600;
            text-transform: uppercase;
            letter-spacing: 0.08em;
            color: #ffffff;
        }
    }

    .jb-site-footer__services {
        margin-top: 4px;
        margin-inline: 0;
        text-align: left;

        .wp-block-heading {
            margin: 0 0 6px;
            margin-inline: 0;
            font-size: 1.5rem;
            font-weight: 600;
            color: #ffffff;
            text-align: left;
        }

        p.wp-block-paragraph {
            margin: 0;
            margin-inline: 0!important;
            font-size: 14px;
            line-height: 1.6;
            color: var(--footer-text-muted);
            max-width: 420px;
            text-align: left;
        }
    }

    .jb-site-footer__legals {
        margin-top: 32px;
        padding-top: 20px;
        border-top: 1px solid var(--footer-border);
        justify-content: space-between;
        align-items: center;
        flex-wrap: wrap;
        gap: 12px;

        p.wp-block-paragraph {
            margin: 0;
            font-size: 13px;
            color: var(--footer-text-muted);
        }

        ul.wp-block-list {
            list-style: none;
            margin: 0;
            padding: 0;
            display: flex;
            flex-wrap: wrap;
            gap: 20px;

            li {
                font-size: 13px;
                color: var(--footer-text-muted);

                a {
                    color: inherit;
                    text-decoration: none;

                    &:hover {
                        color: white;
                    }
                }
            }
        }

        @media (max-width: 800px) {
            flex-direction: column;
            align-items: flex-start;
        }
    }
}

.wp-block-button.is-style-outline .wp-block-button__link,
.wp-block-button.is-style-jb-white .wp-block-button__link,
.wp-block-button.is-style-jb-underline .wp-block-button__link,
.wp-block-button.is-style-jb-plain .wp-block-button__link {
    background-image: none;
    font-weight: 500;
}

.wp-block-button.is-style-jb-underline .wp-block-button__link, .wp-block-button.is-style-jb-plain .wp-block-button__link  {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
}

.wp-block-button.is-style-jb-underline .wp-block-button__link::after, .wp-block-button.is-style-jb-plain .wp-block-button__link::after  {
    content: "";
    width: 1.1em;
    height: 1.1em;
    flex-shrink: 0;
    background-color: currentColor;
    mask-image: url("data:image/svg+xml,%3Csvg%20width='24'%20height='24'%20viewBox='0%200%2024%2024'%20fill='none'%20xmlns='http://www.w3.org/2000/svg'%3E%3Cpath%20d='M5%2012H19M19%2012L12%205M19%2012L12%2019'%20stroke='black'%20stroke-width='2'%20stroke-linecap='round'%20stroke-linejoin='round'/%3E%3C/svg%3E");
    mask-repeat: no-repeat;
    mask-size: contain;
    mask-position: center;
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg%20width='24'%20height='24'%20viewBox='0%200%2024%2024'%20fill='none'%20xmlns='http://www.w3.org/2000/svg'%3E%3Cpath%20d='M5%2012H19M19%2012L12%205M19%2012L12%2019'%20stroke='black'%20stroke-width='2'%20stroke-linecap='round'%20stroke-linejoin='round'/%3E%3C/svg%3E");
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-size: contain;
    -webkit-mask-position: center;
    transition: transform 0.2s ease;
}

.wp-block-button.is-style-jb-underline .wp-block-button__link:hover::after, .wp-block-button.is-style-jb-plain .wp-block-button__link:hover::after  {
    transform: translateX(4px);
}

/* Header Menu */
.wp-block-jorboo-blocks-jb-site-header {
    --jb-header-accent: #a5312f;
    --jb-header-mobile-menu-padding: 72px 24px 24px 24px;
    z-index: 500;
    padding-block: 8px;
}

.jb-site-header__bar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 32px;
}

.jb-site-header__menu .wp-block-navigation__container {
    display: flex;
    align-items: center;
    gap: 28px;
    list-style: none;
    margin: 0;
    padding: 0;
}

.jb-site-header__menu .wp-block-navigation-item__content {
    position: relative;
    font-size: 14px;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--wp--preset--color--text-primary);
    text-decoration: none;
    padding: 6px 0;
}

.jb-site-header__menu .wp-block-navigation-item__content::after {
    content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 3px;
    background: var(--jb-header-accent);
    transform: scaleX(0);
    transform-origin: left;
    transition: transform 0.25s ease;
}

.jb-site-header__menu .wp-block-navigation-item__content:hover::after,
.jb-site-header__menu .current-menu-item .wp-block-navigation-item__content::after {
    transform: scaleX(1);
}

.jb-site-header__menu .wp-block-buttons {
    margin: 0;
}

.jb-site-header__menu .current-menu-item .wp-block-navigation-item__content {
    color: var(--jb-header-accent);
}

.jb-site-header__hamburger {
    display: none;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 5px;
    width: 40px;
    height: 40px;
    background: none;
    border: none;
    cursor: pointer;
}

.jb-site-header__hamburger-bar {
    display: block;
    width: 22px;
    height: 2px;
    background: #2a2b2c;
    transition: background 0.2s ease, transform 0.3s ease, opacity 0.3s ease;
}

.jb-site-header__hamburger:hover .jb-site-header__hamburger-bar {
    background: var(--jb-header-accent);
}

.jb-site-header__hamburger[aria-expanded="true"] .jb-site-header__hamburger-bar:nth-child(1) {
    transform: translateY(7px) rotate(45deg);
}

.jb-site-header__hamburger[aria-expanded="true"] .jb-site-header__hamburger-bar:nth-child(2) {
    opacity: 0;
}

.jb-site-header__hamburger[aria-expanded="true"] .jb-site-header__hamburger-bar:nth-child(3) {
    transform: translateY(-7px) rotate(-45deg);
}

.jb-site-header__close {
    align-self: flex-end;
    position: relative;
    width: 32px;
    height: 32px;
    background: none;
    border: none;
    cursor: pointer;
    margin-bottom: 16px;
}

.jb-site-header__close::before,
.jb-site-header__close::after {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    width: 20px;
    height: 2px;
    background: #2a2b2c;
}

.jb-site-header__close::before {
    transform: translate(-50%, -50%) rotate(45deg);
}

.jb-site-header__close::after {
    transform: translate(-50%, -50%) rotate(-45deg);
}

.jb-site-header__visually-hidden {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
}

.jb-site-header__backdrop {
    position: fixed;
    inset: 0;
    z-index: 900;
    background: rgba(10, 11, 12, 0.55);
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.3s ease, visibility 0s linear 0.3s;
}

.jb-site-header--menu-open .jb-site-header__backdrop {
    opacity: 1;
    visibility: visible;
    transition: opacity 0.3s ease;
}

@media (max-width: 1119px) {
    .jb-contact-page-row {
        flex-direction: column-reverse;
        align-items: center;
    }

    .jb-site-header__menu .wp-block-navigation-item__content:hover {
        color: var(--jb-header-accent);
    }

    .jb-site-header__hamburger {
        display: inline-flex;
    }

    .jb-site-header__menu {
        background: #ffffff;
        box-shadow: -8px 0 24px rgba(0, 0, 0, 0.12);
    }

    .jb-site-header__menu .wp-block-navigation__container {
        flex-direction: column;
        align-items: stretch;
        gap: 0;
        width: 100%;
        margin-top: 8px;
    }

    .jb-site-header__menu .wp-block-navigation-item__content {
        display: block;
        font-size: 16px;
        padding: 16px 0;
        border-bottom: 1px solid rgba(0, 0, 0, 0.08);
    }

    .jb-site-header__menu .wp-block-buttons {
        width: 100%;
        margin-top: 24px;
    }

    .jb-site-header__menu .wp-block-button {
        width: 100%;
    }

    .jb-site-header__menu .wp-block-button__link {
        display: block;
        text-align: center;
    }
}

/* Summary */
.jb-summary {
    padding-top: var(--wp--preset--spacing--sm);
    padding-right: var(--wp--preset--spacing--xs);
    padding-bottom: var(--wp--preset--spacing--sm);
    padding-left: var(--wp--preset--spacing--xs);
}

.jb-summary__title {
    margin-top: 0;
    text-transform: uppercase;
}

.jb-summary__list {
    list-style: none;
    margin: 0;
    padding: 0;
}
.jb-summary__item:last-child {
    border-bottom: none;
}

.jb-summary__link {
    display: block;
    padding: 0.25rem 0;
    font-size: 15px;
    color: #2a2b2c;
    text-decoration: none;
    transition: color 0.2s ease;
}

.jb-summary__item--h3 .jb-summary__link {
    font-size: 14px;
    color: #5c5f61;
}

.jb-summary__link:hover {
    color: #a5312f;
}

.jb-summary__more {
    margin-top: 4px;
}

.jb-summary__toggle {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    margin-top: 14px;
    font-size: 13px;
    font-weight: 500;
    cursor: pointer;
    list-style: none;
}

.jb-summary__toggle::-webkit-details-marker {
    display: none;
}

.jb-summary__toggle::after {
    content: "";
    width: 7px;
    height: 7px;
    border-right: 2px solid currentColor;
    border-bottom: 2px solid currentColor;
    transform: rotate(45deg);
    transition: transform 0.25s ease;
}

.jb-summary__more[open] .jb-summary__toggle::after {
    transform: rotate(225deg);
}

.jb-summary__toggle-label--less {
    display: none;
}

.jb-summary__more[open] .jb-summary__toggle-label--more {
    display: none;
}

.jb-summary__more[open] .jb-summary__toggle-label--less {
    display: inline;
}

.jb-article__content {
    flex: 0 1 760px;
}

.jb-article__aside {
    flex: 0 0 360px;
}

/* Article */
@media (max-width: 1023px) {
    .jb-article__row {
        flex-direction: column;
        align-items: center;
    }

    .jb-article__aside {
        display: contents;
    }

    .jb-summary {
        order: -1;
        box-sizing: border-box;
        width: 100%;
    }

    .jb-article__cta {
        order: 10;
    }
}

/* Contact item */
.jb-contact-item {
    background-color: var(--wp--preset--color--white);
    border-radius: var(--card-radius);
    padding: 1rem 0.75rem;
    box-shadow: var(--wp--preset--shadow--card);
    gap: 0.75rem;

    .jb-contact-item__content {
        gap: 0.25rem;
    }

    .jb-contact-item__label {
        font-size: 1.125rem;
        font-weight: 700;
    }
}


/* Contact Form 7*/
.wpcf7-form:not(dialog *) {
    background-color: var(--wp--preset--color--white);
    border-radius: var(--card-radius);
    padding: 2rem 1.75rem;
    box-shadow: var(--wp--preset--shadow--card);
}

.contact-form__row {
    display: grid;
    grid-template-columns: 100px 1fr 1fr;
    gap: 16px;
}

.contact-form__field { margin-bottom: 20px; }
.wpcf7-form p { margin: 0; }

.contact-form__label {
    display: block;
    font-weight: 600;
    font-size: 0.9rem;
    margin-bottom: 6px;
    color: #1a1a1a;
}

.contact-form__input {
    width: 100%;
    padding: 12px 14px;
    border: 1px solid #d0d0d0;
    border-radius: var(--card-radius);
    font-size: 1rem;
    font-family: inherit;
    background: #fff;
    box-sizing: border-box;
    transition: border-color .2s ease, box-shadow .2s ease;
}

.contact-form__input:focus {
    outline: none;
    border-color: #8b1e2f;
    box-shadow: 0 0 0 3px rgba(139, 30, 47, .12);
}

.contact-form__input.wpcf7-not-valid { border-color: #c0392b; }

.wpcf7-not-valid-tip {
    display: block;
    color: #c0392b;
    font-size: .85rem;
    margin-top: 6px;
}

select.contact-form__input {
    appearance: none;
    background-image: url("data:image/svg+xml;charset=UTF-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='16' height='16'%3E%3Cpath fill='%23555' d='M7 10l5 5 5-5z'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 12px center;
    padding-right: 36px;
}

textarea.contact-form__input { min-height: 140px; resize: vertical; }

.contact-form__field--acceptance { font-size: .9rem; color: #444; }
.contact-form__field--acceptance .wpcf7-list-item {
    display: flex;
    align-items: flex-start;
    gap: 10px;
}
.contact-form__field--acceptance input[type="checkbox"] {
    margin-top: 4px;
    width: 14px;
    height: 14px;
    accent-color: #8b1e2f;
    flex-shrink: 0;
}
.contact-form__field--acceptance a { color: #8b1e2f; text-decoration: underline; }

.contact-form__submit-row {
    display: flex;
    align-items: center;
    margin-top: 8px;
}

.wpcf7 form .wpcf7-response-output {
    margin-top: 16px;
    padding: 12px 16px;
    border-radius: var(--card-radius);
    font-size: 0.9rem;
    border: 1px solid transparent;
}

.wpcf7-form.invalid .wpcf7-response-output {
    background-color: #fdecea;
    border-color: #c0392b!important;
    color: #c0392b;
}

.wpcf7-form.sent .wpcf7-response-output {
    background-color: #eafaf1;
    border-color: #27ae60!important;
    color: #1e8449;
}

.wpcf7-form.spam .wpcf7-response-output,
.wpcf7-form.aborted .wpcf7-response-output {
    background-color: #fdecea;
    border-color: #c0392b!important;
    color: #c0392b;
}

.wpcf7-acceptance .wpcf7-list-item-label {
    font-size: 0.95rem;
}

@media (max-width: 640px) {
    .contact-form__row { grid-template-columns: 1fr; gap:0; }
}

/* Gallery */
.jb-gallery {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    grid-template-rows: repeat(2, 220px);
    grid-auto-flow: dense;
    gap: 16px;
}

.jb-gallery > figure {
    margin: 0;
    overflow: hidden;
}

.jb-gallery > figure img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.jb-gallery > figure:nth-child(1) {
    grid-column: span 2;
    grid-row: span 2;
}

@media (max-width: 1023px) {
    .jb-gallery {
        grid-template-columns: 1fr 1fr;
        grid-template-rows: repeat(4, 200px);
    }
}

@media (max-width: 767px) {
    .jb-gallery {
        grid-template-columns: 1fr;
        grid-template-rows: none;
    }

    .jb-gallery > figure {
        aspect-ratio: 4 / 3;
    }

    .jb-gallery > figure:nth-child(1) {
        grid-column: span 1;
        grid-row: span 1;
    }
}

.jb-cta-footer__row {
    .jb-cta-footer__heading {
        max-width: 720px;
    }
}
@media (max-width: 1023px) {
    .jb-cta-footer__row {
        flex-direction: column;
        .jb-cta-footer__heading {
            text-align: center;
        }
    }
}

@media (min-width: 680px) and (max-width:1023px) {
    .wp-singular .wp-block-query li:nth-child(+3){
        display: none;
    }
}

/* 404 */
.jb-404-number {
    font-size: clamp(4rem, 12vw, 9rem);
    font-weight: 800;
    font-style: italic;
    line-height: 1;
    color: var(--wp--preset--color--accent);
    margin: 0;
}

/* Breadcrumbs */
.jb-breadcrumbs {
    background-color: var(--wp--preset--color--light-grey, #f6f6f6);
    border-bottom: 1px solid var(--wp--preset--color--grey-light, #e5e5e5);
    padding-block: 0.75rem;
}

.jb-breadcrumbs:not(:has(nav)) {
    display: none;
}

.jb-breadcrumbs .wp-block-breadcrumbs {
    margin-block: 0!important;
    font-size: 0.875rem;

    ol {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        list-style: none;
        margin: 0;
        padding: 0;
        gap: 0.5em;
        color: var(--wp--preset--color--grey, #6b7280);
    }

    li {
        display: flex;
        align-items: center;
        gap: 0.5em;

        &:not(:last-child)::after {
            content: var(--separator, "/");
            color: var(--wp--preset--color--grey-light, #c4c4c4);
            font-weight: 400;
        }
    }

    a {
        color: inherit;
        text-decoration: none;
        transition: color 0.2s ease;

        &:hover,
        &:focus-visible {
            color: var(--wp--preset--color--primary, #7a1e22);
            text-decoration: underline;
        }
    }

    [aria-current="page"] {
        color: var(--wp--preset--color--contrast, #1a1a1a);
        font-weight: 600;
        /* évite qu'un titre d'article long ne casse la mise en page sur mobile */
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
        max-width: 60vw;
    }
}