/* Website promotion. Uses Halo's shared typography, colors, and components. */
.single-hero { padding-block: clamp(3rem, 7vw, 6rem); }
.single-hero .hero__grid { align-items: start; }
.single-hero .hero__cta { align-items: center; }
.single-hero .hero__sub strong { color: var(--color-ink); font-weight: 600; }
.single-hero__terms { display: grid; gap: var(--space-xs); margin-top: var(--space-lg); font-variant-numeric: lining-nums; }
.single-hero__terms strong { font-size: var(--text-lg); font-weight: 600; }
.single-hero__terms span { color: var(--color-muted); }
.single-price {
  background: var(--color-ink);
  color: var(--color-paper);
  padding: clamp(1.5rem, 3.2vw, 2.5rem);
  border-top: 4px solid var(--color-accent);
  font-variant-numeric: lining-nums;
}
.single-price__label { font-size: var(--text-xs); text-transform: uppercase; letter-spacing: .12em; color: var(--color-on-ink-2); }
.single-price h2 { color: var(--color-paper); font-size: var(--text-xl); margin-top: var(--space-lg); }
.single-price__amount { font-family: var(--font-display); font-size: clamp(5rem, 7vw, 7rem); line-height: 1.1; margin-top: var(--space-xs); letter-spacing: -.055em; }
.single-price__amount span { display: block; font-family: var(--font-body); font-size: var(--text-sm); letter-spacing: 0; margin-top: var(--space-xs); }
.single-price__scope { color: var(--color-on-ink-2); font-size: var(--text-sm); margin-top: var(--space-lg); }
.single-price__hosting { display: flex; justify-content: space-between; align-items: center; gap: var(--space-md); margin-block: var(--space-lg); padding-block: var(--space-lg); border-block: 1px solid oklch(97.5% .005 85 / .24); }
.single-price__hosting > span { font-size: var(--text-sm); }
.single-price__hosting small { color: var(--color-on-ink-2); }
.single-price__hosting p { font-family: var(--font-display); font-size: var(--text-2xl); white-space: nowrap; }
.single-price__hosting p span { font-family: var(--font-body); font-size: var(--text-sm); }
.single-price__features { display: grid; gap: var(--space-xs); list-style: none; font-size: var(--text-sm); }
.single-price__features li::before { content: '✓'; color: var(--color-accent); margin-right: var(--space-sm); }
.single-price__note { color: var(--color-on-ink-2); font-size: var(--text-xs); margin-top: var(--space-lg); }
.single-included { display: grid; grid-template-columns: 5fr 7fr; gap: clamp(2rem, 5vw, 5rem); border-top: 1px solid var(--color-rule); }
.single-included .head-hang { max-width: 30ch; }
.single-included h2, .single-faq-grid h2, .single-flow h2 { margin-top: var(--space-md); }
.single-features { list-style: none; }
.single-features li { display: grid; grid-template-columns: 2rem 1fr; gap: var(--space-md); padding-block: var(--space-lg); border-bottom: 1px solid var(--color-rule); }
.single-features li:first-child { padding-top: 0; }
.single-features__number { color: var(--color-accent-strong); font-size: var(--text-sm); font-variant-numeric: lining-nums; padding-top: .3rem; }
.single-features h3 { font-size: var(--text-xl); }
.single-features p { margin-top: var(--space-xs); color: var(--color-muted); }
.single-flow { background: var(--color-paper-2); border-block: 1px solid var(--color-rule); }
.single-flow .head-hang { max-width: 39ch; }
.single-steps { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.single-steps .stage { font-family: var(--font-body); font-size: var(--text-sm); }
.single-steps h3 { margin-block: var(--space-md); }
.single-promo-callout { display: flex; align-items: center; justify-content: space-between; gap: var(--space-xl); margin-top: var(--space-2xl); padding-top: var(--space-xl); border-top: 1px solid var(--color-rule); }
.single-promo-callout h3 { margin-block: var(--space-sm); font-size: var(--text-2xl); }
.single-promo-callout p:last-child { color: var(--color-muted); }
.single-promo-callout .btn { flex-shrink: 0; }
.single-faq-grid { display: grid; grid-template-columns: 4fr 7fr; gap: clamp(2rem, 5vw, 5rem); }
.single-faq-grid .faq summary { font-size: var(--text-md); font-family: var(--font-body); line-height: 1.5; }
.single-faq-grid .faq__a { font-size: var(--text-base); }
.single-request-note { font-size: var(--text-sm); }
.single-form-summary { display: grid; padding-bottom: var(--space-lg); margin-bottom: var(--space-lg); border-bottom: 1px solid var(--color-rule); }
.single-form-summary strong { font-family: var(--font-display); font-size: var(--text-xl); }
.single-form-summary span, .single-optional { font-weight: 400; color: var(--color-muted); font-size: var(--text-sm); }
[data-page="single-page-website"] .form-foot a { text-decoration: underline; text-underline-offset: .2em; }
[data-page="single-page-website"] .contact-line { margin-top: var(--space-xl); display: grid; gap: var(--space-xs); }
@media (max-width: 900px) {
  .single-included, .single-faq-grid { grid-template-columns: 1fr; }
  .single-included .head-hang, .single-faq-grid .head-hang { max-width: 38ch; margin-bottom: 0; }
  .single-steps { grid-template-columns: 1fr; }
  .single-steps p { max-width: 60ch; }
  .single-promo-callout { align-items: flex-start; flex-direction: column; }
}
@media (max-width: 480px) {
  .single-hero .hero__cta { align-items: flex-start; }
  .single-hero .hero__cta .tlink { padding-block: .5rem; }
  .single-price__hosting { align-items: start; }
  .single-price__hosting p { font-size: 2rem; }
  [data-page="single-page-website"] .btn { white-space: normal; }
}
