/* /pricing/start — the form a plan CTA lands on, in the V2 language.
   The markup and every id stay as js/pricing.js expects them; only the
   presentation moved over from css/pricing.css. */

/* Inline styles in the form still reference this token from the old sheet. */
.start-page{--ink-faint:#6a7a90}

.start-page main{background:var(--mist)}
.start-shell-section{padding-top:64px;padding-bottom:96px}
.pr-start-shell{max-width:760px;margin:0 auto;background:#fff;padding:54px 60px 58px;
  box-shadow:0 24px 60px #0a193112;border-top:3px solid var(--cyan)}
.pr-start-shell .eyebrow{color:#007a99}
.pr-start-shell h1{font-size:clamp(30px,3.2vw,42px);letter-spacing:-.035em;line-height:1.14;margin-bottom:14px}
.pr-start-shell .lede{font-size:17px;line-height:1.7;color:var(--body);margin-bottom:30px}

/* The plan chip js/pricing.js fills in from ?plan= */
.pr-chip{display:inline-block;background:#c9f3fd;color:#07485c;font-size:13px;font-weight:600;
  letter-spacing:.04em;padding:9px 16px;margin:0 0 28px}
.pr-chip[hidden]{display:none}

.pr-2col{display:grid;grid-template-columns:1fr 1fr;gap:0 26px}
.field{margin-bottom:22px;display:flex;flex-direction:column}
.field label{font-size:13px;font-weight:600;letter-spacing:.02em;margin-bottom:8px;color:var(--navy);line-height:1.45}
.field input,.field select,.field textarea{font:inherit;font-size:16px;color:var(--navy);background:#fff;
  border:1px solid var(--line);border-radius:0;padding:13px 14px;width:100%;transition:border-color .18s,box-shadow .18s}
.field textarea{resize:vertical;min-height:88px}
.field select{appearance:none;background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='none' stroke='%2342506b' stroke-width='1.6' d='M1 1.5 6 6.5l5-5'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 15px center;padding-right:40px}
.field input:focus,.field select:focus,.field textarea:focus{outline:none;border-color:var(--cyan);
  box-shadow:0 0 0 3px #08ccfc33}
.field input:focus-visible,.field select:focus-visible,.field textarea:focus-visible{outline:none}

/* The two conditional notes js/pricing.js reveals. */
.pr-form-note{font-size:15px;line-height:1.7;padding:20px 22px;margin:4px 0 24px}
.pr-form-note[hidden]{display:none}
.pr-note--upgrade{background:#e6f8fd;color:#0d4457;border-left:3px solid var(--cyan)}
.pr-note--custom{background:var(--mist);color:#2c3d55;border-left:3px solid var(--blue)}

#pr-submit-wrap .btn,#pr-custom-wrap .btn{background:var(--navy);color:#fff;display:inline-flex;
  align-items:center;gap:18px;padding:18px 24px;font-size:15px;font-weight:500;transition:background .2s}
#pr-submit-wrap .btn:hover,#pr-custom-wrap .btn:hover{background:#123359}
#pr-submit-wrap .btn .arrow,#pr-custom-wrap .btn .arrow{color:var(--cyan);font-size:22px;line-height:1}
#pr-custom-wrap[hidden],#pr-submit-wrap[hidden]{display:none}
.pr-error{color:#b3261e;font-size:14px;line-height:1.6;margin-top:14px;text-align:center}
.pr-error[hidden]{display:none}
.pr-linklike{background:none;border:0;padding:12px 0;font-size:14px;color:var(--body);
  text-decoration:underline;text-underline-offset:3px}
.pr-linklike:hover{color:#007a99}

.pr-success{text-align:center;padding:26px 0 10px}
.pr-success[hidden]{display:none}
.pr-success .tick{width:58px;height:58px;margin:0 auto 26px;border-radius:50%;background:#c9f3fd;
  color:#03738f;display:flex;align-items:center;justify-content:center}
.pr-success h2{font-size:clamp(28px,3vw,38px);margin-bottom:14px}
.pr-success p{font-size:17px;line-height:1.7;max-width:46ch;margin:0 auto 30px}
.pr-success .btn{background:var(--navy);color:#fff;display:inline-flex;align-items:center;gap:18px;
  padding:18px 26px;font-size:15px;font-weight:500}
.pr-success .btn:hover{background:#123359}
.pr-success .btn .arrow{color:var(--cyan);font-size:22px;line-height:1}

@media(max-width:700px){
  .start-shell-section{padding-top:38px;padding-bottom:58px}
  .pr-start-shell{padding:34px 24px 40px}
  .pr-2col{grid-template-columns:1fr;gap:0}
  .field input,.field select,.field textarea{font-size:16px}
}
