/* Page for arenas: why join, plans, comparison, pilot, FAQ and the request form. */

.owners-hero { background: var(--cp-bg); }
.owners-hero-grid { display: grid; gap: var(--cp-space-32); padding-block: var(--cp-space-32) var(--cp-space-48); }
.owners-hero .eyebrow { color: var(--cp-accent); }
.owners-hero h1 { font-size: clamp(2rem, 8vw, 2.75rem); line-height: 1; margin: var(--cp-space-16) 0; max-width: 40rem; }
.owners-hero h1 em { font-style: normal; color: var(--cp-accent); }
.owners-lead { font-size: 1.0625rem; line-height: 1.6; color: var(--cp-text-muted); max-width: 34rem; }
.owners-hero .hero-actions { display: flex; flex-wrap: wrap; gap: var(--cp-space-8); }

.owners-stats { display: flex; flex-wrap: wrap; gap: var(--cp-space-24); list-style: none; margin: var(--cp-space-32) 0 0; padding: var(--cp-space-16) 0 0; border-top: 1px solid var(--cp-border); }
.owners-stats li { display: grid; }
.owners-stats strong { font: 900 1.75rem/1 var(--cp-font-display); letter-spacing: -0.03em; }
.owners-stats span { font: 500 0.75rem/1.6 var(--cp-font-data); text-transform: uppercase; letter-spacing: 0.06em; color: var(--cp-text-muted); }

/* A real Pro page, framed */
.pro-preview { margin: 0; display: grid; gap: var(--cp-space-8); }
.pro-preview-link { position: relative; display: block; border-radius: var(--cp-radius-md); overflow: hidden; background: var(--cp-sand); color: inherit; text-decoration: none; aspect-ratio: 4 / 3; }
.pro-preview-link > img, .pro-preview-link > .court-art { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; aspect-ratio: auto; border-radius: 0; transition: transform var(--cp-duration-slow) var(--cp-ease-out); }
.pro-preview-link:hover > img { transform: scale(1.02); }
.pro-preview-card { position: absolute; left: var(--cp-space-12); right: var(--cp-space-12); bottom: 4.25rem; display: flex; align-items: center; gap: var(--cp-space-12); padding: var(--cp-space-12); background: var(--cp-surface); border-radius: var(--cp-radius-sm); }
.pro-preview-card .monogram { width: 2.75rem; height: 2.75rem; font-size: 0.9375rem; }
.pro-preview-text { display: grid; min-width: 0; flex: 1; font-size: 0.8125rem; color: var(--cp-text-muted); }
.pro-preview-text strong { font: 900 1rem/1.15 var(--cp-font-display); color: var(--cp-text); letter-spacing: -0.02em; }
.pro-preview-text span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pro-preview-card .score-box strong { font-size: 1.25rem; }
.pro-preview-cta { position: absolute; left: var(--cp-space-12); right: var(--cp-space-12); bottom: var(--cp-space-12); display: flex; align-items: center; justify-content: center; gap: var(--cp-space-8); min-height: var(--cp-target-size); border-radius: var(--cp-radius-sm); background: var(--cp-accent); color: var(--cp-on-accent); font-weight: 700; }
.pro-preview figcaption { font: 500 0.75rem var(--cp-font-data); color: var(--cp-text-muted); }

.owners-nav { top: 0; }

/* Steps */
.steps { display: grid; gap: var(--cp-space-16); list-style: none; margin: var(--cp-space-24) 0 0; padding: 0; counter-reset: step; }
.steps li { position: relative; display: grid; gap: var(--cp-space-8); padding: var(--cp-space-24); padding-top: var(--cp-space-48); background: var(--cp-surface); border: 1px solid var(--cp-border); border-radius: var(--cp-radius-md); counter-increment: step; }
.steps li::before { content: counter(step); position: absolute; top: var(--cp-space-16); left: var(--cp-space-24); font: 900 1.5rem/1 var(--cp-font-display); color: var(--cp-accent); }
.steps h3 { font-size: 1.25rem; line-height: 1.15; }
.steps p { color: var(--cp-text-muted); }
.step-time { font: 500 0.6875rem/1.4 var(--cp-font-data); letter-spacing: 0.06em; text-transform: uppercase; color: var(--cp-text-muted); }

