/*
Theme Name: Hooshnics XTRA Child
Description: Thin integration child theme for Hooshnics. Page layouts are supplied later as approved frontend packages.
Author: Hooshnics
Template: xtra
Version: 0.1.15
Text Domain: hooshnics-xtra-child
*/

/* Home development shell alignment. These selectors target the existing
 * XTRA/Codevz shell only; the standalone preview header/footer are omitted. */
body.page-id-10 .header_2,
body.page-id-10 #site_header .header_2 {
	background: #071b35 !important;
	border-bottom: 1px solid #173b61 !important;
}

/* Solutions uses the same XTRA/Codevz shell as the other approved pages.
 * Only the page content wrapper is made full-bleed; parent theme files stay
 * untouched and the preview header/footer are never rendered. */
body.page-solutions #page_content { margin: 0 !important; }
body.page-solutions #page_content > .row,
body.page-solutions #page_content .cz_post_content,
body.page-solutions #page_content .elementor,
body.page-solutions #page_content .elementor-widget-shortcode,
body.page-solutions #page_content .elementor-shortcode,
body.page-solutions #page_content #hn-main {
	width: 100% !important;
	max-width: none !important;
	margin-inline: 0 !important;
}
body.page-solutions #page_content .elementor-element-hnsolutions,
body.page-solutions #page_content .elementor-element-hnsolutions > .e-con-inner {
	padding: 0 !important;
}
body.page-solutions .header_2,
body.page-solutions #site_header .header_2,
body.page-solutions .header_4,
body.page-solutions #site_header .header_4 {
	background: #071b35 !important;
	border-bottom-color: #173b61 !important;
}
body.page-solutions #menu_header_2 > .cz > a,
body.page-solutions #menu_header_4 > .cz > a,
body.page-solutions #menu_header_4 .cz a { font-weight: 500 !important; }
body.page-solutions #menu_header_2 > .cz > a { color: #eaf6ff !important; background: transparent !important; }
body.page-solutions #menu_header_2 > .cz > a:hover,
body.page-solutions #menu_header_2 > .current_menu > a,
body.page-solutions #menu_header_2 > .current_page_item > a { color: #17baff !important; }
body.page-solutions #menu_header_2 > .hn-header-cta > a {
	background: #079fe2 !important;
	border-radius: 20px !important;
	color: #fff !important;
	font-weight: 500 !important;
	padding-inline: 17px !important;
}
body.page-solutions .cz_middle_footer,
body.page-solutions .footer_2 { background-color: #061d36 !important; }
body.page-solutions #page_content,
body.page-solutions #page_content > .row,
body.page-solutions #page_content > .row > .s12,
body.page-solutions #page_content .cz_is_blank,
body.page-solutions #page_content .cz_post_content,
body.page-solutions #page_content .elementor,
body.page-solutions #page_content .elementor-element-hnsolutions,
body.page-solutions #page_content .elementor-element-hnsolutions > .e-con-inner,
body.page-solutions #page_content .elementor-element-hnsolutionswidget,
body.page-solutions #page_content .elementor-shortcode,
body.page-solutions #hn-main {
	width: 100% !important;
	min-width: 0 !important;
	max-width: 100% !important;
	margin-inline: 0 !important;
}
@media (max-width: 650px) {
	body.page-solutions .hn-page--solutions {
		width: 100vw !important;
		max-width: 100vw !important;
	}
	body.page-solutions .hn-page--solutions .hn-container {
		width: calc(100vw - 30px) !important;
		max-width: calc(100vw - 30px) !important;
	}
	body.page-solutions #site_header,
	body.page-solutions #site_header .header_2,
	body.page-solutions #site_header .header_4,
	body.page-solutions #site_header .row.elms_row,
	body.page-solutions #site_header .row.elms_row > .clr {
		width: 100% !important;
		max-width: 100% !important;
		min-width: 0 !important;
	}
	body.page-solutions #site_header .row.elms_row > .clr { display: flex !important; justify-content: space-between !important; }
	body.page-solutions #site_header .elms_left,
	body.page-solutions #site_header .elms_right { min-width: 0 !important; }
}
body.page-id-10 .header_4,
body.page-id-10 #site_header .header_4 {
	background: #071b35 !important;
	border-bottom: 1px solid #173b61 !important;
}
body.page-id-10 .header_4 i[class*="icon_mobile"] {
	color: #ffffff !important;
	background-color: #079fe2 !important;
}
body.page-id-10 #menu_header_2 > .cz > a {
	color: #eaf6ff !important;
	background: transparent !important;
}
body.page-id-10 #menu_header_2 > .cz > a:hover,
body.page-id-10 #menu_header_2 > .current_menu > a,
body.page-id-10 #menu_header_2 > .current-menu-parent > a {
	color: #17baff !important;
}
body.page-id-10 .cz_middle_footer,
body.page-id-10 .footer_2 {
	background-color: #061d36 !important;
}

