.header.hdr2 {display: block; padding: 0; background-color: #121820; border-radius: 20px 20px 0 0;}
.hdr2__top {display: flex; align-items: center; gap: 24px; height: 80px; padding: 0 40px;}
.hdr2 .logo {flex-shrink: 0; height: 40px; margin: 0; line-height: 40px; font-size: 30px; background-size: 40px; padding-left: 50px;}
.hdr2 .search-wrap {flex: 1 1 auto; min-width: 0; max-width: 560px; margin: 0 auto;}
.hdr2 .search-box {position: relative;}
.hdr2 .search-box input, .hdr2 .search-box input:focus {height: 44px; line-height: 44px; font-size: 14px;}
.hdr2 .search-box input:not(:focus)::placeholder {font-size: 14px;}
.hdr2 .search-box button {height: 44px; line-height: 44px;}
.hdr2 .quick-actions {flex-shrink: 0;}
.hdr2 .quick-action {width: 40px; height: 40px; min-width: 40px;}
.hdr2 .header-btn {display: inline-flex; flex-shrink: 0; align-items: center; justify-content: center; gap: 8px; height: 40px; padding: 0 18px;}
.hdr2 .header-btn .fas {font-size: 14px;}
.hdr2 .btn-menu {display: none;}

.hdr2__nav {display: flex; align-items: center; gap: 4px; height: 52px; padding: 0 34px; background-color: #0f141b; border-top: 1px solid rgba(143,167,198,.12);}
.hdr2__tabs, .hdr2__side {display: flex; align-items: center; gap: 4px;}
.hdr2__side {margin-left: auto;}
.hdr2__tab {display: inline-flex; flex: 0 0 auto; align-items: center; gap: 6px; height: 34px; padding: 0 12px; border-radius: 9px; color: #aac2e0; font-size: 14px; font-weight: 600; line-height: 1; white-space: nowrap; text-decoration: none;}
.hdr2__tab .fas {font-size: 12px;}
.hdr2__tab:hover, .hdr2__tab:focus-visible {background-color: rgba(143,167,198,.12); color: #fff; outline: none;}
.hdr2__tab.is-active {color: #fff; box-shadow: inset 0 -2px 0 #ffbb00; border-radius: 9px 9px 0 0;}
.hdr2__tab--cta, .hdr2__tab--cta:hover, .hdr2__tab--cta:focus-visible {background-color: #ffbb00; color: #121820;}
.hdr2__tab--cta:hover, .hdr2__tab--cta:focus-visible {background-color: #ffc933;}
.hdr2__tab--quiet {color: #8fa7c6; font-weight: 500;}

@media screen and (max-width: 1220px) {
	.header.hdr2 {padding: 0; border-radius: 0;}
	.hdr2__top {gap: 14px; height: 72px; padding: 0 20px;}
	.hdr2 .logo {font-size: 24px; background-size: 34px; padding-left: 42px;}
	.hdr2 .btn-menu {display: grid; place-items: center; flex-shrink: 0; width: 44px; height: 44px; margin: 0; font-size: 26px; line-height: 1;}
	.hdr2 .quick-action {width: 44px; height: 44px; min-width: 44px;}
	.hdr2 .header-btn {height: 44px;}
	.hdr2__nav {gap: 4px; padding: 0 14px; overflow-x: auto; scrollbar-width: none; -webkit-overflow-scrolling: touch;}
	.hdr2__nav::-webkit-scrollbar {display: none;}
	.hdr2__side {margin-left: 0;}
	.hdr2__tab {height: 36px;}
}

@media screen and (max-width: 950px) {
	.hdr2 .search-wrap {order: 0; min-width: 0; max-width: none; margin: 0;}
}

@media screen and (max-width: 760px) {
	.hdr2 .logo {margin-right: 0; min-width: 0;}
	.hdr2 .header-btn {width: 44px; padding: 0;}
	.hdr2 .header-btn .hdr2__btn-t {display: none;}
}

@media screen and (max-width: 590px) {
	.hdr2__top {flex-wrap: wrap; row-gap: 10px; column-gap: 6px; height: auto; padding: 10px 16px 12px;}
	.hdr2 .logo {width: auto; max-width: none; margin-right: auto; overflow: visible; font-size: 22px; padding-left: 40px; background-size: 34px;}
	.hdr2 .logo span {font-size: inherit;}
	.hdr2 .search-wrap {order: 10; flex: 1 1 100%;}
	.hdr2 .header-btn, .hdr2 .btn-menu {position: static;}
	.hdr2 .header-btn.hdr2__guest {width: auto; padding: 0 14px;}
	.hdr2__nav {height: 56px; padding: 0 8px 0 16px;}
	.hdr2__tab {height: 44px;}
}

/* 360px: логотип, кубик, «Увійти» і меню мають вміститися в один ряд (без цього меню переносилось окремим рядком) */
@media screen and (max-width: 380px) {
	.hdr2 .logo {font-size: 18px; padding-left: 36px; background-size: 30px;}
	.hdr2 .header-btn.hdr2__guest {padding: 0 10px;}
}
