/* ==========================================================
   BLACK GOLD ENERGY — GLOBAL STYLES
   Theme: Hello Elementor Child
   ========================================================== */

:root {
    --bge-black: #070707;
    --bge-black-soft: #0d0d0d;
    --bge-black-card: #111111;
    --bge-gold: #d6a84b;
    --bge-gold-light: #f0d387;
    --bge-gold-dark: #a77a24;
    --bge-white: #f5f2eb;
    --bge-gray: #a7a29a;
    --bge-gray-dark: #66615a;
    --bge-border: rgba(214, 168, 75, 0.24);

    --bge-font: "Montserrat", Arial, sans-serif;

    --bge-radius-sm: 8px;
    --bge-radius-md: 14px;
    --bge-radius-lg: 24px;

    --bge-container: 1180px;
    --bge-section-space: 96px;
    --bge-transition: 220ms ease;
}

html {
    scroll-behavior: smooth;
}

body.bge-site {
    margin: 0;
    background: var(--bge-black);
    color: var(--bge-white);
    font-family: var(--bge-font);
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
}

body.bge-site,
body.bge-site p,
body.bge-site a,
body.bge-site button,
body.bge-site input,
body.bge-site textarea,
body.bge-site select {
    font-family: var(--bge-font);
}

body.bge-site a {
    color: var(--bge-gold-light);
    transition: color var(--bge-transition), opacity var(--bge-transition);
}

body.bge-site a:hover,
body.bge-site a:focus {
    color: var(--bge-gold);
}

body.bge-site ::selection {
    background: var(--bge-gold);
    color: var(--bge-black);
}

/* Elementor global helpers */
.bge-container {
    width: min(100% - 40px, var(--bge-container));
    margin-inline: auto;
}

.bge-section {
    padding-block: var(--bge-section-space);
}

.bge-eyebrow {
    color: var(--bge-gold);
    font-size: 12px;
    font-weight: 700;
    letter-spacing: .18em;
    text-transform: uppercase;
}

.bge-gold-text {
    color: var(--bge-gold);
}

.bge-muted {
    color: var(--bge-gray);
}

.bge-card {
    background:
        linear-gradient(180deg, rgba(255,255,255,.025), rgba(255,255,255,0)),
        var(--bge-black-card);
    border: 1px solid var(--bge-border);
    border-radius: var(--bge-radius-md);
}

.bge-gold-line {
    width: 64px;
    height: 2px;
    background: var(--bge-gold);
}

/* Buttons */
body.bge-site .elementor-button,
.bge-btn {
    border-radius: var(--bge-radius-sm);
    font-weight: 700;
    letter-spacing: .01em;
    transition:
        transform var(--bge-transition),
        background-color var(--bge-transition),
        color var(--bge-transition),
        border-color var(--bge-transition);
}

body.bge-site .elementor-button:hover,
.bge-btn:hover {
    transform: translateY(-2px);
}

.bge-btn-gold .elementor-button,
body.bge-site .bge-btn-gold.elementor-widget-button .elementor-button {
    background: var(--bge-gold);
    color: var(--bge-black);
    border: 1px solid var(--bge-gold);
}

.bge-btn-outline .elementor-button,
body.bge-site .bge-btn-outline.elementor-widget-button .elementor-button {
    background: transparent;
    color: var(--bge-gold-light);
    border: 1px solid var(--bge-gold);
}

/* Header helper classes for Elementor */
.bge-header {
    background: rgba(7, 7, 7, 0.94);
    border-bottom: 1px solid rgba(214, 168, 75, 0.14);
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
}

.bge-logo img {
    max-height: 64px;
    width: auto;
}

/* Hero helpers */
.bge-hero {
    position: relative;
    overflow: hidden;
}

.bge-hero::before {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    background:
        linear-gradient(90deg, rgba(0,0,0,.86) 0%, rgba(0,0,0,.54) 48%, rgba(0,0,0,.20) 100%),
        linear-gradient(0deg, rgba(0,0,0,.62) 0%, transparent 45%);
    z-index: 0;
}

