:root {
    /* SDM Nursing Premium Palette (As Requested) */
    --clr-white: #ffffff;
    --clr-off-white: #f8fafc;
    --clr-light-blue: #e0f2fe;
    --clr-soft-aqua: #ccfbf1;
    --clr-subtle-mint: #d1fae5;
    --clr-deep-navy: #0f172a;
    --clr-accent: #0284c7;

    /* Typography */
    --font-primary: 'Roboto', sans-serif;
    
    /* Video-Matched Typography Scales */
    --text-hero: clamp(5rem, 12vw, 12rem); /* Massive size */
    --text-h2: clamp(3.5rem, 8vw, 8rem);
    --text-h3: clamp(2rem, 5vw, 4rem);
    --text-body: clamp(1.125rem, 1.5vw, 1.5rem);
}

* { margin: 0; padding: 0; box-sizing: border-box; }
html { font-family: var(--font-primary); color: var(--clr-deep-navy); }
body { background-color: var(--clr-white); overflow-x: hidden; }
a { text-decoration: none; color: inherit; }

/* Color Blocking Utilities */
.bg-white { background-color: var(--clr-white); }
.bg-blue { background-color: var(--clr-light-blue); }
.bg-aqua { background-color: var(--clr-soft-aqua); }
.bg-navy { background-color: var(--clr-deep-navy); color: var(--clr-white); }

/* Add this to your style.css if you want to abstract the inline styles */
.hero-bg-video {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover; /* Crucial for responsive aspect ratios */
    z-index: 1;
    pointer-events: none; /* Prevents users from accidentally pausing it */
}

/* Video-Matched Typography Styles */
.text-massive { 
    font-size: var(--text-hero); 
    font-weight: 900; 
    line-height: 0.85; /* Extremely tight line-height like the video */
    letter-spacing: -0.04em; 
}
.text-display { 
    font-size: var(--text-h2); 
    font-weight: 900; 
    line-height: 0.9; 
    letter-spacing: -0.03em; 
}

/* Layout Utilities */
.section-pad { padding: 8rem 5%; }
.container { max-width: 1800px; margin: 0 auto; }

/* Video-Matched Offset Image Block */
.offset-image-wrap {
    position: relative;
    padding-bottom: 3rem;
    padding-right: 3rem;
}
.offset-image-wrap .color-block {
    position: absolute;
    bottom: 0;
    right: 0;
    width: 85%;
    height: 85%;
    z-index: 1;
}
.offset-image-wrap img {
    position: relative;
    z-index: 2;
    width: 100%;
    display: block;
}

/* Asymmetric Grid (Matching the video's "Introduction" section) */
.editorial-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 4rem;
}
@media (min-width: 1024px) {
    .editorial-grid { grid-template-columns: 1.2fr 0.8fr; align-items: end; }
    .editorial-grid.reverse { grid-template-columns: 0.8fr 1.2fr; }
}

/* Mega Menu - Split Screen Design */
.mega-menu { 
    position: fixed; top: 0; left: 0; width: 100%; height: 100vh; 
    display: flex; transform: translateY(-100%); 
    transition: transform 0.6s cubic-bezier(0.85, 0, 0.15, 1); z-index: 999; 
}
.mega-menu.is-active { transform: translateY(0); }

.menu-left { background: var(--clr-white); width: 60%; padding: 10rem 5% 5%; overflow-y: auto; }
.menu-right { background: var(--clr-light-blue); width: 40%; padding: 10rem 5% 5%; }

.main-nav-list { list-style: none; display: flex; flex-direction: column; gap: 1.5rem; }
.main-nav-list a { font-size: clamp(3rem, 5vw, 5rem); font-weight: 900; letter-spacing: -0.03em; transition: opacity 0.3s; }
.main-nav-list a:hover { opacity: 0.5; }

.sub-nav-list { list-style: none; display: flex; flex-direction: column; gap: 1rem; }
.sub-nav-list a { font-size: 1.5rem; font-weight: 500; }


/* --- News Section Specific Layouts --- */
        .news-layout-grid {
            display: grid;
            grid-template-columns: 1fr; /* Mobile stack */
            gap: 3rem;
            align-items: start;
        }
        @media (min-width: 1024px) {
            .news-layout-grid {
                grid-template-columns: 1.5fr 1fr; /* Desktop split */
            }
        }
        
        .news-item {
            display: grid;
            grid-template-columns: 120px 1fr; /* Fixed 120px thumbnail, text takes remaining space */
            gap: 1.5rem;
            align-items: start;
            text-decoration: none;
            color: inherit;
        }
        
        .news-item-border {
            border-top: 1px solid rgba(0,0,0,0.1);
            padding-top: 2rem;
        }