/* Bookit passes promo preview calculation card */
#step2 .pass-preview-card,#step2 div[style*="border:1.5px solid #e2e8f0"]:has(#passPrevQty):has(#passPrevBase){background:#fff!important;border:1px solid #dbe6f3!important;border-radius:16px!important;box-shadow:0 14px 34px rgba(16,24,40,.08)!important;overflow:hidden!important;padding:0!important}
#step2 .pass-preview-card>div:first-child,#step2 div[style*="border:1.5px solid #e2e8f0"]:has(#passPrevQty):has(#passPrevBase)>div:first-child{min-height:62px!important;margin:0!important;padding:18px 20px!important;background:linear-gradient(135deg,#006a5d 0%,#007e6e 55%,#008374 100%)!important;color:#fff!important;-webkit-text-fill-color:#fff!important}
#step2 .pass-preview-card>div:first-child>div:first-child,#step2 div[style*="border:1.5px solid #e2e8f0"]:has(#passPrevQty):has(#passPrevBase)>div:first-child>div:first-child{color:#fff!important;-webkit-text-fill-color:#fff!important;font-family:'Roboto Slab',Georgia,serif!important;font-size:18px!important;font-weight:900!important;letter-spacing:-.2px!important}
#step2 .pass-preview-card>div:first-child>div:last-child,#step2 div[style*="border:1.5px solid #e2e8f0"]:has(#passPrevQty):has(#passPrevBase)>div:first-child>div:last-child{color:rgba(255,255,255,.82)!important;-webkit-text-fill-color:rgba(255,255,255,.82)!important;border:1px solid rgba(255,255,255,.22)!important;border-radius:999px!important;padding:5px 10px!important;background:rgba(255,255,255,.10)!important}
#step2 .pass-preview-card>div:nth-child(2),#step2 div[style*="border:1.5px solid #e2e8f0"]:has(#passPrevQty):has(#passPrevBase)>div:nth-child(2){padding:18px 18px 10px!important;margin:0!important}
#step2 .pass-preview-card label,#step2 div[style*="border:1.5px solid #e2e8f0"]:has(#passPrevQty):has(#passPrevBase) label{color:#334155!important;-webkit-text-fill-color:#334155!important;font-size:12px!important;font-weight:900!important;margin-bottom:7px!important}
#step2 .pass-preview-card input,#step2 div[style*="border:1.5px solid #e2e8f0"]:has(#passPrevQty):has(#passPrevBase) input{border:1.5px solid #dbe6f3!important;border-radius:12px!important;min-height:48px!important;padding:12px 14px!important;color:#111827!important;-webkit-text-fill-color:#111827!important;font-size:14px!important;font-weight:800!important;box-shadow:none!important}
#step2 .pass-preview-card input:focus,#step2 div[style*="border:1.5px solid #e2e8f0"]:has(#passPrevQty):has(#passPrevBase) input:focus{border-color:#008374!important;box-shadow:0 0 0 4px rgba(0,131,116,.10)!important}
#step2 .pass-preview-card>div:nth-child(3),#step2 div[style*="border:1.5px solid #e2e8f0"]:has(#passPrevQty):has(#passPrevBase)>div:nth-child(3){margin:8px 18px 0!important;padding:14px 16px!important;gap:8px!important;background:#f0fdf9!important;border:1px solid #c7f2ea!important;border-radius:14px!important;color:#0f172a!important;-webkit-text-fill-color:#0f172a!important}
#step2 .pass-preview-card>div:nth-child(3)>div,#step2 div[style*="border:1.5px solid #e2e8f0"]:has(#passPrevQty):has(#passPrevBase)>div:nth-child(3)>div{padding:3px 0!important;border-bottom:1px solid rgba(0,131,116,.12)!important;color:#334155!important;-webkit-text-fill-color:#334155!important}
#step2 .pass-preview-card>div:nth-child(3)>div:last-child,#step2 div[style*="border:1.5px solid #e2e8f0"]:has(#passPrevQty):has(#passPrevBase)>div:nth-child(3)>div:last-child{border-bottom:0!important}
#step2 .pass-preview-card>div:nth-child(3) span:last-child,#step2 div[style*="border:1.5px solid #e2e8f0"]:has(#passPrevQty):has(#passPrevBase)>div:nth-child(3) span:last-child{color:#006a5d!important;-webkit-text-fill-color:#006a5d!important;font-weight:900!important}
#step2 #passPrevDiscount{color:#dc2626!important;-webkit-text-fill-color:#dc2626!important}
#step2 .pass-preview-card>div:nth-child(4),#step2 div[style*="border:1.5px solid #e2e8f0"]:has(#passPrevQty):has(#passPrevBase)>div:nth-child(4){margin:0!important;padding:16px 18px 18px!important;gap:10px!important}
#step2 #passPrevRecalc,#step2 #passPromoClearAll{min-height:42px!important;border-radius:999px!important;font-size:13px!important;font-weight:900!important;box-shadow:0 10px 22px rgba(0,131,116,.14)!important}
#step2 #passPrevRecalc{background:#008374!important;border:1.5px solid #008374!important;color:#fff!important;-webkit-text-fill-color:#fff!important}
#step2 #passPromoClearAll{background:#fff!important;border:1.5px solid #dbe6f3!important;color:#334155!important;-webkit-text-fill-color:#334155!important;box-shadow:none!important}
/* ============================================================
   JustSelect Universal Banner System
   L1 = step (h2 data-section-num)  : largest, "Section 0X" eyebrow
   L2 = category (.section-head etc): medium, "CATEGORY" eyebrow
   L3 = sub-section                  : compact divider style
   Icons via --bnr-icon CSS variable (set inline by JS)
   ============================================================ */

