/* ============================================================
   ECHO DU VIDE - RESPONSIVE GLOBAL
   Fichier unique - toutes les regles media queries du site

   BREAKPOINTS UTILISES
   1440px  -> Grand ecran / desktop large (backgrounds)
   1024px  -> Tablette landscape / petit desktop
    768px  -> Tablette portrait / mobile large
    480px  -> Mobile standard

   TABLE DES MATIERES
   01. FONDATIONS GLOBALES
   02. TYPOGRAPHIE
   03. LAYOUT & COLONNES
   04. PAGE ACCUEIL (ID:44)
   05. PAGE ACTUALITES (ID:30)
   06. PAGE DROPS / TWITCH (ID:26)
   07. PAGE LE JEU (ID:22)
   08. PAGE DISCORD (ID:33)
   09. PAGE ACHAT (ID:36)
   10. FORMULAIRES DE FILTRES
   11. CHATBOT L'ARCHITECTE DU VIDE
   12. POPUP ACHAT CONSOLE
   13. POPUP CONTACT
   14. POPUP TWITCH
   15. NEWSLETTER
   16. CODEX DU VIDE
   17. FOOTER
   18. ARTICLES DU BLOG (single-post)
   ============================================================ */


/* ============================================================
   01. FONDATIONS GLOBALES
   ============================================================ */

body,
.site,
.site-container,
.content-area {
    max-width: 100%;
    width: 100%;
    box-sizing: border-box;
}

/* Empêche le scroll horizontal global */
html, body {
    overflow-x: hidden;
}

/* Vidéos et iframes responsives */
iframe,
video {
    max-width: 100%;
    height: auto;
}

/* Header mobile */

@media (max-width: 480px) {

    /* Bouton CTA header mobile - réduit pour tenir sur une ligne */
.mobile-header-button-wrap .mobile-header-button {
        font-size: 13px !important;
        padding: 6px 10px !important;
        border-width: 2px !important;
    }
    .mobile-toggle-open-container {
        padding-right: 0px !important;
        margin-right: -10px !important;
    }
    .site-branding {
        padding-left: 4px !important;
    }
    

    /* Décale le burger du bord droit */
    .mobile-toggle-open-container {
        padding-right: 12px !important;
    }
    
 

}

/* tout les blocs textes du site mobile */

@media (max-width: 480px) {
    .wp-block-group.has-background {
        padding-left: 16px !important;
        padding-right: 16px !important;
    }
}



/* ============================================================
   02. TYPOGRAPHIE
   ============================================================ */

@media (max-width: 1024px) {
    h1 { font-size: 2.4rem !important; }
    h2 { font-size: 2rem !important; }
    h3 { font-size: 1.6rem !important; }
    p,
    li { font-size: 1rem !important; line-height: 1.6 !important; }
}

@media (max-width: 768px) {
    h1 { font-size: 2rem !important; }
    h2 { font-size: 1.7rem !important; }
    h3 { font-size: 1.4rem !important; }
    p,
    li { font-size: 0.95rem !important; line-height: 1.6 !important; }
}

@media (max-width: 480px) {
    h1 { font-size: 1.7rem !important; }
    h2 { font-size: 1.4rem !important; }
    h3 { font-size: 1.2rem !important; }
    p,
    li { font-size: 1rem !important; line-height: 1.5 !important;} 
}


/* ============================================================
   03. LAYOUT & COLONNES
   ============================================================ */

@media (max-width: 1024px) {
    .wp-block-columns,
    .kt-row-layout-inner,
    .kt-row-column-wrap {
        flex-wrap: wrap;
    }

    .kt-row-column {
        flex: 0 0 50%;
        max-width: 50%;
        box-sizing: border-box;
    }
}

@media (max-width: 768px) {
    .kt-row-column {
        flex: 0 0 100%;
        max-width: 100%;
    }
}


/* ============================================================
   04. PAGE ACCUEIL (ID:44)
   ============================================================ */

@media (max-width: 1440px) {
    body.page-id-44 {
        background-size: 100% auto !important;
        min-height: auto !important;
    }
}


/* ============================================================
   05. PAGE ACTUALITES (ID:30)
   ============================================================ */

@media (max-width: 1440px) {
    body.page-id-30 {
        background-size: 100% auto !important;
        min-height: auto !important;
    }
}