.bge-hero > .elementor-container,
.bge-hero > .e-con-inner,
.bge-hero > .e-con {
    position: relative;
    z-index: 1;
}

/* Image polish */
body.bge-site img {
    max-width: 100%;
    height: auto;
}

.bge-image-frame img {
    border-radius: var(--bge-radius-md);
}

/* Product spotlight */
.bge-product-spotlight {
    background:
        radial-gradient(circle at 18% 30%, rgba(214,168,75,.08), transparent 28%),
        var(--bge-black-soft);
    border-block: 1px solid rgba(214,168,75,.12);
}

/* Sponsors */
.bge-sponsor-logo {
    min-height: 110px;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid rgba(214,168,75,.16);
    border-radius: var(--bge-radius-md);
    background: rgba(255,255,255,.018);
    transition: border-color var(--bge-transition), transform var(--bge-transition);
}

.bge-sponsor-logo:hover {
    border-color: rgba(214,168,75,.52);
    transform: translateY(-3px);
}

.bge-sponsor-logo img {
    max-height: 58px;
    max-width: 78%;
    object-fit: contain;
    filter: grayscale(1);
    opacity: .78;
    transition: filter var(--bge-transition), opacity var(--bge-transition);
}

.bge-sponsor-logo:hover img {
    filter: grayscale(0);
    opacity: 1;
}

/* Contact Form 7 global base.
   Les styles finaux seront complétés au moment de l'étape CF7. */
body.bge-site .wpcf7 form {
    margin: 0;
}

body.bge-site .wpcf7 input:not([type="submit"]):not([type="checkbox"]):not([type="radio"]),
body.bge-site .wpcf7 textarea,
body.bge-site .wpcf7 select {
    width: 100%;
    min-height: 52px;
    padding: 13px 16px;
    color: var(--bge-white);
    background: #0c0c0c;
    border: 1px solid rgba(255,255,255,.11);
    border-radius: var(--bge-radius-sm);
    outline: none;
    transition: border-color var(--bge-transition), box-shadow var(--bge-transition);
}

body.bge-site .wpcf7 textarea {
    min-height: 150px;
    resize: vertical;
}

body.bge-site .wpcf7 input:focus,
body.bge-site .wpcf7 textarea:focus,
body.bge-site .wpcf7 select:focus {
    border-color: var(--bge-gold);
    box-shadow: 0 0 0 3px rgba(214,168,75,.10);
}

body.bge-site .wpcf7 input[type="submit"] {
    min-height: 50px;
    padding: 12px 24px;
    border: 1px solid var(--bge-gold);
    border-radius: var(--bge-radius-sm);
    background: var(--bge-gold);
    color: var(--bge-black);
    font-weight: 800;
    cursor: pointer;
    transition: transform var(--bge-transition), background var(--bge-transition);
}

body.bge-site .wpcf7 input[type="submit"]:hover {
    transform: translateY(-2px);
    background: var(--bge-gold-light);
}

/* Utilities */
.bge-no-margin,
.bge-no-margin p {
    margin: 0;
}

.bge-relative {
    position: relative;
}

.bge-overflow-hidden {
    overflow: hidden;
}

/* Responsive */
@media (max-width: 1024px) {
    :root {
        --bge-section-space: 78px;
    }

    .bge-logo img {
        max-height: 56px;
    }
}

@media (max-width: 767px) {
    :root {
        --bge-section-space: 60px;
    }

    .bge-container {
        width: min(100% - 28px, var(--bge-container));
    }

    .bge-logo img {
        max-height: 48px;
    }

    .bge-hero::before {
        background:
            linear-gradient(0deg, rgba(0,0,0,.87) 0%, rgba(0,0,0,.52) 68%, rgba(0,0,0,.28) 100%);
    }
}