/* The XTRA page shell adds a generic 80px page margin and boxed Elementor
 * container. Home owns its full-bleed hero, so remove only that shell spacing
 * while leaving the parent theme and its shared Header/Footer intact. */
body.page-id-10 #page_content {
	margin: 0 !important;
}
body.page-id-10 #page_content > .row,
body.page-id-10 #page_content .cz_post_content,
body.page-id-10 #page_content .elementor,
body.page-id-10 #page_content .elementor-element-hnprivatehome,
body.page-id-10 #page_content .elementor-element-hnprivatehome > .e-con-inner,
body.page-id-10 #page_content .elementor-widget-shortcode,
body.page-id-10 #page_content .elementor-shortcode,
body.page-id-10 #page_content #hn-main {
	width: 100% !important;
	max-width: none !important;
	margin-inline: 0 !important;
}

/* Shared XTRA/Codevz footer inner fragment. XTRA supplies the only outer footer. */
.page_footer .hn-footer-cms {
	background: #061d36;
	color: #fff;
	font-family: var(--hn-font-family, 'Vazir'), sans-serif;
	width: 100%;
}
.page_footer > .row,
.page_footer > .row > .elementor,
.page_footer .elementor-element-hnsharedfooter > .e-con-inner,
.page_footer .elementor-widget-shortcode,
.page_footer .elementor-shortcode {
	width: 100% !important;
	max-width: none !important;
	margin-inline: 0 !important;
}
.page_footer .elementor-element-hnsharedfooter > .e-con-inner { padding: 0 !important; }
.page_footer .elementor-element-hnsharedfooter { padding-inline: 0 !important; }
.hn-footer-cms__inner,
.hn-footer-cms__bottom {
	box-sizing: border-box;
	max-width: 1200px;
	margin-inline: auto;
	padding-inline: 24px;
}
.hn-footer-cms__inner {
	display: grid;
	grid-template-columns: minmax(230px, 1.5fr) repeat(2, minmax(150px, 1fr)) minmax(190px, 1fr);
	gap: 36px;
	padding-top: 48px;
	padding-bottom: 38px;
}
.hn-footer-cms__brand,
.hn-footer-cms__column,
.hn-footer-cms__contact { min-width: 0; }
.hn-footer-cms__logo { display: inline-flex; max-width: 190px; margin-bottom: 18px; }
.hn-footer-cms__logo img { display: block; width: 100%; height: auto; max-height: 58px; object-fit: contain; object-position: right center; }
.hn-footer-cms p { margin: 0 0 10px; color: rgba(255,255,255,.78); font-size: 13px; line-height: 2; }
.hn-footer-cms h2 { margin: 0 0 18px; color: #fff; font-size: 16px; font-weight: 700; }
.hn-footer-cms a { color: rgba(255,255,255,.84); text-decoration: none; }
.hn-footer-cms a:hover, .hn-footer-cms a:focus-visible { color: #18b7f2; }
.hn-footer-cms__menu { list-style: none; margin: 0; padding: 0; }
.hn-footer-cms__menu li { margin: 0 0 9px; font-size: 13px; line-height: 1.8; }
.hn-footer-cms__bottom { display: flex; justify-content: space-between; gap: 16px; padding-top: 14px; padding-bottom: 16px; border-top: 1px solid rgba(255,255,255,.12); color: rgba(255,255,255,.58); font-size: 11px; }
.hn-footer-cms__bottom a { color: inherit; }
@media (max-width: 900px) {
	.hn-footer-cms__inner { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 28px 24px; }
	.hn-footer-cms__brand { grid-column: 1 / -1; }
}
@media (max-width: 560px) {
	.hn-footer-cms__inner { grid-template-columns: 1fr; padding-top: 34px; padding-bottom: 26px; }
	.hn-footer-cms__brand { grid-column: auto; }
	.hn-footer-cms__bottom { flex-direction: column; gap: 6px; }
}
body.page-id-10 #page_content .elementor-element-hnprivatehome,
body.page-id-10 #page_content .elementor-element-hnprivatehome > .e-con-inner {
	padding: 0 !important;
}

/* Match the compact navy reference header and expose the editable CTA menu
 * item as a button without creating a second shell. */
body.page-id-10 #site_header .header_2 .inner_logo_header_2_left_0,
body.page-id-10 #site_header .header_2 .inner_search_header_2_right_0,
body.page-id-10 #site_header .header_2 .inner_menu_header_2_right_1 {
	margin-top: 15px !important;
	margin-bottom: 15px !important;
}
body.page-id-10 #site_header .header_2 {
	border-radius: 0 0 14px 14px;
}
body.page-id-10 #menu_header_2 > .hn-header-cta > a {
	background: #079fe2 !important;
	border-radius: 20px !important;
	color: #fff !important;
	font-weight: 500 !important;
	padding-inline: 17px !important;
}
body.page-id-10 #menu_header_2 > .cz > a { font-weight: 500 !important; }
body.page-id-10 #menu_header_4 > .cz > a,
body.page-id-10 #menu_header_4 .cz a { font-weight: 500 !important; }
body.page-id-10 #menu_header_2 > .hn-header-cta > a:hover,
body.page-id-10 #menu_header_2 > .hn-header-cta.current_menu > a {
	background: #05b7f7 !important;
	color: #fff !important;
}

