/* === Joussor Brand Identity overrides - 2026-06-23 ===
   Source: Joussor Brand Identity EDIT.pdf
   Brand colors: orange #f0471c, black #12110f, dove gray #676767, white #ffffff.
   Fonts: Made Tommy / Helvetica Neue LT with safe web fallbacks.
=== */
:root{
  --joussor-orange:#f0471c;
  --joussor-black:#12110f;
  --joussor-gray:#676767;
  --joussor-light:#f7f7f7;
  --joussor-white:#ffffff;
  --joussor-font-en:"Made Tommy","MADE TOMMY","Helvetica Neue",Arial,sans-serif;
  --joussor-font-ar:"HelveticaNeueLTArabic","Helvetica Neue LT","Helvetica Neue",Arial,Tahoma,sans-serif;
}

html, body,
body.rtl,
body.rtl p,
body.rtl li,
body.rtl input,
body.rtl textarea,
body.rtl select,
body.rtl button{
  font-family:var(--joussor-font-ar)!important;
}
body:not(.rtl),
body:not(.rtl) p,
body:not(.rtl) li,
body:not(.rtl) input,
body:not(.rtl) textarea,
body:not(.rtl) select,
body:not(.rtl) button{
  font-family:var(--joussor-font-en)!important;
}
h1,h2,h3,h4,h5,h6,
.vc_custom_heading,
.widget_title,
.main_menu_nav > li > a,
.top_nav .top_nav_wrapper > ul > li > a{
  font-family:inherit!important;
  letter-spacing:0!important;
}
body{
  color:var(--joussor-gray)!important;
}
h1,h2,h3,h4,h5,h6,
.vc_custom_heading,
.page_title h1,
.entry-header h1,
.stm_icon .stm_icon_title,
.info_box h4,
.service h4,
#footer .wnt-footer h3{
  color:var(--joussor-black)!important;
}
p, li, .wpb_text_column, .wpb_text_column p{
  color:var(--joussor-gray);
}
a,
a:hover,
.top_nav .top_nav_wrapper > ul > li.current-menu-item > a,
.top_nav .top_nav_wrapper > ul > li.current_page_item > a{
  color:var(--joussor-orange);
}

/* Replace old cyan accents with brand orange without changing layout */
.base_bg_color,
.secondary_bg_color,
.theme_bg_color,
.button,
a.button,
button.button,
.vc_btn3.vc_btn3-color-theme_style,
.vc_general.vc_btn3,
input[type="submit"],
input[type="button"],
.wpcf7-submit,
.theme-wpcf7-submit,
.header_top .button,
.top_bar_info_wr .top_bar_info_switcher .active,
.top_bar_info_wr .top_bar_info_switcher ul li a:hover,
.rev_slider .tp-caption a.button,
.rev_slider .button{
  background-color:var(--joussor-orange)!important;
  border-color:var(--joussor-orange)!important;
  color:var(--joussor-white)!important;
}
.button:hover,
a.button:hover,
button.button:hover,
.vc_general.vc_btn3:hover,
input[type="submit"]:hover,
.wpcf7-submit:hover,
.theme-wpcf7-submit:hover,
.rev_slider .button:hover{
  background-color:var(--joussor-black)!important;
  border-color:var(--joussor-black)!important;
  color:var(--joussor-white)!important;
}

.top_nav .top_nav_wrapper > ul > li.current-menu-item > a:after,
.top_nav .top_nav_wrapper > ul > li.current_page_item > a:after,
.top_nav .top_nav_wrapper > ul > li > a:hover:after,
.wpb_content_element .wpb_tabs_nav li.ui-tabs-active a:after,
.vc_custom_heading:before,
.vc_custom_heading:after,
.stm_title_line,
.heading-line,
.icon_box .icon:before{
  background-color:var(--joussor-orange)!important;
  border-color:var(--joussor-orange)!important;
}

.stm_icon svg,
.stm_icon svg path,
.stm_icon svg line,
.stm_icon svg polyline,
.stm_icon svg rect,
.stm_icon svg circle,
.stm_icon i,
.fa,
.fas,
.fab{
  color:var(--joussor-orange)!important;
  stroke:var(--joussor-orange)!important;
}

/* Header language/top controls */
.header_top,
.header_top_bar,
.mobile_header .top_nav_mobile,
.mobile_header .mobile_header_top_bar{
  background-color:var(--joussor-black)!important;
}
.header_top a,
.header_top_bar a,
.top_bar_info_wr a,
.mobile_header a{
  color:var(--joussor-white)!important;
}
.top_bar_info_wr .top_bar_info_switcher .active,
.top_bar_info_wr .top_bar_info_switcher ul{
  background-color:var(--joussor-orange)!important;
}

