/* Scoped copy of steps.css, built by ZW Icons from https://zachwheat.com/wp-content/plugins/zw-icons/assets/kit/steps.css */

body.zw-kit .steps {
  
  --height: 50px;
  --arrow: 24px;          
  --radius: 4px;
  --circle: 38px;
  --font: Arial, "Helvetica Neue", Helvetica, sans-serif;
  --label-size: 20px;
  --desc-size: 13px;
  --num-size: 30px;

  
  --panel: #37bfff;        
  --panel-shade: 22%;      
  --panel-lift: 40%;       
  --panel-border: #058be9;
  --gloss: #ffffff;        
  --shadow: 0 2px 2.5px rgba(0, 0, 0, .35);

  --label: #ffffff;
  --desc: #dff4ff;
  --text-shadow: 0 1px 1px rgba(0, 0, 0, .3);

  --num-bg: #1a8fd8;
  --num-ring: #b8ecff;
  --num-color: #ffffff;
  --num-shadow: 0 1px 1px rgba(0, 0, 0, .35);

  --sep-light: rgba(255, 255, 255, .5);   
  --sep-dark: rgba(0, 60, 120, .35);

  
  --active: #93b418;
  --active-shade: 40%;
  --active-lift: 12%;
  --active-gloss: var(--gloss);
  --active-border: #456003;
  --active-edge: #6fcfff;     
  --active-texture: none;     
  --active-label: #ffffff;
  --active-desc: #b1e35d;
  --active-text-shadow: 0 1px 1px rgba(0, 0, 0, .35);

  --active-num-bg: #cee76b;
  --active-num-ring: #efffb4;
  --active-num-color: #4f7800;
  --active-num-shadow: 0 1px 0 rgba(255, 255, 255, .6);

  
  container-type: inline-size;   
  display: flex;
  height: var(--height);
  margin: 0;
  padding: 0;
  list-style: none;
  border-radius: var(--radius);
  overflow: hidden;
  font-family: var(--font);
  background: linear-gradient(0deg,
    color-mix(in oklch, var(--panel), black var(--panel-shade)) 0%,
    var(--panel) 60%,
    color-mix(in oklch, var(--panel), white var(--panel-lift)) 96%,
    var(--gloss) 99%);
  box-shadow: 0 0 0 1px var(--panel-border), var(--shadow);
}
body.zw-kit .steps--muted {
  --panel: #e4e4e4;
  --panel-shade: 14%;
  --panel-lift: 50%;
  --panel-border: #bcbcbc;

  --label: #707070;
  --desc: #a5a5a5;
  --text-shadow: 0 1px 0 rgba(255, 255, 255, .85);

  --num-bg: #a3a3a3;
  --num-ring: #ececec;
  --num-shadow: 0 1px 1px rgba(0, 0, 0, .3);

  --sep-light: #ffffff;
  --sep-dark: rgba(0, 0, 0, .16);

  --active: #262626;
  --active-shade: 30%;
  --active-lift: 10%;
  --active-gloss: #4a4a4a;
  --active-border: #000000;
  --active-edge: rgba(255, 255, 255, .55);
  --active-texture: radial-gradient(rgba(255, 255, 255, .07) .8px, transparent 1px) 0 0 / 3px 3px;
  --active-desc: #a6e04a;
  --active-text-shadow: 0 1px 1px #000;

  --active-num-bg: #62b80f;
  --active-num-ring: #c9f78e;
  --active-num-color: #ffffff;
  --active-num-shadow: 0 1px 1px rgba(0, 0, 0, .35);
}
body.zw-kit .steps--amber {
  --panel: #2f3f5e;
  --panel-border: #1e2a40;
  --desc: #b9c6dc;
  --num-bg: #465a80;

  --active: #e8a317;
  --active-border: #8c5c00;
  --active-edge: #7f9cd1;
  --active-desc: #fff3c4;
  --active-num-bg: #ffe08a;
  --active-num-color: #8a5a00;
}
body.zw-kit .step {
  --a: var(--arrow);   
  position: relative;
  z-index: 1;
  flex: 1 1 0;
  min-width: 0;
  display: flex;
  align-items: center;
  gap: 10px;
  
  margin-left: calc(var(--a) * -1);
  padding: 0 calc(var(--a) + 4px) 0 calc(var(--a) + 10px);
}
body.zw-kit .step:first-child {
  margin-left: 0;
  padding-left: 10px;
}
body.zw-kit .step[aria-current="step"] {
  z-index: 2;   
}
body.zw-kit .step__shape {
  position: absolute;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  filter: drop-shadow(-1px 0 0 var(--sep-dark));
}
body.zw-kit .step__shape::before {
  content: "";
  position: absolute;
  inset: 0;
  background: var(--sep-light);
  
  clip-path: polygon(
    calc(100% - var(--a) - 2px) 0,
    calc(100% - var(--a)) 0,
    100% 50%,
    calc(100% - var(--a)) 100%,
    calc(100% - var(--a) - 2px) 100%,
    calc(100% - 2px) 50%);
}
body.zw-kit .step:last-child .step__shape::before {
  content: none;   
}
body.zw-kit .step[aria-current="step"] .step__shape {
  filter:
    drop-shadow(-1px 0 0 var(--active-border))
    drop-shadow(1px 0 0 var(--active-border))
    drop-shadow(2px 0 0 var(--active-edge));
}
body.zw-kit .step[aria-current="step"] .step__shape::before {
  content: "";
  background:
    var(--active-texture),
    linear-gradient(0deg,
      color-mix(in oklch, var(--active), black var(--active-shade)) 0%,
      var(--active) 60%,
      color-mix(in oklch, var(--active), white var(--active-lift)) 96%,
      var(--active-gloss) 97%);
  
  clip-path: polygon(
    0 0,
    calc(100% - var(--a)) 0,
    100% 50%,
    calc(100% - var(--a)) 100%,
    0 100%,
    var(--a) 50%);
}
body.zw-kit .step:first-child[aria-current="step"] .step__shape::before {
  
  clip-path: polygon(0 0, calc(100% - var(--a)) 0, 100% 50%, calc(100% - var(--a)) 100%, 0 100%);
}
body.zw-kit .step:last-child[aria-current="step"] .step__shape::before {
  
  clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%, var(--a) 50%);
}
body.zw-kit .step__num {
  flex: none;
  box-sizing: border-box;
  display: grid;
  place-items: center;
  width: var(--circle);
  height: var(--circle);
  border: 2px solid var(--num-ring);
  border-radius: 50%;
  background: linear-gradient(0deg,
    color-mix(in oklch, var(--num-bg), black 12%) 0%,
    var(--num-bg) 52%,
    color-mix(in oklch, var(--num-bg), white 60%) 100%);
  box-shadow: inset 0 1px 2px rgba(0, 0, 0, .2), 0 1px 1px rgba(0, 0, 0, .2);
  color: var(--num-color);
  font-size: var(--num-size);
  font-weight: 700;
  line-height: 1;
  letter-spacing: -.06em;
  text-shadow: var(--num-shadow);
}
body.zw-kit .step[aria-current="step"] .step__num {
  border-color: var(--active-num-ring);
  background: linear-gradient(0deg,
    color-mix(in oklch, var(--active-num-bg), black 12%) 0%,
    var(--active-num-bg) 52%,
    color-mix(in oklch, var(--active-num-bg), white 60%) 100%);
  color: var(--active-num-color);
  text-shadow: var(--active-num-shadow);
}
body.zw-kit .step__text {
  display: flex;
  flex-direction: column;
  gap: 3px;
  min-width: 0;
}
body.zw-kit .step__label, body.zw-kit .step__desc {
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}
body.zw-kit .step__label {
  color: var(--label);
  font-size: var(--label-size);
  font-weight: 700;
  line-height: 1;
  text-transform: uppercase;
  text-shadow: var(--text-shadow);
}
body.zw-kit .step__desc {
  color: var(--desc);
  font-family: var(--desc-font, inherit);
  font-size: var(--desc-size);
  line-height: 1.1;
}
body.zw-kit .step[aria-current="step"] .step__label {
  color: var(--active-label);
  text-shadow: var(--active-text-shadow);
}
body.zw-kit .step[aria-current="step"] .step__desc {
  color: var(--active-desc);
}
body.zw-kit .steps--grad {
  --height: 60px;
  --arrow: 20px;
  --label-size: 18px;
  --desc-size: 12px;
  --num-size: 46px;

  --panel: #ececec;
  --panel-shade: 6%;
  --panel-lift: 70%;
  --panel-border: #d6d6d6;
  --shadow: 0 1px 2px rgba(0, 0, 0, .15);

  --label: #666666;
  --desc: #6e6e6e;
  --text-shadow: 0 1px 0 rgba(255, 255, 255, .9);
  --num-color: #666666;
  --num-shadow: 0 1px 0 rgba(255, 255, 255, .9);

  --sep-light: #ffffff;
  --sep-dark: rgba(0, 0, 0, .08);

  --active: #5aaed3;          
  --active-final: #3f97c6;    
  --active-shade: 12%;
  --active-lift: 18%;
  --active-gloss: color-mix(in oklch, var(--active), white 35%);
  --active-border: rgba(0, 60, 100, .25);
  --active-edge: transparent;
  --active-label: #ffffff;
  --active-desc: #ffffff;
  --active-text-shadow: 0 1px 1px rgba(0, 50, 80, .25);
  --active-num-color: #ffffff;
  --active-num-shadow: 0 1px 1px rgba(0, 50, 80, .25);

  --past-step: 14%;           
}
body.zw-kit .steps--grad .step__num, body.zw-kit .steps--grad .step[aria-current="step"] .step__num {
  width: auto;
  height: auto;
  min-width: .7em;
  border: 0;
  background: none;
  box-shadow: none;
  letter-spacing: 0;
}
body.zw-kit .steps--grad .step__desc { font-weight: 700; }
body.zw-kit .steps--grad .step:last-child[aria-current="step"] { --active: var(--active-final); }
body.zw-kit .steps--grad .step:has(~ [aria-current="step"]) { --back: 3; }
body.zw-kit .steps--grad .step:has(+ .step + .step + [aria-current="step"]) { --back: 3; }
body.zw-kit .steps--grad .step:has(+ .step + [aria-current="step"]) { --back: 2; }
body.zw-kit .steps--grad .step:has(+ [aria-current="step"]) { --back: 1; }
body.zw-kit .steps--grad .step:has(~ [aria-current="step"]) {
  --lift: calc(var(--past-step) * var(--back));
}
body.zw-kit .steps--grad .step:has(~ [aria-current="step"]) .step__shape {
  filter: drop-shadow(1px 0 0 rgba(255, 255, 255, .35));
}
body.zw-kit .steps--grad .step:has(~ [aria-current="step"]) .step__shape::before {
  background: linear-gradient(0deg,
    color-mix(in oklch, var(--active), white calc(var(--lift) + 4%)) 0%,
    color-mix(in oklch, var(--active), white calc(var(--lift) + 14%)) 100%);
  clip-path: polygon(0 0, calc(100% - var(--a)) 0, 100% 50%, calc(100% - var(--a)) 100%, 0 100%, var(--a) 50%);
}
body.zw-kit .steps--grad .step:first-child:has(~ [aria-current="step"]) .step__shape::before {
  clip-path: polygon(0 0, calc(100% - var(--a)) 0, 100% 50%, calc(100% - var(--a)) 100%, 0 100%);
}
body.zw-kit .steps--grad .step:has(~ [aria-current="step"]) .step__label, body.zw-kit .steps--grad .step:has(~ [aria-current="step"]) .step__desc, body.zw-kit .steps--grad .step:has(~ [aria-current="step"]) .step__num {
  color: #ffffff;
  text-shadow: var(--active-text-shadow);
}
@container (max-width: 980px) {
body.zw-kit .step__label { font-size: calc(var(--label-size) * .8); }
body.zw-kit .step__desc { font-size: calc(var(--desc-size) * .85); }
body.zw-kit .step__num { width: calc(var(--circle) * .85); height: calc(var(--circle) * .85); font-size: calc(var(--num-size) * .8); }
}
@container (max-width: 820px) {
body.zw-kit .step { --a: calc(var(--arrow) * .7); gap: 7px; }
body.zw-kit .step__label { font-size: calc(var(--label-size) * .7); }
body.zw-kit .step__desc { font-size: calc(var(--desc-size) * .8); }
body.zw-kit .step__num { width: calc(var(--circle) * .75); height: calc(var(--circle) * .75); font-size: calc(var(--num-size) * .7); }
}
@container (max-width: 600px) {
body.zw-kit .step { --a: calc(var(--arrow) * .6); gap: 6px; flex: 0 0 auto; }
body.zw-kit .step:not([aria-current="step"]) .step__text { display: none; }
body.zw-kit .step[aria-current="step"] { flex: 1 1 auto; }
}
@container (max-width: 820px) {
body.zw-kit .steps--compact .step { --a: calc(var(--arrow) * .6); gap: 6px; flex: 0 0 auto; }
body.zw-kit .steps--compact .step:not([aria-current="step"]) .step__text { display: none; }
body.zw-kit .steps--compact .step[aria-current="step"] { flex: 1 1 auto; }
}
@container (max-width: 480px) {
body.zw-kit .step:not([aria-current="step"]) { display: none; }
body.zw-kit .step[aria-current="step"] { margin-left: 0; padding-left: 10px; padding-right: 10px; }
body.zw-kit .steps .step[aria-current="step"] .step__shape::before { clip-path: none; }
body.zw-kit .steps .step[aria-current="step"] .step__shape { filter: none; }
}

