@media screen and (max-width: 900px) {

    .header-inner {
        width: 92%;
        min-height: 72px;
    }

    .main-navigation {
        gap: 0;
    }

    .main-navigation > a,
    .nav-dropdown-button {
        font-size: 11px;
        padding: 9px 5px;
    }

    .hero-slider,
    .hero-slide {
        min-height: 480px;
    }

    .hero-copy {
        margin-left: 5%;
    }

    .hero-copy h1 {
        font-size: 38px;
    }

    .hero-copy p {
        font-size: 16px;
    }

    .programme-grid {
        grid-template-columns: 1fr;
        max-width: 620px;
    }

    .programme-card p {
        min-height: auto;
    }
}

@media screen and (max-width: 740px) {

    body {
        width: 100%;
    }

    .header-inner {
        min-height: 70px;
        width: 92%;
    }

    .logo img {
        width: 125px;
        height: 52px;
    }

    .mobile-menu-button {
        display: flex;
        width: 40px;
        height: 38px;
        padding: 7px;
        border: 0;
        background: transparent;
        flex-direction: column;
        justify-content: center;
        gap: 5px;
        cursor: pointer;
    }

    .mobile-menu-button span {
        display: block;
        height: 3px;
        width: 26px;
        background: var(--ican-green);
        border-radius: 5px;
    }

    .main-navigation {
        display: none;
        position: absolute;
        top: 70px;
        left: 0;
        width: 100%;
        padding: 12px 5%;
        background: #fff;
        box-shadow: 0 12px 25px rgba(0,0,0,.12);
        flex-direction: column;
        align-items: stretch;
    }

    .main-navigation.mobile-open {
        display: flex;
    }

    .main-navigation > a,
    .nav-dropdown-button {
        display: block;
        width: 100%;
        padding: 13px 5px;
        text-align: left;
        border-bottom: 1px solid #edf2ee;
        font-size: 12px;
    }

    .nav-dropdown-menu {
        position: static;
        display: none;
        min-width: 0;
        opacity: 1;
        visibility: visible;
        transform: none;
        box-shadow: none;
        border-top: 0;
        border-bottom: 1px solid #edf2ee;
        padding: 0;
    }

    .nav-dropdown:hover .nav-dropdown-menu,
    .nav-dropdown:focus-within .nav-dropdown-menu {
        display: block;
    }

    .nav-dropdown-menu a {
        padding: 12px 15px;
        font-size: 11px;
    }

    .nav-register {
        margin-top: 8px;
        text-align: center !important;
    }

    .hero-slider,
    .hero-slide {
        min-height: 690px;
    }

    .hero-slide {
        display: flex;
        flex-direction: column;
        justify-content: flex-start;
    }

    .hero-copy {
        width: 90%;
        margin: 0 auto;
        padding: 55px 0 10px;
        text-align: center;
    }

    .hero-kicker {
        font-size: 13px;
    }

    .hero-copy h1 {
        font-size: 34px;
        line-height: 1.12;
    }

    .hero-copy p {
        margin-left: auto;
        margin-right: auto;
        font-size: 15px;
    }

    .hero-actions {
        justify-content: center;
    }

    .hero-visual {
        width: 100%;
        flex: 1;
        min-height: 285px;
        align-items: flex-end;
    }

    .hero-visual-bg {
        inset: 10% 0 0 15%;
        border-radius: 55% 0 0 0;
    }

    .hero-visual img {
        width: 55%;
        max-height: 300px;
    }

    .slider-arrow {
        width: 35px;
        height: 35px;
        margin-top: -17px;
        font-size: 16px;
    }

    .slider-prev {
        left: 8px;
    }

    .slider-next {
        right: 8px;
    }

    .slider-dots {
        bottom: 13px;
    }

    .programmes-section {
        padding: 55px 5% 65px;
    }

    .section-heading h2 {
        font-size: 27px;
    }

    .section-heading p {
        font-size: 14px;
    }

    .programme-card {
        padding: 28px 24px;
    }

    .layer4 ul {
        padding: 50px 5%;
        display: block;
    }

    .layer4 ul li {
        width: 90%;
        margin: 0 auto 45px;
    }

    .layer4 ul li:last-child {
        margin-bottom: 0;
    }

    .layer4 ul li img {
        width: 80px;
        height: 80px;
    }

    .layer4 ul li p {
        font-size: 20px;
    }

    .layer4 ul li article {
        font-size: 14px;
    }

    .layer5 {
        width: 70%;
    }

    .layer6 {
        width: 90%;
        margin-top: 45px;
        font-size: 20px;
    }

    .articleworks1 {
        width: 90%;
        font-size: 13px;
        margin-bottom: 45px;
    }

    .layer7 {
        margin: 30px auto 45px;
    }

    .layer7A {
        width: 100%;
        height: auto;
    }

    .layer7A iframe {
        width: 100%;
        height: 250px;
    }

    .layer7B {
        display: none;
    }

    .layer7C {
        display: block;
        width: 100%;
        height: auto;
        margin: 30px 0 0;
    }

    .layer7C img {
        width: 90%;
        height: auto;
    }

    .layer8 {
        padding: 50px 5%;
    }

    .socials ul li {
        margin: 7px;
    }

    .socials ul li img {
        width: 48px;
        height: 48px;
    }

    .production-page {
        padding: 50px 5% 65px;
    }

    .production-page h1 {
        font-size: 34px;
    }

    .production-placeholder {
        padding: 24px;
        font-size: 15px;
    }
}
