/* Implant & Technology — Mega-menu Produits v38
   Comportement type CONMED : rien au survol, ouverture au clic, panneau pleine largeur
   inséré dans le flux de la page sous le header. Il pousse le contenu au lieu de rester
   figé au premier plan. */

li.itcat-mega-parent {
    position: static !important;
}

li.itcat-mega-parent > a {
    cursor: pointer;
}

.itcat-megamenu {
    display: block;
    position: relative;
    z-index: 20;
    width: 100%;
    max-height: 0;
    opacity: 0;
    overflow: hidden;
    transform: translateY(-10px);
    pointer-events: none;
    padding: 0;
    border: 0;
    border-top: 1px solid transparent;
    border-bottom: 1px solid transparent;
    border-radius: 0;
    background: rgba(255, 255, 255, 0.99);
    box-shadow: 0 18px 45px rgba(4, 20, 40, 0);
    transition:
        max-height var(--itcat-megamenu-transition-speed, 420ms) cubic-bezier(0.22, 1, 0.36, 1),
        opacity var(--itcat-megamenu-transition-speed-fast, 260ms) ease,
        transform var(--itcat-megamenu-transition-speed, 420ms) cubic-bezier(0.22, 1, 0.36, 1),
        border-color var(--itcat-megamenu-transition-speed-fast, 260ms) ease,
        box-shadow var(--itcat-megamenu-transition-speed-fast, 260ms) ease;
    will-change: max-height, opacity, transform;
}

/* Pas d'ouverture au survol : seule la classe JS affiche le panneau. */
.itcat-megamenu.itcat-megamenu-open {
    max-height: var(--itcat-megamenu-open-height, 950px);
    opacity: 1;
    transform: translateY(0);
    pointer-events: auto;
    border-top-color: rgba(210, 224, 238, 0.9);
    border-bottom-color: rgba(210, 224, 238, 0.9);
    box-shadow: 0 18px 45px rgba(4, 20, 40, 0.10);
}

@media (prefers-reduced-motion: reduce) {
    .itcat-megamenu {
        transition: none;
        transform: none;
    }
}

.itcat-megamenu,
.itcat-megamenu * {
    box-sizing: border-box;
}

.itcat-megamenu-inner {
    width: min(1180px, calc(100vw - 44px));
    margin: 0 auto;
    padding: 42px 0 44px;
    display: grid;
    grid-template-columns: 230px minmax(0, 1fr);
    gap: 42px;
    align-items: start;
}

.itcat-megamenu-intro {
    min-height: 255px;
    padding: 0 28px 0 0;
    border-right: 2px solid #23b7d9;
}

.itcat-megamenu-kicker {
    margin: 0 0 12px;
    font-size: 11px;
    line-height: 1.2;
    font-weight: 850;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    color: #0c8eb7;
}

.itcat-megamenu-title {
    margin: 0 0 24px;
    font-size: 30px;
    line-height: 1.05;
    font-weight: 500;
    letter-spacing: -0.04em;
    color: #071b33;
}

.itcat-megamenu-copy {
    margin: 0;
    max-width: 180px;
    font-size: 13px;
    line-height: 1.55;
    color: #667085;
}

.itcat-megamenu-grid {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 30px 54px;
    align-items: start;
}

.itcat-megamenu-category {
    min-width: 0;
    padding: 0;
    border: 0;
}

