/* =========================================================
   Steve Shofner Website - HERO IMAGE PLACEMENT ONLY

   This is the single source of truth for hero image placement.

   Use these scenario names when requesting/tuning adjustments:
   1. Home Desktop
   2. Home Mobile Portrait
   3. Home Mobile Landscape
   4. Subpage Desktop
   5. Subpage Mobile Portrait
   6. Subpage Mobile Landscape

   Fine-tune only background-position and background-size here.
   First background-position value = left/right.
   Second background-position value = up/down.
   ========================================================= */


/* 1) HOME DESKTOP */
.hero{
  background:
    linear-gradient(90deg,rgba(0,0,0,.86),rgba(0,0,0,.62),rgba(0,0,0,.35)),
    url("../images/hero.jpg") 74% center / cover no-repeat !important;
}


/* 4) SUBPAGE DESKTOP */
.page-hero{
  background:
    linear-gradient(90deg,rgba(8,8,8,.88),rgba(8,8,8,.45)),
    url("../images/hero.jpg") 74% 38% / auto 72% no-repeat !important;
}


/* 2) HOME MOBILE PORTRAIT */
@media (max-width:768px) and (orientation:portrait){
  .hero{
    background:
      linear-gradient(90deg,rgba(0,0,0,.88),rgba(0,0,0,.64),rgba(0,0,0,.36)),
      url("../images/hero.jpg") 50% center / cover no-repeat !important;
  }
}


/* 3) HOME MOBILE LANDSCAPE */
@media (max-width:950px) and (orientation:landscape){
  .hero{
    background:
      linear-gradient(90deg,rgba(0,0,0,.88),rgba(0,0,0,.64),rgba(0,0,0,.36)),
      url("../images/hero.jpg") 64% center / cover no-repeat !important;
  }
}


/* 5) SUBPAGE MOBILE PORTRAIT */
@media (max-width:768px) and (orientation:portrait){
  .page-hero{
    background:
      linear-gradient(90deg,rgba(8,8,8,.88),rgba(8,8,8,.45)),
      url("../images/hero.jpg") 48% 40% / 68% auto no-repeat !important;
  }
}


/* 6) SUBPAGE MOBILE LANDSCAPE */
@media (max-width:950px) and (orientation:landscape){
  .page-hero{
    background:
      linear-gradient(90deg,rgba(8,8,8,.88),rgba(8,8,8,.45)),
      url("../images/hero.jpg") 66% 40% / 68% auto no-repeat !important;
  }
}