/* ============================================================
   CONTENT WITH SIDEBAR BUTTONS
   ============================================================ */

/* ------------------------------------------------------------
   MAIN 3-COLUMN LAYOUT
   ------------------------------------------------------------ */

.module-content-with-sidebar-buttons {
    width: 100% !important;
}

.module-content-with-sidebar-buttons .module-inner {
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 0 !important;
}

.module-content-with-sidebar-buttons .module-wrap {
    display: grid !important;
    grid-template-columns: 220px minmax(0, 1fr) 280px !important;
    gap: 50px !important;
    width: calc(100% - 20px) !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 0 !important;
    align-items: start !important;
}


/* ------------------------------------------------------------
   LEFT COLUMN — BUTTONS
   ------------------------------------------------------------ */

.module-content-with-sidebar-buttons,
.module-content-with-sidebar-buttons .module-inner,
.module-content-with-sidebar-buttons .module-wrap {
    overflow: visible !important;
}

.module-content-with-sidebar-buttons .buttons-column .content-module-buttons {
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 0 !important;
}

.module-content-with-sidebar-buttons .buttons-column .content-module-buttons .content-module-inner {
    width: 100% !important;
    padding: 0 !important;
}

.module-content-with-sidebar-buttons .buttons-column .btn-wrap + .btn-wrap {
    margin-top: 1em;
}


/* ------------------------------------------------------------
   MIDDLE COLUMN — MAIN CONTENT
   ------------------------------------------------------------ */

.module-content-with-sidebar-buttons .content-column {
    width: 100% !important;
    min-width: 0 !important;
}

.module-content-with-sidebar-buttons .content-column .content-module {
    width: 100% !important;
    max-width: none !important;
    margin-left: 0 !important;
}

.module-content-with-sidebar-buttons .content-column .content-module-inner {
    width: 100% !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
}

.module-content-with-sidebar-buttons .content-column .wysiwyg {
    width: 100% !important;
}


/* ------------------------------------------------------------
   RIGHT COLUMN — IMAGES / MEDIA
   ------------------------------------------------------------ */

.module-content-with-sidebar-buttons .media-column {
    width: 100% !important;
    min-width: 0 !important;
}

.module-content-with-sidebar-buttons .media-column .content-module {
    width: 100% !important;
    max-width: none !important;
    margin-left: 0 !important;
}

.module-content-with-sidebar-buttons .media-column .content-module-inner {
    width: 100% !important;
    padding: 0 !important;
}

.module-content-with-sidebar-buttons .media-column .content-module-image {
    width: 100% !important;
}

.module-content-with-sidebar-buttons .media-column .content-module-image img {
    display: block;
    width: 100%;
    height: auto;
}


/* ------------------------------------------------------------
   IMAGE CAPTIONS
   ------------------------------------------------------------ */

.module-content-with-sidebar-buttons .image-with-caption figcaption {
    margin-top: 1em;
    color: #adaeb0;
}

.module-content-with-sidebar-buttons .image-with-caption figcaption.has-no-offset {
    margin-left: 0 !important;
}


/* ------------------------------------------------------------
   CONTENT SPACING
   ------------------------------------------------------------ */

.module-content-with-sidebar-buttons .content-module + .content-module {
    margin-top: var(--mrgn-30);
}

.module-content-with-sidebar-buttons .content-module-header {
    margin-bottom: 1.5em;
}

.module-content-with-sidebar-buttons .content-module-copy + .content-module-buttons.has-no-headline {
    margin-top: var(--mrgn-20);
}


/* ------------------------------------------------------------
   BUTTON SPACING
   ------------------------------------------------------------ */

.module-content-with-sidebar-buttons .content-module-buttons .btn-wrap + .btn-wrap {
    margin-top: 1em;
}


/* ------------------------------------------------------------
   DOWNLOADS
   ------------------------------------------------------------ */

.module-content-with-sidebar-buttons .content-module-download {
    padding-bottom: 1.6em;
}

.module-content-with-sidebar-buttons .content-module-download + .content-module-download {
    margin-top: var(--mrgn-10);
}

.module-content-with-sidebar-buttons .content-module-download .headline {
    margin-top: 1.25em;
}