/* Hero and section overlays stay dark, but use brand black tone */
.page_title,
.stm_title_box,
.breadcrumbs,
.rev_slider_wrapper,
.rev_slider{
  --joussor-overlay:rgba(18,17,15,.72);
}

/* Contact/request forms */
.request_quote,
.base_bg_color .request_quote,
.wpcf7 .request_quote,
#quote.base_bg_color{
  background-color:var(--joussor-black)!important;
}
.request_quote input,
.request_quote textarea,
.request_quote select,
.wpcf7 input,
.wpcf7 textarea,
.wpcf7 select{
  border-radius:0!important;
  border-color:#e5e5e5!important;
  color:var(--joussor-black)!important;
  font-family:var(--joussor-font-ar)!important;
}
.request_quote input::placeholder,
.request_quote textarea::placeholder,
.wpcf7 input::placeholder,
.wpcf7 textarea::placeholder{
  color:#8a8a8a!important;
}

/* Services benefits section */
.jisoor-benefits-section{
  background-color:#f7f7f7!important;
}
.jisoor-benefits-section .vc_column-inner{
  border-top-color:var(--joussor-orange)!important;
}
.jisoor-benefits-section .stm_icon svg,
.jisoor-benefits-section .stm_icon svg *,
.jisoor-benefits-section .stm_icon i{
  color:var(--joussor-orange)!important;
  stroke:var(--joussor-orange)!important;
}

/* Footer injected by WPBakery custom JS */
#footer .wnt-footer,
#footer .wnt-footer p,
#footer .wnt-footer li,
#footer .wnt-footer a{
  font-family:var(--joussor-font-ar)!important;
}
#footer .wnt-footer-en,
#footer .wnt-footer-en p,
#footer .wnt-footer-en li,
#footer .wnt-footer-en a{
  font-family:var(--joussor-font-en)!important;
}
#footer .wnt-footer h3,
#footer .wnt-footer strong{
  color:var(--joussor-black)!important;
}
#footer .wnt-footer p,
#footer .wnt-footer li,
#footer .wnt-footer-copy,
#footer .wnt-footer-bottom a{
  color:var(--joussor-gray)!important;
}
#footer .wnt-footer a:hover,
#footer .wnt-social a:hover{
  color:var(--joussor-orange)!important;
}
#footer .wnt-footer-bottom{
  border-top-color:var(--joussor-black)!important;
}

/* Selection and small UI accents */
::selection{
  background:var(--joussor-orange);
  color:var(--joussor-white);
}
::-moz-selection{
  background:var(--joussor-orange);
  color:var(--joussor-white);
}
/* === /Joussor Brand Identity overrides === */

/* === Joussor Brand Identity: high-specificity legacy cyan cleanup === */
#stm_magic_line,
.slider_line,
sr7-shp.slider_line,
.sr7-layer.slider_line,
.top_nav .icon_text,
.top_nav .top_nav_wrapper > ul > li > a:before,
.top_nav .top_nav_wrapper > ul > li > a:after,
.header_top .button,
.header_top a.button,
.top_nav_button,
.top_nav .top_nav_button,
.top_bar_info_switcher,
.top_bar_info_switcher .active,
.top_bar_info_wr .top_bar_info_switcher .active,
.top_bar_info_wr .top_bar_info_switcher ul,
body .vc_tta-panel.vc_active .vc_tta-panel-heading,
body .vc_tta-panel-heading,
body .post_list_main_section_wrapper .date,
body .date,
body .info_box .icon,
body .icon_box .icon{
  background-color:var(--joussor-orange)!important;
  border-color:var(--joussor-orange)!important;
}
.slider_line,
sr7-shp.slider_line,
.sr7-layer.slider_line{
  background:var(--joussor-orange)!important;
  border-color:var(--joussor-orange)!important;
}
body [class^="stm-"],
body [class*=" stm-"],
body .icon,
body .icon i,
body .icon svg,
body .icon svg *,
body .stm_icon svg,
body .stm_icon svg *,
body .stm_icon i{
  color:var(--joussor-orange)!important;
  stroke:var(--joussor-orange)!important;
}
body .icon svg .cls-1,
body .stm_icon svg .cls-1{
  stroke:var(--joussor-orange)!important;
  fill:none!important;
}
.header_top .button:hover,
.header_top a.button:hover,
.top_nav_button:hover,
.top_nav .top_nav_button:hover{
  background-color:var(--joussor-black)!important;
  border-color:var(--joussor-black)!important;
}
/* === /Joussor Brand Identity: high-specificity legacy cyan cleanup === */

