/*
        specials page styles - dedicated layouts for special programme blocks
    */
    
    .content-wrapper {
        grid-column: 1 / -1;
        display: grid;
        grid-template-columns: 2fr 10fr;
        gap: var(--space-xl);
    }
    
    .specials-container {
        grid-column: 2 / 3;
        display: grid;
        grid-template-columns: repeat(1, 1fr);
        gap: var(--space-5xl);
    }
    
    .special-block-card {
        display: grid;
        grid-template-columns: 1fr;
        background: var(--silver);
        transition: all 0.2s var(--transition);
        height: 100%;
    }
    
    .special-block-card-link:hover .special-block-card {
        background: var(--bg-main);
        color: var(--accent);
    }
    
    .special-block-header {
        grid-column: 1 / -1;
        padding: var(--space-xl);
        display: flex;
        flex-direction: column;
        gap: var(--space-lg);
        justify-content: flex-start;
    }
    
    .special-block-card h2 {
        font-size: var(--fs-xl);
        font-weight: normal;
        margin: 0;
        color: inherit;
        cursor: pointer;
    }
    
    .special-block-card h2 a {
        color: inherit;
        text-decoration: none;
        transition: all 0.2s var(--transition);
    }
    
    .special-block-card-link:hover h2 a {
        text-decoration: underline;
    }
    
    .special-block-description {
        font-size: var(--fs-sm);
        color: inherit;
        /* line-height: 1.4; */
    }
    
    .special-block-description p {
        margin-bottom: var(--space-md);
    }

    .special-block-films-container {
        grid-column: 1 / -1;
        padding: 0 var(--space-xl) var(--space-xl);
    }

    .special-block-films-container .film-card {
        margin-top: var(--space-xl);
    }

    .special-block-meta {
        grid-column: 1 / -1;
        padding: 0 var(--space-xl);
        padding-bottom: var(--space-md);
        font-size: var(--fs-xs);
        color: inherit;
        opacity: 0.8;
    }
    
    @media (max-width: 768px) {
        .content-wrapper {
            grid-template-columns: 1fr;
        }

        .search-utilities {
            position: static;
            top: auto;
            grid-column: 1 / -1;
        }

        .specials-container {
            grid-column: 1 / -1;
        }
        
        .special-block-card {
            grid-template-columns: 1fr;
            min-height: auto;
        }
        
        .special-block-header {
            padding: var(--space-lg);
        }
        
        .special-block-card h2 {
            font-size: var(--fs-md);
            /* prevent text overflow on mobile */
            word-wrap: break-word;
            overflow-wrap: break-word;
            hyphens: auto;
            -webkit-hyphens: auto;
        }
        
        .special-block-description {
            font-size: var(--fs-sm);
            /* prevent text overflow on mobile */
            word-wrap: break-word;
            overflow-wrap: break-word;
            hyphens: auto;
            -webkit-hyphens: auto;
        }

        .special-block-films-container .film-card {
            background: var(--silver);
            padding-top: var(--space-lg);
        }
        
        /* prevent horizontal overflow on mobile */
        .special-block-films-container {
            width: 100%;
            overflow-x: hidden;
        }
        
        .special-block-films-container .film-card {
            width: 100%;
            max-width: 100%;
        }
    }
