/* CarsUsed.ca V13 — 03 November 2026
   User direction: ON, QC, BC and AB dealer-directory heroes must use the same
   clean Saskatchewan-style layout treatment with the image held on the right
   and the left side whited out for readable copy and better mobile fit.
   This file only touches those 4 province directory hero sections. */

/* Desktop / tablet */
@media (min-width:801px){
  .v7-region-directory:is(.v6-region-on,.v6-region-qc,.v6-region-bc,.v6-region-ab){
    background:#f8fbff !important;
  }
  .v7-region-directory:is(.v6-region-on,.v6-region-qc,.v6-region-bc,.v6-region-ab)::before{
    inset:0 0 -112px !important;
    background-image:var(--v7-directory-banner) !important;
    background-size:auto 100% !important;
    background-position:right top !important;
    background-repeat:no-repeat !important;
    background-color:#f8fbff !important;
    -webkit-mask-image:linear-gradient(to right, transparent 0%, transparent 51%, #000 76%) !important;
    mask-image:linear-gradient(to right, transparent 0%, transparent 51%, #000 76%) !important;
    filter:saturate(1.12) brightness(1.035) !important;
  }
  .v7-region-directory:is(.v6-region-on,.v6-region-qc,.v6-region-bc,.v6-region-ab)::after{
    inset:0 0 -112px !important;
    background:
      linear-gradient(90deg, white 0%, white 33%, rgba(255,255,255,.97) 49%, rgba(255,255,255,.50) 66%, transparent 90%),
      linear-gradient(180deg, transparent 50%, rgba(255,255,255,.08) 65%, white 100%) !important;
  }
}

/* Mobile */
@media (max-width:800px){
  .v7-region-directory:is(.v6-region-on,.v6-region-qc,.v6-region-bc,.v6-region-ab){
    background:#f8fbff !important;
  }
  .v7-region-directory:is(.v6-region-on,.v6-region-qc,.v6-region-bc,.v6-region-ab)::before{
    inset:0 0 -105px !important;
    background-image:var(--v7-directory-mobile) !important;
    background-size:auto 100% !important;
    background-position:right top !important;
    background-repeat:no-repeat !important;
    background-color:#f8fbff !important;
    -webkit-mask-image:none !important;
    mask-image:none !important;
    filter:saturate(1.12) brightness(1.03) !important;
  }
  .v7-region-directory:is(.v6-region-on,.v6-region-qc,.v6-region-bc,.v6-region-ab)::after{
    inset:0 0 -105px !important;
    background:
      linear-gradient(90deg, white 0%, rgba(255,255,255,.95) 42%, rgba(255,255,255,.67) 78%, rgba(255,255,255,.28) 100%),
      linear-gradient(180deg, transparent 45%, white 100%) !important;
  }
}

/* Extra-small phones: preserve left-side readability the same way the
   Saskatchewan page presents it. */
@media (max-width:520px){
  .v7-region-directory:is(.v6-region-on,.v6-region-qc,.v6-region-bc,.v6-region-ab)::before{
    background-position:70% top !important;
  }
  .v7-region-directory:is(.v6-region-on,.v6-region-qc,.v6-region-bc,.v6-region-ab)::after{
    background:
      linear-gradient(90deg, rgba(255,255,255,.99) 0%, rgba(255,255,255,.90) 52%, rgba(255,255,255,.59) 100%),
      linear-gradient(180deg, transparent 38%, white 100%) !important;
  }
}
