/* register.css: page-scoped styles moved out of register.html on 2026-09-05, verbatim. tokens.css wins. */
  /* AeroEdge -- Register. Tokens (:root + [data-theme]) live in /css/tokens.css.
     Geometry: radius 0, hairline --rule, no shadows/glows/gradients (design system). */
  *, *::before, *::after { box-sizing:border-box; margin:0; padding:0; }
  html, body { min-height:100%; }
  body {
    background:var(--bg); color:var(--text); font-family:'Barlow',sans-serif;
    min-height:100vh; display:flex; align-items:flex-start; justify-content:center;
    padding:48px 24px; transition:background .35s ease, color .35s ease;
  }
  .card {
    background:var(--surface); border:1px solid var(--rule); border-radius:var(--radius);
    padding:42px 40px 36px; width:100%; max-width:940px;
    animation:rise .5s cubic-bezier(.2,.7,.2,1) both;
  }
  @keyframes rise { from { opacity:0; transform:translateY(10px); } to { opacity:1; transform:none; } }
  .brand { display:flex; flex-direction:column; align-items:flex-start; margin-bottom:26px; }
  .logo-plate {
    background:var(--logo-plate); border-radius:var(--radius); padding:var(--logo-pad,0);
    transition:background .35s ease, padding .35s ease; align-self:stretch;
  }
  .logo-img { display:block; width:100%; max-width:240px; height:auto; }
  .logo-fallback {
    display:none; font-family:'Barlow Condensed',sans-serif; font-weight:800; font-size:var(--fs-6);
    color:var(--text); letter-spacing:.02em;
  }
  .logo-fallback span { color:var(--cyan); }
  /* kicker -- the one signature device per page (skill §3) */
  .kicker {
    font-family:'Barlow Condensed',sans-serif; font-weight:600; font-size:var(--fs-2);
    letter-spacing:.16em; text-transform:uppercase; color:var(--cyan); margin-top:18px;
  }
  h1 {
    font-family:'Barlow Condensed',sans-serif; font-weight:800; font-size:var(--fs-7); line-height:1;
    text-transform:uppercase; letter-spacing:.02em; margin-top:6px; color:var(--text);
  }
  .subtitle { font-size:var(--fs-3); color:var(--text); margin-top:8px; }
  /* Account form + athlete plans stay in a readable centered column; the
     professional grid spans the full (wide) card. */
  .narrow-col { max-width:452px; margin-left:auto; margin-right:auto; }
  .step-label {
    font-family:'Barlow Condensed',sans-serif; font-size:var(--fs-2); font-weight:600;
    text-transform:uppercase; letter-spacing:.12em; color:var(--dim); margin-bottom:14px;
    display:flex; align-items:center; gap:10px;
  }
  .step-label::after { content:""; flex:1; height:1px; background:var(--rule); }
  .plans { display:grid; grid-template-columns:1fr 1fr; gap:12px; margin-bottom:18px; }
  .plan {
    position:relative; border:1px solid var(--rule); border-radius:var(--radius); padding:16px 16px 14px;
    cursor:pointer; transition:border-color .15s, background .15s; background:var(--surface2);
  }
  .plan.selected { border-color:var(--cyan); background:var(--cy-field); }
  .plan.selected::after {
    content:"✓"; position:absolute; top:10px; right:12px; width:18px; height:18px; border-radius:50%;
    background:var(--cyan); color:var(--on-accent); font-size:var(--fs-1); font-weight:700;
    display:flex; align-items:center; justify-content:center;
  }
  .plan input { position:absolute; opacity:0; pointer-events:none; }
  .plan-name {
    font-family:'Barlow Condensed',sans-serif; font-size:var(--fs-2); font-weight:600; letter-spacing:.08em;
    text-transform:uppercase; color:var(--muted); margin-bottom:6px;
  }
  .plan-price { font-family:'Barlow Condensed',sans-serif; font-size:var(--fs-6); font-weight:800; color:var(--text); line-height:1; }
  .plan-price sub { font-size:var(--fs-3); font-weight:500; color:var(--muted); vertical-align:baseline; }
  /* measured/selected chip -- cyan field, hairline cyan rule (skill §5) */
  .plan-badge {
    display:inline-block; background:var(--cy-field); border:1px solid var(--cy-rule); color:var(--cyan);
    font-family:'Barlow Condensed',sans-serif; font-size:var(--fs-1); font-weight:600; letter-spacing:.04em;
    padding:2px 8px; border-radius:var(--radius); margin-top:8px; text-transform:uppercase;
  }
  /* Free: a full-width selectable band below the two paid plans. A muted "no card" sub (not the
     cyan discount badge) keeps it reading as a peer option, not a cheaper tier. */
  .free-band { position:relative; display:grid; grid-template-columns:auto 1fr auto; gap:18px; align-items:center; border:1px solid var(--rule); border-radius:var(--radius); background:var(--surface2); padding:16px 18px; cursor:pointer; transition:border-color .15s, background .15s; margin-bottom:18px; }
  .free-band.selected { border-color:var(--cyan); background:var(--cy-field); }
  .free-band input { position:absolute; opacity:0; pointer-events:none; }
  .free-band .fb-name { font-family:'Barlow Condensed',sans-serif; font-size:var(--fs-2); font-weight:600; letter-spacing:.08em; text-transform:uppercase; color:var(--muted); margin-bottom:4px; }
  .free-band .fb-price { font-family:'Barlow Condensed',sans-serif; font-weight:800; font-size:var(--fs-6); color:var(--text); line-height:1; white-space:nowrap; }
  .free-band .fb-price sub { font-size:var(--fs-2); font-weight:500; color:var(--muted); vertical-align:baseline; }
  .free-band .scope { font-size:var(--fs-2); color:var(--muted); line-height:1.5; }
  .free-band .withhold { font-size:var(--fs-1); color:var(--dim); line-height:1.5; margin-top:6px; }
  .free-band .withhold b { color:var(--muted); font-weight:600; }
  .free-band .fb-pick { font-family:'Barlow Condensed',sans-serif; font-size:var(--fs-2); font-weight:700; letter-spacing:.06em; text-transform:uppercase; color:var(--cyan); border:1px solid var(--cy-rule); padding:9px 16px; white-space:nowrap; }
  .free-band.selected .fb-pick { background:var(--cyan); color:var(--on-accent); }
  .note-free { text-align:center; font-size:var(--fs-3); color:var(--text); margin-bottom:22px; padding:10px; border:1px solid var(--rule); border-radius:var(--radius); }
  .note-free span { color:var(--cyan); font-weight:600; }
  @media (max-width:540px) { .free-band { grid-template-columns:1fr; } .free-band .fb-pick { justify-self:start; } }
  .trial-note {
    text-align:center; font-size:var(--fs-3); color:var(--text); margin-bottom:22px;
    padding:10px; border:1px dashed var(--rule); border-radius:var(--radius);
  }
  .trial-note span { color:var(--green); font-weight:600; }
  .divider { border:none; border-top:1px solid var(--rule); margin:22px 0; }
  .field { margin-bottom:14px; }
  label {
    display:block; font-family:'Barlow Condensed',sans-serif; font-size:var(--fs-2); font-weight:600;
    letter-spacing:.08em; text-transform:uppercase; color:var(--muted); margin-bottom:7px;
  }
  input[type="email"], input[type="password"], input[type="text"] {
    width:100%; background:var(--field-bg); border:1px solid var(--rule); border-radius:var(--radius);
    color:var(--text); font-family:'Barlow',sans-serif; font-size:var(--fs-4); padding:12px 14px;
    outline:none; transition:border-color .15s, background .35s;
  }
  input::placeholder { color:var(--dim); }
  input:focus { border-color:var(--cyan); }
  /* Coupon: a proper always-visible box (not a hidden-behind-a-"+"-toggle field), so an athlete
     with a code sees it before submitting -- same treatment as subscribe.html. */
  .coupon-box { border:1px solid var(--rule); border-radius:var(--radius); background:var(--surface2); padding:16px 18px; margin-bottom:14px; }
  .coupon-box .cb-label { font-family:'Barlow Condensed',sans-serif; font-weight:700; font-size:var(--fs-3); letter-spacing:.04em; text-transform:uppercase; color:var(--text); margin-bottom:4px; }
  .coupon-box .cb-sub { font-size:var(--fs-2); color:var(--muted); line-height:1.4; margin-bottom:12px; }
  /* ONE solid primary per page -- the submit */
  .btn {
    width:100%; background:var(--btn-bg); color:var(--btn-text); border:1px solid var(--btn-bg);
    border-radius:var(--radius); font-family:'Barlow Condensed',sans-serif; font-size:var(--fs-4);
    font-weight:700; letter-spacing:.08em; text-transform:uppercase; padding:14px; cursor:pointer; margin-top:4px;
    transition:opacity .15s;
  }
  .btn:hover:not(:disabled) { opacity:.88; }
  .btn:disabled { opacity:.5; cursor:not-allowed; }
  .error {
    background:color-mix(in srgb,var(--danger) 12%,transparent);
    border:1px solid color-mix(in srgb,var(--danger) 34%,transparent); border-radius:var(--radius);
    color:var(--danger); font-size:var(--fs-3); padding:11px 13px; margin-bottom:14px; display:none;
  }
  .footer-link { margin-top:22px; text-align:center; font-size:var(--fs-3); color:var(--muted); }
  .footer-link a { color:var(--cyan); text-decoration:none; font-weight:600; }
  .footer-link a:hover { text-decoration:underline; }
  .theme-toggle {
    position:fixed; top:20px; right:20px; z-index:3; display:inline-flex; align-items:center; gap:8px;
    background:var(--surface); border:1px solid var(--rule); color:var(--muted); border-radius:var(--radius);
    padding:8px 14px; font-family:'Barlow Condensed',sans-serif; font-weight:600; font-size:var(--fs-2);
    letter-spacing:.1em; text-transform:uppercase; cursor:pointer; transition:color .15s, border-color .15s;
  }
  .theme-toggle:hover { color:var(--cyan); border-color:var(--cyan); }
  .theme-toggle svg { width:15px; height:15px; }
  .oauth-divider { display:flex; align-items:center; gap:12px; margin:22px 0 14px; color:var(--dim);
    font-size:var(--fs-2); text-transform:uppercase; letter-spacing:.12em; font-family:'Barlow Condensed',sans-serif; }
  .oauth-divider::before, .oauth-divider::after { content:""; flex:1; height:1px; background:var(--rule); }
  /* OAuth: outlined .btn pattern; the provider logo (SVG) is never restyled */
  .btn-oauth { width:100%; display:flex; align-items:center; justify-content:center; gap:10px;
    background:none; border:1px solid var(--rule); border-radius:var(--radius); color:var(--text);
    font-family:'Barlow',sans-serif; font-size:var(--fs-3); font-weight:600; padding:11px 14px; cursor:pointer;
    margin-bottom:10px; transition:border-color .15s, background .15s, color .15s; }
  .btn-oauth:hover { border-color:var(--cyan); }
  .btn-oauth svg { width:18px; height:18px; flex-shrink:0; }
  @media (max-width:480px) { .card { padding:34px 22px 28px; } .plans { grid-template-columns:1fr; } }

  /* ---- Coaching pricing grid (scoped: ctg-*) ---- */
  .ctg-toggle-wrap { text-align:center; margin-bottom:16px; }
  .ctg-toggle {
    display:inline-flex; align-items:center; gap:0; padding:4px;
    background:var(--surface2); border:1px solid var(--rule); border-radius:var(--radius);
  }
  .ctg-toggle button {
    appearance:none; border:none; background:transparent; cursor:pointer;
    font-family:'Barlow Condensed',sans-serif; font-size:var(--fs-3); font-weight:600; letter-spacing:.08em;
    text-transform:uppercase; color:var(--muted); padding:7px 16px; border-radius:var(--radius);
    transition:background .15s, color .15s;
  }
  .ctg-toggle button.active { background:var(--cyan); color:var(--on-accent); }
  .ctg-hint {
    display:inline-block; margin-left:8px; font-size:var(--fs-1); color:var(--green); font-weight:600;
    vertical-align:middle;
  }
  .ctg-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:14px; align-items:stretch; }
  .ctg-card {
    position:relative; display:flex; flex-direction:column; text-align:left;
    border:1px solid var(--rule); border-radius:var(--radius); padding:20px 14px 16px; background:var(--surface2);
    cursor:pointer; transition:border-color .15s, background .15s;
  }
  .ctg-card.selected { border-color:var(--cyan); background:var(--cy-field); }
  .ctg-card.selected::after {
    content:"✓"; position:absolute; top:10px; right:12px; width:18px; height:18px; border-radius:50%;
    background:var(--cyan); color:var(--on-accent); font-size:var(--fs-1); font-weight:700;
    display:flex; align-items:center; justify-content:center;
  }
  .ctg-badge {
    position:absolute; top:-10px; left:50%; transform:translateX(-50%);
    background:var(--cyan); color:var(--on-accent);
    font-family:'Barlow Condensed',sans-serif; font-size:var(--fs-1); font-weight:700; letter-spacing:.12em;
    text-transform:uppercase; padding:3px 12px; border-radius:var(--radius); white-space:nowrap;
  }
  .ctg-label {
    font-family:'Barlow Condensed',sans-serif; font-size:var(--fs-4); font-weight:700; letter-spacing:.06em;
    text-transform:uppercase; color:var(--text); margin-bottom:4px;
  }
  .ctg-blurb { font-size:var(--fs-1); color:var(--muted); line-height:1.4; min-height:32px; margin-bottom:12px; }
  .ctg-price { font-family:'Barlow Condensed',sans-serif; font-weight:800; font-size:var(--fs-6); color:var(--text); line-height:1; }
  .ctg-price .ctg-suffix { font-size:var(--fs-3); font-weight:500; color:var(--muted); }
  .ctg-billed { font-size:var(--fs-1); color:var(--muted); margin-top:4px; margin-bottom:12px; }
  .ctg-feats { list-style:none; margin:0 0 16px; padding:0; flex:1; }
  .ctg-feats li { position:relative; padding-left:20px; font-size:var(--fs-2); color:var(--text); line-height:1.4; margin-bottom:7px; }
  .ctg-feats li::before { content:"✓"; position:absolute; left:0; top:0; color:var(--cyan); font-weight:700; font-size:var(--fs-2); }
  /* What both paid plans include. Reuses the coach-tier .ctg-feats list, so the athlete block and
     the professional grid read as one page. MUST sit AFTER .ctg-feats: both are single-class
     selectors, so the later rule wins and .prem-feats margin was being overridden from up in the
     .narrow-col group, where subscribe.html put the same code the other way round and the two
     pages spaced the list differently (found in review 2026-08-30).
     The lead-in is a plain muted LABEL, not a second uppercase device: .step-label above it
     already structures the page, and a sub-heading louder than its own section heading is the
     kicker-inflation defect in design skill section 9.2. */
  .prem-lead { text-align:left; font-size:var(--fs-2); color:var(--muted); margin-bottom:8px; }
  .prem-feats { margin:0 0 22px; text-align:left; }
  /* per-tier CTA = outlined cyan (.btn.cy); the recommended tier fills cyan to signify */
  .ctg-cta {
    width:100%; border-radius:var(--radius); padding:11px;
    font-family:'Barlow Condensed',sans-serif; font-size:var(--fs-3); font-weight:700; letter-spacing:.08em;
    text-transform:uppercase; cursor:pointer; transition:background .15s, color .15s;
    border:1px solid var(--cyan); background:none; color:var(--cyan); margin-top:auto;
  }
  .ctg-cta:hover { background:var(--cyan); color:var(--on-accent); }
  .ctg-card.popular .ctg-cta { background:var(--cyan); color:var(--on-accent); border-color:var(--cyan); }
  #coach-plan-section { max-width:860px; margin-left:auto; margin-right:auto; }
  @media (max-width:600px) {
    .ctg-grid { grid-template-columns:1fr; }
    .card { padding:34px 22px 28px; }
    /* 44px minimum touch target, same rule and same breakpoint as sessions.html. Measured on a
       375px viewport before this block existed: theme 33, Monthly/Yearly 30, the three tier CTAs
       40, the coupon field 40, Google 42. That is every control on the page a new customer must
       actually hit. min-height only: no padding, colour or type change, so desktop is untouched.
       The .plan / .free-band cards are already well over 44px and are deliberately not listed:
       their <input type=radio> is opacity:0 / pointer-events:none, a proxy nobody can tap. */
    .ctg-toggle button { min-height:44px; }
    .ctg-cta { min-height:44px; }
    .btn-oauth { min-height:44px; }
  }
