/* ISP+ v3.5.2 — canonical rebuilt section system.
   These components intentionally do not inherit the legacy .section/.section-head layout. */
.rb-section{
  padding-block:clamp(56px,7vw,96px);
  background:#fff;
  color:#102239;
}
.rb-section--soft{background:#f4f8ff}
.rb-container{width:min(1180px,calc(100% - clamp(24px,5vw,64px)));margin-inline:auto}
.rb-heading{
  display:grid;
  gap:clamp(12px,1.8vw,20px);
  width:min(100%,920px);
  margin:0 auto clamp(28px,4vw,46px);
  text-align:center;
}
.rb-heading .kicker{display:block;text-align:center;color:#087ed0}
.rb-heading .section-title{
  max-width:22ch;
  margin:0 auto;
  color:#0a1b2f;
  font-size:clamp(2rem,4.5vw,4.25rem);
  line-height:1.02;
  text-wrap:balance;
}
.rb-heading p,.rb-heading .muted{
  max-width:68ch;
  margin:0 auto;
  color:#415875;
  font-size:clamp(1rem,1.4vw,1.14rem);
  line-height:1.7;
}
.rb-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),1fr));
  gap:clamp(18px,2.4vw,30px);
  align-items:stretch;
}
.rb-card{
  display:flex;
  flex-direction:column;
  min-width:0;
  padding:clamp(22px,2.5vw,32px);
  border:1px solid rgba(12,36,78,.12);
  border-radius:20px;
  background:#fff;
  box-shadow:0 10px 30px rgba(7,20,48,.06);
}
.rb-card h3,.rb-card h4{margin:.5rem 0 .65rem;color:#0a1b2f;line-height:1.18}
.rb-card p,.rb-card .muted{color:#4a607a;line-height:1.65}
.rb-card .mini-label{color:#087ed0}
.rb-check-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(min(100%,280px),1fr));
  gap:14px;
}
.rb-check-grid>div{
  position:relative;
  padding:17px 18px 17px 48px;
  color:#18314d;
  background:#fff;
  border:1px solid rgba(12,36,78,.11);
  border-radius:14px;
  box-shadow:0 7px 20px rgba(7,20,48,.05);
}
.rb-check-grid>div::before{content:"✓";position:absolute;left:18px;color:#b37b00;font-weight:900}
.rb-cta{text-align:center}
.rb-cta .cta{width:min(100%,980px);margin-inline:auto;padding:clamp(34px,5vw,68px)}
.rb-cta .section-title{max-width:20ch;margin:10px auto 16px;text-align:center}
.rb-cta .cta>p{max-width:66ch;margin-inline:auto;text-align:center;color:#c2d1e3}
.rb-cta .cta-actions{justify-content:center;align-items:center;flex-wrap:wrap}

/* Pricing is a standalone component system, separate from legacy generic grids/cards. */
.price-section{padding-block:clamp(56px,7vw,96px);background:linear-gradient(180deg,#07172b,#0a2340);color:#f7fbff}
.price-section--light{background:#f4f8ff;color:#102239}
.price-heading{display:grid;gap:16px;width:min(100%,920px);margin:0 auto clamp(30px,4vw,48px);text-align:center}
.price-heading .kicker{color:#ffbf18;text-align:center}
.price-section--light .price-heading .kicker{color:#0b63d9}
.price-heading .section-title{max-width:20ch;margin:0 auto;color:inherit;font-size:clamp(2rem,4.5vw,4.1rem);line-height:1.03;text-wrap:balance}
.price-heading p{max-width:68ch;margin:0 auto;color:#c5d7ed;line-height:1.7}
.price-section--light .price-heading p{color:#465d78}
.price-tier-grid,.price-section :is(.pricing,.pricing-2,.pricing-4){display:flex;flex-wrap:wrap;justify-content:center;gap:clamp(18px,2.2vw,28px);align-items:stretch}
.price-tier-card,.price-section .price-card{display:flex;flex:1 1 270px;max-width:360px;flex-direction:column;min-width:0;min-height:0;padding:clamp(24px,2.6vw,34px);border:1px solid rgba(255,255,255,.14);border-radius:20px;background:linear-gradient(145deg,#0b1730,#0a1d3b);color:#fff;box-shadow:0 16px 42px rgba(5,15,35,.16)}
.price-tier-card.featured,.price-section .price-card.featured{border-color:#f4b942;box-shadow:0 16px 42px rgba(5,15,35,.2),0 0 0 1px #f4b942}
.price-section .price-card :is(h2,h3,h4,strong,b,.price){color:#fff}
.price-section .price-card :is(p,li,.muted,.small){color:#c5d3e6}
.price-section .price-card .kicker{color:#f4b942}
.price-section .price-card .checks>div{color:#e7eff9;background:transparent;border-color:rgba(255,255,255,.1);box-shadow:none}
.price-section .price-card .scope-note,.price-section .price-card .growth-plan-note{color:#c5d3e6}
.price-section .price-card .btn{margin-top:auto}
.price-path-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,240px),1fr));gap:16px;margin:30px 0 14px}
.price-path-card{display:flex;flex-direction:column;padding:24px;border:1px solid rgba(255,255,255,.16);border-radius:18px;background:linear-gradient(145deg,rgba(14,37,76,.94),rgba(8,20,43,.96));text-decoration:none}
.price-path-card span{color:#73caff;font-size:.72rem;font-weight:900;letter-spacing:.12em;text-transform:uppercase}
.price-path-card strong{display:block;margin:12px 0 8px;font-size:1.35rem;color:#fff}
.price-path-card small{color:#bac9dd;line-height:1.55}
.price-path-card b{margin-top:auto;padding-top:16px;color:#f4b942}
.price-feature-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),1fr));gap:clamp(16px,2vw,24px);align-items:stretch}
.price-feature-grid>.card{height:100%;padding:clamp(22px,2.4vw,30px)}

.resource-card--pending{border-style:dashed;background:#f8fbff}
.resource-status{display:inline-flex;align-items:center;width:max-content;margin-bottom:10px;padding:6px 10px;border-radius:999px;background:#fff3cd;color:#6f4e00;font-size:.75rem;font-weight:800;letter-spacing:.04em;text-transform:uppercase}
.resource-link--inactive{color:#60748c;font-weight:800}

/* Immersive content uses light paper sections, so FAQ questions must remain visible. */
body.immersive-standard .section:not(.final-service-cta) .faq-list details{background:#fff!important;border:1px solid rgba(12,36,78,.1)!important;box-shadow:0 8px 24px rgba(7,20,48,.06)!important}
body.immersive-standard .section:not(.final-service-cta) .faq-list summary{color:#0a1830!important;text-align:left!important}
body.immersive-standard .section:not(.final-service-cta) .faq-list details p{color:#4a607a!important}

@media(max-width:680px){
  .rb-section,.price-section{padding-block:48px}
  .rb-container{width:min(100% - 24px,1180px)}
  .rb-heading,.price-heading{margin-bottom:28px}
}
@media(max-width:440px){
  .rb-container{width:min(100% - 20px,1180px)}
  .rb-cta .btn{width:100%}
}




/* v3.5.15 — pricing rows rebuilt as clean 2 / 4 / 4 panels
   Scope: website package rows only. */
body.pricing-page #website-packages .tier-band{
  position:relative!important;
  width:100%!important;
  max-width:none!important;
  margin:clamp(34px,4vw,54px) 0 0!important;
  padding:clamp(24px,2.7vw,38px)!important;
  border:1px solid rgba(126,166,217,.16)!important;
  border-radius:28px!important;
  background:linear-gradient(135deg,rgba(10,31,58,.96),rgba(10,26,50,.90))!important;
  box-shadow:0 18px 48px rgba(2,10,25,.18)!important;
  overflow:visible!important;
}

body.pricing-page #website-packages .tier-band::before,
body.pricing-page #website-packages .tier-band::after{
  content:none!important;
  display:none!important;
}

body.pricing-page #website-packages .tier-band .tier-label,
body.pricing-page #website-packages .tier-band .tier-intro{
  position:relative!important;
  z-index:2!important;
}

body.pricing-page #website-packages .tier-band .tier-intro{
  max-width:900px!important;
  margin:0 0 22px!important;
}

body.pricing-page #website-packages .tier-band .pricing-2,
body.pricing-page #website-packages .tier-band .pricing-4{
  position:relative!important;
  z-index:2!important;
  width:100%!important;
  margin:24px 0 0!important;
  align-items:stretch!important;
}

/* Row 1 = exactly 2 cards */
body.pricing-page #new-ventures + .tier-intro + .pricing-2,
body.pricing-page #website-packages .tier-band:first-of-type .pricing-2{
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
}

/* Row 2 + Row 3 = exactly 4 cards each */
body.pricing-page #business-growth .pricing-4,
body.pricing-page #church-growth .pricing-4{
  grid-template-columns:repeat(4,minmax(0,1fr))!important;
}

body.pricing-page #website-packages .tier-band .price-card{
  width:100%!important;
  max-width:none!important;
  min-width:0!important;
  height:100%!important;
  align-self:stretch!important;
  margin:0!important;
}

@media(max-width:1180px){
  body.pricing-page #business-growth .pricing-4,
  body.pricing-page #church-growth .pricing-4{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }
}

@media(max-width:760px){
  body.pricing-page #website-packages .tier-band{
    padding:22px 16px!important;
    border-radius:22px!important;
  }
  body.pricing-page #website-packages .tier-band:first-of-type .pricing-2,
  body.pricing-page #business-growth .pricing-4,
  body.pricing-page #church-growth .pricing-4{
    grid-template-columns:1fr!important;
  }
}


/* v3.5.16 — LIVE-SITE VERIFIED pricing row-panel alignment fix
   Old tier-band backgrounds removed. New panels wrap the card grids themselves,
   so panel and cards share the same center line and width. */
body.pricing-page #website-packages .tier-band{
  width:100%!important;
  max-width:none!important;
  margin:clamp(34px,4vw,54px) 0 0!important;
  padding:0!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
  overflow:visible!important;
}

body.pricing-page #website-packages .tier-band .tier-label,
body.pricing-page #website-packages .tier-band .tier-intro{
  width:100%!important;
  max-width:none!important;
  margin-left:auto!important;
  margin-right:auto!important;
  text-align:left!important;
}

body.pricing-page #website-packages .pricing-row-panel{
  box-sizing:border-box!important;
  position:relative!important;
  margin:22px auto 0!important;
  padding:18px!important;
  border:1px solid rgba(126,166,217,.18)!important;
  border-radius:26px!important;
  background:linear-gradient(135deg,rgba(17,43,76,.94),rgba(8,26,51,.96))!important;
  box-shadow:0 18px 48px rgba(2,10,25,.20)!important;
}

/* The 2-card panel shrink-wraps the actual 2-card row and stays centered. */
body.pricing-page #website-packages .pricing-row-panel--2{
  width:min(100%, 780px)!important;
}

/* The 4-card panels use the exact full card-row width and remain centered. */
body.pricing-page #website-packages .pricing-row-panel--4{
  width:100%!important;
}

body.pricing-page #website-packages .pricing-row-panel .pricing-2,
body.pricing-page #website-packages .pricing-row-panel .pricing-4{
  display:grid!important;
  width:100%!important;
  margin:0!important;
  padding:0!important;
  gap:18px!important;
  align-items:stretch!important;
  justify-content:center!important;
}

body.pricing-page #website-packages .pricing-row-panel--2 .pricing-2{
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
}

body.pricing-page #website-packages .pricing-row-panel--4 .pricing-4{
  grid-template-columns:repeat(4,minmax(0,1fr))!important;
}

body.pricing-page #website-packages .pricing-row-panel .price-card{
  box-sizing:border-box!important;
  width:100%!important;
  max-width:none!important;
  min-width:0!important;
  height:100%!important;
  margin:0!important;
}

@media(max-width:1180px){
  body.pricing-page #website-packages .pricing-row-panel--4 .pricing-4{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }
}
@media(max-width:760px){
  body.pricing-page #website-packages .pricing-row-panel{
    width:100%!important;
    padding:14px!important;
    border-radius:20px!important;
  }
  body.pricing-page #website-packages .pricing-row-panel--2 .pricing-2,
  body.pricing-page #website-packages .pricing-row-panel--4 .pricing-4{
    grid-template-columns:1fr!important;
  }
}
/* Pricing light-section cards need light-theme text and silver controls. */
body.immersive-standard.pricing-page .price-section--light .price-feature-grid > .card {
  --muted:#465d78;
  color:#102239;
}
body.immersive-standard.pricing-page .price-section--light .price-feature-grid > .card :is(p,li,.muted,.small) {
  color:#465d78!important;
}
body.immersive-standard.pricing-page .price-section--light .price-feature-grid > .card :is(h2,h3,h4,strong,b) {
  color:#102239!important;
}
body.immersive-standard.pricing-page #business-ecommerce-setup .card a.btn-primary {
  color:#fff!important;
  background:#0b63d9!important;
  border:1px solid #0b63d9!important;
}
body.immersive-standard.pricing-page #business-ecommerce-setup .card a.btn-primary:hover {
  background:#084fae!important;
  border-color:#084fae!important;
}
