/* OBRAC_OWNER_VISUAL_REFINEMENTS_V1
 * Owner-requested refinements layered after inner-visual-coherence.
 * Scope: Home hexagonal diagram, What We Do right hero copy, Get Involved hero copy lift.
 */

/* -------------------------------------------------------------------------
 * HOME — geometric hexagonal companion for BUILD WITH OBRAC.
 * ---------------------------------------------------------------------- */
body.page-id-10 .elementor-element-364b6bc7.obrac-home-hex-ready{
  overflow:hidden!important;
}
body.page-id-10 .obrac-home-hex-host{
  position:relative!important;
  padding-right:390px!important;
}
body.page-id-10 .obrac-home-hex-diagram{
  position:absolute!important;
  z-index:2!important;
  top:50%!important;
  right:38px!important;
  width:286px!important;
  aspect-ratio:1!important;
  transform:translateY(-50%) rotate(4deg)!important;
  color:var(--obrac-accent,var(--obrac-page-secondary,#5e00ff));
  pointer-events:none!important;
  filter:drop-shadow(0 22px 46px color-mix(in srgb,currentColor 16%,transparent));
}
body.page-id-10 .obrac-home-hex-diagram svg{
  display:block!important;
  width:100%!important;
  height:100%!important;
  overflow:visible!important;
}
body.page-id-10 .obrac-home-hex-diagram polygon{
  fill:color-mix(in srgb,currentColor 4%,transparent);
  stroke:currentColor;
  vector-effect:non-scaling-stroke;
}
body.page-id-10 .obrac-home-hex-diagram polygon:nth-child(1){opacity:.52;stroke-width:1.2;}
body.page-id-10 .obrac-home-hex-diagram polygon:nth-child(2){opacity:.68;stroke-width:1.5;}
body.page-id-10 .obrac-home-hex-diagram polygon:nth-child(3){opacity:.94;stroke-width:2;}
body.page-id-10 .obrac-home-hex-diagram circle{
  fill:currentColor;
  filter:drop-shadow(0 0 10px currentColor);
}

/* -------------------------------------------------------------------------
 * WHAT WE DO — desktop copy belongs on the dark right side of the image.
 * Explicit auto margin wins over Elementor container behaviour that kept it left.
 * ---------------------------------------------------------------------- */
@media(min-width:768px){
  body.page-id-13 .obrac-hero.obrac-unified-parallax-hero .obrac-hero-grid{
    justify-content:flex-end!important;
  }
  body.page-id-13 .obrac-hero.obrac-unified-parallax-hero .obrac-hero-copy{
    width:min(760px,52vw)!important;
    margin-left:auto!important;
    margin-right:0!important;
    padding:96px max(64px,calc((100vw - 1280px)/2 + 32px)) 96px 86px!important;
  }
  body.page-id-13 .obrac-hero.obrac-unified-parallax-hero .obrac-hero-copy>*{
    max-width:610px!important;
  }

  /* GET INVOLVED — lift the complete copy group so the final CTA is visible. */
  body.page-id-14 .elementor-element-62c0d457 .obrac-hero-copy{
    justify-content:flex-start!important;
    padding-top:110px!important;
    padding-bottom:52px!important;
  }
}

@media(max-width:1024px) and (min-width:768px){
  body.page-id-10 .obrac-home-hex-host{padding-right:285px!important;}
  body.page-id-10 .obrac-home-hex-diagram{right:26px!important;width:210px!important;}
  body.page-id-13 .obrac-hero.obrac-unified-parallax-hero .obrac-hero-copy{
    width:min(650px,68vw)!important;
    padding-left:72px!important;
    padding-right:32px!important;
  }
}

@media(max-width:767px){
  /* Home: preserve text width; diagram becomes an in-flow visual below content. */
  body.page-id-10 .obrac-home-hex-host{
    padding-right:0!important;
  }
  body.page-id-10 .obrac-home-hex-diagram{
    position:relative!important;
    top:auto!important;
    right:auto!important;
    width:min(164px,48vw)!important;
    margin:28px auto 0!important;
    transform:rotate(4deg)!important;
  }

  /* Get Involved: raise the copy further while keeping the CTA comfortably visible. */
  body.page-id-14 .elementor-element-62c0d457.obrac-hero,
  body.page-id-14 .elementor-element-62c0d457.obrac-hero>.obrac-shell,
  body.page-id-14 .elementor-element-62c0d457.obrac-hero .obrac-hero-grid,
  body.page-id-14 .elementor-element-62c0d457.obrac-hero .obrac-hero-copy{
    min-height:600px!important;
  }
  body.page-id-14 .elementor-element-62c0d457.obrac-hero .obrac-hero-copy{
    justify-content:flex-start!important;
    padding:44px 24px 24px!important;
  }
}

@media(prefers-reduced-motion:reduce){
  body.page-id-10 .obrac-home-hex-diagram{filter:none!important;}
}