@media (max-width: 1024px) {

    .page-id-30 .wp-block-post-template {
        margin-left: 40px !important;
        margin-right: 40px !important;
    }

    /* Image en proportion homothétique */
    .page-id-30 .wp-block-post-featured-image {
        width: 100% !important;
        height: auto !important;
        margin-left: auto !important;
        margin-right: auto !important;
    }

      /* ← Neutralise les styles inline Gutenberg sur la figure */
    .page-id-30 .wp-block-post-featured-image figure {
        width: 100% !important;
        max-width: 100% !important;
        height: auto !important;
    }
   

    .page-id-30 .wp-block-post-title   { font-size: 24px !important; }
    .page-id-30 .wp-block-post-excerpt { font-size: 20px !important; }
}

@media (max-width: 768px) {

    .page-id-30 .wp-block-post-template {
        margin-left: 24px !important;
        margin-right: 24px !important;
         width: 90% !important;
    }

    .page-id-30 .wp-block-column {
        padding-left: 10px !important;
        padding-right: 10px !important;
    }

    .page-id-30 .wp-block-columns {
        flex-direction: column !important;
    }

    .page-id-30 .wp-block-column {
        flex-basis: 100% !important;
        width: 100% !important;
    }

    .page-id-30 .wp-block-post-title       { font-size: 24px !important; }
    .page-id-30 .wp-block-post-excerpt     { font-size: 20px !important; }
    .page-id-30 .wp-block-spacer           { height: 24px !important; }
    .page-id-30 .wp-block-query-pagination { font-size: 20px !important; }

    /* Espace entre les articles */
    .page-id-30 .wp-block-post-template > li {
    margin-bottom: 8rem !important;
}

/* Rapproche le texte de son image */
  .page-id-30 .wp-block-columns {
    gap: 0.3rem !important;
    row-gap: 0.3rem !important;
}

.page-id-30 .content-area {
    margin-bottom: 0 !important;
}


}

@media (max-width: 480px) {

    .page-id-30 .wp-block-post-template {
        margin-left: 16px !important;
        margin-right: 16px !important;
    }

    /* Espace entre les articles */
    .page-id-30 .wp-block-post-template > li {
    margin-bottom: 4rem !important;
    }

    /* Rapproche le texte de son image */
   .page-id-30 .wp-block-post-template > li > * {
    gap: 0.6rem !important;
}

    .page-id-30 .wp-block-post-title   { font-size: 18px !important; }
    .page-id-30 .wp-block-post-excerpt { font-size: 14px !important; }
}



/* ============================================================
   06. PAGE DROPS / TWITCH (ID:26)
   ============================================================ */

@media (max-width: 1440px) {
    body.page-id-26 {
        background-size: 100% auto !important;
        min-height: auto !important;
    }
}

@media (max-width: 768px) {

    /* Conteneur bouton + texte - espace bords */
    .kadence-column26_2e2246-3e {
        padding-left: 16px !important;
        padding-right: 16px !important;
    }

    /* Bouton Twitch pleine largeur */
    .wp-block-kadence-advancedbtn .kb-btn26_0de7d1-91.kb-button,
    ul.menu .wp-block-kadence-advancedbtn .kb-btn26_0de7d1-91.kb-button {
        width: 100% !important;
    }

    /* Bloc texte informatif - espace bords */
    .kt-adv-heading26_99cb4b-9e {
        margin-left: 16px !important;
        margin-right: 16px !important;
    }

    /* Images des drops - proportions homothétiques */
    .page-id-26 .wp-block-post-featured-image {
        width: 80% !important;
        margin-left: auto !important;
        margin-right: auto !important;
    }

    .page-id-26 .wp-block-post-featured-image img {
        width: 100% !important;
        height: auto !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
    }

    /* Colonne image des drops - annule marge */
    .kadence-column26_67650f-56,
    .kt-inside-inner-col > .kadence-column26_67650f-56 {
        margin-left: 0 !important;
        margin-right: 0 !important;
    }

    /* Colonne texte des drops - annule marge */
    .kadence-column26_c54946-da,
    .kt-inside-inner-col > .kadence-column26_c54946-da:not(.specificity) {
        margin-left: 0 !important;
        margin-right: 0 !important;
        text-align: center !important;
    }
}

