/* Public sales pages. Builds on /styles.css (tokens, fonts, buttons, forms, cookie notice). Mobile first. */
.ps main > section { padding-block: var(--s-7); }
.ps main > section + section { border-top: 1px solid var(--color-divider); }
.ps h1 { font-size: clamp(2rem, 6vw, 3.25rem); }
.ps h2 { font-size: clamp(1.5rem, 4vw, 2.125rem); }
.ps-narrow { max-width: 46rem; }
.ps .banner { margin: 0; }

.ps-hero { background: var(--color-paper); }
.ps-hero-grid { display: grid; gap: var(--s-6); align-items: center; }
.ps-cover { margin: 0; }
.ps-cover img { width: 100%; border-radius: var(--radius); box-shadow: 0 12px 32px oklch(23% 0.006 40 / 0.18); }
.ps-cover figcaption { font-size: 0.875rem; color: var(--color-muted); margin-top: var(--s-2); }
.ps-ticks { list-style: none; padding: 0; margin: 0 0 var(--s-5); }
.ps-ticks li { position: relative; padding-left: 1.75rem; margin-bottom: var(--s-2); }
.ps-ticks li::before { content: ""; position: absolute; left: 0.25rem; top: 0.45em; width: 0.55rem; height: 0.9rem; border: solid var(--color-accent-strong); border-width: 0 3px 3px 0; transform: rotate(45deg); }
.ps-price { margin: 0 0 var(--s-4); display: flex; flex-wrap: wrap; align-items: baseline; gap: var(--s-2); }
.ps-price strong { font-size: 1.75rem; }
.ps-price span { color: var(--color-muted); font-size: 0.9375rem; }

.ps-stats { list-style: none; padding: 0; margin: var(--s-6) 0 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--s-3); }
.ps-stats li { background: var(--color-bg); border-radius: var(--radius); padding: var(--s-3) var(--s-4); }
.ps-stats strong { display: block; font-size: 1.625rem; line-height: 1.1; color: var(--color-accent-strong); }
.ps-stats span { font-size: 0.875rem; color: var(--color-muted); }
.ps-hubcard .ps-stats { margin: 0 0 var(--s-4); }
.ps-hubcard .ps-stats li { background: var(--color-surface); padding: var(--s-2) var(--s-3); }
.ps-hubcard .ps-stats strong { font-size: 1.25rem; }

.ps-tag { display: inline-block; font-size: 0.75rem; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase; color: var(--color-accent-2); }
.ps-ideas { list-style: none; counter-reset: idea; padding: 0; margin: 0; display: grid; gap: var(--s-4); }
.ps-ideas li { counter-increment: idea; background: var(--color-paper); border-radius: var(--radius); padding: var(--s-4) var(--s-4) var(--s-4) 3.5rem; position: relative; }
.ps-ideas li::before { content: counter(idea); position: absolute; left: var(--s-4); top: var(--s-4); font-size: 1.5rem; font-weight: 700; color: var(--color-accent); }
.ps-belief { font-weight: 700; text-decoration: line-through; text-decoration-color: var(--color-accent-2); text-decoration-thickness: 2px; margin-bottom: var(--s-2); }

.ps-cols { display: grid; gap: var(--s-4); }
.ps-card { background: var(--color-paper); border-radius: var(--radius); padding: var(--s-5) var(--s-4); }
.ps-card ul, .ps-modules ul { padding-left: 1.2rem; margin: 0; }
.ps-card li, .ps-modules li { margin-bottom: var(--s-1); }
.ps-modules { display: grid; gap: var(--s-4); }
.ps-modules article { border-left: 3px solid var(--color-accent); padding-left: var(--s-4); }
.ps-day { font-weight: 700; color: var(--color-accent-strong); margin: 0 0 var(--s-1); }
.ps-notfor { margin-top: var(--s-5); padding: var(--s-3) var(--s-4); border: 1px dashed var(--color-input-line); border-radius: var(--radius); }

.ps-offer-wrap { background: var(--color-offer-bg); }
.ps-offer { display: grid; gap: var(--s-6); }
.ps-form { background: var(--color-paper); border: 2px solid var(--color-offer-line); border-radius: var(--radius); padding: var(--s-5) var(--s-4); min-width: 0; }
.ps-form .totals { margin: 0 0 var(--s-5); }
.ps-form .totals div { display: flex; justify-content: space-between; gap: var(--s-3); }
.ps-form .totals dd { margin: 0; font-weight: 700; }
.ps-form .grand { font-size: 1.25rem; border-top: 1px solid var(--color-divider); padding-top: var(--s-2); }
.ps-pay { width: 100%; }

.ps-faq { border-bottom: 1px solid var(--color-divider); }
.ps-faq summary { cursor: pointer; font-weight: 600; min-height: 44px; display: flex; align-items: center; padding-block: var(--s-3); }
.ps-faq p { margin-top: 0; }
.ps-about .ps-two { display: grid; gap: var(--s-6); }
.ps-final { text-align: center; background: var(--color-paper); }
.ps-final .lede { margin-inline: auto; }

.ps-xcard { display: flex; flex-direction: column; background: var(--color-paper); border-radius: var(--radius); overflow: hidden; color: inherit; text-decoration: none; box-shadow: var(--shadow-sm); }
.ps-xcard:hover { color: inherit; box-shadow: 0 6px 20px oklch(23% 0.006 40 / 0.16); }
.ps-xbody { display: flex; flex-direction: column; gap: var(--s-2); padding: var(--s-4); }
.ps-xprice { font-weight: 700; color: var(--color-accent-strong); }

.ps-hubgrid { display: grid; gap: var(--s-5); }
.ps-hubcard { background: var(--color-paper); border-radius: var(--radius); overflow: hidden; box-shadow: var(--shadow-sm); display: flex; flex-direction: column; }
.ps-hubbody { padding: var(--s-4); display: flex; flex-direction: column; flex: 1; }
.ps-actions { display: flex; flex-wrap: wrap; gap: var(--s-3); margin: auto 0 0; }
.ps-actions .btn { flex: 1 1 8rem; }

/* sticky price bar: bottom, above the cookie notice when that is open */
.ps-bar { position: fixed; left: 0; right: 0; bottom: var(--ps-ck, 0px); z-index: 40; background: var(--color-text); color: var(--color-paper); padding-block: var(--s-2); box-shadow: 0 -4px 16px oklch(23% 0.006 40 / 0.2); }
.ps-bar[hidden] { display: none; }
.ps-bar-row { display: flex; align-items: center; justify-content: space-between; gap: var(--s-3); }
.ps-bar-row > span { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ps-bar-title { display: none; opacity: 0.8; margin-left: var(--s-2); }
body.ps-has-bar { padding-bottom: 72px; }

@media (min-width: 48rem) {
  .ps-stats { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .ps-hubcard .ps-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ps-hero-grid { grid-template-columns: 1.15fr 1fr; }
  .ps-cols, .ps-hubgrid { grid-template-columns: repeat(auto-fit, minmax(16rem, 1fr)); }
  .ps-ideas, .ps-modules { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ps-offer { grid-template-columns: 1fr 1.1fr; align-items: start; }
  .ps-about .ps-two { grid-template-columns: 1fr 1fr; }
  .ps-bar-title { display: inline; }
  .ps-form { padding: var(--s-6); }
}
.ps-form .totals div[hidden] { display: none; }