/* Postit step-2 specs visual refresh only. Keeps existing JS/actions intact. */
#step2 #piSpecsWrap .pi-specs-card{
  background:#fff !important;
  border:1px solid #dbe6f3 !important;
  border-radius:16px !important;
  overflow:hidden !important;
  box-shadow:0 14px 34px rgba(16,24,40,.08) !important;
  margin-bottom:16px !important;
  counter-reset:piStepSection !important;
}
#step2 #piSpecsWrap .pi-specs-card-head{
  position:relative !important;
  display:block !important;
  min-height:122px !important;
  padding:26px 24px 26px 98px !important;
  border-radius:16px 16px 0 0 !important;
  background:linear-gradient(135deg,#006a5d 0%,#007e6e 55%,#008374 100%) !important;
  color:#fff !important;
}
#step2 #piSpecsWrap .pi-specs-card-head::before{
  content:"CATEGORY" !important;
  display:block !important;
  margin-bottom:5px !important;
  color:rgba(255,255,255,.82) !important;
  font-family:'Nunito',system-ui,sans-serif !important;
  font-size:12px !important;
  font-weight:800 !important;
  letter-spacing:1.4px !important;
  text-transform:uppercase !important;
}
#step2 #piSpecsWrap .pi-specs-card-head .pi-specs-card-icon{
  position:absolute !important;
  left:24px !important;
  top:50% !important;
  transform:translateY(-50%) !important;
  width:58px !important;
  height:58px !important;
  border-radius:14px !important;
  display:grid !important;
  place-items:center !important;
  background:rgba(255,255,255,.11) !important;
  border:1px solid rgba(255,255,255,.22) !important;
  box-shadow:0 6px 18px rgba(0,0,0,.16) !important;
  font-size:25px !important;
  line-height:1 !important;
}
#step2 #piSpecsWrap .pi-specs-card-head .pi-specs-card-title{
  color:#fff !important;
  -webkit-text-fill-color:#fff !important;
  font-family:'Roboto Slab',Georgia,serif !important;
  font-size:28px !important;
  line-height:1.12 !important;
  font-weight:900 !important;
  letter-spacing:-.3px !important;
}
#step2 #piSpecsWrap .pi-specs-card-head .pi-specs-card-sub{
  margin-top:7px !important;
  color:rgba(255,255,255,.88) !important;
  -webkit-text-fill-color:rgba(255,255,255,.88) !important;
  font-size:13px !important;
  font-weight:700 !important;
  line-height:1.35 !important;
}
#step2 #piSpecsWrap .pi-sec-head{
  counter-increment:piStepSection !important;
  display:block !important;
  margin:0 !important;
  padding:18px 22px 4px !important;
  border:0 !important;
  background:#fff !important;
}
#step2 #piSpecsWrap .pi-sec-head:not(:first-child){border-top:1px solid #eef2f7 !important}
#step2 #piSpecsWrap .pi-sec-head .pi-sec-icon{display:none !important}
#step2 #piSpecsWrap .pi-sec-head .pi-sec-label{
  color:var(--brand) !important;
  -webkit-text-fill-color:var(--brand) !important;
  font-size:18px !important;
  font-weight:900 !important;
  text-transform:none !important;
  letter-spacing:0 !important;
  line-height:1.2 !important;
}
#step2 #piSpecsWrap .pi-sec-head .pi-sec-label::before{content:counter(piStepSection) ") " !important}
#step2 #piSpecsWrap .pi-sec-head .pi-sec-desc{
  margin-top:4px !important;
  color:#64748b !important;
  -webkit-text-fill-color:#64748b !important;
  font-size:12px !important;
  font-weight:700 !important;
  line-height:1.35 !important;
}
#step2 #piSpecsWrap .pi-sec-body{padding:12px 22px 16px !important;background:#fff !important}
#step2 #piSpecsWrap .pi-spec-group{margin-bottom:18px !important}
#step2 #piSpecsWrap .pi-spec-label{
  margin-bottom:10px !important;
  color:#111827 !important;
  -webkit-text-fill-color:#111827 !important;
  font-size:14px !important;
  font-weight:900 !important;
}

/* === LEVEL 1 — Step Section (largest banner) === */
/* Back navigation guard: never show skeleton loaders over the category step. */
#step1.active #step1Skeleton,
#step1.active ~ #step2SkeletonOuter{
  display:none !important;
}
#step1.active.skeleton-active{
  overflow:visible !important;
  min-height:0 !important;
}