@media (max-width: 480px) {

    /* Titre bouton Twitch */
    .kadence-column26_2e2246-3e h2 {
        font-size: 1.2rem !important;
    }

    /* Titres des drops */
    .page-id-26 .wp-block-post-title {
        font-size: 1.1rem !important;
    }

    /* Texte des drops */
    .page-id-26 .wp-block-post-content p {
        font-size: 1rem !important;
    }
}


/* ============================================================
   07. PAGE LE JEU (ID:22)
   ============================================================ */

@media (max-width: 1440px) {
    body.page-id-22 {
        background-size: 100% auto !important;
        min-height: auto !important;
    }
}

@media (max-width: 768px) {

    .video-card-thumb {
        padding: 12px;
        border-radius: 20px;
        width: 95%;
    }

    .videos-carousel-wrap {
        padding: 20px 40px;
    }

    .videos-carousel-wrap .splide__arrow {
        top: 50%;
        transform: translateY(-50%);
    }

    .videos-carousel-wrap .splide__arrow--prev { left: -5px; }
    .videos-carousel-wrap .splide__arrow--next { right: -5px; }
}


/* ============================================================
   08. PAGE DISCORD (ID:33)
   ============================================================ */
@media (max-width: 1440px) {
    body.page-id-33 {
        background-size: 100% auto !important;
        min-height: auto !important;
    }
}

@media all and (max-width: 767px) {
    .discord-btn-primary {
        height: auto !important;
        padding: 12px 16px !important;
        font-size: 0.9rem !important;
        line-height: 1.4 !important;
        text-align: center !important;
        white-space: normal !important;
    }
    .discord-form-body h3 {
        font-size: 1.2rem !important;
    }
    .discord-form-body .discord-form-subtitle {
        font-size: 15px !important;
    }
.kt-adv-heading33_e1e98f-9d {
        font-size: 1.5rem !important;
    }
}

@media all and (max-width: 480px) {
    .discord-btn-primary {
        font-size: 0.85rem !important;
        padding: 10px 14px !important;
    }
    .discord-form-body h3 {
        font-size: 1.1rem !important;
    }
    .discord-form-body .discord-form-subtitle {
        font-size: 14px !important;
    }

}


/* ============================================================
   09. PAGE ACHAT (ID:36)
   ============================================================ */

@media (max-width: 1440px) {
    body.page-id-36 {
        background-size: 100% auto !important;
        min-height: auto !important;
    }
}


/* ============================================================
   10. FORMULAIRES DE FILTRES
   Partage entre : .void-filters, .blog-filters, .drops-filters
   ============================================================ */

@media (max-width: 1024px) {
    .void-filters form,
    .blog-filters form,
    .drops-filters form {
        gap: 0.8rem;
    }

    .void-filters input[type="text"],
    .void-filters select,
    .void-filters button[type="submit"],
    .blog-filters input[type="text"],
    .blog-filters select,
    .blog-filters button[type="submit"],
    .drops-filters input[type="text"],
    .drops-filters select,
    .drops-filters button[type="submit"] {
        flex: 1 1 calc(50% - 1rem);
    }
}

@media (max-width: 768px) {

    /* Decolle les filtres des bords de l'ecran */
    .void-filters,
    .blog-filters,
    .drops-filters {
        margin-left: 16px !important;
        margin-right: 16px !important;
    }

    .void-filters form,
    .blog-filters form,
    .drops-filters form {
        flex-direction: column;
        align-items: stretch;
    }

    .void-filters input[type="text"],
    .void-filters select,
    .void-filters button[type="submit"],
    .blog-filters input[type="text"],
    .blog-filters select,
    .blog-filters button[type="submit"],
    .drops-filters input[type="text"],
    .drops-filters select,
    .drops-filters button[type="submit"] {
        width: 100%;
        flex: none;
    }
}

@media (max-width: 480px) {
    .void-filters,
    .blog-filters,
    .drops-filters {
        padding: 1rem 1.2rem;
    }

    .void-filters form,
    .blog-filters form,
    .drops-filters form {
        gap: 0.7rem;
    }
}


/* ============================================================
   11. CHATBOT L'ARCHITECTE DU VIDE
   ============================================================ */

