/* Static-build overrides
   ---------------------------------------------------------------
   Content backdrop: the footer-reveal effect keeps #footer position:fixed
   behind the page. Sections with no background of their own (e.g. the
   contact form area) would otherwise let the fixed navy footer show
   through mid-scroll. Painting the page-inner canvas with the site's
   body colour keeps content areas opaque; the footer still reveals in
   the reserved gap after the content ends. */
.footer-overlap .page-inner {
  background-color: var(--the7-body-bg-color, #ffffff);
}

/* size the injected "+" sub-menu arrows so dropdown rows match the other rows */
.dt-mobile-header .next-level-button svg,
.main-nav .next-level-button svg {
  width: 14px;
  height: 14px;
  display: inline-block;
  vertical-align: middle;
}
.dt-mobile-header li.has-children > a > .next-level-button {
  padding-top: 0;
  padding-bottom: 0;
}

/* ==================== professional footer ==================== */
.os-footer {
  background-color: #001D4F;
  color: rgba(255, 255, 255, .8);
  font-family: "Roboto", Helvetica, Arial, Verdana, sans-serif;
}
.os-footer .os-footer-main {
  max-width: 1280px;
  margin: 0 auto;
  padding: 64px 28px 44px;
  box-sizing: border-box;
}
.os-footer .os-footer-grid {
  display: grid;
  grid-template-columns: 1.5fr 1fr 1.2fr 1.3fr;
  gap: 40px;
  text-align: left;
}
.os-footer .os-footer-brand img { max-width: 178px; height: auto; margin-bottom: 16px; }
.os-footer .os-footer-brand p { font-size: 14px; line-height: 1.7; margin: 0 0 18px; color: rgba(255,255,255,.7); }
.os-footer .os-footer-linkedin {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 40px; height: 40px;
  border-radius: 10px;
  background: #0A58A0;
  color: #ffffff;
  transition: background .25s ease, transform .25s ease;
}
.os-footer .os-footer-linkedin:hover { background: #ffffff; color: #001D4F; transform: translateY(-2px); }
.os-footer h4 {
  font-family: "Questrial", Helvetica, Arial, Verdana, sans-serif;
  font-weight: 400;
  font-size: 17px;
  color: #ffffff;
  margin: 6px 0 16px;
}
.os-footer ul { list-style: none; margin: 0; padding: 0; }
.os-footer ul li { margin: 0 0 11px; font-size: 14px; }
.os-footer ul li a { color: rgba(255,255,255,.78); text-decoration: none; transition: color .2s ease; }
.os-footer ul li a:hover { color: #58b8e8; }
.os-footer ul li span { color: rgba(255,255,255,.55); }
.os-footer .os-footer-bottom { border-top: 1px solid rgba(255,255,255,.14); }
.os-footer .os-footer-bottom-inner {
  max-width: 1280px;
  margin: 0 auto;
  padding: 18px 28px;
  display: flex;
  flex-wrap: wrap;
  gap: 8px 24px;
  justify-content: space-between;
  font-size: 12.5px;
  color: rgba(255,255,255,.55);
}
@media (max-width: 980px) {
  .os-footer .os-footer-grid { grid-template-columns: 1fr 1fr; gap: 34px 28px; }
}
@media (max-width: 560px) {
  .os-footer .os-footer-grid { grid-template-columns: 1fr; gap: 30px; }
  .os-footer .os-footer-main { padding: 48px 22px 36px; }
  .os-footer .os-footer-bottom-inner { justify-content: center; text-align: center; }
}

/* keep the back-to-top button stacked above the WhatsApp bubble (all viewports) */
.scroll-top {
  right: 18px !important;
  bottom: 84px !important;
}

/* ---- mobile drawer: clean brand styling (replaces The7's JS-built inner
       scroller, which provided the panel's inner spacing) ---- */
#page .dt-mobile-header {
  background-color: #ffffff;
  padding: 88px 20px 44px 26px;
  box-sizing: border-box;
  overflow-y: auto;
  box-shadow: -14px 0 44px rgba(0, 29, 79, .16);
}
#page .dt-close-mobile-menu-icon {
  position: absolute;
  top: 26px;
  right: 26px;
}
#page .dt-mobile-header .mobile-main-nav {
  margin: 0;
  padding: 0;
}
#page .dt-mobile-header .mobile-main-nav > li > a {
  font-size: 17px;
}
#page .dt-mobile-header .mobile-main-nav .sub-nav a {
  font-size: 15.5px;
}
#page .dt-mobile-header .mobile-main-nav > li {
  border-bottom: 1px solid rgba(10, 88, 160, .18);
}
#page .dt-mobile-header .mobile-main-nav > li:last-child {
  border-bottom: none;
}

/* drawer chevrons rotate when a section is open */
#page .dt-mobile-header li.has-children > a > .next-level-button {
  transition: transform .3s ease;
  transform: none;
}
#page .dt-mobile-header li.has-children.open-sub > a > .next-level-button {
  transform: rotate(180deg);
}

/* ---- "Book a Meeting" highlighted as a button ---- */
/* mobile drawer */
#page .dt-mobile-header .book-a-meeting-item > a {
  display: inline-block;
  background-color: #0A58A0;
  border-radius: 100px;
  padding: 10px 24px;
  margin: 8px 0 12px;
}
#page .dt-mobile-header .book-a-meeting-item > a .menu-text,
#page .dt-mobile-header .book-a-meeting-item > a .menu-item-text {
  color: #ffffff !important;
}
/* desktop dropdown */
.main-nav .sub-nav .book-a-meeting-item > a {
  background-color: #0A58A0;
  border-radius: 8px;
  margin: 6px 10px 8px;
}
.main-nav .sub-nav .book-a-meeting-item > a .menu-text,
.main-nav .sub-nav .book-a-meeting-item > a .menu-item-text {
  color: #ffffff !important;
}
.main-nav .sub-nav .book-a-meeting-item > a:hover {
  background-color: #001D4F;
}
#page .dt-mobile-header .book-a-meeting-item > a:hover {
  background-color: #001D4F;
}
