/* =====================================================================
   Church Registry, Pricing page
   Extends index.css (tokens, base, buttons, header, footer, sections).
   Only pricing-specific components live here.
   ===================================================================== */

/* ------------------------------ Price hero ------------------------------ */
.price-hero{position:relative;padding:clamp(48px,7vw,104px) 0 clamp(40px,5vw,72px);overflow:hidden}
.price-hero__glow{
  position:absolute;left:50%;top:clamp(40px,9vw,120px);width:min(1180px,120vw);height:520px;
  transform:translateX(-50%);z-index:-1;pointer-events:none;filter:blur(14px);opacity:.55;
  background:
    radial-gradient(40% 60% at 18% 40%, rgba(255,221,128,.34), transparent 70%),
    radial-gradient(46% 60% at 82% 32%, rgba(176,214,255,.45), transparent 70%),
    radial-gradient(40% 55% at 50% 82%, rgba(199,243,223,.40), transparent 70%);
}
.price-hero__inner{max-width:1200px;margin-inline:auto;text-align:center;display:flex;flex-direction:column;align-items:center}
.price-hero h1{font-size:clamp(2rem,1.3rem + 2.2vw,2.9rem);letter-spacing:-.035em;line-height:1.06;text-wrap:balance}
.price-hero__lede{margin-top:clamp(14px,2vw,22px);max-width:540px;font-size:clamp(1.05rem,1rem + .35vw,1.24rem);color:var(--navy-2);line-height:1.5}
.price-hero__facts{
  list-style:none;padding:0;margin:clamp(28px,4vw,44px) 0 0;
  display:flex;flex-wrap:wrap;justify-content:center;align-items:center;
  gap:14px clamp(22px,3.5vw,46px);
}
.price-hero__facts li{
  display:inline-flex;align-items:center;gap:9px;
  font-family:var(--font-display);font-weight:700;
  font-size:clamp(.95rem,.9rem + .15vw,1.05rem);color:var(--navy);
}
.price-hero__facts svg{width:21px;height:21px;flex:none;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}

