/* ############################################################################################################################################################################ */
/* ############################################################################################################################################################################ */
/* Glyh Entertainment Public Website                                                                                                                                            */
/*  • Page:            	        Header Stylesheet (header.css)                                                                                                                  */
/*  • Description:              Pure header container styles only – white gradient bar, accessibility skip, and layout container                                                */
/*  • Location:               	/modules/header/css/header.css                                                                                                                  */
/* ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */
/*  • Version:                  v0.0.01 α                                                                                                                                       */
/* ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */
/*  • Project Start Date:       2026-04-07                                                                                                                                      */
/*  • α Release Date:           2026-04-XX                                                                                                                                      */
/*  • β Release Date:           2026-04-XX                                                                                                                                      */
/*  • Last updated:             2026-04-07                                                                                                                                     	*/
/* ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */
/*  • Author:                   by Conner Rhoads                                                                                                                                */
/*  • Official Site:            www.glyphentertainment.com                                                                                                                      */
/* ############################################################################################################################################################################ */
/* ############################################################################################################################################################################ */

/* ============================================================================================================================================================================ */
/* [START] HEADER MODULE STYLESHEET                                                                                                                                             */
/* ============================================================================================================================================================================ */

header 
{
    position: relative;
    width: 100%;
    height: 350px;
    background: #1a1a1a url('../images/mystical-banner.png') center/cover no-repeat;
    box-shadow: 0 4px 12px rgba(0,0,0,0.8);
}

/* White gradient bar at bottom of header (exact match to layout.png / layout-marked.png) */
.header-divider-band 
{
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 12px;
    background: linear-gradient(to bottom, #ffffff, rgba(255,255,255,0.95), transparent);
    box-shadow: 0 2px 6px rgba(0,0,0,0.4);
    z-index: 2;
}

/* Accessibility skip link */
.a11y.skip 
{
    position: absolute;
    left: -9999px;
}

.a11y.skip a:focus 
{
    position: absolute;
    left: 20px;
    top: 20px;
    background: #ffd700;
    color: #111;
    padding: 8px 16px;
    z-index: 9999;
}

/* ============================================================================================================================================================================ */
/* LEGACY / COMPATIBILITY (if needed later)                                                                                                                                     */
/* ============================================================================================================================================================================ */

/* ============================================================================================================================================================================ */
/* [END] HEADER MODULE STYLESHEET                                                                                                                                               */
/* ============================================================================================================================================================================ */