.itcat-megamenu-category-title {
    display: block;
    margin: 0 0 12px;
    font-size: var(--itcat-megamenu-title-size, 14px);
    line-height: 1.25;
    font-weight: var(--itcat-megamenu-title-weight, 850);
    font-family: var(--itcat-category-font, inherit);
    letter-spacing: 0.01em;
    color: var(--itcat-megamenu-title-color, #071b33);
    border-left: 3px solid var(--itcat-accent-color, #0a4d8f);
    padding-left: 10px;
}

.itcat-megamenu-subgroups {
    margin: 4px 0 0 8px;
    padding-left: 12px;
    border-left: 2px solid var(--itcat-accent-color, #0a4d8f);
    opacity: 0.9;
}

.itcat-megamenu-subcategory-title {
    display: inline-block;
    margin: 10px 0 6px;
    font-size: var(--itcat-subcategory-size, 11px);
    line-height: 1.25;
    font-weight: 500;
    font-family: var(--itcat-category-font, inherit);
    letter-spacing: 0.03em;
    text-transform: uppercase;
    color: var(--itcat-subcategory-color, #0a4d8f);
    background: var(--itcat-subcategory-bg, #e6f1fb);
    border-radius: 999px;
    padding: 3px 10px;
}

.itcat-megamenu-subgroups p.itcat-megamenu-subcategory-title:first-of-type {
    margin-top: 0;
}

.main-nav .itcat-megamenu-category ul,
.itcat-megamenu-category ul {
    display: block !important;
    list-style: none !important;
    margin: 0 !important;
    padding: 0 !important;
}

.itcat-megamenu-category li {
    display: block !important;
    margin: 0 !important;
    padding: 0 !important;
}

.itcat-megamenu-category li + li {
    margin-top: 8px !important;
}

.main-nav .itcat-megamenu-category a,
.itcat-megamenu-category a {
    display: inline-block !important;
    position: static !important;
    min-height: 0 !important;
    padding: 2px 0 !important;
    border-radius: 0 !important;
    font-size: 13px !important;
    line-height: 1.38 !important;
    font-weight: 500 !important;
    color: #344054 !important;
    text-decoration: none !important;
    white-space: normal !important;
    overflow-wrap: anywhere !important;
    word-break: normal !important;
}

.main-nav .itcat-megamenu-category a::before,
.main-nav .itcat-megamenu-category a::after,
.itcat-megamenu-category a::before,
.itcat-megamenu-category a::after {
    display: none !important;
    content: none !important;
}

.main-nav .itcat-megamenu-category a:hover,
.main-nav .itcat-megamenu-category a:focus-visible,
.itcat-megamenu-category a:hover,
.itcat-megamenu-category a:focus-visible {
    color: #0a76a8 !important;
    text-decoration: underline !important;
    text-underline-offset: 4px;
}

.itcat-megamenu-more {
    font-weight: 800 !important;
    color: #0a4d8f !important;
}

@media (max-width: 1100px) {
    .itcat-megamenu-inner {
        grid-template-columns: 190px minmax(0, 1fr);
        gap: 30px;
    }

    .itcat-megamenu-grid {
        gap: 26px 34px;
    }
}

@media (max-width: 960px) {
    .itcat-megamenu {
        display: none !important;
    }
}

/* v37 — menu Produits équilibré : colonnes type masonry contrôlé.
   Les catégories restent intactes, mais elles sont réparties dans la colonne la plus courte
   pour réduire les grands espaces blancs entre familles de taille différente. */
.itcat-megamenu-balanced {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 28px 48px;
    align-items: start;
}

.itcat-megamenu-column {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 28px;
}

.itcat-megamenu-column .itcat-megamenu-category {
    margin: 0;
}

.itcat-megamenu-column .itcat-megamenu-category-title {
    margin-bottom: 10px;
}

.itcat-megamenu-column .itcat-megamenu-category li + li {
    margin-top: 7px !important;
}

@media (max-width: 1180px) {
    .itcat-megamenu-balanced {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 26px 38px;
    }
}

@media (max-width: 960px) {
    .itcat-megamenu-balanced {
        display: block !important;
    }
}


/* v38 — habillage premium : fond médical léger + cartes sobres.
   Objectif : conserver le système de colonnes équilibrées v37, mais réduire l'effet de vide
   grâce à une lecture par blocs, sans tomber dans un affichage trop chargé. */
.itcat-megamenu {
    background:
        radial-gradient(circle at 8% 0%, rgba(35, 183, 217, 0.12), transparent 34%),
        radial-gradient(circle at 92% 18%, rgba(10, 76, 143, 0.10), transparent 34%),
        linear-gradient(180deg, #f7fbff 0%, #eef7fd 100%);
}

.itcat-megamenu.itcat-megamenu-open {
    border-top-color: rgba(184, 216, 232, 0.95);
    border-bottom-color: rgba(184, 216, 232, 0.95);
    box-shadow: inset 0 1px 0 rgba(255,255,255,0.86), 0 18px 45px rgba(4, 20, 40, 0.08);
}

.itcat-megamenu-inner {
    width: min(1240px, calc(100vw - 52px));
    padding: 38px 0 40px;
    grid-template-columns: 235px minmax(0, 1fr);
    gap: 40px;
}

.itcat-megamenu-intro {
    min-height: 250px;
    padding: 4px 28px 0 0;
    border-right: 2px solid rgba(35, 183, 217, 0.9);
}

.itcat-megamenu-title {
    margin-bottom: 22px;
    font-weight: 650;
    color: #061a32;
}

.itcat-megamenu-copy {
    color: #4e6178;
}

.itcat-megamenu-balanced {
    gap: 20px 22px;
}

.itcat-megamenu-column {
    gap: 16px;
}

.itcat-megamenu-category {
    padding: 15px 17px 16px;
    border: 1px solid rgba(171, 207, 225, 0.62);
    border-left: 3px solid rgba(35, 183, 217, 0.78);
    border-radius: 16px;
    background: rgba(255, 255, 255, 0.74);
    box-shadow: 0 10px 26px rgba(7, 27, 51, 0.045);
    backdrop-filter: blur(4px);
}

.itcat-megamenu-category-title {
    margin-bottom: 9px;
    color: #061a32;
}

.itcat-megamenu-category li + li {
    margin-top: 5px !important;
}

.main-nav .itcat-megamenu-category a,
.itcat-megamenu-category a {
    display: block !important;
    padding: 3px 0 !important;
    color: #203653 !important;
    transition: color 160ms ease, transform 160ms ease;
}

.main-nav .itcat-megamenu-category a:hover,
.main-nav .itcat-megamenu-category a:focus-visible,
.itcat-megamenu-category a:hover,
.itcat-megamenu-category a:focus-visible {
    color: #0077a8 !important;
    text-decoration: none !important;
    transform: translateX(3px);
}

@media (max-width: 1180px) {
    .itcat-megamenu-inner {
        width: min(1120px, calc(100vw - 42px));
        gap: 30px;
    }

    .itcat-megamenu-balanced {
        gap: 18px 20px;
    }
}


/* v1.83 — vignette de la grande catégorie dans le méga-menu.
   Taille volontairement contenue afin de conserver la présentation compacte. */
.itcat-megamenu-category-head {
    display: flex;
    align-items: center;
    gap: 12px;
    margin: 0 0 11px;
}

.itcat-megamenu-category-image {
    flex: 0 0 68px;
    width: 68px;
    height: 68px;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    border: 1px solid rgba(171, 207, 225, 0.72);
    border-radius: 12px;
    background: linear-gradient(145deg, #eaf5fc, #ffffff);
    box-shadow: 0 7px 16px rgba(7, 27, 51, 0.07);
}

.itcat-megamenu-category-image img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: contain;
    padding: 4px;
}

.itcat-megamenu-category-head .itcat-megamenu-category-title {
    flex: 1 1 auto;
    min-width: 0;
    margin: 0;
    padding-left: 0;
    border-left: 0;
}

@media (max-width: 1100px) {
    .itcat-megamenu-category-image {
        flex-basis: 58px;
        width: 58px;
        height: 58px;
    }
}


/* v1.86 — mode « menu pauvre » activable dans Produits > Réglages.
   Le mode normal et ses vignettes de catégorie restent inchangés. */
.itcat-megamenu-sparse .itcat-megamenu-inner {
    grid-template-columns: 210px minmax(0, 1fr);
    gap: 34px;
    padding-top: 30px;
    padding-bottom: 32px;
}

.itcat-megamenu-sparse .itcat-megamenu-intro {
    min-height: 0;
}

.itcat-megamenu-sparse-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 18px;
    align-items: start;
}

.itcat-megamenu-sparse-card {
    display: grid;
    grid-template-columns: var(--itcat-sparse-image-size, 94px) minmax(0, 1fr);
    gap: 16px;
    min-width: 0;
    padding: 14px 16px;
    border: 1px solid rgba(10, 77, 143, 0.18);
    border-left: 3px solid #23b7d9;
    border-radius: 16px;
    background: rgba(255, 255, 255, 0.96);
    box-shadow: 0 10px 26px rgba(8, 35, 61, 0.07);
}

.itcat-megamenu-sparse-image {
    width: var(--itcat-sparse-image-size, 94px);
    height: var(--itcat-sparse-image-size, 94px);
    overflow: hidden;
    border-radius: var(--itcat-sparse-image-radius, 12px);
    background: #eef5fb;
    border: 1px solid rgba(10, 77, 143, 0.10);
}

.itcat-megamenu-sparse-image img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.itcat-megamenu-sparse-content {
    min-width: 0;
}

.itcat-megamenu-sparse .itcat-megamenu-category-title {
    margin-bottom: 9px;
    padding-left: 0;
    border-left: 0;
    font-size: 15px;
}

.itcat-megamenu-sparse .itcat-megamenu-subgroups {
    margin-left: 0;
    padding-left: 0;
    border-left: 0;
}

.itcat-megamenu-sparse .itcat-megamenu-subcategory-title {
    margin-top: 4px;
    margin-bottom: 5px;
}

.itcat-megamenu-sparse .itcat-megamenu-category li + li,
.itcat-megamenu-sparse-card li + li {
    margin-top: 5px !important;
}

.itcat-megamenu-sparse .itcat-megamenu-category a,
.itcat-megamenu-sparse .itcat-megamenu-sparse-card a {
    font-size: 12.5px !important;
    line-height: 1.35 !important;
}

@media (max-width: 1100px) {
    .itcat-megamenu-sparse .itcat-megamenu-inner {
        grid-template-columns: 180px minmax(0, 1fr);
        gap: 26px;
    }

    .itcat-megamenu-sparse-card {
        grid-template-columns: var(--itcat-sparse-image-size-tablet, 78px) minmax(0, 1fr);
        gap: 13px;
    }

    .itcat-megamenu-sparse-image {
        width: var(--itcat-sparse-image-size-tablet, 78px);
        height: var(--itcat-sparse-image-size-tablet, 78px);
    }
}