/* Basic Paragraphs */
.paragraph {
    padding: 0rem;
}

.para-section {
    padding: 0 1rem;
}

.paragraph.centre .para-section {
    text-align: center;
}

/* Single column */
.paragraph--type-basic {
    margin-bottom: 2rem;
}
.paragraph--type-basic h2 {
    padding-right: 20%;
    line-height: 1.2;
}

.paragraph--type-basic ul {
    list-style: none;
    padding: 0;
    max-width: min(100%, 50rem);
}

.paragraph--type-basic ul li {
    list-style-type: none;
    margin-bottom: 0.5rem;
    position: relative;
    padding-left: 1rem;
    line-height: 1.5;
}

.paragraph--type-basic ul li:before {
    font-family: 'icomoon' !important;
    font-style: normal;
    font-weight: normal;
    font-variant: normal;
    text-transform: none;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    content: "\e908";
    position: relative;
    top: 1px;
    margin-right: 0.5rem;
    color: var(--primaryLight);
    position: absolute;
    left: -0.25rem;
    top: 0.33rem;
    font-weight: 900;
}

.paragraph--type-basic ul li li:before {
    content: "\25CB";
    left: 0;
  }

.paragraph--type-basic table {
    background-color: transparent;
    border: 0;
}

.paragraph--type-basic table caption {
    text-align: left;
    font-family: var(--fontBold);
    margin-bottom: 0.5rem;
    margin-top: 1rem;
    opacity: 0.7;
}

/* First Basic Para with Heading Spacing */
.paragraph--type-basic .para-section:not(:has(h2)) {
    margin-top: 2rem;
}

/* Highlight */
.paragraph--type-highlight {
    padding: 3rem 0;
    margin: 0 0 2rem;
}

.paragraph--type-highlight h2,
.paragraph--type-highlight h3,
.paragraph--type-highlight p {
    max-width: min(100%, 56rem);
}

.paragraph--type-highlight ul {
    list-style: none;
    padding: 0;
    max-width: 56rem;
    max-width: min(100%, 56rem);
}

.paragraph--type-highlight ul li {
    list-style-type: none;
    margin-bottom: 0.5rem;
    position: relative;
    padding-left: 1rem;
    line-height: 1.5;
}

.paragraph--type-highlight ul li:before {
    font-family: 'icomoon' !important;
    font-style: normal;
    font-weight: normal;
    font-variant: normal;
    text-transform: none;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    content: "\e908";
    position: relative;
    top: 1px;
    margin-right: 0.5rem;
    position: absolute;
    left: -0.25rem;
    top: 0.33rem;
    font-weight: 900;
}

.paragraph--type-highlight ul li li:before {
    content: "\25CB";
    left: 0;
  }

.paragraph--type-highlight.red {
    background-color: var(--highlightRed);
    color: var(--white);
}

.paragraph--type-highlight.red h2,
.paragraph--type-highlight.red h3,
.paragraph--type-highlight.red h4,
.paragraph--type-highlight.red a {
    color: var(--white);
}

.paragraph--type-highlight .align-right {
    float: right;
    margin: 0 0 1rem 1rem;
}

.paragraph--type-highlight .align-left {
    float: left;
    margin: 0 0 1rem 1rem;
}

/**************/
 /* Downloads */
/**************/
.paragraph--type-downloads {
    margin-bottom: 2rem;
}

.paragraph--type-downloads .list{
    display: flex;
    flex-wrap: wrap;
    gap: 2rem;
    overflow: visible;
}

.paragraph--type-downloads .list > li {
    width: 100%;
    margin: 0;
}

.file .media--type-document,
.file .media--type-link {
    background: var(--background);
    padding: 1rem;
    border-radius: 1rem;
    box-shadow: 0 4px 4px rgba(0, 0, 0, 0.15);
}

.file .media--type-document a,
.file .media--type-link a {
    word-break: normal;
}

