/* Shared revamp navigation. Tool-page geometry is the reference for every page. */
.bf-marketing .bf-header{position:relative;top:0;z-index:5;background:rgba(255,255,255,.97);border:0;border-bottom:1px solid #edf5fd}
.bf-marketing .bf-header .bf-header-inner{width:calc(100% - 80px);max-width:1360px;min-height:64px;margin-inline:auto;padding:0 22px 0 0;box-sizing:border-box;gap:62px}
.bf-marketing .bf-header .bf-logo img{width:174px;height:auto}
@media(min-width:1101px){.bf-marketing .bf-header{background:linear-gradient(90deg,#fff 30%,#ffffffcc 52%,#ffffff00 100%);border-bottom:0}}
@media(max-width:1150px){.bf-marketing .bf-header .bf-header-inner{gap:28px}}
@media(max-width:1100px){.bf-marketing .bf-header .bf-header-inner{width:calc(100% - 40px)}}
@media(max-width:640px){.bf-marketing .bf-header .bf-header-inner{min-height:65px}.bf-marketing .bf-header .bf-logo img{width:160px}}
@media(max-width:600px){.bf-marketing .bf-header .bf-header-inner{padding-right:12px}}
@media(max-width:500px){.bf-marketing .bf-header .bf-header-inner{width:calc(100% - 28px)}}

/* Shared circular language controls; reuses the existing i18n option handling. */
.bf-marketing .bf-language-flags{display:flex;align-items:center;gap:4px;flex-shrink:0}
.bf-marketing .bf-language-flag{width:30px;min-width:30px;height:30px;padding:3px;margin:0;border:1px solid #cddcec;border-radius:50%;background:#fff;display:inline-flex;align-items:center;justify-content:center;cursor:pointer;box-shadow:none}
.bf-marketing .bf-language-flag .flag-icon{display:block;width:22px;height:22px;border-radius:50%;overflow:hidden;box-shadow:inset 0 0 0 1px #10274418}
.bf-marketing .bf-language-flag:hover{border-color:#087bff;background:#edf6ff}
.bf-marketing .bf-language-flag.active{border-color:#087bff;box-shadow:0 0 0 2px #087bff30}
.bf-marketing .bf-language-flag:focus-visible{outline:2px solid #087bff;outline-offset:3px}
@media(pointer:coarse){.bf-marketing .bf-language-flag{width:40px;min-width:40px;height:40px}.bf-marketing .bf-language-flags{gap:5px}}
.bf-language-flags .flag-en {
  background-color: #012169;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 60 60'%3E%3CclipPath id='c'%3E%3Ccircle cx='30' cy='30' r='30'/%3E%3C/clipPath%3E%3Cg clip-path='url(%23c)'%3E%3Cpath fill='%23012169' d='M0 0h60v60H0z'/%3E%3Cpath stroke='%23fff' stroke-width='12' d='m0 0 60 60M60 0 0 60'/%3E%3Cpath stroke='%23c8102e' stroke-width='7' d='m0 0 60 60M60 0 0 60'/%3E%3Cpath stroke='%23fff' stroke-width='20' d='M30 0v60M0 30h60'/%3E%3Cpath stroke='%23c8102e' stroke-width='12' d='M30 0v60M0 30h60'/%3E%3C/g%3E%3C/svg%3E");
  background-size: cover;
  background-position: center;
}

.bf-language-flags .flag-nl {
  background: linear-gradient(180deg, #ae1c28 0 33.33%, #fff 33.33% 66.66%, #21468b 66.66% 100%);
}

.bf-language-flags .flag-de {
  background: linear-gradient(180deg, #000 0 33.33%, #dd0000 33.33% 66.66%, #ffce00 66.66% 100%);
}

.bf-language-flags .flag-fr {
  background: linear-gradient(90deg, #0055a4 0 33.33%, #fff 33.33% 66.66%, #ef4135 66.66% 100%);
}

.bf-language-flags .flag-es {
  background: linear-gradient(180deg, #aa151b 0 25%, #f1bf00 25% 75%, #aa151b 75% 100%);
}

