/* Owner's 20 October desktop-only Fintech composition.
   Keep the shared kit byte-identical. This opt-in class is used only by the
   home header; phones and the separate Fiji Digital header keep the kit layout. */
@layer dimau-kit-light {
  @media (min-width: 901px) and (min-height: 501px) {
    :root:not(#dk) .dk-header.fintech-desktop-header {
      grid-template-columns: minmax(0, 1fr) auto auto !important;
      grid-template-areas: "brand brand end" "nav nav tools" !important;
      gap: 12px 20px !important;
      padding: 12px clamp(20px, 2vw, 32px) !important;
    }
    :root:not(#dk) .fintech-desktop-header .dk-brand {
      gap: 12px !important;
    }
    :root:not(#dk) .fintech-desktop-header .dk-nav {
      align-self: center !important;
      gap: 8px !important;
      padding: 4px !important;
    }
    :root:not(#dk) .fintech-desktop-header .dk-nav > :is(a, button) {
      height: 44px !important;
      min-height: 44px !important;
    }
    :root:not(#dk) .fintech-desktop-header .dk-tools {
      justify-self: end !important;
    }
  }
  @media (min-width: 1200px) and (min-height: 501px) {
    :root:not(#dk) .dk-header.fintech-desktop-header {
      grid-template-columns: minmax(0, 1fr) auto auto auto !important;
      grid-template-areas: "brand nav end tools" !important;
    }
    :root:not(#dk) .fintech-desktop-header .dk-nav {
      justify-content: flex-end !important;
    }
  }
}