.file .media--type-document:hover,
.file .media--type-document:focus-within,
.file .media--type-link:hover,
.file .media--type-link:focus-within {
    background-color: var(--backgroundAlt);
    cursor: pointer;
}

@media screen and (min-width: 50em) {    
    .paragraph--type-downloads .list > li {
        width: 100%;
        max-width: calc(50% - 1rem);
        margin: 0;
    }

    .file .media--type-document,
    .file .media--type-link {
        display: flex;
        gap: 2rem;
    }
}

/* Media Gallery */
.paragraph--type-gallery {
    margin-bottom: 2rem;
    padding-right: 0rem;
    padding-bottom: 2rem;
    background-color: var(--backgroundAlt);
}

.paragraph--type-gallery .para-section {
    padding: 2rem;
}

.paragraph--type-gallery .media {
    text-align: center;
    margin: 0 auto;
}

.paragraph--type-gallery .media--type-image {
    display: flex;
    width: 80%;
    height: 100%;
    justify-content: center;
    align-items: center;
}

.paragraph--type-gallery .splide__track {
    padding-bottom: 1rem;
}

.paragraph--type-gallery .is-mounted .splide__slide {
    background-color: white;
    padding: 2rem;
    border-radius: 2rem;
    box-shadow: 0 4px 4px rgba(0, 0, 0, 0.15);
}

.paragraph--type-gallery .splide__arrow svg {
    fill: white;
}

.paragraph--type-gallery .splide__pagination {
    bottom: 2rem;
}

.paragraph--type-gallery .splide__pagination__page {
    background-color: var(--primaryLight);
}

.paragraph--type-gallery .splide__pagination__page.is-active {
    background-color: var(--primaryDark);
}

/* Call To action */
.paragraph--type-cta {
    color: var(--primary);
    position: relative;
    margin-left: 1rem !important;
    margin-right: 1rem !important;
    margin-bottom: 2rem;

    .para-section {
        padding: 0;
        max-width: inherit;
    }

    &.blue,
    &.grey,
    &.white {
        padding: 1em;
        border-radius: 1em;
        margin-top: 1rem;
        margin-bottom: 1rem;
        .cta {
            background-color: white;
        }
    }

    &.grey {
        background: rgba(0,0,0,0.1)
    }

    &.white {
        background-color: white;
        .cta {
            background-color: var(--background);
        }
    }
    
    .cta {
        padding: 1rem;
        border-radius: 1em;
        box-shadow: 0 4px 4px rgba(0,0,0,0.15);

        img {
            width: auto;
            max-width: 100%;
            object-fit: contain;
            margin-bottom: 1.5rem;
        }

        .text {
            position: relative;
            z-index: 1;
            padding-right: 0;

            h2 {
                margin-bottom: 1rem;
                font-size:  1.25rem;
                color: var(--primaryDark);
            }

            p {
                max-width: 80ch;
                max-width: min(100%, 80ch);

                &:last-child {
                    margin-bottom: 0;
                }
            }

            ul {
                padding-left: 0rem;
                list-style: none;

                li {
                    list-style: none;
                    margin-bottom: 8px;
                    position: relative;
                    padding-left: 1rem;
                    line-height: 1.5;

                    &:before {
                        font-family: 'icomoon' !important;
                        font-style: normal;
                        font-weight: normal;
                        font-variant: normal;
                        text-transform: none;
                        line-height: 1;
                        -webkit-font-smoothing: antialiased;
                        -moz-osx-font-smoothing: grayscale;
                        content: "\e908";
                        position: relative;
                        top: 1px;
                        margin-right: 0.5rem;
                        color: var(--primary);
                        position: absolute;
                        left: -0.25rem;
                        top: 0.33rem;
                        font-weight: 900;
                    }
                }
            }


        }
    }
}