/* Plans */
.plans { display: grid; gap: var(--cp-space-16); margin-top: var(--cp-space-24); align-items: start; }
.plan { display: grid; gap: var(--cp-space-16); padding: var(--cp-space-24); background: var(--cp-surface); border: 1px solid var(--cp-border); border-radius: var(--cp-radius-md); }
.plan header { display: grid; gap: var(--cp-space-4); }
.plan h3 { font-size: 1.75rem; line-height: 1; }
.plan-for { color: var(--cp-text-muted); margin: 0; }
.plan-price { display: flex; flex-wrap: wrap; align-items: baseline; gap: var(--cp-space-8); margin: var(--cp-space-8) 0 0; }
.plan-price strong { font: 900 2rem/1 var(--cp-font-display); letter-spacing: -0.03em; }
.plan-price span { color: var(--cp-text-muted); font-size: 0.9375rem; }
.plan-badge { justify-self: start; margin: 0 0 var(--cp-space-8); padding: var(--cp-space-4) var(--cp-space-8); border-radius: var(--cp-radius-sm); background: var(--cp-highlight); color: var(--cp-on-highlight); font: 500 0.6875rem/1.5 var(--cp-font-data); letter-spacing: 0.04em; text-transform: uppercase; }
.plan-badge-muted { background: var(--cp-sand); color: var(--cp-text-muted); }
.plan-pro { border: 2px solid var(--cp-plum); }
.plan-later { background: transparent; }
.plan-list { display: grid; gap: var(--cp-space-8); list-style: none; margin: 0; padding: 0; }
.plan-list li { display: grid; grid-template-columns: 18px 1fr; gap: var(--cp-space-8); align-items: start; line-height: 1.45; }
.plan-list .icon { margin-top: 2px; color: var(--cp-accent); }
.plan-list li.is-soon { color: var(--cp-text-muted); }
.plan-list li.is-soon .icon { color: var(--cp-line-control); }
.tag-soon { background: var(--cp-lavender); color: var(--cp-plum); vertical-align: 1px; }
.plan-fee { margin: 0; padding: var(--cp-space-12); border-radius: var(--cp-radius-sm); background: var(--cp-cream); font-size: 0.9375rem; }
.plan-actions { display: grid; gap: var(--cp-space-8); justify-items: start; }
.plan-actions .button { width: 100%; }
.plans-note { margin-top: var(--cp-space-16); }

/* Comparison */
.table-scroll { overflow-x: auto; margin-top: var(--cp-space-24); border: 1px solid var(--cp-border); border-radius: var(--cp-radius-md); background: var(--cp-surface); }
.table-scroll:focus-visible { box-shadow: var(--cp-focus-ring); outline: none; }
.compare { width: 100%; min-width: 40rem; border-collapse: collapse; font-size: 0.9375rem; }
.compare th, .compare td { text-align: left; vertical-align: top; padding: var(--cp-space-12) var(--cp-space-16); border-bottom: 1px solid var(--cp-border); }
.compare tbody tr:last-child th, .compare tbody tr:last-child td { border-bottom: 0; }
.compare thead th { font: 500 0.6875rem/1.4 var(--cp-font-data); letter-spacing: 0.06em; text-transform: uppercase; color: var(--cp-text-muted); }
.compare tbody th { font-weight: 700; width: 22%; }
.compare td { color: var(--cp-text-muted); }
.compare .is-us { background: var(--cp-blush); color: var(--cp-text); }
.compare thead .is-us { color: var(--cp-guava-strong); }

.owners-trust { display: grid; gap: var(--cp-space-16); max-width: 46rem; }
.owners-trust h2 { font-size: clamp(1.875rem, 6vw, 3rem); line-height: 1.02; }

.owners-pilot .section-head p + p { margin-top: var(--cp-space-12); }
.pilot-asks { margin-top: var(--cp-space-24); }
.section-tight { padding-top: 0; }

/* Request form */
.owners-form-grid { display: grid; gap: var(--cp-space-32); }
.owners-form-intro { display: grid; gap: var(--cp-space-16); align-content: start; }
.owners-form-intro h2 { font-size: clamp(1.75rem, 6vw, 2.5rem); line-height: 1.05; }
.owners-form-card { padding: var(--cp-space-24); background: var(--cp-surface); border-radius: var(--cp-radius-md); border: 1px solid var(--cp-border); }
.interest-field .choice-row { display: grid; gap: var(--cp-space-8); }
.form-actions { display: flex; }
.form-actions .button { width: 100%; }
.owners-form-card .state-success { display: grid; gap: var(--cp-space-12); justify-items: start; }
.owners-form-card .state-success .check { width: 48px; height: 48px; border-radius: 50%; background: var(--cp-highlight); display: grid; place-items: center; }

@media (min-width: 768px) {
  .owners-hero-grid { grid-template-columns: minmax(0, 1.1fr) minmax(0, 0.9fr); align-items: center; padding-block: var(--cp-space-64); }
  .owners-hero h1 { font-size: clamp(2.5rem, 4.6vw, 3.75rem); }
  .steps { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .interest-field .choice-row { display: flex; flex-wrap: wrap; }
  .form-actions .button { width: auto; }
}
@media (min-width: 1024px) {
  .plans { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .plan-pro { transform: translateY(-8px); }
  .owners-form-grid { grid-template-columns: minmax(0, 0.8fr) minmax(0, 1.2fr); align-items: start; }
  .plan-actions .button { width: auto; }
}
@media (prefers-reduced-motion: reduce) {
  .pro-preview-link > img { transition: none; }
}
@media (min-width: 768px) { .facts.pilot-asks { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1024px) { .facts.pilot-asks { grid-template-columns: repeat(4, minmax(0, 1fr)); } }