/* Shared company-site content width + moderate spacing.
   PC-first: desktop layout is the default. Mobile tweaks live in max-width queries. */

:root {
  --site-content-max: 1120px;
  --site-gutter: 40px;
  --site-gutter-sm: 32px;
}

/* ---- Content width: align with header --site-head-max ---- */
.site-container,
.header-inner,
.section-inner,
.jbid-wrap,
.jplus-wrap,
.mdab-wrap,
.jodari-wrap,
.mkt-wrap,
.vprod-wrap,
.bc-wrap,
.home-wrap,
.inner-main,
.about-intro__inner,
.site-head__inner,
body.home-v1 .portal-foot .portal-wrap,
body.company-site .portal-foot .portal-wrap {
  width: min(var(--site-content-max), calc(100% - var(--site-gutter)));
  margin-left: auto;
  margin-right: auto;
  box-sizing: border-box;
}

.jbid,
.jplus,
.mdab,
.jodari,
.mkt,
.vprod,
.bc {
  --jbid-max: var(--site-content-max);
  --jp-max: var(--site-content-max);
  --md-max: var(--site-content-max);
  --jd-max: var(--site-content-max);
  --mkt-max: var(--site-content-max);
  --vprod-max: var(--site-content-max);
  --bc-max: var(--site-content-max);
}

.home-v1 {
  --home-max: var(--site-content-max);
}

.about-page {
  --about-max: var(--site-content-max);
}

/* ---- Service detail: trim oversized gaps, keep readable air ---- */
.jbid-hero,
.jplus-hero,
.mdab-hero,
.jodari-hero,
.mkt-hero,
.vprod-hero,
.bc-hero {
  min-height: auto;
  padding: 52px 0 44px;
}

.jbid-block,
.jplus-block,
.mdab-block,
.jodari-block,
.mkt-block,
.vprod-block,
.bc-block {
  padding: 56px 0;
}

.jbid-cta,
.jplus-cta,
.mdab-cta,
.mdab-books,
.mkt-cta,
.vprod-cta,
.bc-cta {
  padding: 64px 0;
}

.jbid h1,
.jbid h2,
.jplus h1,
.jplus h2,
.mdab h1,
.mdab h2 {
  margin: 0 0 18px;
}

.jbid p,
.jplus p,
.mdab p {
  margin: 0 0 14px;
}

.jbid-lead,
.jplus-lead,
.mdab-lead {
  margin-bottom: 16px;
}

.jbid-actions,
.jplus-actions,
.mdab-actions {
  margin-top: 8px;
}

.jbid-points,
.jbid-services,
.jbid-steps,
.jplus-list,
.jplus-steps,
.jplus-trust,
.mdab-cards,
.mdab-flow,
.mdab-roadmap,
.mdab-who {
  margin-top: 24px;
  gap: 14px;
}

.jbid-hero__grid,
.jplus-hero__grid,
.mdab-hero__grid,
.jbid-split,
.mdab-split,
.jplus-books__grid,
.mdab-books__grid {
  gap: 28px;
}

.jbid-hero__stage,
.jplus-hero__stage,
.mdab-hero__stage {
  gap: 12px;
}

.jbid-media,
.jplus-media,
.mdab-media {
  margin: 20px 0 8px;
}

.jbid-back,
.jplus-back,
.mdab-back {
  padding: 20px 0 40px;
}

.jbid-cta__inner {
  max-width: none;
}

/* ---- Inner pages ---- */
.inner-main {
  margin-top: 28px;
  margin-bottom: 56px;
}

.page-hero {
  margin-bottom: 28px;
}

.page-hero h1 {
  margin-bottom: 12px;
}

.page-hero p {
  max-width: none;
}

.svc-grid {
  gap: 16px;
}

.svc-card__body {
  gap: 8px;
  padding: 16px 18px 18px;
}

/* ---- Home: keep hero presence; ease process/banner only ---- */
.home-process {
  padding: 48px 0;
}

.home-process__head {
  max-width: none;
  margin: 0 0 28px;
}

