/* OBRAC_MOBILE_SPACING_UNIFORM_V4
 * Final mobile spacing authority for the live Elementor pages.
 * Home (page 10) remains the reference and is deliberately excluded.
 */
@media (max-width:767px){
  /* One outer gutter only: 24px, matching the Home rhythm. */
  body.page-id-11 .obrac-section:not(.obrac-hero),
  body.page-id-12 .obrac-section:not(.obrac-hero),
  body.page-id-13 .obrac-section:not(.obrac-hero),
  body.page-id-14 .obrac-section:not(.obrac-hero),
  body.page-id-15 .obrac-section:not(.obrac-hero),
  body.page-id-30 .obrac-section:not(.obrac-hero){
    box-sizing:border-box!important;
    padding-left:24px!important;
    padding-right:24px!important;
  }

  body.page-id-11 .obrac-section:not(.obrac-hero)>.obrac-shell,
  body.page-id-12 .obrac-section:not(.obrac-hero)>.obrac-shell,
  body.page-id-13 .obrac-section:not(.obrac-hero)>.obrac-shell,
  body.page-id-14 .obrac-section:not(.obrac-hero)>.obrac-shell,
  body.page-id-15 .obrac-section:not(.obrac-hero)>.obrac-shell,
  body.page-id-30 .obrac-section:not(.obrac-hero)>.obrac-shell{
    box-sizing:border-box!important;
    width:100%!important;
    max-width:none!important;
    margin-left:auto!important;
    margin-right:auto!important;
    padding-left:0!important;
    padding-right:0!important;
    --padding-left:0px!important;
    --padding-right:0px!important;
  }

  /* Remove duplicate Elementor structural gutters while preserving content blocks. */
  body.page-id-11 .obrac-section:not(.obrac-hero)>.obrac-shell>:is(.obrac-stack:not(.obrac-card):not(.obrac-quote),.obrac-grid-2,.obrac-grid-3,.obrac-grid-4,.obrac-split,.obrac-actions),
  body.page-id-12 .obrac-section:not(.obrac-hero)>.obrac-shell>:is(.obrac-stack:not(.obrac-card):not(.obrac-quote),.obrac-grid-2,.obrac-grid-3,.obrac-grid-4,.obrac-split,.obrac-actions),
  body.page-id-13 .obrac-section:not(.obrac-hero)>.obrac-shell>:is(.obrac-stack:not(.obrac-card):not(.obrac-quote),.obrac-grid-2,.obrac-grid-3,.obrac-grid-4,.obrac-split,.obrac-actions),
  body.page-id-14 .obrac-section:not(.obrac-hero)>.obrac-shell>:is(.obrac-stack:not(.obrac-card):not(.obrac-quote),.obrac-grid-2,.obrac-grid-3,.obrac-grid-4,.obrac-split,.obrac-actions),
  body.page-id-15 .obrac-section:not(.obrac-hero)>.obrac-shell>:is(.obrac-stack:not(.obrac-card):not(.obrac-quote),.obrac-grid-2,.obrac-grid-3,.obrac-grid-4,.obrac-split,.obrac-actions),
  body.page-id-30 .obrac-section:not(.obrac-hero)>.obrac-shell>:is(.obrac-stack:not(.obrac-card):not(.obrac-quote),.obrac-grid-2,.obrac-grid-3,.obrac-grid-4,.obrac-split,.obrac-actions){
    box-sizing:border-box!important;
    width:100%!important;
    max-width:none!important;
    margin-left:0!important;
    margin-right:0!important;
    padding-left:0!important;
    padding-right:0!important;
    padding-inline:0!important;
    --padding-left:0px!important;
    --padding-right:0px!important;
  }

  /* Content blocks: compact but comfortable. Use both physical and logical
   * padding because Elementor emits logical declarations on some containers. */
  body.page-id-11 .elementor .obrac-section .obrac-card,
  body.page-id-12 .elementor .obrac-section .obrac-card,
  body.page-id-13 .elementor .obrac-section .obrac-card,
  body.page-id-14 .elementor .obrac-section .obrac-card,
  body.page-id-15 .elementor .obrac-section .obrac-card,
  body.page-id-11 .elementor .obrac-section .obrac-quote,
  body.page-id-12 .elementor .obrac-section .obrac-quote,
  body.page-id-13 .elementor .obrac-section .obrac-quote,
  body.page-id-14 .elementor .obrac-section .obrac-quote,
  body.page-id-15 .elementor .obrac-section .obrac-quote{
    padding-left:20px!important;
    padding-right:20px!important;
    padding-inline:20px!important;
    --padding-left:20px!important;
    --padding-right:20px!important;
  }

  /* ABOUT: process cards become one readable column. */
  body.page-id-11 .elementor-element-49931031 .obrac-grid-4,
  body.page-id-11 .elementor-element-49931031 .obrac-process{
    grid-template-columns:1fr!important;
    gap:12px!important;
  }
  body.page-id-11 .elementor-element-49931031 .obrac-card,
  body.page-id-11 .elementor-element-5087f89a .obrac-card{
    width:100%!important;
    padding-left:20px!important;
    padding-right:20px!important;
    padding-inline:20px!important;
  }

  /* OBRAC AI: neutralize nested Elementor gutters and page-specific 22px/26px
   * declarations that previously beat the intended compact mobile rhythm. */
  body.page-id-12 .obrac-section:not(.obrac-hero){
    --padding-left:24px!important;
    --padding-right:24px!important;
    padding-top:28px!important;
    padding-bottom:28px!important;
  }
  body.page-id-12 .obrac-section:not(.obrac-hero)>.obrac-shell{
    padding-top:0!important;
    padding-bottom:0!important;
    --padding-top:0px!important;
    --padding-bottom:0px!important;
  }
  body.page-id-12 .obrac-section:not(.obrac-hero)>.obrac-shell,
  body.page-id-12 .obrac-section:not(.obrac-hero)>.obrac-shell>.obrac-grid-3,
  body.page-id-12 .obrac-section:not(.obrac-hero)>.obrac-shell>.obrac-grid-4{
    --padding-left:0px!important;
    --padding-right:0px!important;
  }
  body.page-id-12 .elementor :is(.elementor-element-8d069bf2,.elementor-element-f777203b,.elementor-element-9892cf40) .obrac-card,
  body.page-id-12 .elementor .obrac-section .obrac-card{
    padding-left:20px!important;
    padding-right:20px!important;
    padding-inline:20px!important;
    --padding-left:20px!important;
    --padding-right:20px!important;
  }
  body.page-id-12 .obrac-ai-feature__intro,
  body.page-id-12 .obrac-ai-access__content{
    padding-left:20px!important;
    padding-right:20px!important;
    padding-inline:20px!important;
  }
  body.page-id-12 .obrac-ai-stack__row{
    padding-left:16px!important;
    padding-right:16px!important;
    padding-inline:16px!important;
  }

  /* OBRAC AI mobile vertical rhythm: keep editorial blocks distinct without
   * stacking large blank margins between them. */
  body.page-id-12 :is(.obrac-ai-feature--stack,.obrac-ai-gallery,.obrac-ai-feature--access){
    margin-top:24px!important;
    margin-bottom:24px!important;
  }

  /* The gallery had an unused third grid track that looked like a large blank
   * area below the photos. Mobile now uses a compact two-by-two mosaic. */
  body.page-id-12 .obrac-ai-gallery__header{
    margin-bottom:18px!important;
  }
  body.page-id-12 .obrac-ai-gallery__mosaic{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    grid-template-rows:160px 160px!important;
    min-height:0!important;
    height:auto!important;
    align-content:start!important;
    gap:8px!important;
  }
  body.page-id-12 .obrac-ai-gallery__item,
  body.page-id-12 .obrac-ai-gallery__item.item-1,
  body.page-id-12 .obrac-ai-gallery__item.item-2,
  body.page-id-12 .obrac-ai-gallery__item.item-3,
  body.page-id-12 .obrac-ai-gallery__item.item-4{
    grid-column:auto!important;
    grid-row:auto!important;
    min-height:0!important;
    height:auto!important;
  }

  /* The hero remains photographic but starts its copy much closer to the top. */
  body.page-id-12 .elementor-element-3c22dd30.obrac-hero,
  body.page-id-12 .elementor-element-3c22dd30.obrac-hero>.obrac-shell,
  body.page-id-12 .elementor-element-3c22dd30.obrac-hero .obrac-hero-grid,
  body.page-id-12 .elementor-element-3c22dd30.obrac-hero .obrac-hero-copy{
    min-height:660px!important;
  }
  body.page-id-12 .elementor-element-3c22dd30.obrac-hero .obrac-hero-copy{
    padding-top:52px!important;
    padding-bottom:28px!important;
  }
  body.page-id-12 .elementor-element-3c22dd30.obrac-hero .obrac-hero-copy:before{
    top:38px!important;
  }

  /* Remove the two secondary grey annotations requested by the owner. */
  body.page-id-12 .obrac-ai-gallery__caption,
  body.page-id-12 .obrac-ai-parallax-chapter span{
    display:none!important;
  }

  /* Governance is content-driven on mobile. The photo shell remains absolute,
   * while the copy participates in normal flow. This removes the large empty
   * areas both before and after the governance title on narrow screens. */
  body.page-id-12 .obrac-interleaved-photo--slot-2.obrac-interleaved-photo--ai{
    height:auto!important;
    min-height:0!important;
  }
  body.page-id-12 .obrac-interleaved-photo--slot-2 .obrac-interleaved-photo__shell{
    position:absolute!important;
    inset:0!important;
    width:100%!important;
    height:100%!important;
    min-height:0!important;
  }
  body.page-id-12 .obrac-interleaved-photo--slot-2 .obrac-interleaved-photo__image{
    width:100%!important;
    height:100%!important;
    min-height:100%!important;
  }
  body.page-id-12 .obrac-ai-parallax-chapter{
    position:relative!important;
    inset:auto!important;
    display:block!important;
    min-height:0!important;
    padding:28px 0!important;
  }
  body.page-id-12 .obrac-ai-parallax-chapter__inner{
    width:calc(100% - 48px)!important;
    margin:0 auto!important;
  }

  /* WHAT WE DO: compact card copy without narrowing the media. */
  body.page-id-13 .elementor .obrac-section .obrac-card,
  body.page-id-13 .obrac-wwd-focus-card__content{
    padding-left:20px!important;
    padding-right:20px!important;
    padding-inline:20px!important;
  }

  /* GET INVOLVED: exact block from the owner screenshot. */
  body.page-id-14 .obrac-gi-half-parallax__copy{
    padding:28px 20px 30px!important;
    padding-inline:20px!important;
  }
  body.page-id-14 .obrac-gi-video-story{
    padding-left:20px!important;
    padding-right:20px!important;
    padding-inline:20px!important;
  }
  body.page-id-14 .elementor-element-bcdd7bfa .obrac-card{
    padding-left:20px!important;
    padding-right:20px!important;
    padding-inline:20px!important;
  }

  /* CONTACT: keep CTA bottom reserve; tighten only horizontal space. */
  body.page-id-15 .obrac-contact-route-card{
    padding-left:20px!important;
    padding-right:20px!important;
    padding-inline:20px!important;
    --padding-left:20px!important;
    --padding-right:20px!important;
  }

  /* Blog horizontal carousel geometry is intentionally preserved. */
}