@media screen and (min-width: 60rem) {
    .paragraph--type-cta {
        margin-left: 2rem !important;
        margin-right: 2rem!important;

        &.blue,
        &.grey,
        &.white {
            padding: 1em;
            margin-top: 1rem;
            margin-bottom: 1rem;
        }
        
        .cta {
            display: flex;
            justify-content: space-between;
            padding: 2rem;

            img {
                order: 2;
                max-width: 25rem;
                max-width: min(100%, 25rem);
                margin-bottom: 0;
            }

            .text {
                padding-right: 3rem;
                h2 {
                    font-size: 2rem;
                }
            }
        }
    }
}

@media screen and (min-width: 85rem) {
   .paragraph--type-cta {
        max-width: 81rem;
        margin-left: auto !important;
        margin-right: auto !important;
   } 
}

/* Accordions */
.paragraph--type-accordion {
    padding-bottom: 2rem;
}

.paragraph--type-accordion .accordion-intro {
    max-width: 56rem;
    max-width: min(100%, 56rem);
}

.paragraph--type-accordion .accordion {
    max-width: 50rem;
    max-width: min(100%, 50rem);
}

.paragraph--type-accordion > h2 {
    color: var(--highlightTeal);
    width: 100%;
    line-height: 1.2;
    font-size: 1.5rem;
}

.paragraph--type-accordion details {
    padding: 0;
    text-transform: inherit;
    margin: 0 0 1rem;
    border: 0;
}

.paragraph--type-accordion .accordion details summary::-webkit-details-marker {
    display: none;
}

.paragraph--type-accordion details summary:after {
    font-family: 'icomoon';
    content: "\e903";
    color: var(--primary);
    font-size: 2.5rem;
    top: -1rem;
    right: -1rem;
    display: flex;
    height: 1.5rem;
    align-items: center;
    line-height: 1;
}

.paragraph--type-accordion details summary {
    font-family: var(--fontBold);
    position: relative;
    font-size: 1.25rem;
    color: var(--primary);
    padding: 0.5rem 0;
    list-style: none;
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-bottom: 2px solid var(--primary);
    font-weight: 600;
}

.paragraph--type-accordion details summary:hover,
.paragraph--type-accordion details summary:focus-visible {
    color: var(--highlightTeal);
}

.paragraph--type-accordion details[open] summary {
    margin: -1rem -1rem 1rem;
    border-color: var(--primaryDark);
    font-weight: 600;
    background-color: var(--highlightTeal);
    color: white;
    padding-left: 0.5rem;
    padding-right: 0.25rem;
}

.paragraph--type-accordion details[open] {
    background-color: var(--white);
    border-bottom: 2px solid var(--primary);
    padding: 1rem;
}

.paragraph--type-accordion details[open] summary:after {
    font-family: 'icomoon';
    content: "\e906";
    color: white;
}

.paragraph--type-accordion details h2 {
    font-size: 1.125rem;
    margin-bottom: 0.75rem;
}

.paragraph--type-accordion details h3 {
    font-size: 1rem;
    margin-bottom: 0.75rem;
}

.paragraph--type-accordion details .media--type-remote-video {
    margin-bottom: 1rem;
}


    .paragraph--type-accordion ul,
    .paragraph--type-accordion ol {
        padding-left: 0;
    }

    .paragraph--type-accordion ul li,
    .paragraph--type-accordion ol li {
        list-style-type: none;
        margin-bottom: 0.5rem;
        position: relative;
        padding-left: 1rem;
        line-height: 1.5;
    }

    .paragraph--type-accordion ol li {
        list-style-type: decimal;
        margin-left: 1.5rem;
        padding-left: 0.25rem;
    }

    .paragraph--type-accordion ol li::marker {
        font-weight: bold;
        color: var(--primary);
    }
    
    .paragraph--type-accordion ul li:before {
        font-family: 'icomoon' !important;
        font-style: normal;
        font-weight: normal;
        font-variant: normal;
        text-transform: none;
        line-height: 1;
        -webkit-font-smoothing: antialiased;
        -moz-osx-font-smoothing: grayscale;
        content: "\e908";
        position: relative;
        top: 1px;
        margin-right: 0.5rem;
        position: absolute;
        left: -0.25rem;
        top: 0.33rem;
        font-weight: 900;
        color: var(--primary);
    }

    .paragraph--type-accordion ul li li:before {
        content: "\25CB";
        left: 0;
      }

    .paragraph--type-accordion {
        table {
            table-layout: fixed;
            width: 100%;
            max-width: 100%;
        }
    }
