/* ============================================================
   the inquiry form, ported from v4 (stopgap/shared/port_inquiry.py).
   do not edit here: edit v4 and re-run the port.
   ============================================================ */
.inq{
  --inq-ground:var(--ink-2, #121214);
  --inq-paper:#ece7df;
  --inq-dim:#c8c1b7;
  --inq-line:rgba(236,231,223,.45);     /* control borders, 3.6:1 (WCAG 1.4.11 asks 3) */
  --inq-hair:rgba(236,231,223,.14);
  --inq-warn:#e9b07a;                    /* errors: warm, not alarm red */
  --inq-display:inherit;
  --inq-q-size:clamp(28px,2.6vw,40px);
  --inq-q-weight:400;
  position:relative; color:var(--inq-paper);
}
/* the older versions style button, form, fieldset and inputs globally; take them back */
:where(.inq) button{margin:0; border-radius:0; letter-spacing:normal; align-self:auto; text-transform:none}
.inq .inq__form{display:block; max-width:none; gap:0}
.inq .inq-step{display:block}
.inq .inq-field input, .inq .inq-field textarea{font-family:inherit}
.inq .inq__sentence button:hover, .inq .inq__back:hover, .inq .inq__reset:hover{background:none}
.inq .inq-send__btn:hover{color:var(--inq-ground)}
.inq .inq-body{margin:0; color:var(--inq-dim); text-wrap:pretty}
.inq .cf-turnstile{margin-top:16px}
/* the sentence: answers as words you can tap to change.
   its space is reserved so the questions below never move. */
.inq .inq__sentence{
  margin:0 0 24px; min-height:56px; font-size:17px; line-height:28px; color:var(--inq-dim);
}
@media (max-width:899px){ .inq__sentence{min-height:84px} }
.inq .inq__sentence button{
  font:inherit; color:var(--inq-paper); background:none; border:0; padding:0; cursor:pointer;
  text-decoration:underline; text-decoration-color:var(--inq-line); text-underline-offset:5px;
  text-decoration-thickness:1px; transition:text-decoration-color .3s var(--ease);
}
.inq .inq__sentence button:hover{text-decoration-color:var(--inq-paper)}
.inq .inq__sentence button:focus-visible{outline:2px solid var(--inq-paper); outline-offset:3px}
.inq .inq__sentence .w{opacity:0; animation:inq-word .5s var(--ease-out) forwards}
@keyframes inq-word{from{opacity:0; transform:translateY(4px)} to{opacity:1; transform:none}}

/* progress: Goal-Gradient. a hairline that fills, and the count */
.inq .inq__progress{display:flex; align-items:center; gap:16px; margin-bottom:48px}
.inq .inq__bar{position:relative; flex:1; height:1px; background:var(--inq-hair)}
.inq .inq__fill{position:absolute; inset:0 auto 0 0; width:0; background:var(--inq-paper); transition:width .6s var(--ease-out)}
.inq .inq__count{font-size:12px; line-height:16px; font-stretch:112%; letter-spacing:.08em; color:var(--inq-dim); font-variant-numeric:tabular-nums}

/* steps: all stacked in one cell, so the box is always as tall as the
   tallest step and nothing jumps when they cross-fade */
.inq .inq__steps{display:grid}
.inq .inq-step{grid-area:1 / 1; border:0; margin:0; padding:0; min-width:0;
  opacity:0; visibility:hidden; transform:translateY(8px);
  transition:opacity .32s var(--ease), transform .32s var(--ease), visibility 0s .32s}
.inq .inq-step.is-on{opacity:1; visibility:visible; transform:none; transition:opacity .42s var(--ease) .08s, transform .42s var(--ease) .08s}
.inq .inq-step__q{float:left; width:100%; padding:0; margin:0 0 32px;
  font-family:var(--inq-display); font-weight:var(--inq-q-weight); font-optical-sizing:auto; font-size:var(--inq-q-size); line-height:1.1; letter-spacing:-.015em}
.inq .inq-step > :not(legend){clear:both}

/* numbered choice cards: large targets, the number is also the key to press */
.inq .inq-opts{display:grid; gap:12px}
.inq .inq-opt{position:relative; display:grid; grid-template-columns:28px 1fr 18px; align-items:center; gap:16px;
  min-height:64px; padding:16px 20px; border:1px solid var(--inq-line); cursor:pointer;
  transition:background-color .24s var(--ease), border-color .24s var(--ease), color .24s var(--ease)}
.inq .inq-opt input{position:absolute; inset:0; opacity:0; margin:0; cursor:pointer}
.inq .inq-opt__n{display:grid; place-items:center; width:28px; height:28px; border:1px solid var(--inq-line);
  font-size:12px; font-stretch:112%; font-variant-numeric:tabular-nums; transition:border-color .24s var(--ease)}
.inq .inq-opt__t{font-size:17px; line-height:24px}
.inq .inq-opt__dot{width:18px; height:18px; border:1px solid var(--inq-line); border-radius:50%; position:relative; transition:border-color .24s var(--ease)}
.inq .inq-opt__dot::after{content:""; position:absolute; inset:4px; border-radius:50%; background:var(--inq-ground); transform:scale(0); transition:transform .24s var(--ease-out)}
.inq .inq-opt:hover{border-color:var(--inq-paper)}
.inq .inq-opt:has(input:focus-visible){outline:2px solid var(--inq-paper); outline-offset:3px}
.inq .inq-opt:has(input:checked){background:var(--inq-paper); border-color:var(--inq-paper); color:var(--inq-ground)}
.inq .inq-opt:has(input:checked) .inq-opt__n,
.inq .inq-opt:has(input:checked) .inq-opt__dot{border-color:var(--inq-ground)}
.inq .inq-opt:has(input:checked) .inq-opt__dot::after{transform:scale(1)}

/* fields: label above (fastest to complete, per eye-tracking studies),
   a reserved line for the message so an error never pushes the next field */
.inq .inq-avail__note{margin-bottom:24px}
.inq .inq-field{display:block}
.inq .inq-field + .inq-field,
.inq .inq-avail + .inq-field{margin-top:8px}
.inq .inq-field__label{display:flex; justify-content:space-between; font-size:13px; line-height:20px; font-weight:500;
  font-stretch:112%; letter-spacing:.04em}
.inq .inq-field__opt{font-weight:400; color:var(--inq-dim); letter-spacing:.02em}
.inq .inq-field__box{position:relative; margin-top:8px}
.inq .inq-field input,
.inq .inq-field textarea{
  width:100%; background:transparent; color:var(--inq-paper); border:0; border-bottom:1px solid var(--inq-line);
  border-radius:0; font:inherit; font-size:18px; line-height:28px; padding:8px 40px 8px 0;
  transition:border-color .24s var(--ease), box-shadow .24s var(--ease);
}
.inq .inq-field textarea{resize:vertical; min-height:72px; padding-right:0}
.inq .inq-field input:focus,
.inq .inq-field textarea:focus{outline:0; border-bottom-color:var(--inq-paper); box-shadow:0 1px 0 0 var(--inq-paper)}
.inq .inq-field__msg,
.inq .inq-field__help{margin:8px 0 0; font-size:13px; line-height:20px}
.inq .inq-field__msg{min-height:20px; color:var(--inq-paper); display:flex; gap:8px; align-items:baseline;
  opacity:0; transform:translateY(-4px); transition:opacity .28s var(--ease), transform .28s var(--ease)}
.inq .inq-field__msg::before{content:""; flex:none; width:6px; height:6px; border-radius:50%; background:var(--inq-warn); transform:translateY(-1px)}
.inq .inq-field__help{color:var(--inq-dim); margin-bottom:24px}
.inq .inq-field.is-error input{border-bottom-color:var(--inq-warn); box-shadow:0 1px 0 0 var(--inq-warn)}
.inq .inq-field.is-error .inq-field__msg{opacity:1; transform:none}

/* the feather: Adam collects them. it draws itself where a checkmark would be */
.inq .inq-feather{position:absolute; right:0; bottom:10px; width:24px; height:24px; fill:none; stroke:var(--inq-paper);
  stroke-width:1.2; stroke-linecap:round; stroke-linejoin:round; opacity:0; pointer-events:none}
.inq .inq-feather path{stroke-dasharray:70; stroke-dashoffset:70}
.inq .inq-field.is-good .inq-feather{opacity:1}
.inq .inq-field.is-good .inq-feather path{stroke-dashoffset:0; transition:stroke-dashoffset 1.1s var(--ease-out)}
.inq .inq-field.is-good .inq-feather .inq-feather__shaft{transition-delay:.25s}

.inq .hp{position:absolute; left:-9999px; width:1px; height:1px; overflow:hidden}

/* send: the one solid control on the page */
.inq .inq-send{margin-top:24px}
.inq .inq-send__btn{position:relative; overflow:hidden; display:inline-flex; align-items:center; justify-content:center;
  min-width:220px; min-height:56px; padding:0 32px; border:0; background:var(--inq-paper); color:var(--inq-ground);
  font:inherit; font-size:14px; font-weight:600; font-stretch:112%; letter-spacing:.12em; text-transform:uppercase;
  cursor:pointer; transition:background-color .24s var(--ease), transform .16s var(--ease)}
.inq .inq-send__btn:hover{background:#fff}
.inq .inq-send__btn:active{transform:scale(.985)}
.inq .inq-send__btn:focus-visible{outline:2px solid var(--inq-paper); outline-offset:4px}
.inq .inq-send__line{position:absolute; left:0; bottom:0; height:3px; width:100%; background:var(--inq-ground);
  transform:scaleX(0); transform-origin:0 50%}
.inq.is-sending .inq-send__btn{pointer-events:none}
.inq.is-sending .inq-send__line{animation:inq-sending 1.4s var(--ease) forwards}
@keyframes inq-sending{to{transform:scaleX(1)}}
.inq .inq-send__status{margin:16px 0 0; min-height:20px; font-size:13px; line-height:20px; color:var(--inq-dim)}

/* back and start over: quiet, always in the same place */
.inq .inq__nav{display:flex; justify-content:space-between; margin-top:32px}
.inq .inq__back,
.inq .inq__reset{display:inline-flex; align-items:center; gap:8px; min-height:44px; padding:0;
  background:none; border:0; color:var(--inq-dim); font:inherit; font-size:14px; cursor:pointer;
  transition:color .24s var(--ease), opacity .3s var(--ease)}
.inq .inq__back:hover,
.inq .inq__reset:hover{color:var(--inq-paper)}
.inq .inq__back:focus-visible,
.inq .inq__reset:focus-visible{outline:2px solid var(--inq-paper); outline-offset:4px}
.inq .inq__back svg,
.inq .inq__reset svg{width:16px; height:16px; fill:none; stroke:currentColor; stroke-width:1.6; stroke-linecap:round; stroke-linejoin:round}
.inq .inq__back[hidden],
.inq .inq__reset[hidden]{display:inline-flex; visibility:hidden; opacity:0}

/* sent: the same box, so nothing moves. the feather draws, then the note */
.inq .inq__sentence,
.inq .inq__progress,
.inq .inq__form{transition:opacity .4s var(--ease)}
.inq .inq-sent{position:absolute; inset:0; display:flex; flex-direction:column; align-items:flex-start;
  opacity:0; visibility:hidden; transition:opacity .6s var(--ease) .3s, visibility 0s .9s}
.inq[data-state="sent"] .inq__sentence,
.inq[data-state="sent"] .inq__progress,
.inq[data-state="sent"] .inq__form{opacity:0; pointer-events:none}
.inq[data-state="sent"] .inq-sent{opacity:1; visibility:visible; transition:opacity .6s var(--ease) .3s}
.inq .inq-sent__feather{width:72px; height:72px; fill:none; stroke:var(--inq-paper); stroke-width:.7; stroke-linecap:round; stroke-linejoin:round; margin-bottom:32px}
.inq .inq-sent__feather path{stroke-dasharray:70; stroke-dashoffset:70}
.inq[data-state="sent"] .inq-sent__feather path{stroke-dashoffset:0; transition:stroke-dashoffset 1.8s var(--ease-out) .5s}
.inq[data-state="sent"] .inq-sent__feather .inq-feather__shaft{transition-delay:.9s}
.inq .inq-sent__head{margin:0 0 16px; font-family:var(--inq-display); font-weight:var(--inq-q-weight); font-size:var(--inq-q-size); line-height:1.1; letter-spacing:-.015em}
.inq .inq-sent__receipt{margin:24px 0 32px; padding-top:24px; border-top:1px solid var(--inq-hair); font-size:15px; line-height:24px; color:var(--inq-dim); max-width:34em}
.inq .inq-sent__receipt b{font-weight:400; color:var(--inq-paper)}