/* Project overrides on top of the exported Webflow CSS. Add custom tweaks here;
   do not edit the generated webflow css files. */
main {
  display: block;
}

/* Mobile/tablet language switcher: flow the chevron right after the label (the
   exported CSS absolute-positions it to the far edge, leaving a huge gap) and
   keep the label readable at small breakpoints. */
.language_switcher-wrapper.is-tablet {
  text-align: center;
}
.language_switcher-wrapper.is-tablet .dropdown-toggle {
  width: auto;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  padding-right: 0;
}
.language_switcher-wrapper.is-tablet .local-text {
  order: 1;
  font-size: 1.125rem;
  line-height: 100%;
}
.language_switcher-wrapper.is-tablet .icon {
  order: 2;
  position: static;
  inset: auto;
  margin: 0;
  transform: none;
}

/* Topbar language switcher: it's a <div> (needs to be, for the dropdown
   widget), so it misses the browser-default `a { font-weight: 500 }` rule
   its sibling nav links (real <a> tags) get for free — match it explicitly.
   Also drop the default focus ring; the dropdown already shows its open
   state visually (white panel), so a browser outline is just noise here. */
.language_switcher-wrapper .dropdown-toggle {
  font-weight: 500;
}
/* The wrapper is a plain block box taller than its content (24px toggle
   inside a ~37.5px line box), so normal text-flow placement sat the toggle
   near the bottom instead of centered — unlike sibling nav links, which are
   centered by the parent .button-group's flexbox directly. Flexing the
   wrapper itself (and its one unstyled inner div) centers it the same way. */
.language_switcher-wrapper:not(.is-tablet) {
  display: flex;
  align-items: center;
  height: 100%;
}
.language_switcher-wrapper:not(.is-tablet) > div {
  display: flex;
  align-items: center;
}
/* The dropdown chevron is absolutely positioned and bottom-aligned by a
   shared `.icon` rule elsewhere on the site (`inset: auto -1rem 0% auto`),
   which sits it 6px lower than the globe icon/text. Same fix as the tablet
   variant above: let it flow as a normal flex child instead, so the
   toggle's own `align-items: center` centers all three pieces together. */
.language_switcher-wrapper:not(.is-tablet) .dropdown-toggle .icon.w-icon-dropdown-toggle {
  position: static;
  inset: auto;
  margin: 0;
}
.language_switcher-wrapper .dropdown-toggle:focus,
.language_switcher-wrapper .dropdown-toggle:focus-visible {
  outline: none;
}
/* The dropdown list only got `min-width: 100%` (of the ~90px toggle) from
   Webflow's base .w-dropdown-list rule, so "Dansk (DK)" / "English (EN)"
   wrapped to two lines. Size it to its content instead. */
.language_switcher-wrapper .dropdown-local {
  min-width: max-content;
}
.language_switcher-wrapper .locales-list a {
  white-space: nowrap;
  padding: 0.375rem 0.5rem;
  border-radius: 0.375rem;
  display: block;
}
.language_switcher-wrapper .locales-list a:hover {
  background-color: var(--_primitives---frankly-warm-beige--limestone-20);
}
.language_switcher-wrapper .locales-list a.w--current {
  color: var(--_primitives---base--40-black);
}
/* Footer variant: same component as the topbar, but it sits on a light
   background, so the trigger (icon + label, via `currentColor`) needs to be
   dark instead of the `.button.is-link.is-icon` default light text color.
   Matches `.footer6_credit-text` right next to it. */
.language_switcher-wrapper.is-light .dropdown-toggle {
  color: var(--_primitives---base--black);
}

/* Blog body images (PortableText `richImage` → figure.post-image).
   The class was emitted but never styled, so images rendered narrow. Two causes:
   the UA <figure> side margins, and webflow.css's `.w-richtext figure` capping
   figures at max-width:60%. The selector below is scoped to .w-richtext so it
   outranks that rule (0,2,1 vs 0,1,1) rather than relying on !important. */
.w-richtext figure.post-image,
.post-image {
  max-width: 100%;
  margin: 2.5rem 0;
}
.post-image img {
  display: block;
  width: 100%;
  height: auto;
  border-radius: var(--_ui-styles---radius--medium);
}
.post-image figcaption {
  margin-top: 0.75rem;
  font-size: 0.875rem;
  color: var(--_primitives---base--40-black);
}
