/* Book Bella. The press kit's document shell with the site's raised fields and pills. */

.book [hidden]{display:none!important}
.book__t{color:#fff;margin-bottom:8px}
.book__lede{padding-top:20px;font-size:15px;color:var(--plum-700);max-width:62ch}

.bset{border:0;margin:0;min-width:0;padding-inline:0}
.bset > legend{float:left;width:100%;margin-bottom:14px;padding:0}
.bset > legend + *{clear:both}
.bset legend i,.field__l i,.opt i{font-style:normal;color:#C2185B}

.bgrid{display:grid;gap:15px}
@media (min-width:720px){
  .bgrid{grid-template-columns:1fr 1fr;gap:15px 18px}
  .field--wide{grid-column:1 / -1}
}

.field{display:grid;gap:6px;min-width:0}
.field--group{gap:10px;margin-top:18px}
.field__l{font-size:13.5px;font-weight:700;color:var(--ink)}
.field__opt{font-weight:500;color:var(--ink-2)}
.field__i{
  width:100%;min-height:50px;padding:12px 14px;
  border:1px solid rgba(58,40,112,.16);border-radius:14px;
  background:linear-gradient(180deg,#FBF9FF 0%,#FFFFFF 100%);color:var(--ink);font:inherit;font-size:16px;
  box-shadow:inset 0 2px 4px rgba(39,26,77,.07), 0 1px 0 #fff;
  transition:border-color .18s var(--ease),box-shadow .18s var(--ease);
}
textarea.field__i{resize:vertical;line-height:1.55}
.field__i::placeholder{color:#8A79AD}
.field__i:hover{border-color:rgba(58,40,112,.32)}
.field__i:focus{outline:none;border-color:var(--violet);box-shadow:inset 0 2px 4px rgba(39,26,77,.07), 0 0 0 3px rgba(109,75,199,.18)}
.field__i[type=date],.field__i[type=time]{appearance:none;-webkit-appearance:none}

/* choices: raised cards that press in when picked */
.opts{display:grid;gap:9px}
@media (min-width:720px){ .opts{grid-template-columns:1fr 1fr} }
.opts--row{grid-template-columns:1fr 1fr}
.opts--chips{display:flex;flex-wrap:wrap;gap:8px}
.opt{position:relative;display:block;cursor:pointer}
.opt input{position:absolute;opacity:0;inset:0;margin:0;cursor:pointer}
.opt > span{
  display:flex;flex-direction:column;justify-content:center;gap:2px;
  min-height:52px;padding:11px 14px 11px 44px;border-radius:16px;
  background:var(--surf);border:var(--surf-edge);border-bottom-color:rgba(39,26,77,.12);
  box-shadow:var(--lift);font-size:14.5px;font-weight:650;color:var(--ink);line-height:1.3;
  transition:transform .16s var(--ease),box-shadow .16s var(--ease),background .16s var(--ease);
}
.opt > span::before{
  content:"";position:absolute;left:15px;top:50%;width:18px;height:18px;margin-top:-9px;
  border-radius:50%;border:2px solid rgba(58,40,112,.3);background:#fff;
  box-shadow:inset 0 1px 2px rgba(39,26,77,.15);
}
.opt input[type=checkbox] + span::before{border-radius:6px}
.opt small{font-size:12.5px;font-weight:500;color:var(--ink-2)}
.opt input:checked + span{
  background:linear-gradient(180deg,#F3ECFF 0%,#E7DBFB 100%);
  box-shadow:inset 0 2px 5px rgba(39,26,77,.14), 0 1px 0 #fff;transform:translateY(1px);
}
.opt input:checked + span::before{border-color:var(--violet);background:var(--violet);box-shadow:inset 0 0 0 3px #fff}
.opt input[type=checkbox]:checked + span::before{
  box-shadow:none;
  background:var(--violet) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7.5'/%3E%3C/svg%3E") center/13px no-repeat;
}
.opt input:focus-visible + span{outline:3px solid rgba(109,75,199,.45);outline-offset:2px}
.opts--chips .opt > span{min-height:44px;padding:9px 14px 9px 38px;border-radius:99px;font-size:14px}
.opts--chips .opt > span::before{left:13px;width:16px;height:16px;margin-top:-8px}
.opt--ack{margin-top:14px}
.opt--ack > span{display:block;padding-block:15px;font-weight:600}

.rates{display:grid;gap:8px;padding:14px 16px;margin-bottom:12px;border-radius:16px;background:rgba(222,210,245,.42);font-size:14px;color:var(--plum-700)}
.rates a{color:var(--violet);font-weight:700;text-decoration:underline;text-underline-offset:2px;overflow-wrap:anywhere}

/* errors */
.field--bad > .field__l,.field--bad .field__l{color:#8C1F3D}
.field--bad .field__i{border-color:#C2185B}
.field--bad .opt > span,.opt--ack.field--bad > span{box-shadow:inset 0 0 0 1.5px #E46AA7, var(--lift)}

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

.book__foot{display:grid;gap:12px;padding-block:24px 8px}
.book__foot .cta{width:100%}
@media (min-width:720px){ .book__foot .cta{width:auto;justify-self:start;padding-inline:40px} }
.book__msg{font-size:14px;min-height:0}
.book__msg:empty{display:none}
.book__msg[data-tone="bad"]{color:#8C1F3D;font-weight:650}
.book__alt{font-size:13px;color:var(--ink-2)}
.book__alt a{color:var(--violet);font-weight:700;text-decoration:underline;text-underline-offset:2px}

.book__done{padding-block:28px}
.book__done:focus{outline:none}
.book__done .dark{margin-inline:0}