```css
/*
====================================================================
 NEW STAR CINEMA
 REGION A
 region-a.css

 Production Styling
 Vertical Fit Correction

 Mount Point:
 #nsc-region-a-root

 Mounted Shell:
 #nsc-region-a

 Region A is completely isolated from:
 - Region B
 - Region C
 - Region D
 - Guide viewport
 - Guide engine
 - Guide LIVE engine

 IMPORTANT:
 This CSS does NOT alter:
 - Region A JavaScript
 - LIVE population behavior
 - NSCGuideLiveChanged
 - NSCGuideHover
 - guide-live.js
 - guide.js
====================================================================
*/


/* =========================================================
   MOUNT POINT
========================================================= */

#nsc-region-a-root{
    display:block;
    width:100%;
    max-width:100%;
    margin:0;
    padding:0;
}


/* =========================================================
   REGION A ROOT
========================================================= */

#nsc-region-a{
    display:block;
    width:100%;
    max-width:1485px;
    height:300px;
    margin:0;
    padding:0;
    overflow:hidden;
    position:relative;

    color:#ffffff;

    font-family:
        'Open Sans',
        Arial,
        sans-serif;

    background:
        linear-gradient(
            135deg,
            #080808,
            #171717
        );

    box-sizing:border-box;
}


/* =========================================================
   GLOBAL BOX SIZING
========================================================= */

#nsc-region-a,
#nsc-region-a *,
#nsc-region-a *::before,
#nsc-region-a *::after{
    box-sizing:border-box;
}


/* =========================================================
   MASTER SHELL
========================================================= */

#nsc-region-a .nsc-ra-shell{
    display:grid;

    width:100%;
    max-width:1485px;
    height:300px;

    margin:0;
    padding:0;

    overflow:hidden;

    grid-template-columns:
        35.02%
        26.60%
        38.38%;
}


/* =========================================================
   COLUMN BASE
========================================================= */

#nsc-region-a .nsc-ra-column{
    min-width:0;
    height:300px;
    overflow:hidden;
}


/* =========================================================
   GENERAL SECTION
========================================================= */

#nsc-region-a .nsc-ra-section{
    position:relative;
}


/* =========================================================
   LABEL
========================================================= */

#nsc-region-a .nsc-ra-label{
    margin:0 0 5px;

    color:#b7b7b7;

    font-size:10px;
    font-weight:700;

    letter-spacing:1.3px;

    line-height:1.15;

    text-transform:uppercase;
}


/* =========================================================
   COLUMN 1
   PROGRAM INFORMATION

   Vertical fit correction:
   Original:
   padding 18px 22px

   Corrected:
   padding 14px 20px

   This preserves the overall visual hierarchy while
   recovering vertical space for the lower content.
========================================================= */

#nsc-region-a .nsc-ra-column-info{
    padding:14px 20px;

    background:
        linear-gradient(
            180deg,
            #151515,
            #090909
        );

    border-right:
        1px solid
        rgba(
            255,
            255,
            255,
            .08
        );
}


/* =========================================================
   TITLE
========================================================= */

#nsc-region-a .nsc-ra-title-section h2{
    margin:0;
    padding:0;

    color:#ffffff;

    font-size:26px;
    font-weight:800;

    line-height:1.12;

    letter-spacing:.2px;

    text-shadow:
        0 2px 8px
        rgba(
            0,
            0,
            0,
            .75
        );
}


/* =========================================================
   STATUS
========================================================= */

#nsc-region-a .nsc-ra-status-section{
    display:flex;

    align-items:center;

    gap:12px;

    margin-top:12px;
}


#nsc-region-a .nsc-ra-status{
    display:inline-flex;

    align-items:center;
    justify-content:center;

    min-width:76px;
    height:26px;

    padding:0 12px;

    border-radius:5px;

    background:#7d0000;

    color:#ffffff;

    font-size:12px;
    font-weight:800;

    letter-spacing:1px;
}


#nsc-region-a .nsc-ra-status.live{
    background:
        linear-gradient(
            135deg,
            #ff0000,
            #990000
        );

    animation:
        nscRegionALivePulse
        2s
        infinite;
}


@keyframes nscRegionALivePulse{

    0%{
        box-shadow:
            0 0 8px
            rgba(
                255,
                0,
                0,
                .35
            );
    }

    50%{
        box-shadow:
            0 0 22px
            rgba(
                255,
                0,
                0,
                .85
            );
    }

    100%{
        box-shadow:
            0 0 8px
            rgba(
                255,
                0,
                0,
                .35
            );
    }

}


/* =========================================================
   CHANNEL
========================================================= */

#nsc-region-a .nsc-ra-channel{
    color:#d6d6d6;

    font-size:13px;
    font-weight:700;

    line-height:1.2;
}


/* =========================================================
   DESCRIPTION
========================================================= */

#nsc-region-a .nsc-ra-description-section{
    margin-top:12px;
}


#nsc-region-a .nsc-ra-description-section p{
    max-width:470px;

    margin:0;
    padding:0;

    color:#e5e5e5;

    font-size:14px;

    line-height:1.35;
}


/* =========================================================
   COLUMN 2
   PROGRAM METADATA

   Vertical fit correction:
   Original padding:
   18px

   Corrected:
   14px
========================================================= */

#nsc-region-a .nsc-ra-column-meta{
    padding:14px;

    background:
        linear-gradient(
            180deg,
            #101010,
            #080808
        );

    border-right:
        1px solid
        rgba(
            255,
            255,
            255,
            .08
        );
}


/* =========================================================
   METADATA HEADER
========================================================= */

#nsc-region-a .nsc-ra-metadata-header{
    margin-bottom:8px;
}


#nsc-region-a .nsc-ra-program-type{
    color:#ffffff;

    font-size:16px;
    font-weight:800;

    line-height:1.15;

    letter-spacing:.4px;

    text-transform:uppercase;
}


/* =========================================================
   METADATA GRID
========================================================= */

#nsc-region-a .nsc-ra-metadata-grid{
    display:grid;

    grid-template-columns:
        repeat(
            3,
            minmax(
                0,
                1fr
            )
        );

    gap:6px;
}


/* =========================================================
   METADATA CARD

   Reduced height allows all metadata and support rows
   to remain visible within the 300px Region A shell.
========================================================= */

#nsc-region-a .nsc-ra-meta-item{
    min-height:46px;

    padding:6px;

    display:flex;

    flex-direction:column;

    justify-content:center;

    background:
        linear-gradient(
            145deg,
            #202020,
            #111111
        );

    border:
        1px solid
        rgba(
            255,
            255,
            255,
            .08
        );

    border-radius:6px;
}


#nsc-region-a .nsc-ra-meta-label{
    color:#8f8f8f;

    font-size:9px;
    font-weight:700;

    line-height:1.1;

    letter-spacing:.8px;

    text-transform:uppercase;
}


#nsc-region-a .nsc-ra-meta-value{
    margin-top:2px;

    color:#ffffff;

    font-size:13px;
    font-weight:800;

    line-height:1.15;
}


/* =========================================================
   SUPPORT INFORMATION

   This section is intentionally compact so the
   End Time row remains inside the 300px shell.
========================================================= */

#nsc-region-a .nsc-ra-support-section{
    margin-top:8px;

    padding-top:7px;

    border-top:
        1px solid
        rgba(
            255,
            255,
            255,
            .10
        );
}


#nsc-region-a .nsc-ra-support-row{
    display:flex;

    align-items:center;

    justify-content:space-between;

    height:20px;

    font-size:11px;

    line-height:1;
}


#nsc-region-a .nsc-ra-support-label{
    color:#8d8d8d;

    font-weight:700;

    letter-spacing:.7px;
}


#nsc-region-a .nsc-ra-support-value{
    color:#ffffff;

    font-weight:800;
}


/* =========================================================
   COLUMN 3
========================================================= */

#nsc-region-a .nsc-ra-column-poster{
    width:100%;
    height:300px;

    position:relative;

    overflow:hidden;

    background:#000000;
}


/* =========================================================
   POSTER SECTION
========================================================= */

#nsc-region-a .nsc-ra-poster-section{
    width:100%;
    height:300px;

    position:relative;

    overflow:hidden;
}


/* =========================================================
   POSTER IMAGE
========================================================= */

#nsc-region-a .nsc-ra-poster{
    display:block;

    width:100%;
    height:100%;

    margin:0;
    padding:0;

    object-fit:cover;

    background:#111111;

    transition:
        transform .35s ease,
        filter .35s ease;
}


/* =========================================================
   CINEMATIC OVERLAY
========================================================= */

#nsc-region-a .nsc-ra-poster-section::before{
    content:"";

    position:absolute;

    inset:0;

    z-index:2;

    pointer-events:none;

    background:
        linear-gradient(
            90deg,
            rgba(
                0,
                0,
                0,
                .45
            ),
            transparent 35%
        );
}


/* =========================================================
   POSTER VIGNETTE
========================================================= */

#nsc-region-a .nsc-ra-poster-section::after{
    content:"";

    position:absolute;

    inset:0;

    z-index:3;

    pointer-events:none;

    box-shadow:
        inset
        0 0 40px
        rgba(
            0,
            0,
            0,
            .75
        );
}


/* =========================================================
   POSTER HOVER
========================================================= */

#nsc-region-a:hover .nsc-ra-poster{
    transform:scale(1.03);

    filter:brightness(1.08);
}


/* =========================================================
   RESPONSIVE
========================================================= */

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

    #nsc-region-a{
        height:auto;
    }

    #nsc-region-a .nsc-ra-shell{
        height:auto;
        min-height:300px;
    }

    #nsc-region-a .nsc-ra-column{
        height:auto;
        min-height:300px;
    }

    #nsc-region-a .nsc-ra-column-poster,
    #nsc-region-a .nsc-ra-poster-section{
        height:300px;
    }

}


/* =========================================================
   TABLET
========================================================= */

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

    #nsc-region-a .nsc-ra-title-section h2{
        font-size:24px;
    }

    #nsc-region-a .nsc-ra-description-section p{
        font-size:13px;
    }

    #nsc-region-a .nsc-ra-metadata-grid{
        grid-template-columns:
            repeat(
                2,
                minmax(
                    0,
                    1fr
                )
            );
    }

}


/* =========================================================
   MOBILE
========================================================= */

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

    #nsc-region-a{
        height:auto;
    }

    #nsc-region-a .nsc-ra-shell{
        display:flex;

        flex-direction:column;

        height:auto;
    }

    #nsc-region-a .nsc-ra-column{
        width:100%;

        height:auto;

        min-height:0;
    }

    #nsc-region-a .nsc-ra-column-poster{
        order:-1;

        height:auto;
    }

    #nsc-region-a .nsc-ra-poster-section{
        width:100%;

        height:auto;

        aspect-ratio:16 / 9;
    }

    #nsc-region-a .nsc-ra-poster{
        width:100%;
        height:100%;
    }

    #nsc-region-a .nsc-ra-column-info,
    #nsc-region-a .nsc-ra-column-meta{
        border-right:none;
    }

}


/* =========================================================
   SMALL MOBILE
========================================================= */

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

    #nsc-region-a .nsc-ra-title-section h2{
        font-size:22px;
    }

    #nsc-region-a .nsc-ra-status-section{
        flex-direction:column;

        align-items:flex-start;

        gap:10px;
    }

    #nsc-region-a .nsc-ra-metadata-grid{
        grid-template-columns:1fr;
    }

}


/* =========================================================
   IMAGE DEFAULTS
========================================================= */

#nsc-region-a img{
    display:block;

    max-width:100%;
}


/* =========================================================
   TEXT DEFAULTS
========================================================= */

#nsc-region-a h2,
#nsc-region-a p{
    margin-top:0;
}


/* =========================================================
   END REGION A CSS
========================================================= */
```