/* Accessibility */
@media (prefers-reduced-motion: reduce) {
    html {
        scroll-behavior: auto;
    }

    *,
    *::before,
    *::after {
        animation-duration: .01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: .01ms !important;
    }
}

/* ==========================================================
   BLACK GOLD ENERGY — HEADER RESPONSIVE + STICKY
   ========================================================== */

#top {
    position: sticky;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 9999;

    background: rgba(7, 7, 7, 0.94);
    border-bottom: 1px solid rgba(214, 168, 75, 0.12);

    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);

    transition:
        background-color .25s ease,
        box-shadow .25s ease,
        border-color .25s ease;
}


/* Header après scroll */

body.bge-scrolled #top {
    background: rgba(7, 7, 7, 0.985);

    border-bottom-color: rgba(214, 168, 75, 0.24);

    box-shadow:
        0 12px 35px rgba(0, 0, 0, 0.35);
}


/* Container desktop */

#top > .elementor-container {
    display: flex;
    align-items: center;
}


/* Logo */

#top .elementor-element-7defb2d img {
    width: 74px;
    max-width: 74px;
    height: auto;

    transition: width .25s ease;
}


/* Logo légèrement plus petit après scroll */

body.bge-scrolled #top .elementor-element-7defb2d img {
    width: 62px;
}


/* Desktop menu */

#top .elementor-element-fd5c5c2 .elementor-icon-list-items {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 28px;

    flex-wrap: nowrap;
}


#top .elementor-element-fd5c5c2 .elementor-icon-list-item {
    margin: 0;
}


#top .elementor-element-fd5c5c2 a {
    color: #f5f2eb;
    text-decoration: none;

    font-size: 14px;
    font-weight: 600;

    transition: color .2s ease;
}


#top .elementor-element-fd5c5c2 a:hover {
    color: #d6a84b;
}


/* ==========================================================
   MOBILE TOGGLE
   ========================================================== */

.bge-menu-toggle {
    display: none;

    width: 46px;
    height: 46px;

    padding: 0;

    align-items: center;
    justify-content: center;

    border: 1px solid rgba(214, 168, 75, 0.35);
    border-radius: 10px;

    background: #0d0d0d;

    cursor: pointer;

    position: relative;

    z-index: 10002;
}


.bge-menu-toggle span {
    display: block;

    position: absolute;

    width: 21px;
    height: 2px;

    background: #d6a84b;

    border-radius: 10px;

    transition:
        transform .25s ease,
        opacity .25s ease,
        top .25s ease;
}


.bge-menu-toggle span:nth-child(1) {
    top: 14px;
}


.bge-menu-toggle span:nth-child(2) {
    top: 21px;
}


.bge-menu-toggle span:nth-child(3) {
    top: 28px;
}


/* Hamburger -> X */

.bge-menu-toggle.is-active span:nth-child(1) {
    top: 21px;
    transform: rotate(45deg);
}


.bge-menu-toggle.is-active span:nth-child(2) {
    opacity: 0;
}


.bge-menu-toggle.is-active span:nth-child(3) {
    top: 21px;
    transform: rotate(-45deg);
}


/* ==========================================================
   OFFCANVAS
   ========================================================== */

.bge-offcanvas {
    position: fixed;

    top: 0;
    right: 0;

    width: min(88vw, 390px);
    height: 100dvh;

    padding: 110px 28px 35px;

    background:
        radial-gradient(
            circle at top right,
            rgba(214, 168, 75, 0.08),
            transparent 35%
        ),
        #090909;

    border-left: 1px solid rgba(214, 168, 75, 0.22);

    transform: translateX(105%);

    visibility: hidden;

    z-index: 10000;

    overflow-y: auto;

    transition:
        transform .32s ease,
        visibility .32s ease;

    box-shadow:
        -25px 0 60px rgba(0, 0, 0, 0.40);
}


.bge-offcanvas.is-open {
    transform: translateX(0);
    visibility: visible;
}


/* Menu */

.bge-offcanvas-nav {
    display: flex;
    flex-direction: column;
}