/* P6B: XTRA renders the logo and menu/search controls as separate table-cell
 * groups. Make the owning row a packed RTL flex row so the logo stays at the
 * right, the menu begins beside it, and unused space remains on the left. */
#site_header .header_2 .row.elms_row > .clr,
#site_header .header_4 .row.elms_row > .clr {
	display: flex !important;
	align-items: center;
	justify-content: flex-start;
	direction: rtl;
	gap: 24px;
	width: 100%;
	max-width: 100%;
}
#site_header .header_2 .row.elms_row > .clr::before,
#site_header .header_2 .row.elms_row > .clr::after,
#site_header .header_4 .row.elms_row > .clr::before,
#site_header .header_4 .row.elms_row > .clr::after {
	display: none !important;
}
#site_header .header_2 .elms_left,
#site_header .header_4 .elms_left {
	display: block;
	flex: 0 0 auto;
	width: auto;
}
#site_header .header_2 .elms_right,
#site_header .header_4 .elms_right {
	display: flex;
	flex: 1 1 auto;
	align-items: center;
	justify-content: flex-end;
	direction: ltr;
	width: auto;
	max-width: none;
	min-width: 0;
}
#site_header .header_2 .elms_left > div,
#site_header .header_4 .elms_left > div,
#site_header .header_2 .elms_right > div,
#site_header .header_4 .elms_right > div {
	display: block;
	float: none;
}
#site_header #menu_header_2 {
	display: flex;
	align-items: center;
	justify-content: flex-start;
	direction: rtl;
	width: auto;
	max-width: none;
}
#site_header #menu_header_4 {
	direction: rtl;
	width: auto;
	max-width: none;
}
#menu_header_4.sidebar_offcanvas_area,
#menu_header_4.sidebar_offcanvas_area > li,
#menu_header_4.sidebar_offcanvas_area > li > a {
	direction: rtl !important;
	text-align: right !important;
}
#site_header #menu_header_2 > .cz,
#site_header #menu_header_4 > .cz {
	flex: 0 0 auto;
	float: none;
}

@media screen and (max-width: 1024px) {
	#site_header .header_4 .row.elms_row > .clr {
		justify-content: space-between;
		gap: 0;
	}
	#site_header .header_4 .elms_right {
		flex: 0 0 auto;
		justify-content: flex-start;
	}
}

/* P8: the approved About/Contact references use the same dark corporate
 * shell as Home. The previous XTRA inner-page title bar exposed a light logo
 * on white and inserted a non-reference blue strip above the page hero. */
