/* Ventoo + Innomax shortcode compatibility (loaded on CMS pages with innomax blocks) */

html.innomax-demo-styles .react-awesome-reveal,
html.innomax-demo-styles .react-awesome-reveal > div,
html.innomax-demo-styles [class*="css-"][style*="opacity"] {
  opacity: 1 !important;
  transform: none !important;
  visibility: visible !important;
  animation: none !important;
}

/* Keep page scrollable vertically; clip horizontal bleed without breaking sticky/pin */
html {
  overflow-x: clip;
}

body.techco-react.cybersecurity,
body.techco-react.it-services,
body.techco-react.data_analytics,
body.techco-react.cloud-and-devops,
body.techco-react.help_desk,
body.techco-react.body_wrap,
body.techco-react {
  overflow-x: clip !important;
  overflow-y: visible !important;
  height: auto !important;
}

.ventoo-flow-shell,
.ventoo-flow-shell .body_wrap,
.ventoo-flow-shell .page_content {
  overflow: visible;
  position: relative;
  max-width: 100%;
}

/* Process sticky cards need overflow:visible on the section.
   Do not clip sa-process_right — it breaks the demo illustration. */
.ventoo-flow-shell section.process {
  overflow: visible !important;
}

/* RTL: icon on one side, number on the other */
.ventoo-flow-shell .sa-process_left .process-item .xb-item--number,
[dir="rtl"] .sa-process_left .process-item .xb-item--number {
  right: auto !important;
  left: 30px !important;
}

/* RTL: sidebar gap should be toward content (inline-start), not outer left */
.ventoo-flow-shell .sidebar,
[dir="rtl"] .sidebar {
  margin-left: 0 !important;
  margin-right: 80px;
}

@media (max-width: 1199px) {
  .ventoo-flow-shell .sidebar,
  [dir="rtl"] .sidebar {
    margin-right: 40px;
  }
}

@media (max-width: 991px) {
  .ventoo-flow-shell .sidebar,
  [dir="rtl"] .sidebar {
    margin-right: 0;
  }
}

/* Hero4 demo title is 160px — unusable for CMS multi-word titles */
.hero.hero-style-three.is-shortcode .xb-item--title {
  font-size: clamp(2.2rem, 5vw, 4.5rem) !important;
  letter-spacing: 0.04em !important;
  line-height: 1.25 !important;
  text-transform: none !important;
  max-width: 18ch;
  margin-inline: auto;
}

.hero.hero-style-three.is-shortcode .xb-item--title span {
  display: inline;
  -webkit-text-fill-color: #ae6dfe;
  background: none;
  color: #ae6dfe;
}

.hero.hero-style-three.is-shortcode .xb-item--holder {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 1rem;
  margin-top: 1rem;
}

.hero.hero-style-three.is-shortcode .xb-item--content {
  font-size: 1.1rem !important;
  max-width: 36rem;
  opacity: 0.9;
}

.hero.hero-style-three.is-shortcode .xb-item--item {
  text-align: start;
  margin: 0 auto;
}

.hero.hero-style-three.is-shortcode .xb-item--item li {
  color: #fff;
  margin-bottom: 0.4rem;
}

/* Scope dark cyber background to the block when mixed with Ventoo sections */
.innomax-block--hero4 {
  background: #010315;
  color: #fff;
}

.innomax-block--hero2,
.innomax-block--hero3,
.innomax-block--hero5,
.innomax-block--hero6,
.innomax-block--hero,
.innomax-block--hero-banner-1 {
  isolation: isolate;
}