body.zw-kit .steps.steps--auto {
  --active: #0d1b2e;
  --active-final: color-mix(in oklch, #0d1b2e, black 10%);
  --active-gloss: color-mix(in oklch, #0d1b2e, white 45%);
  --active-border: color-mix(in oklch, #0d1b2e, black 38%);
  --active-edge: color-mix(in oklch, #a5a5a5, white 35%);
  --active-texture: none;
  --active-label: #ffffff;
  --active-desc: color-mix(in oklch, #ffffff, #0d1b2e 28%);
  --active-text-shadow: 0 1px 1px rgba(0, 0, 0, .35);
  --active-num-bg: color-mix(in oklch, #0d1b2e, white 55%);
  --active-num-ring: color-mix(in oklch, #0d1b2e, white 80%);
  --active-num-color: color-mix(in oklch, #0d1b2e, black 50%);
  --active-num-shadow: 0 1px 0 rgba(255, 255, 255, .5);
  --zw-past-text: #ffffff;
  --zw-past-shadow: 0 1px 1px rgba(0, 0, 0, .25);
}
body.zw-kit .steps.steps--auto-panel {
  --panel: #a5a5a5;
  --panel-border: color-mix(in oklch, #a5a5a5, black 28%);
  --gloss: color-mix(in oklch, #a5a5a5, white 55%);
  --label: #1a1a1a;
  --desc: color-mix(in oklch, #1a1a1a, #a5a5a5 30%);
  --text-shadow: 0 1px 0 rgba(255, 255, 255, .6);
  --num-bg: color-mix(in oklch, #a5a5a5, black 18%);
  --num-ring: color-mix(in oklch, #a5a5a5, white 55%);
  --num-color: #1a1a1a;
  --sep-light: rgba(255, 255, 255, .8);
  --sep-dark: color-mix(in oklch, #a5a5a5, black 40%);
}
body.zw-kit .steps--grad:is(.steps--auto, .steps--custom) .step:has(~ [aria-current="step"]) :is(.step__label, .step__desc, .step__num) {
  color: var(--zw-past-text);
  text-shadow: var(--zw-past-shadow);
}
body.zw-kit .steps.steps { padding: 0; list-style: none; line-height: normal; }
body.zw-kit .steps .step { margin-top: 0; margin-bottom: 0; padding-top: 0; padding-bottom: 0; height: auto; align-self: stretch; list-style: none; line-height: normal; }
body.zw-kit .steps .step::marker { content: none; }
body.zw-kit .steps .step::before, body.zw-kit .steps .step::after { content: none; display: none; }
body.zw-kit .zw-sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
body.zw-kit .step__num .zw-icon { width: 62%; height: 62%; }
body.zw-kit .steps--grad .step__num .zw-icon { width: 34px; height: 34px; }