/* ============================================================
   FOREGRANDA CONSULTING — Brand Layer
   Overrides the base ConsultHub template with the brand identity
   defined in forgranda_styles.pdf (colours, typography, logo).
   Load this file AFTER style.css and responsive.css.
   ============================================================ */

@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@400;500;600;700;800&family=Nunito:wght@400;500;600;700;800&display=swap');

:root{
    /* Brand palette (source: forgranda_styles.pdf) */
    --fg-navy:      #001729;  /* primary dark / logo background      */
    --fg-navy-2:    #001322;  /* deeper navy for overlays            */
    --fg-rust:      #0E3C63;  /* primary accent (buttons, links)     */
    --fg-rust-dark: #0A2D4A;  /* accent hover                        */
    --fg-green:     #253822;  /* secondary — forest green            */
    --fg-olive:     #9D9849;  /* tertiary — olive / highlight        */
    --fg-cream:     #FFFEEB;  /* light background / logo on dark      */
    --fg-brown:     #503230;  /* warm neutral                        */
    --fg-blue:      #B3D0DB;  /* soft blue tint                      */
    --fg-ink:       #222222;  /* body copy                           */
    --fg-muted:     #6b7280;  /* muted copy                          */

    /* Typography */
    --font-display: 'Montserrat', 'Segoe UI', sans-serif; /* Meigan-style display fallback */
    --font-heading: 'Montserrat', 'Segoe UI', sans-serif;
    --font-body:    'Nunito', 'Segoe UI', sans-serif;
}

/* ---------- Typography ---------- */
body{ font-family: var(--font-body); color: var(--fg-ink); }
h1,h2,h3,h4,h5,h6,
.sec-title h2,
.count-text,
.logo-text{ font-family: var(--font-heading); font-weight: 700; }

.sec-title h2{ color: var(--fg-navy); }

/* ---------- Accent helpers ---------- */
.theme_color,
.text-rust{ color: var(--fg-rust) !important; }
.bg-navy{ background-color: var(--fg-navy) !important; }
.bg-cream{ background-color: var(--fg-cream) !important; }

/* ---------- Buttons ---------- */
.theme-btn.btn-style-one,
.theme-btn.btn-style-three,
.consult-btn,
.header-style-two .consult-btn{
    background: var(--fg-rust);
    color: var(--fg-cream);
    font-family: var(--font-heading);
    font-weight: 600;
    letter-spacing: .3px;
    border-color: var(--fg-rust);
}
.theme-btn.btn-style-one:hover,
.theme-btn.btn-style-three:hover,
.consult-btn:hover{
    background: var(--fg-navy);
    color: var(--fg-cream);
    border-color: var(--fg-navy);
}
.theme-btn.btn-style-two,
.theme-btn.btn-style-six{
    background: transparent;
    color: var(--fg-cream);
    border: 2px solid var(--fg-cream);
}
.theme-btn.btn-style-two:hover,
.theme-btn.btn-style-six:hover{
    background: var(--fg-cream);
    color: var(--fg-navy);
}

/* Highlighted primary CTA used across the header/menu: Book a Discovery Call */
.discovery-btn{
    display: inline-block;
    background: var(--fg-rust);
    color: var(--fg-cream) !important;
    font-family: var(--font-heading);
    font-weight: 700;
    font-size: 15px;
    line-height: 1;
    padding: 15px 10px;
    border-radius: 4px;
    text-transform: none;
    transition: all .3s ease;
    white-space: nowrap;
}
.discovery-btn:hover{ background: var(--fg-navy); color: var(--fg-cream) !important; }

/* Make the in-menu CTA render as a pill button (beat template nav specificity) */
.main-menu .navigation > li > a.discovery-btn,
.sticky-header .main-menu .navigation > li > a.discovery-btn{
    color: var(--fg-navy) !important;
    background: var(--fg-cream) !important;
    padding: 12px 12px !important;
    margin: 22px 0 22px 14px;
    border-radius: 4px;
    line-height: 1;
    text-transform: none;
}
.main-menu .navigation > li > a.discovery-btn:hover{ background: var(--fg-navy) !important; color: var(--fg-cream) !important; }
/* On the white sticky header, flip to a solid accent button */
.sticky-header .main-menu .navigation > li > a.discovery-btn{
    color: var(--fg-cream) !important;
    background: var(--fg-rust) !important;
}
.sticky-header .main-menu .navigation > li > a.discovery-btn:hover{ background: var(--fg-navy) !important; }

/* ---------- Header / navigation ---------- */
.main-menu .navigation > li.current > a,
.main-menu .navigation > li:hover > a{ color: var(--fg-rust); }

/* ---------- Dark sections use brand navy ---------- */
.main-footer{ background-color: var(--fg-navy); }
.call-to-action{ background-color: var(--fg-rust); }

/* ---------- Process / step numbers, icons ---------- */
.count-box .count-text,
.icon-box .icon{ color: var(--fg-rust); }

/* ---------- Links ---------- */
a{ color: var(--fg-rust); }
a:hover{ color: var(--fg-navy); }

/* ---------- Emoji pillar icons (used in rebranded cards) ---------- */
.pillar-emoji{
    font-size: 42px;
    line-height: 1;
    display: inline-block;
    margin-bottom: 18px;
}

/* Logo sizing for the wide Foregranda wordmark */
.main-header .logo img,
.sticky-header .logo img{ max-height: 46px; width: auto; }
.footer-logo img{ max-height: 52px; width: auto; }