.module-content-with-sidebar-buttons .content-module-download .meta {
    margin-top: 0.2em;
}

.module-content-with-sidebar-buttons .content-module-download figure {
    position: relative;
    height: 5em;
}

.module-content-with-sidebar-buttons .content-module-download .icon-and-image {
    position: relative;
}

.module-content-with-sidebar-buttons .content-module-download .content-module-inner {
    padding-left: max(45px, calc(65 * var(--base-unit)));
    position: relative;
}

.module-content-with-sidebar-buttons .content-module-download .icon {
    position: absolute;
    left: 0;
    top: 0;
}

.module-content-with-sidebar-buttons .content-module-download .icon svg {
    width: max(25px, calc(45 * var(--base-unit)));
    height: auto;
    display: inline-block;
}

.module-content-with-sidebar-buttons .content-module-download.has-image .icon-and-image {
    position: absolute;
    left: -4.3em;
    top: -3.4em;
    width: 100px;
}

.module-content-with-sidebar-buttons .content-module-download.has-image .icon {
    display: none;
}

.module-content-with-sidebar-buttons a.content-module-download:hover .headline,
.module-content-with-sidebar-buttons a.content-module-download:focus .headline {
    text-decoration: underline;
}


/* ------------------------------------------------------------
   BOXES
   ------------------------------------------------------------ */

.module-content-with-sidebar-buttons .content-module-box {
    background: #ffd92f;
    color: #3a4390;
    padding: var(--component-copy-padding);
    box-sizing: border-box;
}

.module-content-with-sidebar-buttons a.content-module-box {
    display: block;
    position: relative;
}

.module-content-with-sidebar-buttons a.content-module-box::after {
    content: '';
    position: absolute;
    inset: 0;
    border: 3px solid #06b1c2;
    transform: translateY(-13%) scale(0.94) rotate(-1.7deg);
    z-index: -1;
    pointer-events: none;
}


/* ------------------------------------------------------------
   VIDEO / AUDIO
   ------------------------------------------------------------ */

.module-content-with-sidebar-buttons .content-module-video video,
.module-content-with-sidebar-buttons .content-module-video iframe {
    display: block;
    width: 100%;
}

.module-content-with-sidebar-buttons .content-module-audio audio {
    display: block;
    max-width: 100%;
}

.module-content-with-sidebar-buttons .content-module-video figcaption,
.module-content-with-sidebar-buttons .content-module-audio figcaption {
    margin-top: 1em;
    color: #adaeb0;
}


/* ------------------------------------------------------------
   TABLET
   ------------------------------------------------------------ */

@media (max-width: 1060px) {

    .module-content-with-sidebar-buttons .module-wrap {
        grid-template-columns: 190px minmax(0, 1fr) 230px !important;
        gap: 35px !important;
    }

}


/* ------------------------------------------------------------
   SMALLER TABLETS
   ------------------------------------------------------------ */

@media (max-width: 900px) {

    .module-content-with-sidebar-buttons .module-wrap {
        grid-template-columns: 180px minmax(0, 1fr) !important;
        gap: 30px !important;
    }

    .module-content-with-sidebar-buttons .media-column {
        grid-column: 2 !important;
    }

    .module-content-with-sidebar-buttons .content-column .content-module,
    .module-content-with-sidebar-buttons .media-column .content-module {
        margin-left: 0 !important;
    }

}


/* ------------------------------------------------------------
   MOBILE
   ------------------------------------------------------------ */

@media (max-width: 750px) {

    .module-content-with-sidebar-buttons .module-wrap {
        display: block !important;
    }

    .module-content-with-sidebar-buttons .buttons-column {
        position: static !important;
        width: 100% !important;
        margin-bottom: 30px !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
    }

    .module-content-with-sidebar-buttons .content-column,
    .module-content-with-sidebar-buttons .media-column {
        width: 100% !important;
    }

    .module-content-with-sidebar-buttons .media-column {
        margin-top: 30px !important;
    }

    .module-content-with-sidebar-buttons .content-module-header {
        margin-bottom: 0.5em;
    }

    .module-content-with-sidebar-buttons .content-module-download .content-module-inner {
        padding-left: 3.3em;
    }

    .module-content-with-sidebar-buttons .content-module-download .icon {
        position: absolute;
        left: 0;
        top: -0.4em;
    }

    .module-content-with-sidebar-buttons .content-module-download.has-image .icon-and-image {
        left: -2em;
        top: -1.9em;
        width: 70px;
    }

}