/* Step 3 media radio controls: selected state belongs to the full button, not the text span. */
#step3 .principal-media-toggle,
#step3 .media-type-selector{
  align-items:center !important;
}
#step3 .media-radio{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:flex-start !important;
  gap:8px !important;
  border:1.5px solid #dbe6f3 !important;
  background:#fff !important;
  color:#334155 !important;
  -webkit-text-fill-color:#334155 !important;
  box-shadow:none !important;
}
#step3 .principal-media-toggle .media-radio{
  min-height:42px !important;
  padding:8px 16px !important;
  border-radius:999px !important;
  flex:0 0 auto !important;
}
#step3 .media-type-selector .media-radio{
  min-height:52px !important;
  padding:10px 18px !important;
  border-radius:14px !important;
}
#step3 .media-radio:hover{
  border-color:#008374 !important;
  background:rgba(0,131,116,.05) !important;
}
#step3 .media-radio:has(input[type="radio"]:checked){
  border-color:#008374 !important;
  background:rgba(0,131,116,.09) !important;
  color:#005f55 !important;
  -webkit-text-fill-color:#005f55 !important;
  box-shadow:0 0 0 3px rgba(0,131,116,.08) !important;
}
#step3 .media-radio input[type="radio"]{
  width:16px !important;
  height:16px !important;
  margin:0 !important;
  flex:0 0 auto !important;
  accent-color:#008374 !important;
}
#step3 .media-radio span,
#step3 .media-radio input[type="radio"]:checked + span{
  display:inline !important;
  padding:0 !important;
  margin:0 !important;
  border:0 !important;
  border-radius:0 !important;
  background:transparent !important;
  background-image:none !important;
  box-shadow:none !important;
  color:inherit !important;
  -webkit-text-fill-color:inherit !important;
  font-weight:900 !important;
  line-height:1.2 !important;
}

/* Postit sub-category chips: keep pill styling stable even if module CSS loads late. */
body.postit-flow-active #step2 .pi-level-card .pi-level-grid{
  display:flex !important;
  flex-wrap:wrap !important;
  gap:10px !important;
  padding:18px 22px 22px !important;
  background:#fff !important;
}
body.postit-flow-active #step2 .pi-level-card .pi-level-chip,
body.postit-flow-active #step2 .pi-level-card .lp-cat-chip{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  min-height:38px !important;
  margin:0 !important;
  padding:10px 18px !important;
  border:1.5px solid #dbe6f3 !important;
  border-radius:999px !important;
  background:#fff !important;
  color:#0f172a !important;
  -webkit-text-fill-color:#0f172a !important;
  font-size:14px !important;
  font-weight:900 !important;
  line-height:1.25 !important;
  box-shadow:none !important;
  cursor:pointer !important;
  user-select:none !important;
}
body.postit-flow-active #step2 .pi-level-card .pi-level-chip:hover,
body.postit-flow-active #step2 .pi-level-card .lp-cat-chip:hover{
  border-color:#008374 !important;
  background:#e6f7f5 !important;
  box-shadow:0 0 0 3px rgba(0,131,116,.08) !important;
}
body.postit-flow-active #step2 .pi-level-card .pi-level-chip.selected,
body.postit-flow-active #step2 .pi-level-card .lp-cat-chip.selected{
  border-color:#008374 !important;
  background:#008374 !important;
  color:#fff !important;
  -webkit-text-fill-color:#fff !important;
  box-shadow:0 8px 18px rgba(0,131,116,.22) !important;
}

/* Post Project budget fields: keep currency prefix and values readable. */
body.postit-flow-active #step2 #pjfBudgetRow{
  overflow:visible !important;
}
body.postit-flow-active #step2 #pjfBudgetRow > div:nth-child(2){
  display:grid !important;
  grid-template-columns:minmax(0,1fr) auto minmax(0,1fr) auto !important;
  align-items:center !important;
  gap:12px !important;
}
body.postit-flow-active #step2 #pjfBudgetRow #ppwBudgetFrom,
body.postit-flow-active #step2 #pjfBudgetRow #ppwBudgetTo{
  height:52px !important;
  min-height:52px !important;
  padding:0 18px 0 54px !important;
  border:1.5px solid #dbe6f3 !important;
  border-radius:12px !important;
  background:#fff !important;
  color:#0f172a !important;
  -webkit-text-fill-color:#0f172a !important;
  font-size:15px !important;
  font-weight:900 !important;
  line-height:52px !important;
  box-shadow:none !important;
}
body.postit-flow-active #step2 #pjfBudgetRow #ppwBudgetFrom:focus,
body.postit-flow-active #step2 #pjfBudgetRow #ppwBudgetTo:focus{
  border-color:#008374 !important;
  box-shadow:0 0 0 4px rgba(0,131,116,.12) !important;
}
body.postit-flow-active #step2 #pjfBudgetRow #ppwBudgetFrom + *,
body.postit-flow-active #step2 #pjfBudgetRow #ppwBudgetTo + *{
  pointer-events:none !important;
}
body.postit-flow-active #step2 #pjfBudgetRow div:has(> #ppwBudgetFrom) > span,
body.postit-flow-active #step2 #pjfBudgetRow div:has(> #ppwBudgetTo) > span{
  left:20px !important;
  color:#008374 !important;
  -webkit-text-fill-color:#008374 !important;
  font-size:14px !important;
  font-weight:900 !important;
  z-index:2 !important;
}
#step2 #pjfBudgetRow #ppwBudgetFrom,
#step2 #pjfBudgetRow #ppwBudgetTo{
  padding-left:54px !important;
}
#step2 #pjfBudgetRow div:has(> #ppwBudgetFrom) > span,
#step2 #pjfBudgetRow div:has(> #ppwBudgetTo) > span{
  left:20px !important;
  min-width:18px !important;
  color:#008374 !important;
  -webkit-text-fill-color:#008374 !important;
  font-weight:900 !important;
}
body.postit-flow-active #step2 #pjfBudgetRow button[onclick="pjfToggleFixed()"]{
  height:48px !important;
  min-width:66px !important;
  padding:0 16px !important;
  border:1.5px solid #dbe6f3 !important;
  border-radius:12px !important;
  background:#fff !important;
  color:#0f172a !important;
  -webkit-text-fill-color:#0f172a !important;
  font-size:13px !important;
  font-weight:900 !important;
  box-shadow:none !important;
}
body.postit-flow-active #step2 #pjfBudgetDisplay{
  color:#008374 !important;
  -webkit-text-fill-color:#008374 !important;
  font-size:16px !important;
  font-weight:900 !important;
}
body.postit-flow-active #step2 #pjfDualRange{
  margin:6px 12px 0 !important;
}
@media(max-width:640px){
  body.postit-flow-active #step2 #pjfBudgetRow > div:nth-child(2){
    grid-template-columns:1fr !important;
  }
  body.postit-flow-active #step2 #pjfBudgetRow > div:nth-child(2) > span{
    display:none !important;
  }
}

