/*
Theme Name: Flatsome Child – Bangó Ügyvédi Iroda
Template: flatsome
Description: Child theme for the Bangó Ügyvédi Iroda rebuild. Holds design tokens (fonts, gold accent, navy patterned page-title banner, chevron lists). Client edits content in UX Builder; CSS lives here.
Version: 1.0.0
*/

/* ============================================================
   Design tokens
   ============================================================ */
:root {
    --bango-navy: #2b3344;
    --bango-navy-2: #373f51;
    --bango-gold: #b8985a;       /* eyebrows, role labels, chevrons */
    --bango-gold-soft: #d7b685;  /* hero title / lighter gold       */
    --bango-text: #4e586e;       /* body copy                       */
    --bango-heading: #373f51;    /* dark slate headings             */
}

/* ============================================================
   Typography — Playfair Display headings over a clean sans
   ============================================================ */
body,
.sd { font-family: "Source Sans 3", "Helvetica Neue", Arial, sans-serif; color: var(--bango-text); }

h1, h2, h3, h4, h5, h6,
.heading-font,
.banner h1, .banner h2 {
    font-family: "Playfair Display", Georgia, "Times New Roman", serif;
    color: var(--bango-heading);
    font-weight: 700;
}

/* ============================================================
   Reusable content helpers (add as a class in UX Builder)
   ============================================================ */

/* Small gold eyebrow above a section heading: <span class="bango-eyebrow"> */
.bango-eyebrow {
    display: inline-block;
    color: var(--bango-gold);
    font-weight: 600;
    letter-spacing: .04em;
    font-size: 1.05em;
    margin-bottom: .35em;
}

/* Team member role line: gold italic */
.bango-role {
    color: var(--bango-gold);
    font-style: italic;
    font-weight: 600;
    display: block;
    margin: -.4em 0 1em;
}

/* Gold double-chevron lists — add class "bango-list" to the column/text block */
.bango-list ul { list-style: none; margin-left: 0; padding-left: 0; }
.bango-list ul li {
    position: relative;
    padding-left: 1.9em;
    margin-bottom: .55em;
    line-height: 1.4;
}
.bango-list ul li::before {
    content: "\00BB\00BB";          /* »» */
    position: absolute;
    left: 0;
    color: var(--bango-gold);
    font-weight: 700;
    letter-spacing: -.15em;
}

/* Publications / specialty lists keep tight rhythm */
.bango-list p { margin-bottom: .4em; }

/* Média: source/date line under each article link */
.bango-media-meta { color: var(--bango-gold); font-size: .85em; font-style: normal; letter-spacing: .02em; }
.bango-list ul li a { font-weight: 600; }

/* ============================================================
   Dark navy page-title banner with subtle diamond crosshatch
   Add class "bango-pagetitle" to a Flatsome [section]
   ============================================================ */
.bango-pagetitle {
    background-color: var(--bango-navy) !important;
    background-image:
        url("data:image/svg+xml,%3Csvg width='44' height='44' viewBox='0 0 44 44' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M0 22 L22 0 L44 22 L22 44 Z' fill='none' stroke='%23ffffff' stroke-opacity='0.045' stroke-width='1'/%3E%3Cpath d='M0 0 L44 44 M44 0 L0 44' stroke='%23ffffff' stroke-opacity='0.03' stroke-width='1'/%3E%3C/svg%3E");
    background-repeat: repeat;
}
.bango-pagetitle h1,
.bango-pagetitle h2 {
    color: var(--bango-gold-soft) !important;
    text-align: center;
    margin: 0;
    letter-spacing: .01em;
}

/* ============================================================
   Hero title (transparent-header home)
   ============================================================ */
.bango-hero-sub {
    color: #fff;
    font-weight: 400;
    font-size: 1.5rem;
    display: block;
    margin-bottom: .1em;
    font-family: "Source Sans 3", sans-serif;
}
.bango-hero-title {
    color: var(--bango-gold-soft);
    font-family: "Playfair Display", serif;
    font-style: italic;
    font-weight: 700;
    line-height: 1.05;
    font-size: 3.4rem;
    margin: 0 0 .6em;
}
@media (max-width: 549px) {
    .bango-hero-title { font-size: 2.2rem; }
    .bango-hero-sub { font-size: 1.15rem; }
}

/* ============================================================
   Gold button — named class (never inline [#hex] in shortcodes)
   ============================================================ */