@media (max-width: 1024px) {

    #architecte-chatbot { max-width: 100% !important; border-radius: 32px !important; }

    #architecte-chatbot .archi-header  { padding: 1rem 1.2rem !important; gap: 0.7rem !important; }
    #architecte-chatbot .archi-avatar  { width: 54px !important; height: 54px !important; }
    #architecte-chatbot .archi-name    { font-size: 22px !important; }
    #architecte-chatbot .archi-status  { font-size: 18px !important; }

    #architecte-chatbot .archi-messages {
        padding: 1rem 1.2rem !important;
        max-height: 280px !important;
    }

    #architecte-chatbot .archi-msg        { font-size: 22px !important; }
    #architecte-chatbot .archi-input-area { padding: 1rem 1.2rem !important; }

    #architecte-chatbot #architecte-input {
        font-size: 20px !important;
        padding: 0.7rem 1.3rem !important;
    }

    #architecte-chatbot #architecte-send { width: 64px !important; height: 64px !important; }
}

@media (max-width: 768px) {

    #architecte-chatbot { border-radius: 24px !important; }

    #architecte-chatbot .archi-header {
        padding: 0.8rem 1rem !important;
        gap: 0.6rem !important;
    }

    #architecte-chatbot .archi-avatar  { width: 48px !important; height: 48px !important; }
    #architecte-chatbot .archi-name    { font-size: 20px !important; }
    #architecte-chatbot .archi-status  { font-size: 16px !important; }

    #architecte-chatbot .archi-messages {
        padding: 0.8rem 1rem !important;
        max-height: 260px !important;
    }

    #architecte-chatbot .archi-msg { font-size: 20px !important; }

    #architecte-chatbot .archi-input-area { padding: 0.8rem 1rem !important; gap: 0.5rem !important; }

    #architecte-chatbot #architecte-input {
        font-size: 18px !important;
        padding: 0.6rem 1.2rem !important;
    }

    #architecte-chatbot #architecte-send { width: 56px !important; height: 56px !important; }
}

@media (max-width: 480px) {

    #architecte-chatbot .archi-header { padding: 0.6rem 0.8rem !important; }
    #architecte-chatbot .archi-avatar { width: 42px !important; height: 42px !important; }

    #architecte-chatbot .archi-name {
        font-size: 16px !important;
        letter-spacing: 0.1em !important;
    }

    #architecte-chatbot .archi-status  { font-size: 13px !important; }

    #architecte-chatbot .archi-messages {
        padding: 0.6rem 0.8rem !important;
        max-height: 220px !important;
    }

    #architecte-chatbot .archi-msg { font-size: 16px !important; }

    #architecte-chatbot #architecte-input {
        font-size: 16px !important;
        padding: 0.55rem 1rem !important;
    }

    #architecte-chatbot #architecte-send { width: 50px !important; height: 50px !important; }
}


/* ============================================================
   12. POPUP ACHAT CONSOLE
   ============================================================ */

@media (max-width: 1024px) {
    .shop-popup-inner   { max-width: 420px; padding: 1.6rem; }
    .shop-format-btn    { padding: 1rem 1.4rem; font-size: 0.95rem; }
    .shop-retailer-item { padding: 0.7rem 0.9rem; font-size: 0.95rem; }
    .shop-cta-btn       { padding: 0.7rem 1rem; font-size: 0.95rem; }
}

@media (max-width: 768px) {

    .shop-popup-inner {
        max-width: 90%;
        padding: 1.4rem;
        border-radius: 6px;
    }

    .shop-popup-inner h3 { font-size: 1.2rem; }
    .shop-popup-desc,
    .shop-step-desc      { font-size: 0.85rem; }

    .shop-format-buttons { flex-direction: column; gap: 0.8rem; }

    .shop-format-btn    { padding: 0.9rem 1.2rem; font-size: 0.9rem; }
    .shop-retailer-item { padding: 0.7rem 0.8rem; font-size: 0.9rem; }
    .shop-cta-btn       { padding: 0.7rem 1rem;   font-size: 0.9rem; }
    .shop-back-btn      { font-size: 0.8rem; }
}

@media (max-width: 480px) {

    .shop-popup-inner { padding: 1.2rem; border-radius: 6px; }

    .shop-popup-inner h3 { font-size: 1.1rem; }
    .shop-popup-desc,
    .shop-step-desc      { font-size: 0.8rem; }
    .shop-format-btn     { padding: 0.8rem 1rem;  font-size: 0.85rem; }
    .shop-retailer-item  { padding: 0.6rem 0.7rem; font-size: 0.85rem; }
    .shop-cta-btn        { padding: 0.6rem 0.9rem; font-size: 0.85rem; }
}