/* ------------------------------------------------------------
   SMALL PHONES
   ------------------------------------------------------------ */

@media (max-width: 600px) {

    .module-content-with-sidebar-buttons .content-module-image,
    .module-content-with-sidebar-buttons .content-module-video {
        margin-left: 0 !important;
    }

    .module-content-with-sidebar-buttons .content-module-download .headline {
        font-size: 14px;
    }

    .module-content-with-sidebar-buttons .content-module-download .meta {
        font-size: 14px;
    }

}


/* ------------------------------------------------------------
   VERY SMALL PHONES
   ------------------------------------------------------------ */

@media (max-width: 500px) {

    .module-content-with-sidebar-buttons .content-module-copy,
    .module-content-with-sidebar-buttons .content-module-buttons {
        max-width: none !important;
    }

    .module-content-with-sidebar-buttons .content-module-download {
        padding-bottom: 1.2em;
    }

    .module-content-with-sidebar-buttons .content-module-download .headline {
        font-size: 14px;
    }

    .module-content-with-sidebar-buttons .content-module-download .meta {
        font-size: 14px;
    }

    .module-content-with-sidebar-buttons .content-module-download .icon i {
        font-size: 150%;
    }

    .module-content-with-sidebar-buttons .btn-link-list {
        font-size: 14px;
    }

    .module-content-with-sidebar-buttons ul.link-list li {
        display: block;
        margin-right: 0;
    }

    .module-content-with-sidebar-buttons .content-module-download .content-module-inner {
        padding-left: 2.6em;
    }

}


/* ============================================================
   FINAL POSITIONING OVERRIDES
   ============================================================ */

/* Move the whole 3-column section higher */
.module-content-with-sidebar-buttons {
    margin-top: -120px !important;
}


/* MOBILE — don't apply desktop positioning */
@media (max-width: 750px) {
    .module-content-with-sidebar-buttons {
        margin-top: 0 !important;
    }

    .module-content-with-sidebar-buttons .buttons-column,
    .module-content-with-sidebar-buttons .buttons-column .content-module-buttons {
        position: static !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
    }
}


/* ============================================================
   BUTTONS COLUMN — STICKY + SPACING (única fuente de verdad,
   sin duplicados. OJO: el sticky va SOLO en .buttons-column,
   nunca también en su hijo .content-module-buttons — poner
   sticky en los dos anidados es lo que rompía el efecto.)
   ============================================================ */

.module-content-with-sidebar-buttons .buttons-column {
    overflow: visible !important;
    transform: none !important;
    position: sticky !important;
    position: -webkit-sticky !important;
    top: 110px !important;
    align-self: start !important;
    height: fit-content !important;
    padding-left: 50px !important;
    padding-right: 40px !important;
    box-sizing: border-box !important;
}

/* Theme containers above the module — necesarios para que el sticky no se bloquee */
.barba-outer,
.barba-container,
.container,
main.main,
main.main > .inner {
    overflow: visible !important;
    transform: none !important;
}


html,
body {
    overflow-x: clip !important;
}


/* MOBILE — buttons start at the top of the module */
@media (max-width: 750px) {
    .module-content-with-sidebar-buttons .buttons-column {
        position: static !important;
        top: auto !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
    }
}


/* MOBILE — breathing room around the content */
@media (max-width: 750px) {

    .module-content-with-sidebar-buttons .buttons-column,
    .module-content-with-sidebar-buttons .content-column,
    .module-content-with-sidebar-buttons .media-column {
        box-sizing: border-box !important;
        padding-left: 20px !important;
        padding-right: 20px !important;
    }

    .module-content-with-sidebar-buttons .content-column .content-module-inner,
    .module-content-with-sidebar-buttons .media-column .content-module-inner {
        box-sizing: border-box !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
    }

}