.paragraph--type-accordion-item .para-section {
    padding: 0;
}

.paragraph--type-accordion-item .para-section .accordion-intro > h2 {
    padding-top: 2rem;
}

.paragraph--type-accordion.green,
.paragraph--type-accordion.red,
.paragraph--type-accordion.orange,
.paragraph--type-accordion.beige,
.paragraph--type-accordion.navy {
    padding-top: 3rem;
}

.node--type-page .paragraph--type-accordion details[open] {
    background-color: white;
}


/* Subnav */
.paragraph--type-automated-menu {
    margin: 2rem 0;

    .list-flex {
        gap: 2rem;

        > li {
            width: 100%;

            .node {
                background-color: var(--white);
                border-radius: 2rem;
                padding: 2rem;
                cursor: pointer;
                height: 100%;
                box-shadow: 0 4px 4px rgba(0,0,0,0.15);

                h2 {
                    font-size: 1.5em;
                    color: var(--primary);
                    
                    a {
                        padding-right: 1.75rem;
                    }

                    &:after {
                        content: "";
                        display: inline-block;
                        width: 1.5em;
                        height: 1.5em;
                        margin-left: -1.5em;
                        vertical-align: -0.35em;
                        background-color: currentColor;
                        mask: url(../../images/icons/arrow.svg) no-repeat center / contain;
                        opacity: 0.5;
                        transition: all 0.12s ease-in;
                    }
                }

                &:hover,
                &:focus-within {
                    background-color: var(--primary);
                    color: var(--white);

                    h2,
                    h3,
                    li,
                    a {
                        color: white
                    }

                    h2:after {
                        transform: translateX(0.25em);
                        transition: transform 0.1s ease-out;
                    }
                }

                p:last-child {
                    margin-bottom: 0;
                }
            }
        }
    }
}

@media screen and (min-width: 60em) {
    .paragraph--type-automated-menu .list-flex > li {
        max-width: calc(50% - 1rem);
    }
}

/* Listing */
.paragraph--type-listing > h2 {
    padding-top: 1rem;
    border-top: 1px solid var(--primary);
}

.paragraph--type-listing.no-border > h2 {
    border: 0;
}

.paragraph--type-listing.remove-header > h2 {
    display: none;
}

.paragraph--type-listing {

    .view .list-flex {
        justify-content: space-evenly;
        overflow: visible;
    }

    .more-link a {
        border: 0;
        border-radius: 2rem;
        background-color: rgba(0,0,0,0.2);
        color: var(--primaryDark);
        padding-right: 0.667em;

        &:after {
              content: "\e90d";
        }
        
        &:hover,
        &:focus-visible {
            background-color: #009eb3;
            color: white;
        }
    }

    &.blue {
        .para-section {
            > h2 {
                color: white;
            }
        }

        .more-link a {
          color: white;
          
          &:hover,
          &:focus-visible {
            background-color: #009eb3;
            color: white;
          }
        }
    }
}

/* TOC */
.paragraph--type-table-of-contents {
    margin: 2rem 0;
}


.paragraph--type-block.right {
    background: white;
    padding: 2rem 0;
    border-top-left-radius: 2rem;
    border-bottom-left-radius: 2rem;
    margin: 2rem 0;
    position: relative;
}
@media screen and (min-width: 60em) {
    .paragraph--type-block.right {
        padding: 2rem 0 2rem 4rem;
    }

    .paragraph--type-block.left {
        padding: 2rem 0 2rem 4rem;
    }
}

