/* ############################################################################################################################################################################ */
/* ############################################################################################################################################################################ */
/* Skye Isle Terrier Sanctuary                                                                                                                                                  */
/*  • Page:            	        Header Stylesheet (header.css)                                                                                                                  */
/*  • Description:              Header with video background + gold divider band                                                                                                */
/*  • Location:               	/components/header/css/header.css                                                                                                                  */
/* ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */
/*  • Version:                  v0.0.03 α (Cleaned & consolidated)                                                                                                              */
/* ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */
/*  • Project Start Date:       2026-06-15                                                                                                                                      */
/*  • Last updated:             2026-06-19 @ 21:10 EDT                                                                                                                          */
/* ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */
/*  • Author:                   by Conner Rhoads                                                                                                                                */
/*  • Official Site:            www.skyeisleterriersanctuary.com                                                                                                                */
/* ############################################################################################################################################################################ */
/* ############################################################################################################################################################################ */

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

/* ============================================= */
/* Main Header Container                         */
/* ============================================= */
.site-header 
{
    position: relative;
    width: 100%;
    height: 350px;
    overflow: hidden;
    background-color: #1a1a1a; /* Fallback color */
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.8);
}

/* ============================================= */
/* Video Background                              */
/* ============================================= */
.header-video-bg 
{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    z-index: 0;
}

/* Dark overlay for better text readability */
.header-overlay 
{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.28);
    z-index: 1;
}

/* ============================================= */
/* Gold Divider Band at Bottom                   */
/* ============================================= */
.header-divider-band 
{
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 8px;
    background-color: #ffffff; /* Gold accent */
    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;
}

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