/*
Theme Name: Salient Child Theme
Description: This is a custom child theme for Salient
Theme URI:   https://themeforest.net/item/salient-responsive-multipurpose-theme/4363266
Author: ThemeNectar
Author URI:  https://themeforest.net/user/themenectar
Template: salient
Version: 1.0
*/

/* ---- Bioregen background patterns ---- */

/* Dark full-width bands: fine dot grid + large concentric rings echoing the circular leaf logo */
.brg-row-dark .row-bg {
  background-image:
    radial-gradient(circle at 88% -140px, transparent 279px, rgba(255, 255, 255, 0.07) 280px, transparent 283px),
    radial-gradient(circle at 88% -140px, transparent 389px, rgba(255, 255, 255, 0.05) 390px, transparent 393px),
    radial-gradient(circle at 88% -140px, transparent 499px, rgba(255, 255, 255, 0.03) 500px, transparent 503px),
    radial-gradient(rgba(255, 255, 255, 0.05) 1px, transparent 1.6px);
  background-size: auto, auto, auto, 26px 26px;
}

/* Light grey full-width bands: faint dot grid */
.brg-row-light .row-bg {
  background-image: radial-gradient(rgba(0, 0, 0, 0.05) 1px, transparent 1.6px);
  background-size: 26px 26px;
}

/* Column-level patterns are painted as overlays so they ride above the column bg colour */
.brg-col-green,
.brg-col-light {
  position: relative;
}
.brg-col-green::before,
.brg-col-light::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  border-radius: 15px;
  pointer-events: none;
}

/* Green CTA panels: fine diagonal pinstripes + one large ring */
.brg-col-green::before {
  background-image:
    repeating-linear-gradient(-45deg, rgba(255, 255, 255, 0.06) 0 2px, transparent 2px 16px),
    radial-gradient(circle at 92% -100px, transparent 249px, rgba(255, 255, 255, 0.16) 250px, transparent 253px),
    radial-gradient(circle at 92% -100px, transparent 339px, rgba(255, 255, 255, 0.1) 340px, transparent 343px);
}

/* Light feature panels: faint dot grid */
.brg-col-light::before {
  background-image: radial-gradient(rgba(0, 0, 0, 0.045) 1px, transparent 1.6px);
  background-size: 26px 26px;
}

/* Sage band (flexible home): green dot grid + large green rings, logo echo */
.brg-row-sage .row-bg {
  background-image:
    radial-gradient(circle at 8% 120%, transparent 279px, rgba(8, 137, 33, 0.1) 280px, transparent 283px),
    radial-gradient(circle at 8% 120%, transparent 389px, rgba(8, 137, 33, 0.07) 390px, transparent 393px),
    radial-gradient(circle at 8% 120%, transparent 499px, rgba(8, 137, 33, 0.045) 500px, transparent 503px),
    radial-gradient(rgba(8, 137, 33, 0.08) 1px, transparent 1.6px);
  background-size: auto, auto, auto, 26px 26px;
}

/* Process steps: green flow arrows between stages (desktop only — hidden when the
   grid wraps to 2x2 or stacks, where a right-pointing arrow would mislead) */
.brg-arrow-col { position: relative; }
.brg-arrow {
  display: none;
  position: absolute;
  top: 2px;
  right: -36px;
  width: 30px;
  height: 26px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2356b365' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 12h16M14 6l6 6-6 6'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  pointer-events: none;
}
@media (min-width: 1000px) {
  .brg-arrow { display: block; }
}

/* Mist band (what we do): fine blue pinstripes + one large blue ring */
.brg-row-mist .row-bg {
  background-image:
    repeating-linear-gradient(-45deg, rgba(2, 59, 138, 0.045) 0 2px, transparent 2px 18px),
    radial-gradient(circle at 94% -120px, transparent 299px, rgba(2, 59, 138, 0.09) 300px, transparent 303px),
    radial-gradient(circle at 94% -120px, transparent 419px, rgba(2, 59, 138, 0.06) 420px, transparent 423px);
}