.paragraph--type-block.right:after {
    content: "";
    background: white;
    height: 100%;
    top: 0;
    bottom: 0;
    left: 0;
    right: -100vw;
    position: absolute;
    display: block;
    border-top-left-radius: 2rem;
    border-bottom-left-radius: 2rem;
    box-shadow: 0 4px 4px rgba(0,0,0,0.15);
}

.paragraph--type-block.left {
    background: white;
    padding: 2rem 0;
    border-top-right-radius: 2rem;
    border-bottom-right-radius: 2rem;
    margin: 2rem 0;
    position: relative;
}

.paragraph--type-block.left:after {
    content: "";
    background: white;
    height: 100%;
    top: 0;
    bottom: 0;
    right: 0;
    left: -100vw;
    position: absolute;
    display: block;
    box-shadow: 0 4px 4px rgba(0,0,0,0.15);
    border-top-right-radius: 2rem;
    border-bottom-right-radius: 2rem;
}

/* Block */
.paragraph--type-block {
    padding: 2rem 0;
}

/* Grid */
.paragraph--type-grid {
    padding: 2rem 0;

    .field--name-field-content {
        max-width: 80ch;
        max-width: min(100%, 80ch);

        ul {
            padding-left: 0;
        }

        ul + p {
            margin-top: 1rem;
        }

        p:last-child {
            margin-bottom: 0;
        }
    }

    &.blue {
        margin-bottom: 2rem;
        border-radius: 1rem;
        padding-bottom: 2rem;
        .para-section {
            max-width: 100%;
            > h2,
            > .field {
                color: white !important;
            }
        }
    }

     &.grey {
        margin-bottom: 2rem;
     }
}

.paragraph--type-grid .list-flex {
    gap: 2rem;
    overflow: visible;
    list-style: none;
    margin: 2rem 0 0;
    padding: 0;
}

.paragraph--type-grid .list-flex li.entry {
    margin-bottom: 0;
}

.paragraph--type-grid.blue,
.paragraph--type-grid.grey {
    .entry {
        background-color: #fff !important;
    }
}

.paragraph--type-grid.blue .entry > h3 {
    color: var(--text) !important;
}

@media screen and (min-width: 40em) {
    .paragraph--type-grid .entry img {
        max-width: 100px;
        margin-right: -1rem;
    }
    .paragraph--type-grid.one-column .entry {
        width: 45rem;
    }

    .paragraph--type-grid.two-column .entry {
        width: calc(50% - 1rem);
    } 

    .paragraph--type-grid.three-column .entry {
        width: calc(33.33% - 1.667rem);
    }

    .paragraph--type-grid.four-column .entry {
        width: calc(25% - 2rem);
    }
} 

/* Grid Item */
.paragraph--type-grid .grid .entry {
    border: 2px solid #eee;
    border-radius: 1em;
    padding: 1.5em 2em 2em;
    box-shadow: 0 4px 4px rgba(0, 0, 0, 0.15);
    
    h3 {
        font-size: 1.333rem;
        margin-bottom: 0.5em;
        color: var(--primary);
    }

    img {
        border-radius: 50%;
        border: 4px solid var(--highlightTeal);
        margin: -1rem -1.5rem 1rem 0rem;
        max-width: 100px;
    }

    ul {
        padding-left: 0rem;
        list-style: none;

        li {
            list-style: none;
            margin-bottom: 8px;
            position: relative;
            padding-left: 1rem;
            line-height: 1.5;

            &:before {
                font-family: 'icomoon' !important;
                font-style: normal;
                font-weight: normal;
                font-variant: normal;
                text-transform: none;
                line-height: 1;
                -webkit-font-smoothing: antialiased;
                -moz-osx-font-smoothing: grayscale;
                content: "\e908";
                position: relative;
                top: 1px;
                margin-right: 0.5rem;
                color: var(--primary);
                position: absolute;
                left: -0.25rem;
                top: 0.33rem;
                font-weight: 900;
            }
        }
    }

    ul + p {
        margin-top: 1rem
    }

    .grid-link a {
        margin: 0;
        padding: 0.33rem 0.75rem;
        border: 1px solid;
        border-radius: 1.5rem;
        margin: 0 0.25rem 0 0;
        text-decoration: none;
        display: inline-block;
        word-break: normal;
    }
}

