#language-home {
    width: 100%;
    padding: clamp(16px, 2.5vw, 36px);
    color: #30243e;
    text-align: left;
}

#language-home .language-home-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 20px;
    margin-bottom: 24px;
}

#language-home .language-home-eyebrow {
    margin-bottom: 8px;
    color: #6b527e;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: .08em;
    text-transform: uppercase;
}

#language-home h1 {
    margin: 0 0 10px;
    color: #361b50;
    font-size: clamp(28px, 3vw, 40px);
    font-weight: 700;
}

#language-home .language-home-heading p:last-child {
    margin-bottom: 0;
    color: #655a70;
}

#language-home .language-home-search {
    position: relative;
    flex: 0 1 360px;
}

#language-home .language-home-search .livesearch {
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    z-index: 20;
    max-height: 360px;
    overflow-y: auto;
    border: 1px solid #d9cce5;
    border-radius: 0 0 10px 10px;
    background: #fff;
    box-shadow: 0 8px 24px #30243e26;
}

#language-home .language-home-search label {
    display: block;
    margin-bottom: 8px;
    font-weight: 600;
}

#language-home .language-home-search__controls {
    display: flex;
    gap: 8px;
}

#language-home .language-home-search input {
    min-width: 0;
    min-height: 44px;
    border-radius: 8px;
}

#language-home .language-home-search button {
    padding: 10px 16px;
    border-radius: 8px;
    background: #361b50;
    color: #fff;
}

#language-home #languagebackgroundImage {
    position: static;
    width: 100%;
    margin: 0 0 24px;
    overflow: hidden;
    border-radius: 12px;
}

#language-home .languagebgImagesize {
    width: 100%;
    height: 140px;
    object-fit: cover;
}

#language-home #language-content {
    margin: 0;
}

#language-home #language-content > div {
    display: grid;
    grid-template-columns: minmax(210px, 1fr) minmax(0, 2.4fr) minmax(210px, 1fr);
    align-items: start;
    gap: 24px;
}

#language-home #language-content > div > [class*="col-"] {
    width: auto;
    min-width: 0;
    padding: 0;
}

#language-home .languageBox {
    padding: 22px;
    min-height: 0;
    border-radius: 12px;
    background: #361b50;
}

#language-home .languageBox > h3 {
    font-size: 24px;
    color: #fff;
}

#language-home #languageNavigation a {
    padding: 10px 0;
    color: #fff;
    line-height: 1.5;
}

#language-home #languageNavigation a:hover {
    color: #e1c6f7;
    text-decoration: underline;
}

#language-home #languageNavigation p,
#language-home #languageNavigation h4 {
    margin: 0;
}

#language-home #languageContent {
    margin-top: 0;
    text-align: left;
    line-height: 1.8;
}

#language-home #languageContent > h3 {
    margin: 0 0 16px;
    color: #361b50;
    font-size: 24px;
    line-height: 1.4;
}

#language-home #languageText h2,
#language-home #languageText h3 {
    color: #361b50;
    font-size: 22px;
}

#language-home .languageImage {
    margin-top: 24px;
    padding: 12px;
    border: 1px solid #e2d9ea;
    border-radius: 10px;
    background: #fff;
}

#language-home .languageImage img {
    width: 100%;
    height: auto;
}

#language-home #leftHandSideImageDescription {
    margin-top: 10px;
    color: #655a70;
    font-size: 13px;
    line-height: 1.6;
}

#language-home #languageBackgroundButton {
    display: block;
    margin-top: 20px;
    min-height: 44px;
    border: 1px solid #d9cce5;
    border-radius: 8px;
    background: #f3edf8;
    color: #361b50;
    white-space: normal;
}

#language-home #languageInterest {
    display: block;
    margin-top: 0;
    padding: 20px;
    border: 1px solid #eadcb4;
    border-radius: 12px;
    background: #faf5e7;
}

#language-home .languageInterestText {
    color: #361b50;
    font-size: 17px;
    line-height: 1.6;
}

#language-home .languageInterestMobile {
    display: none;
}

#language-home #languageFilmSuggestions {
    margin-top: 0;
}

#language-home #recommendations {
    margin-top: 24px;
    padding: 20px;
    border: 1px solid #e2d9ea;
    border-radius: 12px;
}

#language-home #recommendations .embed-title {
    margin: 0 0 20px;
    font-size: 19px;
}

#language-home #recommendations .flag {
    padding: 0;
    background: transparent;
    color: #361b50;
    font-size: inherit;
}

#language-home #recommendations article {
    display: grid;
    grid-template-columns: 60px minmax(0, 1fr);
    gap: 12px;
    padding-bottom: 16px;
    margin-bottom: 16px;
    border-bottom: 1px solid #eee7f3;
}

#language-home #recommendations article img {
    float: none;
    width: 60px;
    height: 90px;
    margin: 0;
    object-fit: contain;
}

#language-home #recommendations article > div {
    position: static;
    float: none;
    width: auto;
    min-width: 0;
    margin: 0;
}

#language-home #recommendations h4 {
    margin: 0 0 6px;
    font-size: 15px;
    line-height: 1.5;
}

#language-home #recommendations a {
    color: #59307b;
}

#language-home #recommendations p {
    color: #655a70;
    font-size: 12px;
    line-height: 1.6;
}

#language-home #recommendations .all-news-link {
    border: 0;
    padding: 0;
    font-size: 14px;
}

@media (min-width: 768px) and (max-width: 1199px) {
    #language-home #language-content > div {
        grid-template-columns: 230px minmax(0, 1fr);
    }

    #language-home #language-content > div > .col-md-3:last-child {
        grid-column: 1 / -1;
        display: grid;
        grid-template-columns: 1fr 2fr;
        gap: 24px;
    }

    #language-home #languageInterest {
        align-self: start;
    }

    #language-home #recommendations {
        margin-top: 0;
    }

    #language-home #languageFilmSuggestions {
        display: none;
    }
}

@media (max-width: 767px) {
    #language-home #language-content > div {
        grid-template-columns: minmax(0, 1fr);
    }

    #language-home .language-home-search {
        flex-basis: 100%;
    }

    #language-home .languagebgImagesize {
        height: 100px;
    }
}