/* ============================================================
   13. POPUP CONTACT
   ============================================================ */

@media (max-width: 1024px) {

    .contact-popup-inner {
        padding: 32px;
        max-width: 480px;
        border-radius: 32px;
    }

    .contact-popup-inner h3          { font-size: 1.1rem; margin-bottom: 20px; }
    .contact-form-fields             { gap: 16px; }
    .contact-form-field input,
    .contact-form-field textarea     { font-size: 0.9rem; padding: 10px 14px; }
    .contact-form-submit             { font-size: 0.95rem; padding: 12px 24px; }
}

@media (max-width: 768px) {

    .contact-popup-inner {
        width: 92%;
        padding: 26px;
        border-radius: 28px;
        max-width: 400px;
    }

    .contact-popup-inner h3      { font-size: 1rem; margin-bottom: 18px; }
    .contact-popup-close         { top: 12px; right: 16px; font-size: 1rem; }
    .contact-form-fields         { gap: 14px; }
    .contact-form-field label    { font-size: 0.8rem; }
    .contact-form-field input,
    .contact-form-field textarea { font-size: 0.85rem; padding: 10px 12px; }
    .contact-form-submit         { font-size: 0.9rem; padding: 12px 20px; border-radius: 28px; }
}

@media (max-width: 480px) {

    .contact-popup-inner {
        padding: 20px;
        border-radius: 24px;
        width: 94%;
        max-width: 340px;
    }

    .contact-popup-inner h3      { font-size: 0.95rem; }
    .contact-form-fields         { gap: 12px; }
    .contact-form-field input,
    .contact-form-field textarea { font-size: 0.8rem; padding: 8px 10px; border-radius: 10px; }
    .contact-form-submit         { font-size: 0.85rem; padding: 10px 18px; border-radius: 24px; }
}


/* ============================================================
   14. POPUP TWITCH
   ============================================================ */

@media (max-width: 1024px) {

    .twitch-popup-inner {
        padding: 1.8rem !important;
        max-width: 480px !important;
        border-radius: 8px !important;
    }

    .twitch-popup-inner h3   { font-size: 1.7rem !important; }
    .twitch-popup-desc       { font-size: 1.3rem !important; }
    .twitch-form-field input { font-size: 1.3rem !important; padding: 0.55rem 0.9rem !important; }
    .twitch-form-submit      { font-size: 1.3rem !important; }
}

@media (max-width: 768px) {

    .twitch-popup-inner {
        width: 92% !important;
        max-width: 400px !important;
        padding: 1.5rem !important;
    }

    .twitch-popup-inner h3   { font-size: 1.5rem !important; }
    .twitch-popup-desc       { font-size: 1.2rem !important; }
    .twitch-form-field input { font-size: 1.1rem !important; padding: 0.5rem 0.8rem !important; }
    .twitch-form-submit      { font-size: 1.2rem !important; }
}

@media (max-width: 480px) {

    .twitch-popup-inner {
        width: 94% !important;
        max-width: 320px !important;
        padding: 1.2rem !important;
    }

    .twitch-popup-inner h3   { font-size: 1.3rem !important; }
    .twitch-popup-desc       { font-size: 1.05rem !important; }
    .twitch-form-field input { font-size: 1rem !important; padding: 0.45rem 0.7rem !important; }
    .twitch-form-submit      { font-size: 1.1rem !important; padding: 0.6rem 0.8rem !important; }
}




/* ================================================
   NEWSLETTER - Responsive complet
   1920px : 2 colonnes, champ large, tout aligné
   Réduction progressive jusqu'au mobile
   ================================================ */


