/* northy.css — the Northy chat assistant, contact bubble and launcher. Shared by every page. Loaded next to northy.js. */
.chat { position: fixed; right: 0; top: 0; bottom: 0; width: min(420px, 92vw); background: #fff; z-index: 120; box-shadow: -30px 0 80px rgba(0,0,0,.25); transform: translateX(105%); transition: transform .45s cubic-bezier(.2,.8,.2,1); display: flex; flex-direction: column; }
.chat.open { transform: none; }
.chat .ch { padding: 18px 20px; border-bottom: 1px solid var(--hair, rgba(23,22,20,.12)); display: flex; align-items: center; gap: 12px; }
.chat .ch img { width: 40px; height: 40px; border-radius: 50%; object-fit: cover; }
.chat .ch .av { width: 42px; height: 42px; border-radius: 50%; flex: none; }
/* Northy — the launcher bubble, always on screen */
.northy-launch { position: fixed; right: 22px; bottom: 26px; z-index: 95; display: flex; align-items: center; gap: 10px; background: #fff; border: 2px solid var(--ink, #171614); border-radius: 999px; padding: 6px 18px 6px 6px; cursor: pointer; font-family: inherit; box-shadow: 0 18px 44px rgba(23,22,20,.22); transition: transform .2s; }
.northy-launch:hover { transform: translateY(-2px); }
.northy-launch .av { width: 44px; height: 44px; border-radius: 50%; }
.northy-launch span { display: flex; flex-direction: column; text-align: left; line-height: 1.15; }
.northy-launch b { font-size: 14px; font-weight: 800; }
.northy-launch small { font-size: 11.5px; color: var(--dim, rgba(23,22,20,.6)); font-weight: 500; }
@media (max-width: 700px) { .northy-launch { bottom: 88px; right: 14px; } .northy-launch span { display: none; } .northy-launch { padding: 4px; } }
/* the contact bubble — what "Talk to us" opens first */
.contact { position: fixed; right: 22px; bottom: 100px; z-index: 110; width: min(320px, 92vw); display: none; }
.contact.open { display: block; }
.contact .cb { background: #fff; border: 2px solid var(--ink, #171614); border-radius: 18px; box-shadow: 0 24px 60px rgba(23,22,20,.28); overflow: hidden; position: relative; }
.contact .cb::after { content: ""; position: absolute; right: 34px; bottom: -9px; width: 16px; height: 16px; background: #fff; border-right: 2px solid var(--ink, #171614); border-bottom: 2px solid var(--ink, #171614); transform: rotate(45deg); }
.contact .cbh { display: flex; align-items: center; justify-content: space-between; padding: 14px 16px 12px; border-bottom: 1px solid var(--hair, rgba(23,22,20,.12)); }
.contact .cbh b { font-size: 14.5px; font-weight: 800; }
.contact .cbh button { background: none; border: none; font-size: 20px; cursor: pointer; color: var(--faint, rgba(23,22,20,.38)); line-height: 1; }
.contact .row { display: flex; align-items: center; gap: 12px; padding: 12px 16px; border-bottom: 1px solid var(--hair, rgba(23,22,20,.12)); text-decoration: none; color: var(--ink, #171614); background: none; border-left: none; border-right: none; border-top: none; width: 100%; font-family: inherit; cursor: pointer; text-align: left; }
.contact .row:last-child { border-bottom: none; }
.contact .row:hover { background: #faf8f5; }
.contact .ic { width: 34px; height: 34px; border-radius: 50%; background: var(--yellow, #f2d24b); display: grid; place-items: center; flex: none; font-size: 15px; }
.contact .ic svg { width: 34px; height: 34px; }
.contact .rt { display: flex; flex-direction: column; line-height: 1.2; flex: 1; min-width: 0; }
.contact .rt b { font-size: 13.5px; font-weight: 700; }
.contact .rt span { font-size: 12.5px; color: var(--dim, rgba(23,22,20,.6)); }
.contact .rt code { font-family: inherit; font-size: 13px; color: var(--ink, #171614); }
.contact .copy { font-size: 11px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; border: 1px solid var(--hair, rgba(23,22,20,.12)); border-radius: 999px; padding: 6px 10px; background: #fff; cursor: pointer; font-family: inherit; flex: none; }
.contact .copy:hover { border-color: var(--ink, #171614); }
.chat .ch b { font-size: 15px; display: block; }
.chat .ch span { font-size: 12px; color: var(--faint, rgba(23,22,20,.38)); }
.chat .ch .x { margin-left: auto; background: none; border: none; font-size: 22px; cursor: pointer; color: var(--faint, rgba(23,22,20,.38)); }
.chat .body { flex: 1; overflow-y: auto; padding: 20px; display: flex; flex-direction: column; gap: 12px; }
.msg { max-width: 85%; padding: 12px 15px; border-radius: 14px; font-size: 14px; line-height: 1.5; }
.msg.nova { background: #f4f1ea; border-bottom-left-radius: 4px; align-self: flex-start; }
.msg.user { background: var(--ink, #171614); color: #fff; border-bottom-right-radius: 4px; align-self: flex-end; }
.chips { display: flex; flex-wrap: wrap; gap: 8px; }
.chip { font-size: 12.5px; font-weight: 600; border: 1px solid var(--hair, rgba(23,22,20,.12)); border-radius: 999px; padding: 8px 14px; cursor: pointer; background: #fff; font-family: inherit; transition: all .2s; }
.chip:hover { border-color: var(--ink, #171614); }
.chat .foot { padding: 14px 16px; border-top: 1px solid var(--hair, rgba(23,22,20,.12)); display: flex; gap: 10px; }
.chat .foot input { flex: 1; font-family: inherit; font-size: 14px; padding: 12px 14px; border: 1px solid var(--hair, rgba(23,22,20,.12)); border-radius: 10px; outline: none; }
.chat .foot input:focus { border-color: var(--ink, #171614); }
.chat .foot button { font-family: inherit; font-size: 14px; font-weight: 700; padding: 0 18px; border: none; border-radius: 10px; background: var(--yellow, #f2d24b); cursor: pointer; }
.chat .powered { font-size: 10.5px; color: var(--faint, rgba(23,22,20,.38)); text-align: center; padding: 0 0 10px; }