.home-process__desc {
  margin-top: 12px;
}

.home-cards {
  gap: 16px;
}

.home-card {
  padding: 24px 22px;
}

.home-card--svc {
  padding: 0;
}

.home-banner__inner {
  gap: 20px;
  padding: 36px 0;
}

/* ---- About ---- */
.about-intro {
  padding: 56px 0 64px;
}

@media (min-width: 768px) {
  .jbid-hero,
  .jplus-hero,
  .mdab-hero,
  .jodari-hero {
    min-height: auto;
    padding: 56px 0 48px;
  }

  .jbid-block,
  .jplus-block,
  .mdab-block,
  .jodari-block {
    padding: 60px 0;
  }

  .jbid-cta,
  .jplus-cta,
  .mdab-cta,
  .mdab-books,
  .jodari-cta {
    padding: 68px 0;
  }

  .home-wrap {
    width: min(var(--site-content-max), calc(100% - 56px));
  }

  .home-process {
    padding: 56px 0 48px;
  }

  .home-process__head {
    margin-bottom: 32px;
  }

  .home-cards {
    gap: 18px;
  }

  .home-banner__inner {
    padding: 40px 0;
  }
}

@media (min-width: 1025px) {
  .jbid-wrap,
  .jplus-wrap,
  .mdab-wrap,
  .inner-main,
  .about-intro__inner,
  .site-head__inner,
  .site-container,
  .section-inner {
    width: min(var(--site-content-max), calc(100% - var(--site-gutter)));
  }
}

@media (max-width: 1199px) {
  .jbid-wrap,
  .jplus-wrap,
  .mdab-wrap,
  .jodari-wrap,
  .mkt-wrap,
  .vprod-wrap,
  .bc-wrap,
  .home-wrap,
  .inner-main,
  .about-intro__inner,
  .site-head__inner,
  .site-container,
  .section-inner,
  .home-v1 .portal-foot .portal-wrap,
  body.company-site .portal-foot .portal-wrap {
    width: min(var(--site-content-max), calc(100% - var(--site-gutter-sm)));
  }
}

