/*
Theme Name:   EDBP MAIN THEME
Theme URI:    https://stage0.dev.aplitec.com
Description:  Child theme for Hello Elementor — EDBP portfolio site
Author:       EDBP
Template:     hello-elementor
Version:      1.0.0
Text Domain:  hello-edbp
*/

/* =============================================================
   1. GLOBAL RESET / SITE BACKGROUND
   ============================================================= */

body {
    background-color: #000000;
    font-family: "Chillax", sans-serif;
}

/* =============================================================
   2. PORTFOLIO ITEM RADIUS (migrated from Blocksy Customizer CSS)
   ============================================================= */

.portfolio-item {
    border-radius: 40px !important;
}

/* =============================================================
   3. FONT FAMILY FALLBACK
   Elementor kit tokens set "Chillax" natively (changed at source in DB).
   This body rule covers any non-Elementor element.
   ============================================================= */

body {
    font-family: "Chillax", sans-serif;
}

/* =============================================================
   4. SCREEN-READER-ONLY UTILITY
   Used by visually hidden H1 widgets on gallery/portfolio pages
   that have no visible heading but need an H1 for SEO/a11y.
   ============================================================= */

.screen-reader-text {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

/* =============================================================
   5. HELLO ELEMENTOR HEADER — Black, full-width
   ============================================================= */

.site-header {
    background-color: #000000;
    border-bottom: 1px solid #ffffff;
}

.site-header .header-inner {
    max-width: 100%;
    padding: 0 40px;
    height: 50px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 40px;
}

/* Logo */
.site-header .site-logo img {
    max-height: 40px;
    width: auto;
}

/* Nav links */
.site-header .site-navigation ul {
    display: flex;
    gap: 100px;
    list-style: none;
    margin: 0;
    padding: 0;
}

.site-header .site-navigation a {
    font-family: "Chillax", sans-serif;
    font-size: 12px;
    font-weight: 700;
    text-transform: uppercase;
    color: #ffffff;
    text-decoration: none;
    letter-spacing: 0.05em;
}

.site-header .site-navigation a:hover,
.site-header .site-navigation .current-menu-item > a {
    opacity: 0.7;
}

/* Social icons in header (injected via child template-part) */
.site-header .header-socials {
    display: flex;
    align-items: center;
    gap: 27px;
    margin-left: 20px;
}

.site-header .header-socials a {
    display: flex;
    align-items: center;
    color: #ffffff;
    opacity: 0.85;
    transition: opacity 0.2s ease;
}

.site-header .header-socials a:hover {
    opacity: 1;
}

.site-header .header-socials svg {
    width: 20px;
    height: 20px;
    fill: currentColor;
}

/* Nav+socials wrapper */
.site-header .header-nav-area {
    display: flex;
    align-items: center;
}

/* Mobile hamburger */
.site-header .site-navigation-toggle {
    background: none;
    border: none;
    cursor: pointer;
    padding: 4px;
}

.site-header .site-navigation-toggle-icon,
.site-header .site-navigation-toggle-icon::before,
.site-header .site-navigation-toggle-icon::after {
    display: block;
    width: 22px;
    height: 2px;
    background-color: #ffffff;
    position: relative;
    transition: all 0.2s ease;
}

.site-header .site-navigation-toggle-icon::before,
.site-header .site-navigation-toggle-icon::after {
    content: "";
    position: absolute;
    left: 0;
}

.site-header .site-navigation-toggle-icon::before { top: -7px; }
.site-header .site-navigation-toggle-icon::after  { top:  7px; }

/* Mobile dropdown */
.site-header .site-navigation-dropdown {
    position: absolute;
    top: 50px;
    left: 0;
    right: 0;
    background-color: rgba(18, 21, 25, 0.98);
    padding: 30px 40px;
    z-index: 9999;
}

.site-header .site-navigation-dropdown ul {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.site-header .site-navigation-dropdown a {
    font-size: 20px;
    font-weight: 700;
    color: #ffffff;
    text-transform: uppercase;
    text-decoration: none;
}

@media (max-width: 767px) {
    .site-header .site-navigation { display: none; }
    .site-header .header-socials  { display: none; }
}

@media (min-width: 768px) {
    .site-header .site-navigation-toggle-holder,
    .site-header .site-navigation-dropdown { display: none; }
}

/* =============================================================
   6. HELLO ELEMENTOR FOOTER — Black background, Aplitec watermark
   ============================================================= */

.site-footer {
    background-color: #000000;
    color: #ffffff;
}

.site-footer .footer-inner {
    max-width: 100%;
    padding: 30px 40px;
}

.site-footer .copyright p {
    color: #ffffff;
    font-family: "Chillax", sans-serif;
    font-size: 16px;
    font-weight: 300;
    text-align: center;
    margin: 0;
}