/* LIGHT MODE */
:root {
    --bg-color: #ffffff;
    --text-color: #000000;

    --navbar-bg: #ffffff;
    --navbar-border: #1e90ff;
    --blue-light: #acd6ff;

    --section-border: #ffffff;

    --card-bg: #000000;
    --card-text: #ffffff;
    --card-border: #1e90ff;

    --accent-color: #3bc9db;
    --gradient-primary: linear-gradient(135deg, #000 55%, #0d1bff);
    --gradient-secondary: linear-gradient(135deg, #0d1bff, #3bc9db);

    --footer-text: #aaa;
    --footer-title: #555;

    --nav-link-color: #555;
    --nav-link-hover: #3bc9db;

    --btn-outline-color: #555;
    --btn-outline-border: #555;



}

/* DARK MODE */
.dark-mode {
    --bg-color: #0f1115;
    --text-color: #f8f9fa;

    --navbar-bg: #0b0d11;
    --navbar-border: #3bc9db;

    --section-border: #2a2d33;

    --card-bg: #151922;
    --card-text: #ffffff;
    --card-border: #3bc9db;

    --accent-color: #3bc9db;
    --gradient-primary: linear-gradient(135deg, #0b0d11 55%, #0d1bff);
    --gradient-secondary: linear-gradient(135deg, #0d1bff, #3bc9db);

    --footer-text: #9aa0a6;
    --footer-title: #ffffff;

    --nav-link-color: #f8f9fa;
    --nav-link-hover: #3bc9db;

    --btn-outline-color: #f8f9fa;
    --btn-outline-border: #f8f9fa;
}

/* STYLE */

body {
    font-family: 'Montserrat', sans-serif;
    background-color: var(--bg-color);
    color: var(--text-color);
    padding-top: 90px;
    transition: background-color 0.3s ease, color 0.3s ease;
}

.tag {
    background-color: var(--blue-light);
    color: #0037dd;
    padding: 5px;
    border-radius: 5px;
    font-size: 14px;
}

.navbar {
    background-color: var(--navbar-bg);
    border-bottom: 3px solid var(--navbar-border);
    transition: transform 0.5s ease-in-out, background-color 0.3s ease;
}

/* Ensure toggler icon is visible in both modes */
.navbar-toggler-icon {
    filter: invert(1);
    /* White to Black */
}

.dark-mode .navbar-toggler-icon {
    filter: invert(0);
    /* Keep it White */
}

.nav-industrial::after {
    background: var(--text-color);
}

.navbar-brand img {
    height: 60px;
}

.hero {
    min-height: 90vh;
    display: flex;
    align-items: center;
    border-bottom: 2px solid var(--section-border);
    background: var(--gradient-primary);
}

.hero span {
    color: var(--accent-color);
}

.service-card {
    border: 2px solid var(--card-border);
    background: var(--card-bg);
    color: var(--card-text);
    transition: all 0.3s ease;
}

.service-card .card-body {
    background: var(--card-bg);
    color: var(--card-text);
}

.service-card:hover {
    background: var(--bg-color);
    color: var(--text-color);
}

.section {
    padding: 80px 0;
    border-bottom: 2px solid var(--section-border);
}

footer h5 {
    color: var(--footer-title);
}

footer a {
    color: var(--footer-text);
}

footer a:hover {
    color: var(--footer-title);
}

.field-dark {
    background-color: #333;
    color: #fff;
}

.bg-degrade {
    background: var(--gradient-secondary);
}

/*BOOTTRAP*/

.navbar .nav-link {
    color: var(--nav-link-color) !important;
    transition: color 0.3s ease;
}

.navbar .nav-link:hover {
    color: var(--nav-link-hover) !important;
}

.btn-outline-theme {
    color: var(--btn-outline-color);
    border: 2px solid var(--btn-outline-border);
    background: transparent;
    text-transform: uppercase;
    font-weight: 600;
}

.btn-outline-theme:hover {
    background-color: var(--btn-outline-border);
    color: #000;
}

/* Botões genéricos com border — seguem o tema em dark/light mode */
.btn.border,
.btn.border:focus,
.btn.border:active {
    color: var(--text-color) !important;
    border-color: var(--nav-link-color) !important;
    background: transparent;
    transition: color 0.2s ease, background-color 0.2s ease, border-color 0.2s ease;
}

.btn.border:hover {
    background-color: var(--accent-color) !important;
    border-color: var(--accent-color) !important;
    color: #000 !important;
}

.navbar-hidden {
    top: -120px;
}

.navbar {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    transition: top 0.4s ease-in-out;
}

.navbar,
.navbar-collapse {
    overflow: visible !important;
}

@media (max-width: 991.98px) {
    .navbar-collapse {
        background-color: var(--navbar-bg);
        padding: 1rem;
        border-bottom: 2px solid var(--navbar-border);
    }

    .navbar-nav .nav-link {
        padding: 0.75rem 0;
    }
}

a {
    text-decoration: none !important;
}

/* LANGUAGE DROPDOWN */
.nav-lang-toggle {
    color: var(--nav-link-color) !important;
    font-weight: 600;
    letter-spacing: 0.05em;
    transition: color 0.3s ease;
}

.nav-lang-toggle:hover,
.nav-lang-toggle:focus {
    color: var(--nav-link-hover) !important;
}

.dropdown-menu-theme {
    background-color: var(--navbar-bg);
    border: 1px solid var(--navbar-border);
    border-radius: 6px;
    min-width: 160px;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.25);
    padding: 0.4rem 0;
    animation: dropFadeIn 0.18s ease;
}

@keyframes dropFadeIn {
    from {
        opacity: 0;
        transform: translateY(-6px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.dropdown-menu-theme .dropdown-item {
    color: var(--nav-link-color);
    font-weight: 500;
    padding: 0.5rem 1.1rem;
    transition: background-color 0.2s ease, color 0.2s ease;
    border-radius: 4px;
}

.dropdown-menu-theme .dropdown-item:hover,
.dropdown-menu-theme .dropdown-item:focus {
    background-color: var(--accent-color);
    color: #000 !important;
}

/* Língua activa no dropdown */
.dropdown-menu-theme .dropdown-item.active-lang {
    background-color: var(--accent-color);
    color: #000 !important;
    font-weight: 700;
}


/* CTA */
:root {
    --brand-blue: #0867dc;
    --brand-blue-dark: #075ac3;
    --ink: #16274b;
    --muted: #354361;
}



.budget-banner {
    background: linear-gradient(105deg, #f5faff 0%, #ffffff 51%, #f3f8fd 100%);
}

.budget-icon {
    width: 65px;
    height: 65px;
    flex: 0 0 65px;
    display: grid;
    place-items: center;
    color: #fff;
    background: var(--brand-blue);
    border-radius: 50%;
}

.budget-eyebrow {
    margin-bottom: 5px;
    color: var(--muted);
    font-size: 14px;
    line-height: 1.1;
}

.budget-title {
    margin-bottom: 5px;
    color: var(--ink);
    font-size: 18px;
    font-weight: 700;
    line-height: 1.15;
}

.budget-copy {
    max-width: 285px;
    margin: 0;
    color: var(--muted);
    font-size: 12px;
    line-height: 1.45;
}



.budget-button:hover,
.budget-button:focus-visible {
    color: #fff;
    background: linear-gradient(90deg, #064eaa, #0867dc);
    box-shadow: 0 5px 12px rgba(8, 103, 220, 0.24);
    transform: translateY(-1px);
}


@media (max-width: 575.98px) {

    .budget-copy {
        max-width: none;
    }

}