body.page-about .header_2,
body.page-about #site_header .header_2,
body.page-about .header_4,
body.page-about #site_header .header_4,
body.page-contact .header_2,
body.page-contact #site_header .header_2,
body.page-contact .header_4,
body.page-contact #site_header .header_4 {
	background: #071b35 !important;
	border-bottom: 1px solid #173b61 !important;
}
body.page-about #menu_header_2 > .cz > a,
body.page-contact #menu_header_2 > .cz > a {
	color: #eaf6ff !important;
	background: transparent !important;
}
body.page-about #menu_header_2 > .cz > a:hover,
body.page-about #menu_header_2 > .current_menu > a,
body.page-about #menu_header_2 > .current_page_item > a,
body.page-contact #menu_header_2 > .cz > a:hover,
body.page-contact #menu_header_2 > .current_menu > a,
body.page-contact #menu_header_2 > .current_page_item > a {
	color: #17baff !important;
}
body.page-about #menu_header_2 > .hn-header-cta > a,
body.page-contact #menu_header_2 > .hn-header-cta > a {
	background: #079fe2 !important;
	border-radius: 20px !important;
	color: #fff !important;
}
body.page-about .header_4 i[class*="icon_mobile"],
body.page-contact .header_4 i[class*="icon_mobile"] {
	color: #fff !important;
	background-color: #079fe2 !important;
}
body.page-about .page_title,
body.page-contact .page_title {
	display: none !important;
}
body.page-about #page_content {
	margin: 0 !important;
}
body.page-about #page_content > .row,
body.page-about #page_content > .row > .s12,
body.page-about #page_content .cz_is_blank,
body.page-about #page_content .cz_post_content,
body.page-about #page_content .elementor,
body.page-about #page_content .hn-page--about,
body.page-about #page_content .elementor-element-800f42d,
body.page-about #page_content .elementor-element-800f42d > .e-con-inner {
	width: 100% !important;
	max-width: none !important;
	min-width: 0 !important;
	margin-inline: 0 !important;
}
body.page-about #page_content .elementor-element-800f42d > .e-con-inner {
	padding: 0 !important;
}
body.page-about #page_content .elementor-element-800f42d {
	padding: 0 !important;
}

/* P8: Elementor's page-level typography overrides were winning over the
 * self-hosted Vazir family. Keep icon-font elements outside this text rule. */
body.page-about .hn-page--about,
body.page-about .hn-page--about h1,
body.page-about .hn-page--about h2,
body.page-about .hn-page--about h3,
body.page-about .hn-page--about h4,
body.page-about .hn-page--about p,
body.page-about .hn-page--about a,
body.page-about .hn-page--about span,
body.page-about .hn-page--about strong,
body.page-about .hn-page--about button,
body.page-about .hn-page--about label,
body.page-about .hn-page--about input,
body.page-about .hn-page--about select,
body.page-about .hn-page--about textarea,
body.page-contact .hn-page--contact,
body.page-contact .hn-page--contact h1,
body.page-contact .hn-page--contact h2,
body.page-contact .hn-page--contact h3,
body.page-contact .hn-page--contact h4,
body.page-contact .hn-page--contact p,
body.page-contact .hn-page--contact a,
body.page-contact .hn-page--contact span,
body.page-contact .hn-page--contact strong,
body.page-contact .hn-page--contact button,
body.page-contact .hn-page--contact label,
body.page-contact .hn-page--contact input,
body.page-contact .hn-page--contact select,
body.page-contact .hn-page--contact textarea {
	font-family: var(--hn-font-family, "Vazir"), Tahoma, Arial, sans-serif !important;
}

/* Keep the supplied Contact artwork dark enough for the approved white hero
 * copy even when Elementor's background-image setting is present. */
body.page-contact .hn-contact-hero {
	background-color: #062343 !important;
	background-image: linear-gradient(270deg, rgba(2,18,39,.96) 0%, rgba(3,24,45,.82) 34%, rgba(4,38,61,.42) 67%, rgba(0,19,32,.18) 100%), url("assets/contact-v1_0/images/contact-hero-fixture.webp") !important;
}
body.page-contact .hn-contact-hero h1,
body.page-contact .hn-contact-hero p {
	color: #fff !important;
}
body.page-contact .elementor-element-48f6845,
body.page-contact .elementor-element-46df104 {
	display: none !important;
}