/* Postit title card polish. */
body.postit-flow-active.postit-flow-title-shown #step2 #genericTitleGroup{
  display:block !important;
  margin:18px 0 0 !important;
  padding:0 22px 22px !important;
  background:#fff !important;
  border:1px solid #dbe6f3 !important;
  border-bottom:0 !important;
  border-radius:16px 16px 0 0 !important;
  box-shadow:0 14px 34px rgba(16,24,40,.08) !important;
  overflow:hidden !important;
}
body.postit-flow-active.postit-flow-title-shown #step2 #genericTitleGroup > .pi-form-card-head{
  margin:0 -22px 18px !important;
  width:auto !important;
  min-height:110px !important;
  padding:26px 24px 24px 120px !important;
  border-radius:16px 16px 0 0 !important;
}
body.postit-flow-active.postit-flow-title-shown #step2 #genericTitleGroup > .pi-form-card-head::before{
  left:120px !important;
}
body.postit-flow-active.postit-flow-title-shown #step2 #genericTitleGroup .pi-form-card-icon{
  left:32px !important;
  width:60px !important;
  height:60px !important;
  border-radius:14px !important;
}
body.postit-flow-active.postit-flow-title-shown #step2 #genericTitleGroup .pi-form-card-title,
body.postit-flow-active.postit-flow-title-shown #step2 #genericTitleGroup .pi-form-card-sub{
  position:relative !important;
  z-index:1 !important;
  max-width:calc(100% - 8px) !important;
}
body.postit-flow-active.postit-flow-title-shown #step2 #genericTitleGroup .pi-form-card-title{
  font-size:clamp(22px,3vw,28px) !important;
  line-height:1.12 !important;
}
body.postit-flow-active.postit-flow-title-shown #step2 #genericTitleGroup > label{
  display:block !important;
  margin:0 0 10px !important;
  color:#111827 !important;
  -webkit-text-fill-color:#111827 !important;
  font-size:14px !important;
  font-weight:900 !important;
}
body.postit-flow-active.postit-flow-title-shown #step2 #genericTitleGroup input#title{
  min-height:52px !important;
  margin:0 !important;
  padding:13px 16px !important;
  border:1.5px solid #dbe6f3 !important;
  border-radius:12px !important;
  background:#fff !important;
  color:#111827 !important;
  -webkit-text-fill-color:#111827 !important;
  font-size:15px !important;
  font-weight:800 !important;
  box-shadow:none !important;
}
body.postit-flow-active.postit-flow-title-shown #step2 #genericTitleGroup input#title:focus{
  border-color:#008374 !important;
  box-shadow:0 0 0 4px rgba(0,131,116,.10) !important;
}

body.postit-location-disabled #step2 #locationGroup{
  display:none !important;
}

