/* ==========================================================
   YOGERA — PRICING PAGE-SPECIFIC STYLES
   All-plans-visible layout (no role gate) with a lightweight
   jump-nav, per-role plan sections, government procurement
   workflow, platform fees, escrow flow, Agency seat calculator.
   Depends on shared.css being loaded first.
   ========================================================== */

.pricing-hero{ padding:170px 24px 10px; text-align:center; }
.pricing-hero .eyebrow-sm{ display:inline-block; font-family:var(--font-mono); font-size:12px; letter-spacing:0.08em; color:var(--blue); text-transform:uppercase; margin-bottom:14px; }
.pricing-hero h1{ font-family:var(--font-display); font-weight:800; font-size:clamp(1.8rem, 3.6vw, 2.7rem); letter-spacing:-0.01em; max-width:760px; margin-left:auto; margin-right:auto; }
.pricing-hero p{ margin-top:14px; color:var(--text-muted); font-size:15.5px; max-width:560px; margin-left:auto; margin-right:auto; }

/* Jump-nav: quick navigation to a section, not a gate — every plan-view below is already visible. */
.pricing-jump-nav{
  display:flex; justify-content:center; gap:8px; flex-wrap:wrap;
  padding:6px; border-radius:var(--radius-pill); background:var(--surface); border:1px solid var(--line);
  width:fit-content; margin:0 auto;
}
.pricing-jump-tab{
  display:inline-flex; align-items:center; gap:8px; padding:11px 20px; border-radius:var(--radius-pill);
  font-size:13.5px; font-weight:600; color:var(--text-secondary); transition:all var(--dur-micro) var(--ease);
}
.pricing-jump-tab:hover{ color:var(--text-primary); }
.pricing-jump-tab.is-active{ background:linear-gradient(135deg, var(--blue), var(--purple)); color:#fff; }

.plan-view{ scroll-margin-top:100px; }

.cycle-row{ display:flex; align-items:center; justify-content:center; margin:34px 0 30px; }

.gov-note-row{ display:flex; align-items:center; justify-content:center; margin:6px 0 30px; }

.procurement-wrap{ margin-top:56px; }
.procurement-wrap .section-head{ margin-bottom:40px; }

.fees-wrap{ margin-top:10px; }

.escrow-flow{ margin-top:18px; }

/* Live seat-count calculator (Agency Premium) — DeepLearning.AI-style: default 5 seats
   (the floor, per the 5-seat minimum), stepper cannot go below 5, total recalculates instantly. */
.seat-calc{ background:var(--bg-deep); border:1px solid var(--line); border-radius:var(--radius-md); padding:14px 16px; margin:14px 0; }
.seat-calc-row{ display:flex; align-items:center; justify-content:space-between; }
.seat-calc-row + .seat-calc-row{ margin-top:10px; padding-top:10px; border-top:1px solid var(--line); }
.seat-calc-label{ font-size:12.5px; color:var(--text-muted); font-weight:600; }
.seat-stepper{ display:flex; align-items:center; gap:14px; }
.seat-stepper button{
  width:28px; height:28px; border-radius:50%; border:1px solid var(--line-strong);
  font-size:16px; font-weight:700; color:var(--text-secondary); display:flex; align-items:center; justify-content:center;
  transition:all var(--dur-micro) var(--ease);
}
.seat-stepper button:hover:not(:disabled){ border-color:var(--blue-glow); color:var(--blue); }
.seat-stepper button:disabled{ opacity:0.35; cursor:not-allowed; }
.seat-stepper span{ font-family:var(--font-mono); font-size:15px; font-weight:700; min-width:20px; text-align:center; }
.seat-calc-total{ font-family:var(--font-display); font-weight:800; font-size:17px; color:var(--text-primary); }
.seat-calc-per{ font-family:var(--font-body); font-weight:500; font-size:12px; color:var(--text-muted); margin-left:3px; }
.escrow-cards{ display:grid; grid-template-columns:repeat(6,1fr); gap:10px; margin-top:30px; }
.escrow-cards .escrow-card{
  padding:16px 12px; border-radius:var(--radius-md); border:1px solid var(--line); background:var(--surface);
  text-align:center; font-size:12.5px; color:var(--text-secondary); display:flex; flex-direction:column; gap:8px; align-items:center;
}
.escrow-cards .escrow-card .escrow-card-icon{ font-size:20px; }
.escrow-cards .escrow-card:not(:last-child)::after{ content:'→'; position:relative; }
@media (max-width:960px){ .escrow-cards{ grid-template-columns:repeat(3,1fr); } }
@media (max-width:640px){ .escrow-cards{ grid-template-columns:1fr 1fr; } }

.currency-note{ max-width:640px; margin:26px auto 0; text-align:center; font-size:13.5px; color:var(--text-muted); line-height:1.7; }
.currency-note b{ color:var(--text-secondary); }

.change-type{ text-align:center; margin-top:10px; }