@media all and (min-width: 1025px) and (max-width: 1413px) {
    .kb-row-layout-id546_a6e894-7b > .kt-row-column-wrap {
        grid-template-columns: minmax(0, 1fr) !important;
    }
    .kadence-column546_d9e8d9-93,
    .kadence-column546_b91543-ad {
        margin-left: 0 !important;
        margin-right: 0 !important;
        text-align: center !important;
        width: 100% !important;
    }
    .kadence-column546_d9e8d9-93 > .kt-inside-inner-col {
        align-items: center !important;
    }
    .kt-adv-heading546_030c56-ab { font-size: 20px !important; }
    .kt-adv-heading546_8dc545-71 { font-size: 15px !important; }
    .wp-block-kadence-advanced-form490-cpt-id {
        display: flex !important;
        justify-content: center !important;
        width: 100% !important;
    }
    .kb-row-layout-id546_e0e9e9-13 {
        margin-left: auto !important;
        margin-right: auto !important;
        width: 100% !important;
    }
    .kb-row-layout-id546_e0e9e9-13 > .kt-row-column-wrap {
        justify-content: center !important;
    }
    .kadence-column546_ce920c-76 {
        margin-right: 0 !important;
    }
    .wp-block-kadence-advanced-form .kb-field490813ecd-e1 {
        min-width: 380px !important;
    }
    #field490813ecd-e1 {
        margin-bottom: 10px !important;
    }
    .kb-submit-field .kb-btnd197e5-0f.kb-button {
        margin-bottom: 20px !important;
        margin-right: 0 !important;
        margin-left: 0 !important;
    }
}

/* Newsletter 768px–1024px */
@media all and (min-width: 768px) and (max-width: 1024px) {
    .kb-row-layout-id546_a6e894-7b > .kt-row-column-wrap {
        grid-template-columns: minmax(0, 1fr) !important;
    }
    .kadence-column546_d9e8d9-93 > .kt-inside-inner-col,
    .kadence-column546_b91543-ad > .kt-inside-inner-col {
        align-items: center !important;
        justify-content: center !important;
    }
    .kadence-column546_d9e8d9-93 { margin-left: 0 !important; }
    .kt-adv-heading546_030c56-ab {
        font-size: 19px !important;
        text-align: center !important;
    }
    .kt-adv-heading546_8dc545-71 {
        font-size: 15px !important;
        text-align: center !important;
    }
    .wp-block-kadence-advanced-form .kb-field490813ecd-e1 {
        min-width: 340px !important;
    }
    .kadence-column546_ce920c-76 { margin-right: 0 !important; }
#field490813ecd-e1 {
    margin-bottom: 10px !important;
}
.kb-submit-field .kb-btnd197e5-0f.kb-button {
    margin-bottom: 20px !important;
}
}

@media all and (max-width: 767px) {
    .kb-row-layout-id546_a6e894-7b > .kt-row-column-wrap {
        grid-template-columns: minmax(0, 1fr) !important;
    }
    .kb-row-layout-id546_e0e9e9-13 > .kt-row-column-wrap {
        grid-template-columns: minmax(0, 1fr) !important;
    }
    .kt-adv-heading546_030c56-ab,
    .kt-adv-heading546_8dc545-71 {
        text-align: center !important;
    }
    .kadence-column546_d9e8d9-93,
    .kadence-column546_b91543-ad {
        margin: 0 !important;
        width: 100% !important;
    }
    .kadence-column546_6c5ea6-ed,
    .kt-inside-inner-col > .kadence-column546_6c5ea6-ed:not(.specificity) {
        margin-right: 0 !important;
        margin-left: 0 !important;
        width: 100% !important;
    }
    .kadence-column546_ce920c-76,
    .kt-inside-inner-col > .kadence-column546_ce920c-76:not(.specificity) {
        margin-right: 0 !important;
    }

    /* Largeur du champ — même approche que l'ancien code qui fonctionnait */
    #field490813ecd-e1 {
        width: 90% !important;
        min-width: unset !important;
        height: 48px !important;
        font-size: 1rem !important;
        padding-left: 16px !important;
        box-sizing: border-box !important;
margin: 0 auto !important;
    display: block !important;
    }

    /* Bouton centré */
    .kb-submit-field .kb-btnd197e5-0f.kb-button {
        width: 200px !important;
        margin: 0 auto !important;
        display: block !important;
    }
    .kb-submit-field.kb-fieldd197e5-0f {
        justify-content: center !important;
        width: 100% !important;
    }
    .kadence-column546_ce920c-76 > .kt-inside-inner-col {
        margin-top: 16px !important;
        justify-content: center !important;
    }
    .kb-submit-field .kb-btnd197e5-0f.kb-button {
    margin-bottom: 20px !important;
     }
}


/* ============================================================
   16. CODEX DU VIDE
   Note : particles.js continue de tourner en JS meme avec display:none
   Optimisation : initialiser particles.js uniquement si
   window.innerWidth > 1024 dans le fichier JS
   ============================================================ */