@media (max-width: 767px) {
  html,
  body.company-site,
  body.home-v1 {
    overflow-x: clip;
  }

  body.company-site img,
  body.home-v1 img,
  body.company-site video,
  body.home-v1 video {
    max-width: 100%;
    height: auto;
  }

  .jbid-wrap,
  .jplus-wrap,
  .mdab-wrap,
  .jodari-wrap,
  .mkt-wrap,
  .vprod-wrap,
  .bc-wrap,
  .home-wrap,
  .inner-main,
  .about-intro__inner,
  .site-head__inner {
    width: calc(100% - 32px);
    max-width: 100%;
    box-sizing: border-box;
  }

  .jbid,
  .jplus,
  .mdab,
  .jodari,
  .mkt,
  .vprod,
  .bc,
  .home-v1 #homeMain,
  body.company-site > main {
    max-width: 100%;
    overflow-x: clip;
  }

  .jbid-hero,
  .jplus-hero,
  .mdab-hero,
  .jodari-hero,
  .mkt-hero,
  .vprod-hero,
  .bc-hero,
  .jbid-block,
  .jplus-block,
  .mdab-block,
  .jodari-block,
  .mkt-block,
  .vprod-block,
  .bc-block {
    padding: 44px 0;
  }

  .jbid-cta,
  .jplus-cta,
  .mdab-cta,
  .mdab-books,
  .jodari-cta,
  .mkt-cta,
  .vprod-cta,
  .bc-cta {
    padding: 48px 0;
  }

  /* Mobile only: stack multi-column sections */
  .jbid-hero__grid,
  .jplus-hero__grid,
  .mdab-hero__grid,
  .jodari-hero__grid,
  .mkt-hero__grid,
  .vprod-hero__grid,
  .jbid-split,
  .mdab-split,
  .jodari-split,
  .mkt-split,
  .jplus-books__grid,
  .mdab-books__grid,
  .svc-grid,
  .related-grid,
  .svc-related__grid {
    grid-template-columns: 1fr !important;
  }

  .jbid-actions,
  .jplus-actions,
  .mdab-actions,
  .jodari-actions,
  .mkt-actions,
  .vprod-actions,
  .bc-actions,
  .svc-card__actions {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    width: 100%;
    max-width: 100%;
  }

  .jbid-btn,
  .jplus-btn,
  .mdab-btn,
  .jodari-btn,
  .mkt-btn,
  .vprod-btn,
  .bc-btn,
  .svc-dl {
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
    white-space: normal;
    text-align: center;
  }

  .jbid h1,
  .jplus h1,
  .mdab h1,
  .jodari h1,
  .mkt h1,
  .vprod h1,
  .bc h1 {
    font-size: clamp(22px, 6.2vw, 30px);
    overflow-wrap: anywhere;
    word-break: keep-all;
  }

  .jbid h2,
  .jplus h2,
  .mdab h2,
  .jodari h2,
  .mkt h2,
  .vprod h2,
  .bc h2 {
    font-size: clamp(18px, 5.2vw, 24px);
    overflow-wrap: anywhere;
    word-break: keep-all;
  }

  .jbid p,
  .jplus p,
  .mdab p,
  .jodari p,
  .mkt p,
  .vprod p,
  .bc p,
  .inner-main p {
    overflow-wrap: anywhere;
    word-break: keep-all;
  }

  .jbid-hero__grid > *,
  .jplus-hero__grid > *,
  .mdab-hero__grid > *,
  .jodari-hero__grid > *,
  .mkt-hero__grid > *,
  .vprod-hero__grid > *,
  .jbid-ui,
  .jplus-ui,
  .mdab-ui,
  .jodari-ui,
  .bc-pipe__panel,
  .bc-saas__result,
  .bc-cond,
  .bc-level {
    min-width: 0;
    max-width: 100%;
  }

  .site-brand {
    flex: 1 1 auto;
    min-width: 0;
  }

  .site-head__inner {
    gap: 12px;
  }

  .inner-main {
    margin-top: 20px;
    margin-bottom: 48px;
  }

  .page-hero {
    margin-bottom: 20px;
  }

  .home-process {
    padding: 40px 0;
  }

  .home-process__head {
    margin-bottom: 22px;
  }

  .home-card {
    padding: 20px 18px;
  }

  .home-card--svc {
    padding: 0;
  }

  .svc-grid {
    gap: 14px;
  }
}

@media (max-width: 480px) {
  .jbid-btn,
  .jplus-btn,
  .mdab-btn,
  .jodari-btn,
  .mkt-btn,
  .vprod-btn,
  .bc-btn,
  .svc-dl {
    min-height: 46px;
    font-size: 14px;
    padding-left: 14px;
    padding-right: 14px;
  }
}

@media (min-width: 1200px) {
  .site-container,
  .header-inner,
  .section-inner,
  .site-head__inner,
  .home-wrap,
  .inner-main,
  .about-intro__inner,
  .jbid-wrap,
  .jplus-wrap,
  .mdab-wrap,
  .jodari-wrap,
  .mkt-wrap,
  .vprod-wrap,
  .bc-wrap,
  body.home-v1 .portal-foot .portal-wrap,
  body.company-site .portal-foot .portal-wrap {
    width: min(var(--site-content-max), calc(100% - var(--site-gutter)));
  }

  .page-hero h1,
  body.company-site .page-hero h1,
  body.company-site .about-intro h1,
  body.company-site .contact-head h1 {
    font-size: clamp(28px, 2vw, 36px);
  }

  .about-intro__cta,
  .home-banner__cta {
    min-height: 52px;
    font-size: 16px;
  }

  .home-process {
    padding: 64px 0 52px;
  }

  .home-cards {
    gap: 20px;
  }

  .home-card {
    padding: 28px 22px;
  }

  .home-card--svc {
    padding: 0;
  }

  .home-banner__inner {
    padding: 40px 0;
  }
}