/* Step 5 section-aware review details. */
#step5 #reviewDetailsPanel{
  margin:18px 0 12px !important;
  padding:0 !important;
  border:1.5px solid #dbe6f3 !important;
  border-radius:14px !important;
  background:#fff !important;
  overflow:hidden !important;
}
#step5 .review-details-title{
  margin:0 !important;
  padding:13px 16px !important;
  background:#f8fffd !important;
  border-bottom:1px solid #e2e8f0 !important;
  color:#006a5d !important;
  -webkit-text-fill-color:#006a5d !important;
  font-size:13px !important;
  font-weight:900 !important;
  text-transform:uppercase !important;
  letter-spacing:.7px !important;
}
#step5 .review-details-grid{
  display:grid !important;
  grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  gap:0 !important;
  padding:4px 16px !important;
}
#step5 .review-detail-item{
  min-width:0 !important;
  display:grid !important;
  grid-template-columns:minmax(120px,34%) 1fr !important;
  gap:12px !important;
  align-items:start !important;
  padding:11px 0 !important;
  border:0 !important;
  border-bottom:1px solid #eef2f7 !important;
  border-radius:0 !important;
  background:transparent !important;
}
#step5 .review-detail-label{
  margin:0 !important;
  color:#72809b !important;
  -webkit-text-fill-color:#72809b !important;
  font-size:11px !important;
  font-weight:900 !important;
  text-transform:uppercase !important;
  letter-spacing:.45px !important;
}
#step5 .review-detail-value{
  color:#0f172a !important;
  -webkit-text-fill-color:#0f172a !important;
  font-size:13px !important;
  font-weight:800 !important;
  line-height:1.35 !important;
  overflow-wrap:anywhere !important;
}
@media (max-width:760px){
  #step5 .review-details-grid{grid-template-columns:1fr !important}
  #step5 .review-detail-item{grid-template-columns:1fr !important;gap:4px !important}
}

.app .step-content > h2[data-section-num],
#step1 > h2[data-section-num],#step2 > h2[data-section-num],#step3 > h2[data-section-num],#step4 > h2[data-section-num],#step5 > h2[data-section-num],
h2#step2Title[data-section-num]{
position:relative !important;display:block !important;margin:calc(-1 * var(--pad-3)) calc(-1 * var(--pad-3)) 16px !important;padding:38px 26px 22px 100px !important;min-height:92px !important;box-sizing:border-box !important;background:linear-gradient(135deg,#00564b 0%,#006a5d 50%,#007e6e 100%) !important;background-image:linear-gradient(135deg,#00564b 0%,#006a5d 50%,#007e6e 100%) !important;background-color:#006a5d !important;color:#fff !important;-webkit-text-fill-color:#fff !important;border-radius:calc(var(--r-3) - 2px) calc(var(--r-3) - 2px) 0 0 !important;font-family:'Roboto Slab','Bree Serif',Georgia,serif !important;font-weight:800 !important;font-size:clamp(22px,3.6vw,30px) !important;line-height:1.15 !important;letter-spacing:.2px !important;overflow:hidden !important;border:none !important;text-align:left !important
}
.app .step-content > h2[data-section-num]::before,#step1 > h2[data-section-num]::before,#step2 > h2[data-section-num]::before,#step3 > h2[data-section-num]::before,#step4 > h2[data-section-num]::before,#step5 > h2[data-section-num]::before,h2#step2Title[data-section-num]::before{
content:'Section ' attr(data-section-num) !important;position:absolute !important;top:14px !important;left:100px !important;font-family:'Nunito',system-ui,sans-serif !important;font-size:13px !important;font-weight:500 !important;color:rgba(255,255,255,.78) !important;-webkit-text-fill-color:rgba(255,255,255,.78) !important;letter-spacing:.3px !important;text-transform:none !important;background:none !important;background-image:none !important;width:auto !important;height:auto !important;border-radius:0 !important;border:0 !important;display:block !important;padding:0 !important;margin:0 !important
}
.app .step-content > h2[data-section-num]::after,#step1 > h2[data-section-num]::after,#step2 > h2[data-section-num]::after,#step3 > h2[data-section-num]::after,#step4 > h2[data-section-num]::after,#step5 > h2[data-section-num]::after,h2#step2Title[data-section-num]::after{
content:'' !important;position:absolute !important;top:50% !important;left:22px !important;transform:translateY(-50%) !important;width:56px !important;height:56px !important;border-radius:14px !important;background-color:rgba(255,255,255,.10) !important;background-image:var(--bnr-icon,url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='M3 11l9-8 9 8'/><path d='M5 10v10h14V10'/><path d='M10 20v-6h4v6'/></svg>")) !important;background-position:center !important;background-size:24px 24px !important;background-repeat:no-repeat !important;border:1px solid rgba(255,255,255,.18) !important;box-shadow:0 4px 14px rgba(0,0,0,.18) !important;display:block !important;padding:0 !important;margin:0 !important
}

/* Subtitle right after banner h2 */
.app .step-content > h2[data-section-num] + .subtitle,#step1 > h2[data-section-num] + .subtitle,#step2 > h2[data-section-num] + .subtitle,#step3 > h2[data-section-num] + .subtitle,#step4 > h2[data-section-num] + .subtitle,#step5 > h2[data-section-num] + .subtitle{margin-top:-6px !important;padding:0 4px !important;color:var(--js-muted,#6b7280) !important;-webkit-text-fill-color:var(--js-muted,#6b7280) !important;font-size:13px !important;font-weight:500 !important;background:none !important;background-image:none !important;display:block !important}