@media (max-width: 1024px) {
    #particles-js { display: none !important; }
}


/* ============================================================
   17. FOOTER
   Note : kt-adv-headingblock-20_41cba0-c9 est un ID Kadence fragile
   ============================================================ */

@media (max-width: 1024px) {

    footer .kt-adv-headingblock-20_41cba0-c9 {
        font-size: 1.8rem !important;
        margin-left: 0 !important;
        margin-top: 20px !important;
        text-align: center !important;
    }

    #footer-menu {
        justify-content: center !important;
        margin-left: 0 !important;
        margin-top: 20px !important;
        column-gap: 1.5rem !important;
        row-gap: 0.8rem !important;
    }

    #footer-menu li a { font-size: 1.2rem !important; }

    footer .kb-imageblock-8_6859e0-3c img {
        margin-left: 0 !important;
        margin-top: 10px !important;
        max-width: 120px !important;
    }

    footer .footer-widget-area-inner p {
        margin-left: 0 !important;
        text-align: center !important;
        font-size: 1rem !important;
    }
}

@media (max-width: 768px) {

    footer .kt-adv-headingblock-20_41cba0-c9 {
        font-size: 1.6rem !important;
        margin-top: 15px !important;
    }

    #footer-menu {
        flex-direction: column !important;
        align-items: center !important;
        margin-top: 15px !important;
        column-gap: 0 !important;
        row-gap: 0.6rem !important;
    }

    #footer-menu li a { font-size: 1rem !important; }

    footer .kb-imageblock-8_6859e0-3c img {
        max-width: 100px !important;
        margin-top: 5px !important;
    }

    footer .footer-widget-area-inner p {
        font-size: 1rem !important;
        margin-top: 0.3rem !important;
    }
}

@media (max-width: 480px) {

    footer .kt-adv-headingblock-20_41cba0-c9 {
        font-size: 1.2rem !important;
        letter-spacing: 0.05em !important;
    }

    #footer-menu      { row-gap: 0.5rem !important; }
    #footer-menu li a { font-size: 0.85rem !important; }

    footer .kb-imageblock-8_6859e0-3c img { max-width: 80px !important; }

    footer .footer-widget-area-inner p { font-size: 0.85rem !important; }
}


/* ============================================================
   18. ARTICLES DU BLOG (single-post)
   ============================================================ */

@media (max-width: 1024px) {
    body.single-post #secondary {
        width: 240px;
        min-width: 200px;
    }

    body.single-post .entry-hero .entry-title {
        max-width: 100%;
    }

    .edv-retour-blog {
        display: none !important;
    }
}

@media (max-width: 768px) {

    body.single-post .content-container {
        display: block !important;
    }

    body.single-post #secondary {
        width: 100% !important;
        min-width: unset !important;
        max-width: 100% !important;
        padding: 0 20px !important;
        box-sizing: border-box !important;
    }

    body.single-post .entry-hero .entry-title {
        font-size: clamp(1.4rem, 5vw, 2rem);
    }

    body.single-post .entry-content.single-content {
        padding-left: 20px !important;
        padding-right: 20px !important;
    }

    body.single-post .content-wrap {
        padding-left: 20px !important;
        padding-right: 20px !important;
    }

    body.single-post .entry-related-inner {
        padding-left: 15px !important;
        padding-right: 15px !important;
        max-width: 100% !important;
        box-sizing: border-box !important;
    }

    body.single-post.has-sidebar .entry-related.alignfull {
        margin-left: 0 !important;
        margin-right: 0 !important;
        width: 100% !important;
        max-width: 100% !important;
        overflow: hidden !important;
        position: relative !important;
        left: 0 !important;
        transform: none !important;
    }

    .blog article.loop-entry {
        flex-direction: column;
        gap: 1rem;
    }

    .blog article.loop-entry a.post-thumbnail {
        width: 80% !important;
        height: auto !important;
        position: relative !important;
        margin-left: auto !important;
        margin-right: auto !important;
    }

    .blog article.loop-entry .post-thumbnail-inner img {
        width: 100% !important;
        height: auto !important;
    }

    .blog article.loop-entry .entry-content-wrap {
        padding: 0 0.5rem;
    }
}

@media (max-width: 480px) {

    body.single-post .entry-hero .entry-title {
        font-size: clamp(1.2rem, 6vw, 1.6rem);
    }

    body.single-post .entry-content.single-content {
        padding-left: 16px !important;
        padding-right: 16px !important;
    }

    body.single-post .content-wrap {
        padding-left: 16px !important;
        padding-right: 16px !important;
    }
}

