/* --------------------------------------------------------------------------------- */
/*          NOTES                                                                    */
/* --------------------------------------------------------------------------------- */

/* CDN Orange: ff450a */
/* :root {--uk-position-margin-offset: 0px;} */

/* --------------------------------------------------------------------------------- */
/*          GLOBAL                                                                   */
/* --------------------------------------------------------------------------------- */
.uk-section-primary {background: linear-gradient(40deg, #fe3a6a 0%, #ff4a39 40%, #fe8c45 100%);}

/* BUTTONS */
.uk-button {
    border-radius: 500px;
    border-width: 2px;
    text-transform: inherit;
    line-height: 44px;
    font-size: 1rem;
    font-weight: 600;
}
.uk-button-secondary {
    color: #ff450a;
    background-color: transparent;
    border: 2px solid #ff450a;
}
.uk-button-secondary:hover, .uk-button-secondary:active, .uk-button-secondary:focus {
    background-color: transparent;
    color: #ff450a;
    border: 2px solid #ff450a;
}

/* LIGHTBOX */
.uk-lightbox {background-color: rgba(0,0,0,0.8);}
.uk-lightbox .uk-responsive-width {
    max-width: 1400px !important;
    max-height: none !important;
    width: auto !important; 
    height: auto !important;
}
.uk-lightbox .uk-lightbox-items>*>* {width: 95% !important;}
@media(min-width: 960px) {.uk-lightbox .uk-lightbox-items>*>* {width: 75% !important;}}

/* SUBNAV */
.uk-subnav li a {
    text-transform: inherit !important;
    font-size: 0.9rem !important;
    /* font-weight: 400 !important; */
    color: rgba(255,255,255,0.8) !important;
}

/* TEXT */
.uk-text-lead {font-size: 1.4rem !important; line-height: 1.8rem; font-weight: 600 !important;}
.uk-text-large {font-size: 1.1rem;}
.uk-text-muted {color: #666 !important}

/* MOBILE NAV */
.uk-navbar-toggle svg {fill: #1a1a1a;}

.uk-modal-close-full {background-color: transparent; padding-top: 30px; padding-left: 15px; right: inherit; left: 0;}
.uk-close {color: rgba(255,255,255,1) !important;}
#hh-offcanvas-nav a {color: #fff !important;}
#hh-offcanvas-nav li {margin-top: 10px; margin-bottom: 10px;}

/* .uk-grid-divider {
    border-top-color: yellow !important;
} */
.uk-grid-divider.uk-grid-stack > .uk-grid-margin::before {
    border-top: 1px solid rgba(255, 255, 255, 0.4) !important;
}

/* --------------------------------------------------------------------------------- */
/*          NAVBAR                                                                   */
/* --------------------------------------------------------------------------------- */
.uk-navbar-container .hh-more {padding-right: 5px;}
/* Hide logos by default to selectively reveal */
.uk-navbar-container .uk-logo img.hh-light, 
.uk-navbar-container .uk-logo img.hh-dark {display: none;}

/* Navbar is transparent */
.uk-navbar-transparent:not(.uk-open):not(:has(.uk-open)) .uk-logo img.hh-light {display: block;}
.uk-navbar-transparent li a {color: #fff !important;}
.uk-navbar-transparent .uk-navbar-nav > li > a {
    color: #ffffff !important;
    text-transform: inherit !important;
    font-size: 1rem !important;
    font-weight: 600 !important;
}

/* Navbar is sticky */
.uk-navbar-sticky .uk-logo img.hh-dark {display: block;}
.uk-navbar-sticky .uk-navbar-nav > li > a {
    color: #1a1a1a !important;
    text-transform: inherit !important;
    font-size: 1rem !important;
    font-weight: 600 !important;
}

/* Dropdown is active */
.uk-navbar-container.uk-open .uk-logo img.hh-dark,
.uk-navbar-container:has(.uk-open) .uk-logo img.hh-dark {display: block;}
.uk-navbar-container:has(.uk-open) .uk-navbar-nav > li > a {
    color: #1a1a1a !important;
    text-transform: inherit !important;
    font-size: 1rem !important;
    font-weight: 600 !important;
}

.uk-navbar-container:not(.uk-navbar-transparent) {
    background-color: #ffffff;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
}
/* --------------------------------------------------------------------------------- */
/*          LIBRARY                                                                  */
/* --------------------------------------------------------------------------------- */
.hhs-library .hh-filter svg {width: 18px; height: 18px; margin-right: 10px; fill: #ffffff;}

.hhs-library .hh-results-label svg {margin-right: 5px; width: 18px; height: 18px; fill: #ff450a;}
.hhs-library .hh-results-label {font-size: 0.9rem; color: #ff450a;}
/* --------------------------------------------------------------------------------- */
/*          TEAM                                                                     */
/* --------------------------------------------------------------------------------- */
.hh-team-archive-modal {
    max-width: 1200px !important;
    border-top: 12px solid transparent;
    border-image: linear-gradient(40deg, #fe3a6a 0, #ff4a39 40%, #fe8c45 100%);
    border-image-slice: 1;
}

/* --------------------------------------------------------------------------------- */
/*          WIP SHADOW STUFF                                                         */
/* --------------------------------------------------------------------------------- */
/* .uk-box-shadow-bottom::after { */
    /* background: rgba(49,55,77,.35); */
    /* bottom: -40px; */
/* } */

/* .uk-card-default { */
    /* box-shadow: -15px -15px 20px rgba(255,255,255,.8),15px 15px 20px rgba(57,65,124,.08); */
/* } */

/* --------------------------------------------------------------------------------- */
/*          LESS REMINDER                                                            */
/* --------------------------------------------------------------------------------- */
/*
@import "../node_modules/uikit/src/less/uikit.theme.less";

// GLOBAL, TYPOGRAPHY
@global-font-family: "Inter", sans-serif;
@global-font-size: 16px;
@global-small-font-size: 0.8rem;
@global-line-height: 1.5;

// GLOBAL, COLORS
@global-color:              #1A1A1A;
@global-emphasis-color:     #1A1A1A;
@global-muted-color:        #94949A;
@global-link-color:         #ff450a;
@global-link-hover-color:   #FE6C3E;
@global-inverse-color: #fff;

// GLOBAL, BACKGROUNDS
@global-background: #fff;
@global-muted-background: #F5F5F5;
@global-primary-background: #ff450a;
@global-secondary-background: #1B1B1B;

// BASE
@base-heading-font-weight: 700;

// BORDERS
@border-rounded-border-radius: 12px;

// SUBNAV
@inverse-subnav-pill-item-color:               #fff;
@inverse-subnav-pill-item-hover-background:    #444;
@inverse-subnav-pill-item-hover-color:         #fff;
@inverse-subnav-pill-item-onclick-background:  @global-primary-background;
@inverse-subnav-pill-item-onclick-color:       #fff;
@inverse-subnav-pill-item-active-background:   @global-primary-background;
@inverse-subnav-pill-item-active-color:        #fff;
@subnav-pill-item-padding-vertical:             8px;
.hook-subnav-pill-item() {border-radius: 5px;}

*/


/* .uk-card-hover { */
    /* box-shadow: -15px -15px 20px rgba(255, 255, 255, 0.8), 15px 15px 20px rgba(57,65,124, 0.08) !important; */
/* } */

.uk-card-hover:hover {
    /* box-shadow: -2px -2px 5px rgba(255, 255, 255, 0.9), 2px 2px 4px rgba(57,65,124, 0.2) !important; */
    /* transform: translateY(3px); */
    box-shadow: -15px -15px 20px rgba(255, 255, 255, 0.8), 15px 15px 20px rgba(57,65,124, 0.1) !important;
}


/* --------------------------------------------------------------------------------- */
/*          OLD REF CSS FROM INDEX                                                   */
/* --------------------------------------------------------------------------------- */
    /* .uk-heading-small {font-weight: 600 !important; letter-spacing: 1px;}

    .uk-navbar-nav > li > a {
        color: rgba(0,0,0,0.8) !important;
        font-weight: 400 !important;
    }
    .uk-navbar-nav > li.uk-active > a {
        color: #000 !important;
        font-weight: 700 !important;
    }
    .uk-light .uk-navbar-nav > li > a {
        color: rgba(255,255,255,0.8) !important;
        font-weight: 400 !important;
    }
    .uk-light .uk-navbar-nav > li.uk-active > a {
        color: rgba(255,255,255,1) !important;
        font-weight: 700 !important;
    }
     */
