@media screen and (width >= 400px) {
    header .rs [style^="--icn-"]::before {padding: min(0.8125rem, 3.8vw);}
}
@media screen and (width >= 700px) {
    .sc13 .wrapper-cardsD .pagination {
        position: absolute;
        left: 0;
        top: 50%;
        height: 0;
        width: 100%;
        display: grid;
        margin-top: 0;
        align-content: center;
        justify-content: space-evenly;
        grid-auto-flow: column;
    }
}
@media screen and (width >= 1000px) {
    .cardA picture {margin-block: calc(clamp(min(1em,5vw),2.5vw,3em) * -2);}
    .sc1 .grid {
        grid-template-columns: repeat(40, 1fr);
        grid-template-rows: 1fr;
    }
    .sc1 .grid .wrapper-video .inner {padding-right: min(10em, 10vw);}
    .sc1 .grid .wrapper-video { 
        margin-inline: -1.3em 0;
        grid-area: 1 / 1 / 2 / 23;
    }
    .sc1 .grid .wrapper-text {
        margin-inline: 0 -1.3em;
        grid-area: 1 / 21 / 2 / 41;
    }
    .sc8 .row .left {box-shadow: none;}
    .sc8 .row .right > div > *,
    .sc8 .row .right picture > * { height: 100%;}
    .sc8 .row .right > div {margin: 0 -6.6vw -2em 0;}
    .sc8 .row .right > div video {min-height: min(560px,40vw);}
    .sc8 .row .right .img-float {
        top: 50%;
        translate: 0 -50%;
        aspect-ratio: 1/1.3;
        width: min(305px,17vw);
        left: calc(min(305px,17vw) / -2);
    }
}
@media screen and (width >= 1200px) {
    .up-down {
        position: relative;
    }
    li:has( > .up-down) {
        display: flex;
        gap: 0 .5em;
        align-items: center;
    }
    li:hover > .up-down {rotate: -180deg;}
    li:has( > .up-down) > a {padding-right: .5em;}

    .grid:has( .cardB) {
        display: grid;
        gap: min(1.5em,3vw) 2%;
        filter: drop-shadow(0 5px 30px var(--cLdeepTealBlueTransparent));
        grid-template-columns: repeat(auto-fill, minmax(max(min(300px,80%), 30%), 1fr));
    }
    .wrapper-cardsB .pagination {display: none;}
    header .right {padding-right: 4em;}
    header .ct-nav { 
        position: relative;
        flex: 1;
        scale: 1;
        opacity: 1;
        inset: initial;
        visibility: visible;
    }
    header .ct-nav nav {
        left: 0;
        padding: 0;
        width: auto;
        height: auto;
        margin-left: 0;
        overflow: initial;
        background-color: transparent
    }
    header .primary {
        column-gap: min(3em,2vw);
        min-height: initial;
        overflow-y: visible;
        flex-direction: initial;
        justify-content: flex-end;
    }
    header .top-header {
        position: relative;
        line-height: 1;
        isolation: isolate;
        padding: min(.5em,1vw) 0 min(.5em,1vw) min(2em,2vw);
    }
    header .top-header .flex {column-gap: min(2em,2vw);}
    header .right > .flex:not(.top-header) {
        align-items: center;
        column-gap: min(2em,2vw);
        padding-block: clamp(.3em,2vw,0.7em);
    }
    header .right > .flex:not(.top-header) li {display: inline-flex;}
    header .right > .flex:not(.top-header) > .flex {column-gap: .5em;}
    header .primary ul {
        position: absolute;
        top: 150%;
        left: 50%;
        opacity: 0;
        display: grid;
        text-align: left;
        overflow: initial;
        padding: 1em 1.5em;
        visibility: hidden;
        transition: all .3s;
        border-radius: .5em;
        width: min(300px,30vw);
        font-size: min(16px,4vw);
        transform: translateX(-50%);
        background-color: var(--cLblueIceLight);
    }
    header .primary > li {align-self: center;}
    header .primary li:hover > ul {
        top: 100%;
        opacity: 1;
        visibility: visible;
    }
    .sc1 .grid {
        grid-template-columns: repeat(40, 1fr);
        grid-template-rows: 1fr;
    }
    .sc1 .grid .wrapper-video { grid-area: 1 / 1 / 2 / 23;}
    .sc1 .grid .wrapper-text {grid-area: 1 / 21 / 2 / 41;}
    .sc6 .row {padding-inline: 0;}
}
@media screen and (width >= 1920px) {
    header .logo {
        height: auto;
        margin-left: -1.5em;
    }
    .sc8 .row .right > div {margin-inline: 0 -13em;}
    /* header + main > *:first-child {padding-top: clamp(min(1.2em,5vw),2.5vw,2.8em);} */
}