/* Service packages: use the existing brand tokens. */
#packages { scroll-margin-top: 84px; background: var(--bg); }
.packages-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; margin-top: 32px; }
.package-card { display: flex; flex-direction: column; gap: 16px; padding: 28px; border: 1px solid var(--border); border-radius: var(--radius-lg); background: var(--white); }
.package-kicker { color: #4338ca; font-size: 14px; font-weight: 600; }
.package-card h3 { font-size: 25px; }
.package-price { font-size: 32px; line-height: 1.3; font-weight: 700; color: var(--dark); }
.package-price span { display: block; font-size: 14px; font-weight: 400; color: #475569; margin-top: 6px; }
.package-card ul { padding-left: 20px; }
.package-card li { margin-bottom: 8px; }
.package-detail, .packages-note { font-size: 14px; color: #475569; }
.package-card .btn-primary { margin-top: auto; text-align: center; white-space: normal; }
.packages-note { margin-top: 24px; }
.packages-next { margin-top: 32px; padding: 28px; background: var(--white); border: 1px solid var(--border); border-radius: var(--radius); }
.packages-next p { margin: 16px 0; }
.packages-next p a, .packages-note a, .rate-lead a { color: #4338ca; text-decoration: underline; text-underline-offset: 3px; }
.packages-grid.cols-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.packages-grid.cols-4 .package-card { padding: 22px; }
.packages-grid.cols-4 .package-card h3 { font-size: 22px; }
.rate-block { margin-top: 56px; }
.rate-lead { color: #475569; max-width: 740px; margin: 0 0 8px; line-height: 1.6; }
.rate-terms { margin: 18px 0 0; padding-left: 20px; color: #475569; max-width: 760px; }
.rate-terms li { margin: 8px 0; }
@media (max-width: 1100px) {
  .packages-grid.cols-4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 1000px) { .packages-grid { grid-template-columns: 1fr; } .package-card { padding: 24px; } }
@media (max-width: 700px) { .packages-grid.cols-4 { grid-template-columns: 1fr; } }

/* Monthly plans: open rows using the existing brand typography. */
#monthly-plans{scroll-margin-top:84px;background:var(--bg)}
.monthly-plans-list{margin-top:36px;border-top:1px solid var(--border)}
.monthly-plan{display:grid;grid-template-columns:minmax(180px,1fr) minmax(0,1.6fr) minmax(180px,.8fr);gap:30px;align-items:start;padding:32px 0;border-bottom:1px solid var(--border)}
.monthly-plan h3{font-size:25px;margin:8px 0 14px}.monthly-plan ul{padding-left:20px;margin-bottom:16px}.monthly-plan li{margin-bottom:8px}.monthly-plan .btn-primary{white-space:normal;text-align:center;align-self:center}
.monthly-details{margin-top:24px;border-top:1px solid var(--border);border-bottom:1px solid var(--border);padding:18px 0}.monthly-details summary{cursor:pointer;font-weight:600}.monthly-details p{margin-top:16px;max-width:900px}
@media(max-width:900px){.monthly-plan{grid-template-columns:1fr;gap:18px}.monthly-plan .btn-primary{justify-self:start}}