/* === LEVEL 2 — Category Panel (prominent like L1, with "CATEGORY" eyebrow) === */
.app .section-head,
#step1 .section-head,#step2 .section-head,#step3 .section-head,#step4 .section-head,#step5 .section-head,
.app .dob-policy-section-header,
#step1 .dob-policy-section-header,#step2 .dob-policy-section-header,#step3 .dob-policy-section-header,#step4 .dob-policy-section-header,#step5 .dob-policy-section-header,
#step2 #moduleSpecificWrap > div > .section-head:first-child[class],
#step2 .dob-policy-section > .dob-policy-section-header[class]{
position:relative !important;margin:18px 0 14px !important;padding:30px 22px 18px 86px !important;min-height:74px !important;box-sizing:border-box !important;background:linear-gradient(135deg,#00564b 0%,#006a5d 50%,#007e6e 100%) !important;background-image:linear-gradient(135deg,#00564b 0%,#006a5d 50%,#007e6e 100%) !important;background-color:#006a5d !important;border:none !important;border-radius:14px !important;overflow:hidden !important;color:#fff !important;-webkit-text-fill-color:#fff !important;font-family:'Roboto Slab','Bree Serif',Georgia,serif !important;font-weight:800 !important;display:block !important
}
.app .section-head::before,#step1 .section-head::before,#step2 .section-head::before,#step3 .section-head::before,#step4 .section-head::before,#step5 .section-head::before,
.app .dob-policy-section-header::before,#step1 .dob-policy-section-header::before,#step2 .dob-policy-section-header::before,#step3 .dob-policy-section-header::before,#step4 .dob-policy-section-header::before,#step5 .dob-policy-section-header::before{
content:'' !important;position:absolute !important;left:18px !important;top:50% !important;transform:translateY(-50%) !important;width:48px !important;height:48px !important;border-radius:12px !important;background-color:rgba(255,255,255,.10) !important;background-image:var(--bnr-icon,url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='M3 11l9-8 9 8'/><path d='M5 10v10h14V10'/><path d='M10 20v-6h4v6'/></svg>")) !important;background-position:center !important;background-size:22px 22px !important;background-repeat:no-repeat !important;border:1px solid rgba(255,255,255,.18) !important;box-shadow:0 3px 10px rgba(0,0,0,.16) !important;pointer-events:none !important;display:block !important
}
.app .section-head::after,#step1 .section-head::after,#step2 .section-head::after,#step3 .section-head::after,#step4 .section-head::after,#step5 .section-head::after,
.app .dob-policy-section-header::after,#step1 .dob-policy-section-header::after,#step2 .dob-policy-section-header::after,#step3 .dob-policy-section-header::after,#step4 .dob-policy-section-header::after,#step5 .dob-policy-section-header::after{
content:'CATEGORY' !important;position:absolute !important;top:10px !important;left:86px !important;font-family:'Nunito',system-ui,sans-serif !important;font-size:11px !important;font-weight:600 !important;letter-spacing:2.4px !important;text-transform:uppercase !important;color:rgba(255,255,255,.72) !important;-webkit-text-fill-color:rgba(255,255,255,.72) !important;background:none !important;background-image:none !important;width:auto !important;height:auto !important;border:0 !important;border-radius:0 !important;padding:0 !important;margin:0 !important;display:block !important;pointer-events:none !important
}
.app .section-head .section-title,#step1 .section-head .section-title,#step2 .section-head .section-title,#step3 .section-head .section-title,#step4 .section-head .section-title,#step5 .section-head .section-title,
.app .dob-policy-section-header .dob-policy-section-title,#step1 .dob-policy-section-header .dob-policy-section-title,#step2 .dob-policy-section-header .dob-policy-section-title,#step3 .dob-policy-section-header .dob-policy-section-title,#step4 .dob-policy-section-header .dob-policy-section-title,#step5 .dob-policy-section-header .dob-policy-section-title{
color:#fff !important;-webkit-text-fill-color:#fff !important;font-family:'Roboto Slab','Bree Serif',Georgia,serif !important;font-weight:800 !important;font-size:clamp(17px,2.6vw,21px) !important;line-height:1.2 !important;background:none !important;background-image:none !important;-webkit-background-clip:border-box !important;background-clip:border-box !important;margin:0 !important;padding:0 !important;letter-spacing:.1px !important
}
.app .section-head .section-sub,#step1 .section-head .section-sub,#step2 .section-head .section-sub,#step3 .section-head .section-sub,#step4 .section-head .section-sub,#step5 .section-head .section-sub{
color:rgba(255,255,255,.82) !important;-webkit-text-fill-color:rgba(255,255,255,.82) !important;font-family:'Nunito',system-ui,sans-serif !important;font-weight:500 !important;font-size:12.5px !important;line-height:1.4 !important;margin-top:4px !important;background:none !important;background-image:none !important
}
.app .section-head label,.app .section-head span,.app .dob-policy-section-header label,.app .dob-policy-section-header span{color:#fff !important;-webkit-text-fill-color:#fff !important}

/* === LEVEL 3 — Sub-section header (compact divider) === */
.app .pjf-header, .app .pjf-step-heading, .app .pjf-step-lbl, .app .pjf-step-divider, .app .pjf-sum-head, .app .gig-section-head, .app .gig-wz-step-divider, .app .gig-sum-card-head, .app .adv-head, .app .adv-repeater-head, .app .adv-variant-head, .app .dob-section-title, .app .dap-builder-title, .app .deal-preview-header, .app .deal-activity-preview-header, .app .deal-qoi-header, .app .pricing-header, .app .preview-ad-header, .app .summary-section-title, .app .pi-level-head, .app .pbh-head{
position:relative !important;margin:14px 0 10px !important;padding:11px 14px 11px 52px !important;background:linear-gradient(135deg,#006a5d 0%,#008374 100%) !important;background-image:linear-gradient(135deg,#006a5d 0%,#008374 100%) !important;background-color:#007a6c !important;border:none !important;border-radius:10px !important;overflow:hidden !important;color:#fff !important;-webkit-text-fill-color:#fff !important;font-family:'Roboto Slab','Bree Serif',Georgia,serif !important;font-weight:700 !important;font-size:14px !important;line-height:1.3 !important;display:block !important
}
.app .pjf-header::before, .app .pjf-step-heading::before, .app .pjf-step-lbl::before, .app .pjf-step-divider::before, .app .pjf-sum-head::before, .app .gig-section-head::before, .app .gig-wz-step-divider::before, .app .gig-sum-card-head::before, .app .adv-head::before, .app .adv-repeater-head::before, .app .adv-variant-head::before, .app .dob-section-title::before, .app .dap-builder-title::before, .app .deal-preview-header::before, .app .deal-activity-preview-header::before, .app .deal-qoi-header::before, .app .pricing-header::before, .app .preview-ad-header::before, .app .summary-section-title::before, .app .pi-level-head::before, .app .pbh-head::before{
content:'' !important;position:absolute !important;left:9px !important;top:50% !important;transform:translateY(-50%) !important;width:32px !important;height:32px !important;border-radius:9px !important;background-color:rgba(255,255,255,.10) !important;background-image:var(--bnr-icon,url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='M3 11l9-8 9 8'/><path d='M5 10v10h14V10'/><path d='M10 20v-6h4v6'/></svg>")) !important;background-position:center !important;background-size:16px 16px !important;background-repeat:no-repeat !important;border:1px solid rgba(255,255,255,.18) !important;pointer-events:none !important;display:block !important
}
.app .pjf-header *, .app .pjf-step-heading *, .app .pjf-step-lbl *, .app .pjf-step-divider *, .app .pjf-sum-head *, .app .gig-section-head *, .app .gig-wz-step-divider *, .app .gig-sum-card-head *, .app .adv-head *, .app .adv-repeater-head *, .app .adv-variant-head *, .app .dob-section-title *, .app .dap-builder-title *, .app .deal-preview-header *, .app .deal-activity-preview-header *, .app .deal-qoi-header *, .app .pricing-header *, .app .preview-ad-header *, .app .summary-section-title *, .app .pi-level-head *, .app .pbh-head *{color:#fff !important;-webkit-text-fill-color:#fff !important;font-family:inherit !important;background:none !important;background-image:none !important}
.app .gig-sum-divider{display:block !important;height:0 !important;min-height:0 !important;padding:0 !important;margin:14px 0 !important;border:0 !important;border-top:1px solid #f1f5f9 !important;background:none !important;box-shadow:none !important}
.app .gig-sum-divider::before,.app .gig-sum-divider::after{content:none !important;display:none !important}

/* Dynamic category group titles that do not carry a normal header class. */
#step2 .bnr-cat-head{
  position:relative !important;
  display:block !important;
  margin:0 0 14px !important;
  min-height:96px !important;
  padding:44px 24px 22px 98px !important;
  border:0 !important;
  border-radius:16px 16px 0 0 !important;
  background:linear-gradient(135deg,#006a5d 0%,#007e6e 55%,#008374 100%) !important;
  color:#fff !important;
  -webkit-text-fill-color:#fff !important;
  font-family:'Roboto Slab','Bree Serif',Georgia,serif !important;
  font-size:clamp(22px,3vw,28px) !important;
  font-weight:900 !important;
  line-height:1.15 !important;
  letter-spacing:-.2px !important;
  box-sizing:border-box !important;
  overflow:hidden !important;
}
#step2 .bnr-cat-head::before{
  content:'' !important;
  position:absolute !important;
  left:24px !important;
  top:50% !important;
  transform:translateY(-50%) !important;
  width:58px !important;
  height:58px !important;
  border-radius:14px !important;
  background-color:rgba(255,255,255,.11) !important;
  background-image:var(--bnr-icon,url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><rect x='3' y='3' width='7' height='7'/><rect x='14' y='3' width='7' height='7'/><rect x='14' y='14' width='7' height='7'/><rect x='3' y='14' width='7' height='7'/></svg>")) !important;
  background-position:center !important;
  background-size:25px 25px !important;
  background-repeat:no-repeat !important;
  border:1px solid rgba(255,255,255,.22) !important;
  box-shadow:0 6px 18px rgba(0,0,0,.16) !important;
  display:block !important;
}
#step2 .bnr-cat-head::after{
  content:attr(data-bnr-kicker) !important;
  position:absolute !important;
  left:98px !important;
  top:24px !important;
  width:auto !important;
  height:auto !important;
  padding:0 !important;
  margin:0 !important;
  background:none !important;
  border:0 !important;
  box-shadow:none !important;
  color:rgba(255,255,255,.82) !important;
  -webkit-text-fill-color:rgba(255,255,255,.82) !important;
  font-family:'Nunito',system-ui,sans-serif !important;
  font-size:12px !important;
  font-weight:800 !important;
  line-height:1.2 !important;
  letter-spacing:1.4px !important;
  text-transform:uppercase !important;
}
#step2 .bnr-cat-head > *,
#step2 .bnr-cat-head span{
  color:#fff !important;
  -webkit-text-fill-color:#fff !important;
  background:none !important;
  background-image:none !important;
}

/* Gallery upgrade banner should match the Step 3 media banner treatment. */
.app .gallery-pricing-model{
  padding:0 !important;
  overflow:hidden !important;
  background:#fff !important;
  border:2px solid var(--line) !important;
  border-radius:var(--r-3) !important;
}
.app .gallery-pricing-model .pricing-header{
  margin:0 0 var(--gap-3) !important;
  padding:34px 26px 24px 100px !important;
  min-height:92px !important;
  border:0 !important;
  border-radius:calc(var(--r-3) - 2px) calc(var(--r-3) - 2px) 0 0 !important;
  background:linear-gradient(135deg,#00564b 0%,#006a5d 50%,#007e6e 100%) !important;
  color:#fff !important;
  -webkit-text-fill-color:#fff !important;
  font-family:'Roboto Slab','Bree Serif',Georgia,serif !important;
  font-size:clamp(22px,3.6vw,30px) !important;
  font-weight:800 !important;
  line-height:1.15 !important;
}
.app .gallery-pricing-model .pricing-header::before{
  left:22px !important;
  width:56px !important;
  height:56px !important;
  border-radius:14px !important;
  background-size:24px 24px !important;
  box-shadow:0 4px 14px rgba(0,0,0,.18) !important;
}
.app .gallery-pricing-model .pricing-icon{display:none !important}
.app .gallery-pricing-model .pricing-header-text{
  font:inherit !important;
  color:#fff !important;
  -webkit-text-fill-color:#fff !important;
}
.app .gallery-pricing-model .pricing-tiers,
.app .gallery-pricing-model .pricing-note{
  margin-left:var(--pad-3) !important;
  margin-right:var(--pad-3) !important;
}
.app .gallery-pricing-model .pricing-note{margin-bottom:var(--pad-3) !important}

/* Mobile tweaks */
@media (max-width:600px){
.app .step-content > h2[data-section-num],#step1 > h2[data-section-num],#step2 > h2[data-section-num],#step3 > h2[data-section-num],#step4 > h2[data-section-num],#step5 > h2[data-section-num],h2#step2Title[data-section-num]{padding:34px 16px 16px 76px !important;min-height:78px !important;font-size:clamp(18px,5vw,22px) !important}
.app .step-content > h2[data-section-num]::before,#step1 > h2[data-section-num]::before,#step2 > h2[data-section-num]::before,#step3 > h2[data-section-num]::before,#step4 > h2[data-section-num]::before,#step5 > h2[data-section-num]::before,h2#step2Title[data-section-num]::before{top:10px !important;left:76px !important;font-size:11px !important}
.app .step-content > h2[data-section-num]::after,#step1 > h2[data-section-num]::after,#step2 > h2[data-section-num]::after,#step3 > h2[data-section-num]::after,#step4 > h2[data-section-num]::after,#step5 > h2[data-section-num]::after,h2#step2Title[data-section-num]::after{left:14px !important;width:46px !important;height:46px !important;border-radius:12px !important;background-size:20px 20px !important}
.app .gallery-pricing-model .pricing-header{padding:30px 16px 20px 76px !important;min-height:78px !important;font-size:clamp(18px,5vw,22px) !important}
.app .gallery-pricing-model .pricing-header::before{left:14px !important;width:46px !important;height:46px !important;border-radius:12px !important;background-size:20px 20px !important}
.app .gallery-pricing-model .pricing-tiers,.app .gallery-pricing-model .pricing-note{margin-left:var(--pad-2) !important;margin-right:var(--pad-2) !important}
.app .section-head,#step1 .section-head,#step2 .section-head,#step3 .section-head,#step4 .section-head,#step5 .section-head{padding:26px 16px 14px 70px !important;min-height:62px !important}
.app .section-head::before,#step1 .section-head::before,#step2 .section-head::before,#step3 .section-head::before,#step4 .section-head::before,#step5 .section-head::before{left:13px !important;width:40px !important;height:40px !important;background-size:18px 18px !important}
.app .section-head::after,#step1 .section-head::after,#step2 .section-head::after,#step3 .section-head::after,#step4 .section-head::after,#step5 .section-head::after{top:8px !important;left:70px !important;font-size:10px !important;letter-spacing:1.8px !important}
.app .section-head .section-title,#step1 .section-head .section-title,#step2 .section-head .section-title,#step3 .section-head .section-title,#step4 .section-head .section-title,#step5 .section-head .section-title{font-size:16px !important}
}