/* === Joussor service detail pages: FAQ and feature band cleanup === */
.single-stm_service .vc_tta-container,
.single-stm_service .vc_tta-panels,
.single-stm_service .vc_tta-panel,
.single-stm_service .vc_tta-panel-heading{
  background:transparent!important;
  border-color:transparent!important;
}
.single-stm_service .vc_tta-panel{
  margin-bottom:12px!important;
  border:1px solid #eeeeee!important;
  background:#ffffff!important;
  box-shadow:0 10px 28px rgba(18,17,15,.05)!important;
}
.single-stm_service .vc_tta-panel-heading{
  background:#ffffff!important;
  border:0!important;
}
.single-stm_service .vc_tta-panel-title > a,
.single-stm_service .vc_tta-panel-heading a{
  color:var(--joussor-black)!important;
  background:#ffffff!important;
  border:0!important;
  font-weight:700!important;
  line-height:1.7!important;
}
.single-stm_service .vc_tta-panel-title > a:hover,
.single-stm_service .vc_tta-panel.vc_active .vc_tta-panel-title > a,
.single-stm_service .vc_tta-panel.vc_active .vc_tta-panel-heading a{
  color:var(--joussor-orange)!important;
}
.single-stm_service .vc_tta-controls-icon:before,
.single-stm_service .vc_tta-controls-icon:after{
  border-color:var(--joussor-orange)!important;
}
.single-stm_service .vc_tta-panel-body{
  background:#ffffff!important;
  border:0!important;
  border-top:1px solid #eeeeee!important;
  color:var(--joussor-gray)!important;
  line-height:2!important;
}
.single-stm_service .services_icons.secondary_bg_color,
.single-stm_service .services_icons{
  background:var(--joussor-black)!important;
  color:#ffffff!important;
  margin-top:70px!important;
}
.single-stm_service .services_icons .wpb_column > .vc_column-inner{
  min-height:360px!important;
  background:rgba(255,255,255,.045)!important;
  border-left:1px solid rgba(255,255,255,.08)!important;
  border-right:0!important;
  box-shadow:none!important;
}
.single-stm_service .services_icons .wpb_column:nth-child(2) > .vc_column-inner{
  background:rgba(255,255,255,.075)!important;
}
.single-stm_service .services_icons h1,
.single-stm_service .services_icons h2,
.single-stm_service .services_icons h3,
.single-stm_service .services_icons h4,
.single-stm_service .services_icons .vc_custom_heading,
.single-stm_service .services_icons .stm_icon_title,
.single-stm_service .services_icons .icon_box h4,
.single-stm_service .services_icons p,
.single-stm_service .services_icons li{
  color:#ffffff!important;
}
.single-stm_service .services_icons p{
  color:rgba(255,255,255,.72)!important;
  max-width:360px;
  margin-left:auto!important;
  margin-right:auto!important;
}
.single-stm_service .services_icons .icon,
.single-stm_service .services_icons .stm_icon,
.single-stm_service .services_icons [class^="stm-"],
.single-stm_service .services_icons [class*=" stm-"],
.single-stm_service .services_icons svg,
.single-stm_service .services_icons svg *{
  color:var(--joussor-orange)!important;
  stroke:var(--joussor-orange)!important;
  border-color:transparent!important;
  outline-color:transparent!important;
}
/* === /Joussor service detail pages cleanup === */

/* ===== Helvetica Neue LT Arabic - Arabic version only ===== */
@font-face {
  font-family: 'HelveticaNeueLTArabic';
  src: url('/wp-content/themes/transcargo/assets/fonts/helvetica-neue-arabic/alfont_com_AlFont_com_helveticaneueltarabicroman1.ttf') format('truetype');
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}

html[lang="ar"] body,
html[lang="ar"] h1,
html[lang="ar"] h2,
html[lang="ar"] h3,
html[lang="ar"] h4,
html[lang="ar"] h5,
html[lang="ar"] h6,
html[lang="ar"] p,
html[lang="ar"] a,
html[lang="ar"] li,
html[lang="ar"] span,
html[lang="ar"] div,
html[lang="ar"] button,
html[lang="ar"] input,
html[lang="ar"] textarea,
html[lang="ar"] select,
html[lang="ar"] label {
  font-family: 'HelveticaNeueLTArabic', 'Helvetica Neue', Arial, sans-serif !important;
}
/* ===== /Helvetica Neue LT Arabic ===== */
/* last-updated: 2026-06-25T03:02:02.338Z */

/* ===== About Us page - Black background sections ===== */
.jsm-partners {
  background: #000 !important;
  color: #fff !important;
}
.jsm-partners .jsm-about-title,
.jsm-partners .jsm-about-text {
  color: #fff !important;
}
.vc_custom_1781689482424 {
  background-color: #000 !important;
}
.vc_custom_1781689482424 h2,
.vc_custom_1781689482424 h3,
.vc_custom_1781689482424 .vc_custom_heading {
  color: #fff !important;
}
/* ===== /About Us page - Black background sections ===== */