/* Always Open page: vertical plates on top of the portfolio V4 styles. */
body { background: var(--stage); }
.ao { max-width: 1440px; margin: 0 auto; }
.ao .plate { gap: 24px; }
.ao .idx { font: 12px/1.3 ui-monospace,monospace; text-transform: uppercase; letter-spacing: .06em; opacity: .8; }
.ao-h2 { max-width: 18ch; font-size: clamp(36px,4.6vw,72px); line-height: 1; font-weight: 600; letter-spacing: -.05em; }
.ao-hero { min-height: min(86svh,820px); }
.ao-hero .lede { max-width: 30ch; }
.ao-spec { grid-template-columns: repeat(3,minmax(0,1fr)); gap: 32px; }
.ao-spec dt { font-size: clamp(19px,1.7vw,26px); }
.chips { margin-top: 8px; }

.tb-grid { display: grid; grid-template-columns: minmax(240px,360px) 1fr; gap: clamp(28px,5vw,80px); align-items: center; }
.tb-phone { margin: 0; display: grid; gap: 12px; }
.tb-phone video { display: block; width: 100%; height: auto; aspect-ratio: 9/16; border-radius: 28px; background: #111; border: 6px solid #10110f; box-shadow: 0 30px 70px #0006; }
.tb-copy { display: grid; gap: 22px; align-content: center; }
.tb-copy h2 { font-size: clamp(36px,4.4vw,68px); line-height: 1; letter-spacing: -.05em; font-weight: 600; max-width: 14ch; }
.tb-copy h2 em { font: italic 400 1.05em Georgia,serif; color: #f3c1a3; }
.tb-steps { display: grid; gap: 0; counter-reset: tb; padding: 0; list-style: none; max-width: 52ch; }
.tb-steps li { counter-increment: tb; display: grid; grid-template-columns: 40px 1fr; padding: 14px 0; border-top: 1px solid #ffffff38; font-size: 17px; line-height: 1.45; }
.tb-steps li::before { content: counter(tb); font: italic 400 26px/1 Georgia,serif; color: #c7b89b; }

.proof-grid { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(24px,3vw,48px); }
.proof-card { display: grid; gap: 14px; align-content: start; min-width: 0; }
.proof-card h3 { font-size: clamp(24px,2.2vw,34px); letter-spacing: -.04em; font-weight: 600; }
.proof-card .mac img { aspect-ratio: 8/5; object-fit: cover; object-position: top; display: block; }
.proof-card .facts { grid-column: auto; }
.proof-card a { font-weight: 600; }

.price-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 18px; }
.price-card { display: grid; gap: 12px; align-content: start; padding: 26px; border: 1px solid #23252040; border-radius: 22px; background: #ffffff38; }
.price-card h3 { font-size: 20px; letter-spacing: -.02em; }
.price-card p { font-size: 16px; line-height: 1.45; }
.price b { font: italic 400 clamp(46px,4vw,64px)/.9 Georgia,serif; letter-spacing: -.04em; }
.price-quote { font: italic 400 24px/1.15 Georgia,serif !important; }
.price-best { background: #232520; color: #edeae2; border-color: #232520; }
.price-note { font-size: 15px; opacity: .8; }
.ao-faq .faq { align-self: stretch; max-width: 900px; }

@media (max-width: 899px) {
  .ao-spec,.price-grid,.proof-grid { grid-template-columns: 1fr; }
  .tb-grid { grid-template-columns: 1fr; }
  .tb-phone { max-width: 300px; justify-self: center; }
  .ao-hero .lede { position: static; width: auto; margin-top: 20px; }
  .end-grid { grid-template-columns: 1fr; }
}
