/* navbar.css */
.header {
    display: block;
    position: relative;
    /* background-color: var(--background-color); */
    padding-top: 22px;
    padding-bottom: 12px;
    z-index: 100;
    font-size: 16px;
    line-height: 100%;
    font-family: var(--font1);
    overflow-x: clip;
    background-color: #0a1633;
}


.navbar-inner {
    display: flex;
    flex-direction: column;
    justify-content: stretch;
}

.navbar-top {
    display: flex;
    justify-content: space-between;
    align-items: center;
    position: relative;
    padding-bottom: 22px;
}

.socials {
    display: flex;
    align-items: center;
    gap: 22px;
    flex: 2;
    margin-top: 4px;
    --text-color: white;
}

.social {
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 1;
}

.social:hover .social-inner {
    transform: translateY(-2px);
}

.social-inner {
    width: 22px;
    min-width: 22px;
    height: auto;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all .2s ease;
    transform: translateY(0px);
    will-change: transform;
}

.social-inner-smaller {
    width: 21px;
    min-width: 21px;
}

#instagram,
#linkedin,
#pinterest {
    display: none;
}

.navbar-account-links {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 26px;
    flex: 2;
    --text-color: white;
}

.account-button-wrapper {
    white-space: nowrap;
    display: flex;
    align-items: center;
    gap: 6px;
}

