Responsive Dark Header - Copy this Html, Bootstrap Component to your project

Design-a-responsive-header-with-a-height-of-9vh-for-desktop-and-11-12vh-for-mobile-devices.-The-header-should-have-a-black-background-color-and-display-two-elements:-a-phone-number-on-the-left-and-social-media-icons-(Facebook-and-Instagram)-on-the-right.-On-desktop,-position-the-phone-number-to-the-left-and-the-social-media-icons-to-the-right,-both-aligned-vertically-in-the-center-of-the-header.-For-mobile:-Center-all-elements-both-horizontally-and-vertically-within-the-header.-Arrange-the-phone-number-on-the-first-row-and-centered.-Place-the-social-media-icons-on-a-second-row-below-the-phone-number,-also-centered.-Ensure-the-header-adjusts-smoothly-across-various-screen-sizes-for-optimal-responsiveness.