.button.bango-gold,
.bango-gold.button {
    background-color: var(--bango-gold) !important;
    border-color: var(--bango-gold) !important;
    color: #fff !important;
    border-radius: 2px;
}
.button.bango-gold:hover,
.bango-gold.button:hover {
    background-color: #a5854a !important;
    border-color: #a5854a !important;
}
.button.bango-gold span { color: #fff !important; }

/* Outline gold (contact submit / secondary) */
.button.bango-outline {
    background: transparent !important;
    border: 1px solid #d8dbe1 !important;
    color: var(--bango-heading) !important;
    letter-spacing: .08em;
}
.button.bango-outline:hover {
    border-color: var(--bango-gold) !important;
    color: var(--bango-gold) !important;
}

/* ============================================================
   Section-heading eyebrow spacing + WPForms tidy-up
   ============================================================ */
.wpforms-container .wpforms-submit {
    background: transparent !important;
    border: 1px solid #d8dbe1 !important;
    color: var(--bango-heading) !important;
    letter-spacing: .08em;
    text-transform: uppercase;
    padding: .7em 2.2em;
    border-radius: 2px;
}
.wpforms-container .wpforms-submit:hover {
    border-color: var(--bango-gold) !important;
    color: var(--bango-gold) !important;
}

/* ============================================================
   Logo lockup: crest + cream serif wordmark (Site Title)
   ============================================================ */
#logo a.bango-logo-lockup,
.bango-logo-lockup {
    display: inline-flex !important;
    align-items: center;
    gap: .6em;
    max-width: none !important;
}
.header-logo-mark img,
.bango-logo-lockup .header-logo {
    height: 50px;
    width: auto !important;
    margin: 0;
    display: inline-block !important;  /* override Flatsome transparent/dark logo toggling */
    max-width: none !important;
}
.header-logo-text {
    font-family: "Playfair Display", Georgia, serif;
    font-weight: 700;
    font-size: 1.45rem;
    line-height: 1.05;
    color: #ece4d3;          /* cream — reads on navy + over the dark hero */
    white-space: nowrap;
    letter-spacing: .01em;
    text-transform: none;    /* Flatsome uppercases logo text by default */
}
/* allow Flatsome's fixed #logo width to grow for the wordmark */
#logo { width: auto !important; }
#logo a { max-width: none !important; }
@media (max-width: 549px) {
    .header-logo-text { font-size: 1.05rem; white-space: normal; max-width: 8.5em; }
    .header-logo-mark img { height: 38px; }
}

/* Solid navy header (inner pages + sticky): keep menu + wordmark light */
.header:not(.transparent) .header-logo-text,
.stuck .header-logo-text { color: #ece4d3; }

/* ============================================================
   Footer (UX block #36)
   ============================================================ */
.bango-footer { color: #c3c9d3; }
.bango-footer h3 {
    font-family: "Playfair Display", serif;
    color: #ece4d3;
    margin: .4em 0 .5em;
    font-size: 1.5rem;
}
.bango-footer h4 {
    color: #e6bc91;
    font-size: 1rem;
    letter-spacing: .04em;
    margin-bottom: 1em;
}
.bango-footer p,
.bango-footer li { color: #c3c9d3; }
.bango-footer a { color: #c3c9d3; }
.bango-footer a:hover { color: #e6bc91; }
.bango-footer .col img { max-width: 90px; height: auto; }
.bango-footer-nav { list-style: none; margin: 0; padding: 0; }
.bango-footer-nav li { margin-bottom: .5em; }

/* Language switcher stub in header */
.header-bango-lang { display: inline-flex; align-items: center; margin-left: 18px; padding-right: 4px; }
.bango-lang { font-size: .85em; letter-spacing: .03em; white-space: nowrap; color: rgba(255,255,255,.8); }
.bango-lang a { opacity: 1; color: rgba(255,255,255,.8); }
.bango-lang a:hover { color: var(--bango-gold); }
.bango-lang .is-active { color: var(--bango-gold); font-weight: 700; }
/* keep the right-hand header group from overflowing the container edge */
.header-main .nav-right { flex-wrap: nowrap; }

/* ============================================================
   Nav menu link color
   ============================================================ */
.header-nav-main > li > a {
    color: #E6BC91 !important;
}
.header-nav-main > li.active > a,
.header-nav-main > li.current-menu-item > a,
.header-nav-main > li > a:hover {
    color: #ffffff !important;
}