/* ============================================================
   19. PAGES LEGALES & PRESS KIT
   ============================================================ */

@media (max-width: 768px) {
    .page-id-1208 .entry-content-wrap,
    .page-id-1215 .entry-content-wrap,
    .page-id-1226 .entry-content-wrap,
    .page-id-1220 .entry-content-wrap,
    .page-id-1223 .entry-content-wrap,
    .page-id-39 .entry-content-wrap {
        padding-left: 20px !important;
        padding-right: 20px !important;
    }

    .page-id-1208 .kb-row-layout-id1912_ab3115-19,
    .page-id-1215 .kb-row-layout-id1912_ab3115-19,
    .page-id-1226 .kb-row-layout-id1912_ab3115-19,
    .page-id-1220 .kb-row-layout-id1912_ab3115-19,
    .page-id-1223 .kb-row-layout-id1912_ab3115-19,
    .page-id-39 .kb-row-layout-id1912_ab3115-19 {
        margin-left: -20px !important;
        margin-right: -20px !important;
        width: calc(100% + 40px) !important;
    }
}

@media (max-width: 480px) {
    .page-id-1208 .entry-content-wrap,
    .page-id-1215 .entry-content-wrap,
    .page-id-1226 .entry-content-wrap,
    .page-id-1220 .entry-content-wrap,
    .page-id-1223 .entry-content-wrap,
    .page-id-39 .entry-content-wrap {
        padding-left: 16px !important;
        padding-right: 16px !important;
    }

    .page-id-1208 .kb-row-layout-id1912_ab3115-19,
    .page-id-1215 .kb-row-layout-id1912_ab3115-19,
    .page-id-1226 .kb-row-layout-id1912_ab3115-19,
    .page-id-1220 .kb-row-layout-id1912_ab3115-19,
    .page-id-1223 .kb-row-layout-id1912_ab3115-19,
    .page-id-39 .kb-row-layout-id1912_ab3115-19 {
        margin-left: -16px !important;
        margin-right: -16px !important;
        width: calc(100% + 32px) !important;
    }
}

/* ==============================================
   Section 20 — Header navigation desktop intermédiaire
   Corrige le wrapping des liens et CTA entre 1025px et 1500px
   ============================================== */

/* Logo + titre : réduction progressive */
@media all and (min-width: 1025px) and (max-width: 1200px) {
    .site-branding a.brand img { max-width: 50px !important; }
    .site-branding .site-title { font-size: 16px !important; }
    .site-branding .site-description { font-size: 11px !important; }
}

@media all and (min-width: 1201px) and (max-width: 1600px) {
    .site-branding a.brand img { max-width: 60px !important; }
    .site-branding .site-title { font-size: 19px !important; }
    .site-branding .site-description { font-size: 12px !important; }
}

@media all and (min-width: 1601px) and (max-width: 1900px) {
    .site-branding a.brand img { max-width: 70px !important; }
    .site-branding .site-title { font-size: 22px !important; }
}

/* Menu nav : réduction graduelle */
@media all and (min-width: 1025px) and (max-width: 1200px) {
    .main-navigation .primary-menu-container > ul > li.menu-item > a {
        font-size: 15px !important;
        padding-left: 0.6em !important;
        padding-right: 0.6em !important;
    }
    #main-header .header-button {
        font-size: 13px !important;
        margin-left: 5px !important;
        margin-right: 5px !important;
        padding-left: 10px !important;
        padding-right: 10px !important;
    }
}

@media all and (min-width: 1201px) and (max-width: 1600px) {
    .main-navigation .primary-menu-container > ul > li.menu-item > a {
        font-size: 17px !important;
        padding-left: 1em !important;
        padding-right: 1em !important;
    }
    #main-header .header-button {
        margin-left: 10px !important;
        margin-right: 10px !important;
    }
}

@media all and (min-width: 1601px) and (max-width: 1900px) {
    .main-navigation .primary-menu-container > ul > li.menu-item > a {
        font-size: 18px !important;
        padding-left: 1.5em !important;
        padding-right: 1.5em !important;
    }
    #main-header .header-button {
        margin-left: 15px !important;
        margin-right: 20px !important;
    }
}