.bge-offcanvas-nav a {
    display: flex;
    align-items: center;

    min-height: 58px;

    color: #f5f2eb;

    text-decoration: none;

    font-family: "Montserrat", Arial, sans-serif;

    font-size: 18px;
    font-weight: 600;

    border-bottom: 1px solid rgba(255, 255, 255, 0.07);

    transition:
        color .2s ease,
        padding-left .2s ease;
}


.bge-offcanvas-nav a:hover {
    color: #d6a84b;
    padding-left: 6px;
}


/* CTA offcanvas */

.bge-offcanvas-cta {
    display: flex;
    align-items: center;
    justify-content: center;

    margin-top: 30px;

    min-height: 52px;

    padding: 12px 24px;

    border-radius: 999px;

    background:
        linear-gradient(
            90deg,
            #f1d27b 0%,
            #e4b84f 100%
        );

    color: #070707 !important;

    font-size: 14px !important;
    font-weight: 800 !important;

    border: none !important;
}


/* ==========================================================
   BACKDROP
   ========================================================== */

.bge-offcanvas-backdrop {
    position: fixed;

    inset: 0;

    background: rgba(0, 0, 0, 0.68);

    backdrop-filter: blur(3px);
    -webkit-backdrop-filter: blur(3px);

    opacity: 0;
    visibility: hidden;

    z-index: 9998;

    transition:
        opacity .3s ease,
        visibility .3s ease;
}


.bge-offcanvas-backdrop.is-open {
    opacity: 1;
    visibility: visible;
}


/* Bloque le scroll derrière le menu */

body.bge-menu-open {
    overflow: hidden;
}


/* ==========================================================
   TABLET + MOBILE
   ========================================================== */

@media (max-width: 1024px) {

    #top {
        min-height: 78px;
    }


    #top > .elementor-container {
        min-height: 78px;

        padding-left: 22px;
        padding-right: 22px;

        justify-content: space-between;
    }


    /* colonne logo */

    #top .elementor-element-1cc662a {
        width: auto !important;
        flex: 0 0 auto !important;
    }


    /* Menu desktop */

    #top .elementor-element-1079782 {
        display: none !important;
    }


    /* Bouton Elementor desktop */

    #top .elementor-element-ddbd718 {
        display: none !important;
    }


    #top .elementor-element-7defb2d img,
    body.bge-scrolled #top .elementor-element-7defb2d img {
        width: 62px;
        max-width: 62px;
    }


    .bge-menu-toggle {
        display: flex;
    }

}


/* ==========================================================
   MOBILE
   ========================================================== */

@media (max-width: 767px) {

    #top,
    #top > .elementor-container {
        min-height: 70px;
    }


    #top > .elementor-container {
        padding-left: 16px;
        padding-right: 16px;
    }


    #top .elementor-element-7defb2d img,
    body.bge-scrolled #top .elementor-element-7defb2d img {
        width: 54px;
        max-width: 54px;
    }


    .bge-menu-toggle {
        width: 42px;
        height: 42px;
    }


    .bge-menu-toggle span {
        width: 19px;
    }


    .bge-menu-toggle span:nth-child(1) {
        top: 12px;
    }


    .bge-menu-toggle span:nth-child(2) {
        top: 19px;
    }


    .bge-menu-toggle span:nth-child(3) {
        top: 26px;
    }


    .bge-menu-toggle.is-active span:nth-child(1),
    .bge-menu-toggle.is-active span:nth-child(3) {
        top: 19px;
    }


    .bge-offcanvas {
        width: min(90vw, 340px);

        padding:
            95px
            22px
            30px;
    }


    .bge-offcanvas-nav a {
        min-height: 55px;

        font-size: 16px;
    }

}


/* Admin bar WordPress connecté */

body.admin-bar #top {
    top: 32px;
}


body.admin-bar .bge-offcanvas {
    padding-top: 140px;
}


@media (max-width: 782px) {

    body.admin-bar #top {
        top: 46px;
    }

}