.account-icon-wrapper {
    margin-top: 1px;
    width: 19px;
    min-width: 19px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.account-buttons-separator {
    width: 1px;
    height: 21px;
    /* background-color: var(--text-color); */
}

.subscribe-button {
    padding: 4px 26px;
    font-family: var(--font1);
    font-size: 20px;
    --text-color: #4095ec !important;
}

.logo-wrapper {
    display: flex;
    align-items: center;
    justify-content: center;
    flex: 1;
    margin-bottom: 4px;
}

.logo {
    display: flex;
    align-items: center;
    justify-content: center;
}

.logo-image {
    height: calc(37px * var(--logo-scale));
    width: auto;
}

.navbar-logo-text {
    font-family: var(--font4);
    line-height: 80%;
    letter-spacing: -0.02em;
    font-size: 46px;
}

.black-text {
    --text-color: black !important;
}

.navbar-links-outer {
    padding-top: 13px;
    padding-bottom: 13px;
    /* border-top: 1px solid var(--text-color);
    border-bottom: 1px solid var(--text-color); */
    min-height: 50px;
}

.navbar-links-inner {
    display: flex;
    justify-content: center;
}

.nav {
    display: none;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    column-gap: 30px;
    row-gap: 12px;
}

.nav li {
    list-style-type: none;
    display: flex;
    position: relative;
}

.nav-link, .links-label {
    color: white !important;
    line-height: 100%;
    position: relative;
    white-space: nowrap;

}

.secondary-links .nav-link {
    width: 100%;
    padding: 14px 16px;
    border-bottom: 1px solid var(--text-color);
    transition: color 0.2s ease, background-color 0.2s ease;
}

.secondary-links-inner:last-child {
    border-bottom: none;
}

.links-label {
    display: flex;
    align-items: center;
    cursor: pointer;
}

.nav li:hover .secondary-links, .nav .secondary-links:focus-within {
    opacity: 1;
    pointer-events: all;
}

.dropdown-arrow-svg {
    width: 8px;
    min-width: 8px;
    height: 5px;
    min-height: 5px;
    margin-left: 7px;
    margin-top: 1px;
}

.secondary-links {
    position: absolute;
    bottom: 0px;
    left: -17px;
    transform: translateY(100%);  
    opacity: 0;
    pointer-events: none;
    transition-duration: 0.15s;
    transition-property: opacity;
    min-width: 168px;
    z-index: 2;
}

.secondary-links-inner {
    margin-top: 13px;
    display: flex;
    flex-direction: column;
    /* background-color: var(--background-color); */
    border: 1px solid var(--text-color);
}

.secondary-links-inner .nav-link:hover {
    /* color: var(--background-color); */
    background-color: var(--text-color);
}

.menu-button-wrapper {
    display: none;
}

.subscribe-button-mobile-wrapper {
    display: none;
}

.desktop-navbar {
    display: block !important;
    opacity: 1 !important;
    height: auto !important;
}

/* Styles for extra large desktop */
@media (min-width: 1920px) { 
    .nav {
        column-gap: calc(3vw * var(--scale));
    }
}

/* Styles for large desktop */
@media (min-width: 1439px) {  
    .header {
        padding-top: calc(1.53vw * var(--scale));
        padding-bottom: calc(0.83vw * var(--scale));
        font-size: calc(1.39vw * var(--scale));
        /* color: white !important; */
    }
    
    .navbar-top {
        padding-bottom: calc(1.53vw * var(--scale));
    }
    
    .socials {
        gap: calc(1.53vw * var(--scale));
        margin-top: calc(0.28vw * var(--scale));
    }
    
    .social-inner {
        width: calc(1.53vw * var(--scale));
        min-width: calc(1.53vw * var(--scale));
        color: white;
    }
    
    .social-inner-smaller {
        width: calc(1.46vw * var(--scale));
        min-width: calc(1.46vw * var(--scale));
        color: white;
    }
       
    .navbar-account-links {
        gap: calc(1.81vw * var(--scale));
    }
    
    .account-button-wrapper {
        gap: calc(0.42vw * var(--scale));
    }
    
    .account-icon-wrapper {
        margin-top: 1px;
        width: calc(1.32vw * var(--scale));
        min-width: calc(1.32vw * var(--scale));
    }
    
    .account-buttons-separator {
        height: calc(1.46vw * var(--scale));
    }
    
    .subscribe-button {
        padding: calc(0.28vw * var(--scale)) calc(1.81vw * var(--scale));
        font-size: calc(1.39vw * var(--scale));
    }
    
    .logo-wrapper {
        margin-bottom: calc(0.28vw * var(--scale));
    }
    
    .logo-image {
        height: calc(2.57vw * var(--scale) * var(--logo-scale));
    }
    
    .navbar-logo-text {
        font-size: calc(3.19vw * var(--scale));
    }
    
    .navbar-links-outer {
        padding-top: calc(0.9vw * var(--scale));
        padding-bottom: calc(0.9vw * var(--scale));
        min-height: calc(3.47vw * var(--scale));
    }
    
    .nav {
        column-gap: calc(2.08vw * var(--scale));
        row-gap: calc(0.83vw * var(--scale));
    }
    
    .secondary-links .nav-link {
        padding: calc(0.97vw * var(--scale)) calc(1.11vw * var(--scale));

    }
    
    .dropdown-arrow-svg {
        width: calc(0.56vw * var(--scale));
        min-width: calc(0.56vw * var(--scale));
        height: calc(0.35vw * var(--scale));
        min-height: calc(0.35vw * var(--scale));
        margin-left: calc(0.49vw * var(--scale));
        margin-top: 1px;
    }
    
    .secondary-links {
        left: calc(-1.18vw * var(--scale));
        min-width: calc(11.8vw * var(--scale));
    }
    
    .secondary-links-inner {
        margin-top: calc(1.08vw * var(--scale));
    }
}



/* Styles for tablet */
@media (max-width: 991px) { 
    .account-button-text,
    .account-buttons-separator,
    .subscribe-button,
    .socials {
        display: none;
    }

    .header {
        position: fixed;
        top: 0;
        width: 100%;
        z-index: 999;
        padding-top: 22px;
        padding-bottom: 12px;
    }

    /* .header {
        padding-top: 22px;
        padding-bottom: 12px;
    } */

    .navbar-top {
        padding-bottom: 10px;
    }

    .navbar-account-links {
        gap: 16px;
        flex: 1;
    }
    
    .account-icon-wrapper {
        margin-top: 1px;
        width: 28px;
        min-width: 28px;
    }

    .logo-wrapper {
        flex: 2;
        margin-bottom: 0px;
    }

    .navbar-logo-text {
        font-size: 38px;
    }

    .menu-button-wrapper {
        flex: 1;
        display: block;
        --text-color: white !important;

    }

    .menu-button {
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        row-gap: 7px;
        width: 30px;
        height: 30px;
        touch-action: manipulation;
        -webkit-tap-highlight-color: transparent;
    }

    .menu-line {
        width: 30px;
        height: 2px;
        background-color: var(--text-color);
        pointer-events: none;
        transition: transform 0.3s ease;
    }

    .menu-button.is-active .first-line {
        position: absolute;
        transform: rotateZ(-45deg);
    }

    .menu-button.is-active .second-line {
        position: absolute;
        transform: rotateZ(45deg);
    }

    .menu-button.is-active .mobile-line {
        opacity: 0;
    }

    .navbar-links-outer {
        text-align: center;
        position: absolute;
        background-color: var(--background-color);
        height: calc(100dvh);
        transform: translateY(100%);
        left: 0;
        right: 0;
        bottom: 0px;
        display: none;
        opacity: 0;
        flex-direction: column;
        justify-content: center;
        margin-left: 0;
        border-top: none;
        border-bottom: none;
        padding-top: 0px;
        padding-bottom: 0px;
    }

    .navbar-links-inner {
        padding-top: 15vh;
        padding-bottom: 16vh;
        flex-direction: column;
        align-items: center;
        row-gap: 23px;
        overflow-y: auto;
        justify-content: flex-start;
    }

    .nav {
        flex-direction: column;
        row-gap: 23px;
        min-width: 280px;
    }

    .nav-link, .links-label {
        line-height: 120%;
        font-size: 24px;
        width: fit-content;
    }

    .dropdown-arrow-svg {
        width: 10px;
        min-width: 10px;
        height: 6px;
        position: absolute;
        right: -8px;
        transform: translateX(100%);
        margin-top: 2px;
    }

    .secondary-links {
        min-width: 100%;
        position: static;
        transform: unset;
        opacity: 1;
        pointer-events: none;
        transition-duration: 0.15s;
        transition-property: height;
        height: 0px;
        overflow: hidden;
    }

    .secondary-links-inner {
        align-items: center;
        padding-top: 23px;
        margin-top: 25px;
        padding-bottom: 23px;
        border: none;
        row-gap: 14px;
        border-top: 1px solid var(--text-color);
        border-bottom: 1px solid var(--text-color) !important;
        overflow: hidden;
    }

    .nav li {
        flex-direction: column;
        align-items: center;
        width: 100%;
    }

    .secondary-links .nav-link {
        font-size: 20px;
        font-weight: 400;
        line-height: 150%;
        /* color: var(--text-color); */
        padding: 0px;
        border-bottom: none;
        width: fit-content;
    }

    .secondary-links-inner .nav-link:hover {
        color: unset;
        background-color: unset;
    }

    .subscribe-button-mobile-wrapper {
        display: flex;
        min-width: 280px;
        padding-top: 30px;
        border-top: 1px solid var(--text-color);
    }
    
    .subscribe-button-mobile {
        display: block;
        font-size: 22px;
        padding: 5px 30px;
        margin-left: auto;
        margin-right: auto;
    }

    .logo-image {
        height: calc(30px * var(--logo-scale));
    }

    .social:hover .social-inner {
        transform: translateY(-2px);
    }
}

/* Styles for mobile */
@media (max-width: 479px) { 
    /* .header {
        padding-top: 18px;
    } */
    .header {
        position: fixed;
        top: 0;
        width: 100%;
        z-index: 999;
        padding-top: 18px;
        padding-bottom: 12px;
    }

    .navbar-top {
        padding-bottom: 6px;
    }

    .navbar-account-links {
        gap: 14px;
    }
    
    .account-icon-wrapper {
        width: 26px;
        min-width: 26px;
    }


    .navbar-logo-text {
        font-size: 32px;
    }

    .menu-button {
        height: 28px;
        width: 28px;
    }

    .menu-line {
        width: 28px;
        height: 2px;
    }

    .nav {
        row-gap: 18px;
        min-width: 58vw;
    }

    .nav-link, .links-label {
        font-size: 22px;
    }

    .secondary-links-inner {
        padding-top: 18px;
        margin-top: 22px;
        padding-bottom: 18px;
        row-gap: 8px;
    }

    .subscribe-button-mobile-wrapper {
        min-width: 58vw;
        padding-top: 32px;
    }
    
    .subscribe-button-mobile {
        font-size: 21px;
    }

    .logo-image {
        height: calc(26px * var(--logo-scale));
    }
}
/* announcement-bar.css */
.custom-announcement-bar {
    width: 100%;
    display: none;
    align-items: stretch;
    margin-top: 14px;
    margin-bottom: 26px;
}

.announcement-heading {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 8px 17px;
    background-color: var(--text-color);
    color: var(--background-color);
    font-family: var(--font1);
    line-height: 160%;
    font-size: 16px;
}

.announcement-content {
    width: 100%;
    display: flex;
    align-items: center;
    border-top: 1px solid var(--text-color);
    border-bottom: 1px solid var(--text-color);
    overflow: hidden;
    position: relative;
}

.announcement-inner {
    display: flex;
    align-items: center;
}

.announcement-text {
    white-space: nowrap;
    font-size: 16px;
    font-family: var(--font1);
    line-height: 160%;
    padding: 8px 0px;
    display: flex;
    align-items: center;
    -webkit-text-size-adjust: 100%;
}

.announcement-text a {
    text-decoration: underline;
}

.announcement-close-wrapper {
    display: flex;
    align-items: center;
    background-color: var(--background-color);
    height: 100%;
    position: absolute;
    right: 0;
}

.announcement-close-button {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 13px;
    min-width: 13px;
    height: 13px;
    margin-left: 17px;
}

.custom-announcement-bar[data-announcement-bar-type="Moving One News"] .announcement-text {
    padding-left: 17px;
    padding-right: 17px;
}

.custom-announcement-bar[data-announcement-bar-type="Static"] .announcement-text {
    padding-left: 17px;
    padding-right: 34px;
    white-space: unset;
}

.custom-announcement-bar[data-announcement-bar-type="Static"] .announcement-text:nth-child(2) {
    display: none;
}

.slide-animation {
    animation: slideAnimation 40s linear infinite;
}

.announcement-circle {
    display: inline-flex;
    border-radius: 100%;
    min-width: 5px;
    width: 5px;
    height: 5px;
    background-color: var(--text-color);
    margin-left: 20px;
    margin-right: 20px;
}

@keyframes slideAnimation {
    from {
        transform: translateX(0%);
    }
    to {
        transform: translateX(-100%);
    }
}

/* Styles for large desktop */
@media (min-width: 1439px) {  
    .custom-announcement-bar {
        margin-top: calc(0.97vw * var(--scale));
        margin-bottom: calc(1.81vw * var(--scale));
    }
    
    .announcement-heading {
        padding: calc(0.56vw * var(--scale)) calc(1.18vw * var(--scale));
        font-size: calc(1.11vw * var(--scale));
    }

    .announcement-text {
        font-size: calc(1.11vw * var(--scale));
        padding: calc(0.56vw * var(--scale)) 0px;
    }
    
    .announcement-close-button {
        width: calc(0.9vw * var(--scale));
        min-width: calc(0.9vw * var(--scale));
        height: calc(0.9vw * var(--scale));
        margin-left: calc(1.18vw * var(--scale));
    }
    
    .custom-announcement-bar[data-announcement-bar-type="Moving One News"] .announcement-text {
        padding-left: calc(1.18vw * var(--scale));
        padding-right: calc(1.18vw * var(--scale));
    }
    
    .custom-announcement-bar[data-announcement-bar-type="Static"] .announcement-text {
        padding-left: calc(1.18vw * var(--scale));
        padding-right: calc(2.36vw * var(--scale));
    }
    
    .announcement-circle {
        min-width: calc(0.35vw * var(--scale));
        width: calc(0.35vw * var(--scale));
        height: calc(0.35vw * var(--scale));
        margin-left: calc(1.39vw * var(--scale));
        margin-right: calc(1.39vw * var(--scale));
    }
}

/* Styles for tablet */
@media (max-width: 991px) { 
    .custom-announcement-bar {
        margin-bottom: 38px;
    }

    .custom-announcement-bar[data-announcement-bar-type="Static"] {
        flex-direction: column;
        text-align: center;
    }

    .custom-announcement-bar[data-announcement-bar-type="Static"] .announcement-text {
        padding: 16px;
    }

    .custom-announcement-bar[data-announcement-bar-type="Static"] .announcement-content {
        overflow: unset;
    }

    .custom-announcement-bar[data-announcement-bar-type="Static"] .announcement-close-wrapper {
        top: -21px;
        right: 16px;
        height: auto;
        transform: translateY(-50%);
        background-color: transparent;
    }

    .custom-announcement-bar[data-announcement-bar-type="Static"] .announcement-close-button {
        margin-left: 0;
    }

    .custom-announcement-bar[data-announcement-bar-type="Static"] svg path {
        fill: var(--background-color);
    }
}

/* Styles for mobile */
@media (max-width: 479px) { 
    .custom-announcement-bar {
        margin-top: 10px;
        margin-bottom: 32px;
    }
    
    .announcement-heading {
        padding: 6px 14px;
        font-size: 14px;
    }
    
    .announcement-text {
        font-size: 14px;
        padding: 6px 0px;
    }
    
    .announcement-close-button {
        margin-left: 14px;
    }
    
    .custom-announcement-bar[data-announcement-bar-type="Moving One News"] .announcement-text {
        padding-left: 14px;
        padding-right: 14px;
    }
    
    .announcement-circle {
        min-width: 4px;
        width: 4px;
        height: 4px;
        margin-left: 12px;
        margin-right: 12px;
    }

    .custom-announcement-bar[data-announcement-bar-type="Static"] .announcement-text {
        padding: 12px;
    }

    .custom-announcement-bar[data-announcement-bar-type="Static"] .announcement-close-wrapper {
        top: -18px;
        right: 12px;
        height: auto;
    }
}
/* slider.css */
.slider-outer {
    overflow: hidden;
    position: relative;
}
 
.slider-inner {
    padding-left: 42px;
    padding-right: 42px;
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr;
    gap: 26px;
}

.slide-card {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}

.slide-card-image-link {
    display: block;
    width: 100%;
    height: 11vw;
}

.slide-card-image-wrapper {
    width: 100%;
    height: 100%;
}

.slide-card-heading {
    margin-top: 12px;
    margin-bottom: 4px;
}

.slide-placeholder {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
    border: 1px solid var(--text-color);
}

.slide-card-small-text {
    font-style: italic;
    opacity: 0.7;
    line-height: 100%;
    font-size: 12px;
}

.featured-slider {
    display: flex;
    flex-direction: column;
    gap: 0px;
    padding: 0px;
}

.mobile-heading-span {
    display: none;
}

.slide-card .access-icon-smaller {
    margin-right: 1px;
}

/* Styles for large desktop */
@media (min-width: 1439px) {  
    .slider-inner {
        padding-left: 2.92vw;
        padding-right: 2.92vw;
        gap: calc(1.81vw * var(--scale));
    }
    
    .slide-card-heading {
        margin-top: calc(0.83vw * var(--scale));
        margin-bottom: calc(0.28vw * var(--scale));
    }
    
    .slide-card-small-text {
        font-size: calc(0.83vw * var(--scale));
    }

    .featured-slider {
        gap: 0px;
        padding: 0px;
    }
}

/* Styles for tablet */
@media (max-width: 991px) { 
    .slider-inner {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 30px;
        padding-left: 30px;
        padding-right: 30px;
    }

    .slide-card-heading {
        max-width: 36vw !important;
        text-align: left; /* Left-align the heading */
    }
    
    .slide-card-image-link {
        height: 26vw;
        width: 36vw;
    }

    .slide-card-small-text {
        font-size: 14px;
    }

    .featured-slider {
        flex-direction: row;
    }

    .section-heading-slider {
        padding-left: 30px;
        padding-right: 30px;
    }

    .mobile-heading-span {
        display: inline;
    }
}

/* Styles for mobile */
@media (max-width: 479px) {
    .slider-inner {
        grid-template-columns: 1fr; /* On smaller screens, one post per row */
        gap: 18px;
    }

    .slide-card {
        /* align-items: center !important; */
        padding-bottom: 24px;
        padding-top: 16px;
        border-bottom: 1px solid var(--text-color);
        width: calc(36vw * 2);
        text-align: center;
        align-self: center;
        justify-self: center;
    }

    .slide-card:last-child {
        border-bottom: none;
    }

    .slide-card:first-child {
        padding-top: 4px;
    }

    .slide-card-image-link {
        width: 100%;
        height: calc(26vw * 2);
    }

    .slide-card-small-text,
    .slide-card-heading {
        max-width: calc(36vw * 2) !important;
        /* text-align: left;  */
    }

    .slide-card-small-text {
        /* max-width: calc(36vw * 2) !important; */
        margin-top: 12px;
        margin-bottom: 6px;
        /* align-self: flex-start; */
        /* padding-left: 0; */
    }


    .featured-slider {
        gap: 26px;
    }

    .slide-card-small-text {
        font-size: 12px;
    }
}
/* column-layout.css */
.column-layout {
    margin-top: 26px;
}

.column-layout-grid {
    display: grid;
    grid-template-columns: 1fr 2fr 1fr;
    gap: 42px;
    margin-bottom: 19px;
    padding-left: 42px;
    padding-right: 42px;
}

.column-layout .text-card {
    padding-top: 38px;
    padding-bottom: 38px;
    border-top: 1px solid var(--text-color);
    border-bottom: 1px solid var(--text-color);
    text-align: left;
    align-items: flex-start;
}

.column-layout .text-card-heading {
    font-size: 42px;
}

/* Styles for large desktop */
@media (min-width: 1439px) {  
    .column-layout {
        margin-top: calc(1.81vw * var(--scale));
    }

    .column-layout-grid {
        gap: calc(2.92vw * var(--scale));
        margin-bottom: calc(1.32vw * var(--scale));
        padding-left: 2.92vw;
        padding-right: 2.92vw;
    }

    .column-layout .text-card {
        padding-top: calc(2.64vw * var(--scale));
        padding-bottom: calc(2.64vw * var(--scale));
    }
    
    .column-layout .text-card-heading {
        font-size: calc(2.92vw * var(--scale));
    }
}

/* Styles for tablet */
@media (max-width: 991px) { 
    .column-layout-grid {
        grid-template-columns: 1fr;
        gap: 0px;
        margin-bottom: 0px;
        padding-left: 0px;
        padding-right: 0px;
    }

    .left-column,
    .center-column {
        padding-left: 30px;
        padding-right: 30px;
    }

    .column-layout .text-card {
        text-align: center;
        padding-top: 57px;
        padding-bottom: 64px;
        align-items: center;
        border-bottom: none;
    }

    .column-layout .text-card-heading {
        font-size: 48px;
    }
}

/* Styles for mobile */
@media (max-width: 479px) { 
    .column-layout {
        margin-top: 20px;
    }

    .left-column,
    .center-column {
        padding-left: 18px;
        padding-right: 18px;
    }

    .column-layout .text-card {
        padding-bottom: 57px;
    }

    .column-layout .text-card-heading {
        font-size: 36px;
    }
}
/* cards.css */
.small-card {
    width: 100%;
    padding: 38px 0px;
    border-top: 1px solid var(--text-color);
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}

.centered-heading {
    text-align: center;
}

.centered-heading .medium-text {
    text-decoration: underline;
    margin-bottom: 20px;
}

.small-card-small-text {
    display: flex;
    line-height: 100%;
    color: var(--text-color);
    align-items: flex-start;
    margin-bottom: 9px;
    margin-top: 7px;
}

.small-card-heading {
    margin-top: 13px;
    margin-bottom: 14px;
}

.small-card-image-link {
    display: block;
    margin-bottom: 14px;
    margin-top: auto;
    width: 100%;
}

.small-card-image-wrapper {
    width: 100%;
    height: 16vw;
}

.small-card-text {
    margin-bottom: 13px;
}

.small-card-bottom-text {
    font-style: italic;
    opacity: 0.7;
    line-height: 100%;
}

.big-card {
    width: 100%;
    padding-bottom: 38px;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}

.big-card-image-link {
    width: 100%;
    display: block;
    margin-bottom: 28px;
}

.big-card-image-wrapper {
    width: 100%;
    height: 31vw;
}

.big-card-heading {
    margin-top: 14px;
    margin-bottom: 10px;
}

.big-card-text {
    margin-bottom: 15px;
}

.horizontal-card {
    border-top: 1px solid var(--text-color);
    width: 100%;
    padding: 38px 0px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 38px;
}

.horizontal-card-inner {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    width: 100%;
}

.horizontal-card-image-link {
    margin-bottom: 0px;
    margin-top: 0px;
}

.extra-small-card {
    width: 100%;
    padding: 26px 0px;
    border-top: none;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}

.extra-small-card + .extra-small-card {
    border-top: 1px solid var(--text-color);
}

.extra-small-card-image-link {
    display: block;
    margin-bottom: 0px;
    width: 56%;
    margin-top: 12px;
}

.extra-small-card-image-wrapper {
    width: 100%;
    height: 9vw;
}

.extra-small-card-heading {
    margin-top: 9px;
    margin-bottom: auto;
}

.extra-small-card small {
    font-size: 12px;
}

.extra-small-card-mobile-excerpt {
    display: none;
}

.left-column .small-card:nth-child(4),
.right-column .extra-small-card:nth-child(7),
.right-column .extra-small-card:nth-child(8) {
    display: none;
}

.homepage-newsletter .left-column .small-card:nth-child(4),
.homepage-newsletter .right-column .extra-small-card:nth-child(7),
.homepage-newsletter .right-column .extra-small-card:nth-child(8) {
    display: flex;
}

.big-card-mobile {
    display: none;
}

.grid {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr;
    column-gap: 42px;
    row-gap: 57px;
}

.pagination-grid {
    margin-top: 57px;
    margin-bottom: 57px;
}

.grid-small-card {
    border-top: none !important;
    padding: 0px !important;
}

.placeholder {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 16vw;
    border: 1px solid var(--text-color);
    margin-bottom: 14px;
    margin-top: auto;
}

.text-min-height {
    min-height: 115px;
}

.pagination-nav {
    display: flex;
    align-items: center;
    justify-content: center;
}

.section-heading-slider {
    width: 100%;
}

.big-slide-placeholder {
    display: none;
}

.extra-small-side-card {
    flex-direction: row;
    align-items: flex-end;
}

.extra-small-side-card-image-link,
.extra-small-side-card-placeholder {
    width: 45%;
    min-width: 45%;
    height: 7.4vw;
    display: flex;
    align-items: center;
    justify-content: center;
}

.extra-small-side-card-heading {
    font-size: 18px;
    margin-bottom: 4px;
}

.extra-small-side-card-placeholder {
    border: 1px solid var(--text-color);
}

.extra-small-side-card-content {
    margin-left: 14px;
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.tags-grid {
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr;
    column-gap: 26px;
    row-gap: 38px;
}

.authors-grid-section .small-card-text {
    margin-bottom: 0px !important;
}

.no-margin-left {
    margin-left: 0px !important;
}

.funeral-mobile {
    display: none !important;
}

.featured-mobile {
    display: none !important;
}

/* Styles for large desktop */
@media (min-width: 1439px) {
    .funeral-mobile {
        display: none !important;
    }

    .featured-mobile {
        display: none !important;
    }
    .funeral-desktop {
        display: block;
    }
    .small-card {
        padding: calc(2.64vw * var(--scale)) 0px;
    }
    
    .small-card-heading {
        margin-top: calc(0.9vw * var(--scale));
        margin-bottom: calc(0.97vw * var(--scale));
    }
    
    .small-card-image-link {
        margin-bottom: calc(0.97vw * var(--scale));
    }
     
    .small-card-text {
        margin-bottom: calc(0.9vw * var(--scale));
    }

    .big-card {
        padding-bottom: calc(2.64vw * var(--scale));
    }
    
    .big-card-heading {
        margin-top: calc(1.11vw * var(--scale));
        margin-bottom: calc(0.7vw * var(--scale));
    }
    
    .big-card-image-link {
        margin-bottom: calc(1.94vw * var(--scale));
    }
     
    .big-card-text {
        margin-bottom: calc(1.04vw * var(--scale));
    }

    .horizontal-card {
        padding: calc(2.64vw * var(--scale)) 0px;
        gap: calc(2.64vw * var(--scale));
    }
    
    .horizontal-card-image-link {
        margin-bottom: 0px;
    }

    .extra-small-card {
        padding: calc(1.81vw * var(--scale)) 0px;
    }
    
    .extra-small-card-image-link {
        margin-top: calc(0.83vw * var(--scale));
    }
    
    .extra-small-card-heading {
        margin-top: calc(0.63vw * var(--scale));
    }

    .extra-small-card small {
        font-size: calc(0.83vw * var(--scale));
    }

    .grid {
        column-gap: calc(2.92vw * var(--scale));
        row-gap: calc(3.96vw * var(--scale));
    }

    .placeholder {
        margin-bottom: calc(0.97vw * var(--scale));
    }

    .text-min-height {
        min-height: calc(8vw * var(--scale));
    }

    .pagination-grid {
        margin-top: calc(3.96vw * var(--scale));
        margin-bottom: calc(3.96vw * var(--scale));
    }

    .extra-small-side-card-heading {
        font-size: calc(1.25vw * var(--scale));
    }
    
    .extra-small-side-card-content {
        margin-left: calc(0.97vw * var(--scale));
    }

    .tags-grid {
        column-gap: calc(1.81vw * var(--scale));
        row-gap: calc(2.64vw * var(--scale));
    }
}

/* Styles for tablet */
@media (max-width: 991px) { 
    .funeral-mobile {
        display: flex !important;
    }

    .featured-mobile {
        display: unset !important;
    }
    .funeral-desktop {
        display: none;
    }
    .small-card-image-wrapper {
        height: 66vw;
    }

    .small-card-image-link {
        margin-bottom: 18px;
    }
    
    .big-card-image-wrapper {
        height: 66vw;
    }

    .big-card-desktop {
        display: none;
    }

    .big-card-mobile {
        display: block;
    }

    .left-column .small-card:nth-child(3),
    .left-column .small-card:nth-child(4) {
        display: none !important;
    }

    .horizontal-card-image-link {
        max-width: 50%;
    }

    .horizontal-card-image-link .small-card-image-wrapper {
        height: 31vw;
    }

    .horizontal-card .medium-text {
        margin-bottom: 11px;
    }

    .extra-small-card {
        padding: 38px 0px;
    }

    .extra-small-card + .extra-small-card {
        border-top: none;
    }

    .extra-small-card-image-link {
        width: 62vw;
        height: 44vw;
    }

    .extra-small-card-image-wrapper {
        height: 100%;
    }

    .extra-small-card-mobile-excerpt {
        display: block;
        margin-top: 12px;
        min-height: 51px;
    }

    .extra-small-card small {
        font-size: 14px;
    }

    .grid {
        grid-template-columns: 1fr;
        column-gap: 38px;
        row-gap: 0px;
    }
    
    .pagination-grid {
        margin-top: 0px;
        margin-bottom: 38px;
    }
    
    .grid-small-card {
        border-top: none !important;
        padding: 38px 0px !important;
        border-bottom: 1px solid var(--text-color);
    }
    
    .placeholder {
        display: none;
    }
    
    .text-min-height {
        min-height: auto;;
    }

    .right-column {
        overflow: hidden;
    }

    .big-slide-placeholder {
        display: flex;
        align-items: center;
        justify-content: center;
        width: 62vw;
        height: 42vw;
        border: 1px solid var(--text-color);
    }

    .tags-grid {
        grid-template-columns: 1fr 1fr;
        row-gap: 38px;
        padding-top: 38px;
    }

    .tags-grid .slide-card-image-link {
        width: 100%;
        height: 32vw;
    }

    .authors-grid-section .small-card:last-child{
        padding-bottom: 0px !important;
        border-bottom: none !important;
    }
}

/* Styles for mobile */
@media (max-width: 479px) { 
    .featured-mobile {
        display: unset;
    }
    .funeral-mobile {
        display: flex !important;
    }
    .funeral-desktop {
        display: none;
    }
    .small-card {
        padding: 32px 0px;
    }
    
    .small-card-heading {
        margin-top: 11px;
        margin-bottom: 14px;
    }
    
    .small-card-text {
        margin-bottom: 11px;
    }
    
    .horizontal-card {
        padding: 32px 0px;
        gap: 32px;
    }

    .horizontal-card-image-link {
        max-width: 40%;
        margin-bottom: 0px;
    }

    .horizontal-card-image-link .small-card-image-wrapper {
        height: 26vw;
    }

    .horizontal-card .medium-text {
        font-size: 20px;
        margin-bottom: 9px;
    }

    .horizontal-card small {
        font-size: 12px;
    }

    .extra-small-card {
        padding: 32px 0px;
    }

    .extra-small-card-mobile-excerpt {
        min-height: 45px;
    }

    .extra-small-card small {
        font-size: 12px;
    }
    
    .pagination-grid {
        margin-bottom: 32px;
    }
    
    .grid-small-card {
        padding: 32px 0px !important;
    }

    .section-heading-slider {
        padding-left: 18px;
        padding-right: 18px;
    }

    .tags-grid {
        row-gap: 22px;
        column-gap: 18px;
        padding-top: 32px;
    }
}

/* adverts.css */
.sponsor-logo {
    display: block;
    max-width: 960px;
    width: 100%;
    height: auto;
    margin: 0.5rem auto 1.5rem;
}

@media (max-width: 768px) {
    .ad-ins {
        width: 100%;
        height: auto;
        padding-top: 15px;
        box-sizing: border-box;
    }
}

@media (max-width: 480px) {
    .ad-ins {
        padding-top: 10px; 
        height: auto;
    }
}

.funeral-container {
    display: flex;
    width: 100%;
    margin-bottom: 20px;
    box-sizing: border-box;
    margin-left: auto;
    margin-right: auto;
}

.separated-row {
    flex-direction: column;
    gap: 20px;
}

.separated-row a {
    display: flex;
    justify-content: center;
}

/* --- ROW 2: BOTTOM (Touching) --- */
.connected-row {
    gap: 0;
}

.connected-row a {
    display: flex;
    padding: 0;
    margin: 0;
}

.connected-row .funeral-ad-img {
    margin: 0;
}

.connected-row a:first-child { justify-content: flex-end; }
.connected-row a:last-child { justify-content: flex-start; }

/* --- Modified existing class --- */
.funeral-ad-img {
    max-width: 100%; 
    height: auto;
    display: block;
}

/* Ensure the links take up equal space in the row */
.funeral-container a {
    display: flex;
    flex: 0 1 auto;
}


/* --- Your existing Mobile Overrides --- */
@media (max-width: 768px) {
    .funeral-container {
        flex-direction: column;
        align-items: center;
        gap: 15px !important
    }
    
    .funeral-ad-img {
        max-width: 100%;
    }
    
    .ad-ins {
        width: 100%;
        height: auto;
        padding-top: 15px;
        box-sizing: border-box;
    }
}

@media (max-width: 768px) {
    /* Target specifically the connected row to override the general container settings */
    .connected-row {
        flex-direction: row !important; /* Keep side-by-side */
        align-items: flex-start; /* Prevents height distortion */
        gap: 0 !important; /* Override the 15px gap from the generic mobile rule */
    }

    .connected-row a {
        /* 0 = Don't grow beyond natural size
           1 = Shrink if the screen is too narrow
           auto = Use the image's natural width as the basis 
        */
        flex: 0 1 auto; 
        display: block; /* Ensures no extra flex weirdness */
    }
    
    /* Optional: Ensure the images inside don't overflow the flex container */
    .connected-row .funeral-ad-img {
        width: 100%;
        height: auto;
    }
}



/* .funeral-ad-img {
    max-width: 75%; 
    height: auto;
    display: block;
    margin: 0 auto;
}


@media (max-width: 768px) {
    .funeral-ad-img {
        max-width: 100%;
    }
} */




.center-text {
    text-align: center;
    margin: 0 auto;
    margin-bottom: 7px;
}

.banner-ad-wrap {
    max-width: 960px;
    margin: 1.5rem auto 2rem;
    padding: 0 18px;
    box-sizing: border-box;
}

.banner-ad {
    max-width: 960px;
    display: block;
    margin: 0 auto;
    position: relative;
    overflow: hidden;
    z-index: 1;
    margin-bottom: 1.5rem;
    margin-top: 0.5rem;
}

.post-hero-text-content .banner-ad {
    margin-top: -1.5rem;
}


.banner-ad iframe {
    width: 100%;
    overflow-x: hidden;
}

.banner-ad:has(iframe) {
    margin-bottom: unset;
}

.homepage-ad-wrap {
    max-width: 960px;
    margin: 0rem auto 0rem; /* adds breathing room top + bottom */
    padding: 0 18px; /* matches your mobile container padding */
    overflow: hidden;
    box-sizing: border-box;
}

.homepage-ad-sandwich {
    max-width: 960px;
    margin: 0rem auto 0rem; /* adds breathing room top + bottom */
    padding: 0 18px; /* matches your mobile container padding */
    overflow: hidden;
    box-sizing: border-box;
}

@media (max-width: 991px) {
    .homepage-ad-wrap {
        margin-top: 5rem;
        margin-bottom: -5rem;
    }
}





.text-card .banner-ad-wrap {
    width: 100%;
    max-width: 960px;
    margin-left: auto;
    margin-right: auto;
    padding: 0 18px;
    box-sizing: border-box;
    align-self: center;
    margin-top: -0.5rem;
    margin-bottom: -0.5rem;
}



.text-card .banner-ad {
    max-width: 960px;
    width: 100%;
    overflow: hidden !important;
}

/* Static image ads - just work normally */

/* Iframe ads need special handling */
.text-card .banner-ad:has(iframe) {
    overflow: visible !important;
    height: 150px; /* native iframe height */
}

@media (min-width: 961px) {
    .text-card .banner-ad {
        margin-top: -1.5rem;
        margin-bottom: 1.5rem;
    }
    .text-card .banner-ad iframe {
        width: 100% !important;
        transform: none !important;
        display: block !important;
    }
    .text-card .banner-ad:has(iframe) {
        height: auto;
    }
}

@media (min-width: 990px) {
    .post-hero-text-content .banner-ad {
        margin-top: -3.5rem;
    }
}

@media (max-width: 960px) and (min-width: 829px) {
    .text-card .banner-ad:has(iframe) {
        height: 128px;
        margin-bottom: 2rem;
    }
    .text-card .banner-ad iframe {
        width: 960px !important;
        transform: scale(0.85) !important;
        transform-origin: 0 0 !important;
        margin-left: calc((100% - 960px * 0.85) / 2) !important;
    }
}

@media (max-width: 828px) and (min-width: 701px) {
    .text-card .banner-ad:has(iframe) {
        height: 105px;
        margin-bottom: 2rem;
    }
    .text-card .banner-ad iframe {
        width: 960px !important;
        transform: scale(0.7) !important;
        transform-origin: 0 0 !important;
        margin-left: calc((100% - 960px * 0.7) / 2) !important;
    }
}

@media (max-width: 700px) and (min-width: 541px) {
    .text-card .banner-ad:has(iframe) {
        height: 83px;
        margin-bottom: 1.5rem;
    }
    .text-card .banner-ad iframe {
        width: 960px !important;
        transform: scale(0.55) !important;
        transform-origin: 0 0 !important;
        margin-left: calc((100% - 960px * 0.55) / 2) !important;
    }
}

@media (max-width: 540px) {
    .text-card .banner-ad:has(iframe) {
        height: 60px;
        margin-bottom: 1.5rem;
    }
    .text-card .banner-ad iframe {
        width: 960px !important;
        transform: scale(0.4) !important;
        transform-origin: 0 0 !important;
        margin-left: calc((100% - 960px * 0.4) / 2) !important;
    }
}


















@media (min-width: 991.1px) and (max-width: 1200px) {
    .banner-ad iframe {
        width: 150% !important;
        overflow-x: hidden;
    
        -ms-transform: scale(0.75);
        -moz-transform: scale(0.75);
        -o-transform: scale(0.75);
        -webkit-transform: scale(0.75);
        transform: scale(0.75);
    
        -ms-transform-origin: 0 0;
        -moz-transform-origin: 0 0;
        -o-transform-origin: 0 0;
        -webkit-transform-origin: 0 0;
        transform-origin: 0 0;
    }
}

@media (max-width: 991px) {
    .banner-ad iframe {
        width: 110% !important;
        overflow-x: hidden;
    
        -ms-transform: scale(0.9);
        -moz-transform: scale(0.9);
        -o-transform: scale(0.9);
        -webkit-transform: scale(0.9);
        transform: scale(0.9);
    
        -ms-transform-origin: 0 0;
        -moz-transform-origin: 0 0;
        -o-transform-origin: 0 0;
        -webkit-transform-origin: 0 0;
        transform-origin: 0 0;
    }
}

@media (min-width: 829px) and (max-width: 991px) {
    .banner-ad {
        margin-bottom: 2rem;
    }
}

@media (max-width: 828px) {
    .banner-ad iframe {
        width: 125% !important;
        overflow-x: hidden;
    
        -ms-transform: scale(0.75);
        -moz-transform: scale(0.75);
        -o-transform: scale(0.75);
        -webkit-transform: scale(0.75);
        transform: scale(0.75);
    
        -ms-transform-origin: 0 0;
        -moz-transform-origin: 0 0;
        -o-transform-origin: 0 0;
        -webkit-transform-origin: 0 0;
        transform-origin: 0 0;
    }
}

@media (max-width: 700px) {
    .banner-ad iframe {
        width: 150% !important;
        overflow-x: hidden;
    
        -ms-transform: scale(0.6);
        -moz-transform: scale(0.6);
        -o-transform: scale(0.6);
        -webkit-transform: scale(0.6);
        transform: scale(0.6);
    
        -ms-transform-origin: 0 0;
        -moz-transform-origin: 0 0;
        -o-transform-origin: 0 0;
        -webkit-transform-origin: 0 0;
        transform-origin: 0 0;
    }
}

@media (max-width: 540px) {
    .banner-ad iframe {
        width: 200% !important;
        overflow-x: hidden;
    
        -ms-transform: scale(0.5);
        -moz-transform: scale(0.5);
        -o-transform: scale(0.5);
        -webkit-transform: scale(0.5);
        transform: scale(0.5);
    
        -ms-transform-origin: 0 0;
        -moz-transform-origin: 0 0;
        -o-transform-origin: 0 0;
        -webkit-transform-origin: 0 0;
        transform-origin: 0 0;
    }
}


.advertise-tag .post-tag {
    font-size: 18px !important;
    color: white;
    margin-bottom: 8px;
}

.advertise-tag .sponsor-logo {
    max-width: 960px;
    width: 100%;
    height: auto;
    display: block;
    margin: 0.5rem auto 1.5rem;
}

@media (max-width: 991px) {
    .advertise-tag {
        text-align: center;
        margin-top: 1.5rem;
    }
}

.advertise-tag a {
    display: block;
    position: relative;
    z-index: 2;
}

.advertise-tag .sponsor-logo {
    max-width: 960px;
    width: 100%;
    height: auto;
    display: block;
    margin: 0.5rem auto 1.5rem;
    object-fit: contain;
    overflow: visible;
}

/* ===== Revive-served funeral ads (migrated from hardcoded <img>) ===== */
/* Revive injects an <img> (or <iframe>) inside each <ins>. These rules
   reproduce the previous .funeral-ad-img behaviour on that injected media
   and keep the connected-row seam tight. */

.funeral-ad-ins {
    display: flex;
    flex: 0 1 auto;
    max-width: 100%;
}

.funeral-ad-ins img,
.funeral-ad-ins iframe {
    max-width: 100%;
    height: auto;
    display: block;
}

/* separated-row: Avenal + Frasers stacked, each centered */
.separated-row .funeral-ad-ins {
    justify-content: center;
    width: 100%;
}

/* connected-row: M&W (left) butts up against Cremations (right) */
.connected-row .funeral-ad-ins:first-child { justify-content: flex-end; }
.connected-row .funeral-ad-ins:last-child  { justify-content: flex-start; }

@media (max-width: 768px) {
    .connected-row .funeral-ad-ins {
        flex: 0 1 auto;
        display: block;
    }
    .connected-row .funeral-ad-ins img,
    .connected-row .funeral-ad-ins iframe {
        width: 100%;
        height: auto;
    }
}

/* homepage-spacing.css */
/* v1.0.12 homepage spacing tighten: scoped to main.homepage only */
main.homepage .featured-tags-inner .articles-grid-section .pagination-grid,
main.homepage > .articles-grid-section .pagination-grid{margin:22px 0 34px}
main.homepage .featured-tags-inner .grid-small-card > .small-card-heading:first-child,
main.homepage > .articles-grid-section .grid-small-card > .small-card-heading:first-child{margin-top:0}
main.homepage > .footer-slider{margin-top:0}
@media (max-width:991px){
 main.homepage .featured-tags-inner .articles-grid-section .pagination-grid,
 main.homepage > .articles-grid-section .pagination-grid{margin:0 0 18px}
 main.homepage .featured-tags-inner .pagination-grid > *,
 main.homepage > .articles-grid-section .pagination-grid > *{padding-top:12px;padding-bottom:12px}
 main.homepage .featured-tags-inner .pagination-grid > *:first-child,
 main.homepage > .articles-grid-section .pagination-grid > *:first-child{padding-top:14px}
}

/* v1.0.15: desktop only, a little less space between homepage sections (was 34px under each grid) */
@media (min-width:992px){
 main.homepage .featured-tags-inner .articles-grid-section .pagination-grid{margin-bottom:16px}
}

/* v1.0.16: mobile/tablet only, ~25% less space between homepage sections (was 18px under each grid below 992px) */
@media (max-width:767px){
 main.homepage .featured-tags-inner .articles-grid-section .pagination-grid{margin-bottom:8px}
}
@media (min-width:768px) and (max-width:991px){
 main.homepage .featured-tags-inner .articles-grid-section .pagination-grid{margin-bottom:6px}
}

/* woi-home-events.css */
/* v1.0.13 What's On homepage strip (slug token "whats-on" in featured_tags_on_homepage).
   Featured event + swipeable slider. Mobile-first; scoped to main.homepage. */
main.homepage .woi-home-ev .wide-container{overflow:hidden}
main.homepage .woi-home-ev .section-heading-button{min-height:44px}
main.homepage .woi-home-ev .section-heading{padding-top:0;padding-bottom:0}
main.homepage .woi-home-ev a{color:inherit;text-decoration:none}
main.homepage .woi-hev-fig{position:relative;margin:0;aspect-ratio:3/2;overflow:hidden;background:#e6e8ef}
main.homepage .woi-hev-fig::before{content:"";position:absolute;inset:-10px;background:var(--woi-bg) center/cover;filter:blur(12px) brightness(.85)}
main.homepage .woi-hev-fig img{position:relative;width:100%;height:100%;object-fit:contain;display:block}
main.homepage .woi-hev-date{position:absolute;left:8px;top:8px;background:#0b1960;color:#fff;font-weight:700;padding:4px 8px;border-radius:4px;line-height:1.1;text-align:center;font-size:16px}
main.homepage .woi-hev-date small{display:block;font-size:10px;text-transform:uppercase}
main.homepage .woi-hev-date .woi-hev-until{font-size:9px;margin-bottom:2px;letter-spacing:.3px}
main.homepage .woi-hev-cat{font-size:11px;font-weight:600;margin:8px 0 2px;color:#5a6275;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
main.homepage .woi-hev-title{font-size:14px;line-height:1.25;margin:0 0 4px;font-weight:700;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
main.homepage .woi-hev-meta{font-size:12px;margin:0;color:#5a6275;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
/* featured */
/* slider */
main.homepage .woi-hev-slider{position:relative;margin:12px -18px 0}
main.homepage .woi-hev-row{display:flex;gap:12px;list-style:none;margin:0;padding:4px 18px 6px;overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x mandatory;scroll-padding:0 18px;-webkit-overflow-scrolling:touch;scrollbar-width:none}
main.homepage .woi-hev-row::-webkit-scrollbar{display:none}
main.homepage .woi-hev-row > li{flex:0 0 42%;min-width:0;scroll-snap-align:start}
main.homepage .woi-hev-card{display:block;min-height:44px}
@media (max-width:599px){
 main.homepage .woi-hev-row > li{flex-basis:38%}
 main.homepage .woi-hev-row .woi-hev-cat{display:none}
 main.homepage .woi-hev-row .woi-hev-title{margin-top:6px}
}
main.homepage .woi-hev-arrow{display:none}
main.homepage .woi-hev-credit{font-size:11px;color:#5a6275;margin:4px 0 18px;display:flex;flex-wrap:wrap;gap:0 14px}
main.homepage .woi-hev-credit span{display:inline-flex;align-items:center;min-height:32px}
main.homepage .woi-hev-credit a{text-decoration:underline;display:inline-flex;align-items:center;min-height:44px;margin:-6px 0 -6px .3em}
@media (min-width:600px){
 main.homepage .woi-hev-slider{margin-left:-30px;margin-right:-30px}
 main.homepage .woi-hev-row{padding-left:30px;padding-right:30px;scroll-padding:0 30px;gap:16px}
 main.homepage .woi-hev-row > li{flex-basis:calc((100% - 32px) / 3.3)}
}
@media (min-width:992px){
 main.homepage .woi-hev-slider{margin:18px 0 0;container-type:inline-size}
 main.homepage .woi-hev-row{padding:4px 0 6px;scroll-padding:0;gap:20px}
 main.homepage .woi-hev-row > li{flex-basis:calc((100% - 60px) / 4.3)}
 main.homepage .woi-hev-title{font-size:16px}
 main.homepage .woi-hev-arrow{display:flex;align-items:center;justify-content:center;position:absolute;top:calc(4px + (100cqw - 60px) / 4.3 / 3);transform:translateY(-50%);z-index:2;width:44px;height:44px;border-radius:50%;border:1px solid #d9dce6;background:#fff;color:#0b1960;font-size:28px;line-height:1;cursor:pointer;box-shadow:0 2px 8px rgba(0,0,0,.15);padding:0 0 3px}
 main.homepage .woi-hev-arrow:disabled{opacity:0;pointer-events:none}
 main.homepage .woi-hev-prev{left:-10px}
 main.homepage .woi-hev-next{right:-10px}
 main.homepage .woi-hev-credit{font-size:12px;margin:8px 0 34px}
}

/* v1.0.15: no credit line under the slider, so the slider carries the section's bottom spacing */
main.homepage .woi-home-ev .woi-hev-slider{margin-bottom:18px}
@media (min-width:992px){main.homepage .woi-home-ev .woi-hev-slider{margin-bottom:16px}}