@media screen and (min-width: 60em) {
    .paragraph--type-grid .grid .entry img {
        max-width: 120px;
        margin-right: -1.25rem;
        margin-left: 1rem;
    }
}

@media screen and (min-width: 85em) {
    .paragraph--type-grid {
        max-width: 85rem !important;
        margin-left: auto;
        margin-right: auto;

        &.blue {
            max-width: 81rem !important;
        }
    }
}

/* Embed */
.paragraph--type-embed {
    margin-bottom: 2rem;
    position: relative;
    padding-top: 65%;
}

.paragraph--type-embed iframe {
    max-width: 100%;
    position: absolute;
    top: 0;
    height: 100%;
}

/* Paragraph sections */
@media screen and (min-width: 60em) {
    .para-section {
        max-width: 85rem;
        max-width: min(100%, 85rem);
        padding: 0 2rem;
        margin: 0 auto;
        width: 100%;
    }

    /* Basic Paragraph on wider screens */
    .paragraph--type-basic .basic-content {
        max-width: 56rem;
        max-width: min(100%, 56rem);
        width: 100%;
    }

    .paragraph--type-basic .primary ul li {
        padding-left: 2rem;
        max-width: 48rem;
    }
    
    .paragraph--type-basic .primary ul li:before {
        left: 0.25rem;
    }
}

/* Video */
.paragraph--type-video {
    padding: 2rem 0;
}

.paragraph--type-video .media--type-remote-video {
    max-width: 60rem;
    max-width: min(100%, 60rem);
    margin: 2rem 0;
    padding: 0;
    background: transparent;
    box-shadow: 0 4px 4px rgba(0, 0, 0, 0.15);
}

.paragraph--type-video .field--name-field-content {
    max-width: 50rem;
    max-width: min(100%, 50rem);
    margin: 0;
}

/* May also like */
.paragraph--type-may-also-like .para-section > h2 {
    padding-top: 2rem;
}

.paragraph--type-may-also-like .list-flex {
    gap: 2rem;
}

.paragraph--type-may-also-like .list-flex > li {
    width: 25.5rem;
}

.paragraph--type-may-also-like .list-flex > li .node {
    background: var(--backgroundAlt);
    border-radius: 1rem;
    box-shadow: 0 4px 4px rgba(0, 0, 0, 0.15);
    padding: 1.5rem 2rem;
    height: 100%;
}

.paragraph--type-may-also-like .list-flex > li .node h2 {
    font-size: 1.25rem;
    margin-bottom: 0.5rem;
}

.paragraph--type-may-also-like .list-flex > li .node p:last-child {
    margin-bottom: 0;
}

/* Comkit May Also Like Chnages */
.paragraph--type-may-also-like .list-flex:has(div.node.node--view-mode-teaser-with-image) {
    margin-bottom: 2rem;
}

.paragraph--type-may-also-like .list-flex > li:has(div.node.node--view-mode-teaser-with-image) {
    width: 100%;
    max-width: calc(50% - 1rem);
    margin-bottom: 0;
}

.paragraph--type-may-also-like .list-flex > li .node.node--view-mode-teaser-with-image {
    cursor: pointer;
}

.paragraph--type-may-also-like .list-flex > li .node.node--view-mode-teaser-with-image img {
    max-width: 100%;
    height: auto;
    border-radius: 1rem;
    float: right;
    margin: 0 0 1rem 1rem;
}

