/**
 * BeDijital canonical two-column hero geometry — v1.5.7
 *
 * Kohost reference principle: one shared container/grid system; page-specific
 * artwork is allowed to differ, but the hero columns and safe content bounds do
 * not. Page-specific optical exceptions may be added only after visual review.
 */
:root{
  --bd-hero-container:1200px;
  --bd-hero-height:500px;
  --bd-hero-art-max-height:455px;
  --bd-hero-column-gutter:20px;
}

/* Desktop: canonical Bootstrap/Kohost-like 6+5 / 5+6 geometry. */
@media (min-width:992px){
  #main-content .bdp-page .bdp-hero,
  #main-content .bdt-page .bdt-hero{
    padding-top:0!important;
    padding-bottom:0!important;
    min-height:0!important;
    overflow:hidden!important;
  }

  #main-content .bdp-page .bdp-hero > .container,
  #main-content .bdt-page .bdt-hero > .container{
    box-sizing:border-box!important;
    width:min(var(--bd-hero-container),calc(100% - 40px))!important;
    max-width:var(--bd-hero-container)!important;
    min-height:var(--bd-hero-height)!important;
    height:var(--bd-hero-height)!important;
    margin-left:auto!important;
    margin-right:auto!important;
    padding:0!important;
    position:relative!important;
  }

  #main-content .bdp-page .bdp-hero > .container > .row,
  #main-content .bdt-page .bdt-hero > .container > .row{
    box-sizing:border-box!important;
    display:flex!important;
    flex-wrap:nowrap!important;
    align-items:center!important;
    justify-content:space-between!important;
    width:100%!important;
    min-height:var(--bd-hero-height)!important;
    height:var(--bd-hero-height)!important;
    max-height:var(--bd-hero-height)!important;
    margin:0!important;
    padding:0!important;
    gap:0!important;
  }

  /* Restore the Bootstrap column proportions used by the original Kohost layouts. */
  #main-content .bdp-page .bdp-hero > .container > .row > .col-md-6.col-lg-5,
  #main-content .bdt-page .bdt-hero > .container > .row > .col-md-6.col-lg-5{
    box-sizing:border-box!important;
    flex:0 0 41.666667%!important;
    width:41.666667%!important;
    max-width:41.666667%!important;
    min-width:0!important;
    margin:0!important;
    padding:0 var(--bd-hero-column-gutter) 0 0!important;
    position:relative!important;
  }

  #main-content .bdp-page .bdp-hero > .container > .row > .col-md-6.col-lg-6,
  #main-content .bdt-page .bdt-hero > .container > .row > .col-md-6.col-lg-6{
    box-sizing:border-box!important;
    flex:0 0 50%!important;
    width:50%!important;
    max-width:50%!important;
    min-width:0!important;
    margin:0!important;
    padding:0!important;
    position:relative!important;
  }

  /* Copy must remain inside its own column; legacy absolute offsets are cancelled. */
  #main-content .bdp-page .bdp-hero .bdp-hero-copy,
  #main-content .bdt-page .bdt-hero .bdt-hero-copy{
    box-sizing:border-box!important;
    position:static!important;
    inset:auto!important;
    top:auto!important;
    right:auto!important;
    bottom:auto!important;
    left:auto!important;
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    height:auto!important;
    margin:0!important;
    transform:none!important;
  }

  /* Every artwork uses the same safe right-column box. */
  #main-content .bdp-page .bdp-hero .bdp-hero-image,
  #main-content .bdt-page .bdt-hero .bdt-hero-image{
    box-sizing:border-box!important;
    position:static!important;
    inset:auto!important;
    top:auto!important;
    right:auto!important;
    bottom:auto!important;
    left:auto!important;
    display:flex!important;
    align-items:center!important;
    justify-content:flex-end!important;
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    height:var(--bd-hero-height)!important;
    max-height:var(--bd-hero-height)!important;
    margin:0!important;
    padding:0!important;
    overflow:visible!important;
    text-align:right!important;
    transform:none!important;
  }

  #main-content .bdp-page .bdp-hero .bdp-hero-image img,
  #main-content .bdt-page .bdt-hero .bdt-hero-image img{
    box-sizing:border-box!important;
    display:block!important;
    position:static!important;
    width:auto!important;
    height:auto!important;
    max-width:100%!important;
    max-height:var(--bd-hero-art-max-height)!important;
    margin:0!important;
    padding:0!important;
    object-fit:contain!important;
    transform:none!important;
  }
}

/* Tablet/mobile: keep the common container and column safety, but preserve each
 * page's established hide/show policy for artwork. */
@media (max-width:991.98px){
  #main-content .bdp-page .bdp-hero > .container,
  #main-content .bdt-page .bdt-hero > .container{
    box-sizing:border-box!important;
    width:min(var(--bd-hero-container),calc(100% - 40px))!important;
    max-width:var(--bd-hero-container)!important;
    height:auto!important;
    min-height:0!important;
    margin-left:auto!important;
    margin-right:auto!important;
    padding:0!important;
  }

  #main-content .bdp-page .bdp-hero > .container > .row,
  #main-content .bdt-page .bdt-hero > .container > .row{
    display:flex!important;
    flex-wrap:wrap!important;
    width:100%!important;
    height:auto!important;
    min-height:0!important;
    max-height:none!important;
    margin:0!important;
    padding:0!important;
  }

  #main-content .bdp-page .bdp-hero > .container > .row > .col-md-6,
  #main-content .bdt-page .bdt-hero > .container > .row > .col-md-6{
    box-sizing:border-box!important;
    flex:0 0 100%!important;
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    margin:0!important;
    padding-left:0!important;
    padding-right:0!important;
  }

  #main-content .bdp-page .bdp-hero .bdp-hero-copy,
  #main-content .bdt-page .bdt-hero .bdt-hero-copy{
    position:static!important;
    inset:auto!important;
    width:100%!important;
    max-width:100%!important;
    transform:none!important;
  }

  #main-content .bdp-page .bdp-hero .bdp-hero-image,
  #main-content .bdt-page .bdt-hero .bdt-hero-image{
    position:static!important;
    inset:auto!important;
    max-width:100%!important;
    transform:none!important;
  }

  #main-content .bdp-page .bdp-hero .bdp-hero-image img,
  #main-content .bdt-page .bdt-hero .bdt-hero-image img{
    max-width:100%!important;
    height:auto!important;
    transform:none!important;
  }
}

/* v1.5.13 — WordPress/Divi may inject an empty paragraph as a direct child of
 * the hero flex row on multiline Text-module markup. With space-between this
 * becomes a third flex item and creates a false right-side gap after artwork.
 * Ignore only truly empty direct-child paragraphs; real hero content is untouched. */
#main-content .bdp-page .bdp-hero > .container > .row > p:empty,
#main-content .bdt-page .bdt-hero > .container > .row > p:empty{
  display:none!important;
}

/* v1.5.14 — Windows/Linux Web Hosting artwork normalization.
 * Both assets now share the same normalized canvas and perceived scale. Their
 * transparent source margins are removed at asset level; the small intentional
 * right breathing space is identical. Keep this one shared size for the pair so
 * neither artwork grows simply because its source crop/aspect differs. */
@media (min-width:992px){
  #main-content .bdp-page .bdp-hero .bdp-hero-image img[src$="/windows-web-hosting-hero.webp"],
  #main-content .bdp-page .bdp-hero .bdp-hero-image img[src$="/linux-web-hosting-hero.webp"]{
    width:460px!important;
    max-width:100%!important;
    height:auto!important;
  }
}