/*
Theme Name: Power Fx
*/
 :root {
            --navy: #1f2340;
            --yellow: #ffc800;
            --white: #ffffff;
        }

        body {
            scroll-behavior: smooth;
        }

        /* ===== NAVBAR ===== */
        .navbar {
            background-color: var(--navy);
        }

        .navbar-brand {
            color: var(--white) !important;
            font-weight: 700;
        }

        .navbar-nav .nav-link {
            color: var(--white) !important;
            position: relative;
            padding: 8px 0;
            margin: 0 12px;
        }

        /* Yellow hover underline */
        .navbar-nav .nav-link::after {
            content: "";
            position: absolute;
            left: 0;
            bottom: 0;
            width: 0;
            height: 3px;
            background-color: var(--yellow);
            transition: width 0.3s ease;
        }

        .navbar-nav .nav-link:hover::after {
            width: 100%;
        }

        /* Download button */
        .btn-catalogue {
            background-color: var(--yellow);
            color: #000;
            font-weight: 600;
            border-radius: 4px;
        }

        .btn-catalogue:hover {
            background-color: #e6b800;
        }

        /* Mobile toggle button */
        .navbar-toggler {
            background-color: var(--yellow);
        }
        
        

        /* ===== SECTIONS ===== */
        section {
            padding: 90px 0;
        }
.hero {
    position: relative;
    min-height: 90vh;
    
    background-size: cover;
    background-position: right center; /* keep oil splash visible */
    background-repeat: no-repeat;
    display: flex;
    align-items: center;
}

/* Dark overlay for text clarity */
.hero::before {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(
        90deg,
        rgba(0,0,0,0.55) 0%,
        rgba(0,0,0,0.35) 40%,
        rgba(0,0,0,0.1) 70%
    );
}

/* Content stays aligned, not stretched */
.hero-content {
    position: relative;
    z-index: 2;
    max-width: 1200px;
    padding: 0 40px;
    color: #fff;
}

        /* ===== FOOTER ===== */
        footer {
            background-color: var(--navy);
            color: var(--white);
        }
        .form-control{
            margin:10px;
        }
        
        /* ===== DESKTOP LOGO SIZE (SAFE) ===== */
.navbar-brand img {
    height: 80px;   /* exactly same as before */
    width: auto;
}

/* =========================
   MOBILE NAVBAR FIX ONLY
   ========================= */
@media (max-width: 768px) {

    body {
        overflow-x: hidden;
    }

    .navbar-brand {
        max-width: 70%;
        white-space: normal;
        line-height: 1.2;
    }

    .navbar-brand img {
        height: 45px;   /* mobile size */
    }

    .navbar-brand span {
        font-size: 14px;
        display: block;
    }

    .navbar-nav {
        padding-top: 15px;
    }

    .navbar-nav .nav-item {
        margin-bottom: 8px;
    }

    .navbar-nav .nav-link::after {
        display: none;
    }
}