/* Grid in Primary Sections */
.primary {
    .paragraph--type-grid {
        background-color: transparent !important;
        padding-top: 1rem;
        
        &:before {
            background-color: transparent !important;
        }

        .list-flex {
            margin-top: 1em;
        }

        .para-section > h2 {
            color: var(--primaryDark);
        }

        &.blue {
            color: var(--text);

            .entry {
                padding: 1.5em;
            }

            h3 {
                color: var(--primaryDark);
            }
        }

        &.grey {
            color: var(--text);

            .entry {
                padding: 1.5em;
                background-color: var(--background);
            }

            h3 {
                color: var(--primaryDark);
            }
        }

        &.white {
            color: var(--text);

            .entry {
                padding: 1.5em;
                border: 1px solid var(--borderGrey);
            }

            h3 {
                color: var(--primaryDark);
            }
        }
    }
}

/* Fucntional Banner */
.paragraph--type-functional-banner {
    display: block;
    padding: 2em 0;

    .text {
        .form--inline > .form-item {
            > label {
                font-size: 1em;
                font-weight: 500;
            }

            > input {
                padding: 0 1em;
                border-radius: 2em;
            }
        }

        .form--inline > .form-actions {
            width: max-content;
            float: none;

            input {
                padding: 0.5em 2em;
            }
        }
    } 


}
@media screen and (min-width: 60em) {
    .paragraph--type-functional-banner {
         background: linear-gradient(to right, var(--background), var(--backgroundAlt));
        
        .para-section {
            display: flex;
            flex-wrap: wrap;
       

            .text {
                order: -1;
                width: 40%;
                padding-top: 4em;
            }

            .field--name-field-banner-media {
                width: 60%;
                margin: 2em 0 0;
                padding-left: 2em;
            }
        }
    }
}

/* View Listing */
.paragraph .view .list-flex .entry {
    background-color: white;
    padding: 2em 2em 2em;
    box-shadow: 1px 6px 8px 2px rgba(0, 0, 0, 0.15);
    border: 1px solid #eee;
    border-radius: 1.5em;  

    > .node > img {
        margin: -2em -2em 1em;
        width: calc(100% + 4em);
        max-width: fit-content;
        border-top-left-radius: 1.5em;
        border-top-right-radius: 1.5em;
    }
}

/* Video */
.video-embed-field-responsive-video iframe {
    position: relative;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 100%;
    margin: 0;
    aspect-ratio: 16 / 9;
}

/* Link */
.paragraph--type-link .field > a {
    margin-bottom: 1em;
    border: 1px solid #cecece;
    padding: 0.5em 1em;
    border-radius: 2em;
    text-decoration: none;
    display: flex;
    align-items: center;

    &:before {
      content: "\2197";
      margin-right: 0.5em;
    }

    &:hover,
    &:focus-visible {
      background-color: #2A5380;
      border-color: #2A5380;
      color: white;
    }
}

/* Downloads */
.paragraph--type-downloads {
  .media--type-file .field-content a {
    margin-bottom: 1em;
    border: 1px solid #cecece;
    padding: 0.5em 1em;
    border-radius: 2em;
    text-decoration: none;
    display: flex;
    align-items: center;

    &:before {
      font-family: 'icomoon';
      content: "\e902";
      margin-right: 0.5em;
    }

    &:hover,
    &:focus-visible {
      background-color: #2A5380;
      border-color: #2A5380;
      color: white;
    }
  }

  .node {
    margin-bottom: 1em;
    border: 1px solid #cecece;
    padding: 1em 1em 1em 2em;
    border-radius: 2em;
    overflow: hidden;
    
    img {
      padding: 1em;
    }
  }
}
@media screen and (min-width: 60em) {
    .paragraph--type-downloads .node img {
        float: right;
    }
}

/* Graphical menu */
.paragraph--type-graphical-menu {
    .entry .paragraph--type-menu-link {
        .para-section {
            padding: 0;
            display: flex;
            height: 100%;
        }

        h3 a {
            display: flex;
            padding: 1em;
            height: 100%;
            border-radius: 1rem;

            &:hover,
            &:focus-visible {
                border-radius: 1rem;
                background: var(--primaryDark);
                color: var(--white);
            }
        }
    }
}