/* ----------------------------- Savings band ----------------------------- */
.savings{position:relative;padding-block:var(--section-pad)}
.savings::before{
  content:"";position:absolute;inset:0;z-index:-1;
  background:linear-gradient(180deg,rgba(255,255,255,.7),rgba(255,255,255,.34));
  border-top:1px solid rgba(255,255,255,.7);border-bottom:1px solid var(--line);
}
.bars{max-width:880px;margin:0 auto;display:grid;gap:16px}
.bar{display:grid;grid-template-columns:150px minmax(0,1fr) 104px;align-items:center;gap:18px}
.bar__name{font-family:var(--font-display);font-weight:700;color:var(--navy-2);font-size:1rem;text-align:right;line-height:1.15}
.bar__track{position:relative;height:48px;border-radius:var(--r-pill);background:#e9eef9;border:1px solid var(--line);overflow:hidden}
.bar__fill{position:absolute;inset:0 auto 0 0;width:0;border-radius:inherit;transition:width 1.15s var(--ease)}
.bars.is-visible .bar__fill{width:var(--w)}
.bar--comp .bar__fill{background:linear-gradient(90deg,#cdd9f1,#a7bce8)}
.bar--cr .bar__fill{background:linear-gradient(90deg,#2568ff,#0f49e6);box-shadow:var(--shadow-blue)}
.bar--cr .bar__name{color:var(--blue)}
.bar__amt{font-family:var(--font-display);font-weight:700;font-size:1.02rem;color:var(--navy);text-align:left;white-space:nowrap}
.bar__amt small{font-weight:500;color:var(--muted);font-size:.74em}
.bar--cr .bar__amt{color:var(--blue)}
.bar__amt em{display:block;font-style:normal;font-weight:500;font-size:.72rem;color:var(--muted)}
.bars.is-visible .bar:nth-child(2) .bar__fill{transition-delay:.05s}
.bars.is-visible .bar:nth-child(3) .bar__fill{transition-delay:.12s}
.bars.is-visible .bar:nth-child(4) .bar__fill{transition-delay:.19s}

.savings__cards{max-width:880px;margin:clamp(28px,3.5vw,42px) auto 0;display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.save-card{padding:22px 20px;border-radius:var(--r-md);background:#fff;border:1px solid var(--line);box-shadow:var(--shadow-sm);text-align:center}
.save-card b{display:block;font-family:var(--font-display);font-weight:700;font-size:clamp(1.5rem,1.1rem + 1.2vw,2rem);color:var(--navy);letter-spacing:-.03em;line-height:1}
.save-card span{display:block;margin-top:8px;color:var(--muted);font-size:.92rem;line-height:1.4}
.save-card b small{font-size:.62em;color:var(--muted);font-weight:600}

.fineprint{max-width:880px;margin:clamp(22px,2.6vw,30px) auto 0;color:var(--muted);font-size:.86rem;line-height:1.55;text-align:center}

/* --------------------------- Comparison table --------------------------- */
.compare{padding-block:var(--section-pad)}
.compare-wrap{max-width:1000px;margin:0 auto;overflow-x:auto;-webkit-overflow-scrolling:touch;
  border-radius:var(--r-lg);border:1px solid var(--line);box-shadow:var(--shadow-md);background:#fff}
.compare-table{width:100%;border-collapse:collapse;min-width:780px}
.compare-table caption{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
.compare-table th,.compare-table td{padding:15px 16px;text-align:center;border-bottom:1px solid var(--line);vertical-align:middle}
.compare-table tbody tr:last-child td,.compare-table tbody tr:last-child th{border-bottom:none}
.compare-table thead th{font-family:var(--font-display);font-weight:700;color:var(--navy);background:#f7faff;font-size:.96rem;line-height:1.2}
.compare-table th[scope=row]{text-align:left;font-family:var(--font-display);font-weight:700;color:var(--navy-2);font-size:.94rem;background:#fcfdff;white-space:nowrap}
.compare-table td{color:var(--ink);font-size:.95rem;line-height:1.35}
.compare-table .muted{color:var(--muted)}
.compare-table .ck{display:inline-grid;place-items:center;width:24px;height:24px;border-radius:50%;
  background:linear-gradient(135deg,#37d39b,#10b981);box-shadow:0 4px 10px -4px rgba(16,185,129,.7)}
.compare-table .ck svg{width:13px;height:13px;fill:none;stroke:#fff;stroke-width:3.2;stroke-linecap:round;stroke-linejoin:round}
.compare-table .dash{color:#b3bccf;font-weight:700}
.compare-table .col-cr{background:linear-gradient(180deg,#edf3ff,#f6f9ff)}
.compare-table thead .col-cr{background:linear-gradient(180deg,#2568ff,#0f49e6);color:#fff}
.compare-table thead .col-cr .col-cr__small{display:block;font-weight:600;font-size:.72rem;color:#d6e3ff;letter-spacing:.02em;margin-top:3px}
.compare-table .col-cr.price-cell{font-family:var(--font-display);font-weight:700;color:var(--blue);font-size:1.04rem}
.compare-table .price-cell{font-family:var(--font-display);font-weight:700;color:var(--navy);font-size:.98rem}
.compare-note{max-width:1000px;margin:18px auto 0;color:var(--muted);font-size:.84rem;line-height:1.55}

/* --------------------------- Everything included --------------------------- */
.included{padding-block:var(--section-pad)}
.included__grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;max-width:1060px;margin:0 auto}
.feat{display:flex;flex-direction:column;gap:11px;padding:20px 18px;border-radius:var(--r-md);
  background:#fff;border:1px solid var(--line);box-shadow:var(--shadow-sm);
  transition:transform .25s var(--ease),box-shadow .25s var(--ease)}
.feat:hover{transform:translateY(-4px);box-shadow:var(--shadow-md)}
.feat__ic{width:44px;height:44px;border-radius:13px;display:grid;place-items:center}
.feat__ic svg{width:22px;height:22px;fill:none;stroke:var(--navy);stroke-width:1.85;stroke-linecap:round;stroke-linejoin:round}
.feat__name{font-family:var(--font-display);font-weight:700;color:var(--navy);font-size:1.02rem;letter-spacing:-.01em;line-height:1.2}
.feat__tag{display:inline-flex;align-items:center;gap:7px;font-family:var(--font-display);font-weight:700;font-size:.78rem;color:#0f9d6b;margin-top:auto}
.feat__tag::before{content:"";flex:0 0 auto;width:16px;height:16px;border-radius:50%;
  background:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='white' stroke-width='3.4' stroke-linecap='round' stroke-linejoin='round' d='M5 12.5l4 4 10-10'/%3E%3C/svg%3E") center/10px no-repeat,
    linear-gradient(135deg,#37d39b,#10b981)}
.t-mint{background:var(--mint)} .t-gold{background:var(--gold)} .t-violet{background:var(--lavender)}
.t-blue{background:var(--soft-blue)} .t-sage{background:var(--sage)} .t-blush{background:var(--blush)}

/* ------------------------------- Why band ------------------------------- */
.why{position:relative;padding-block:var(--section-pad)}
.why__copy{max-width:760px;margin:0 auto clamp(28px,3.5vw,44px);text-align:center}
.why__copy p{margin-top:16px;font-size:clamp(1.05rem,1rem + .35vw,1.2rem);color:var(--ink);line-height:1.6}
.why__grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;max-width:1000px;margin:0 auto}

/* ------------------------------ Responsive ------------------------------ */
@media (max-width:900px){
  .included__grid{grid-template-columns:repeat(3,1fr)}
  .savings__cards{grid-template-columns:1fr;max-width:420px;margin-inline:auto}
  .why__grid{grid-template-columns:1fr 1fr;max-width:520px}
}
@media (max-width:640px){
  .included__grid{grid-template-columns:1fr 1fr}
  .bar{grid-template-columns:1fr auto;grid-template-areas:"name amt" "track track";row-gap:8px;column-gap:12px}
  .bar__name{grid-area:name;text-align:left}
  .bar__amt{grid-area:amt;text-align:right}
  .bar__track{grid-area:track;height:42px}
}
@media (max-width:430px){
  .included__grid{grid-template-columns:1fr;max-width:340px;margin-inline:auto}
  .why__grid{grid-template-columns:1fr;max-width:300px}
}
