/* Floating "Book a call" button (src/components/book-call.js), on every page, fixed while the page
   scrolls. João prefers e-mail; the button is there to answer "can we talk first?" (29/09/2026).
   Style of the nav CTA in the lime of the brand, so it shows on white and on the dark footer.
   On case pages it sits left of the back-to-top button (#to-top, 46 px at 22 px from the corner). */
.book-call{position:fixed;right:22px;bottom:22px;z-index:901;display:inline-flex;align-items:center;gap:8px;height:46px;padding:0 18px;border-radius:5px;background:var(--gold-soft,#EAFAA8);color:var(--ink,#141414);font-family:var(--mono,'Azeret Mono',ui-monospace,monospace);font-size:11.5px;font-weight:500;letter-spacing:.12em;text-transform:uppercase;text-decoration:none;box-shadow:0 6px 20px rgba(20,20,20,.18);transition:background .2s,color .2s,transform .2s}
.book-call:hover{background:var(--gold,#133D38);color:#fff;transform:translateY(-1px)}
.book-call:focus-visible{outline:2px solid var(--gold,#133D38);outline-offset:3px}
.book-call svg{flex:none}
body:has(#to-top) .book-call{right:80px}
@media (max-width:600px){.book-call{right:16px;bottom:16px;height:44px;padding:0 14px;font-size:11px}body:has(#to-top) .book-call{right:72px}}
@media (prefers-reduced-motion:reduce){.book-call{transition:none}}
@media print{.book-call{display:none}}

/* the modal with the booking page */
.book-call-modal{margin:auto;inset:0;width:min(760px,94vw);height:min(820px,90vh);max-width:none;max-height:none;padding:0;border:0;border-radius:8px;background:#fff;color:var(--ink,#141414);box-shadow:0 24px 64px rgba(0,0,0,.35);overflow:hidden}
.book-call-modal[open]{display:flex;flex-direction:column}
.book-call-modal::backdrop{background:rgba(20,20,20,.55);backdrop-filter:blur(2px)}
.book-call-head{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:14px 16px 14px 22px;border-bottom:1px solid var(--line,rgba(20,20,20,.14))}
.book-call-head h2{margin:0;font-family:var(--mono,'Azeret Mono',ui-monospace,monospace);font-size:12px;font-weight:500;letter-spacing:.12em;text-transform:uppercase}
.book-call-close{width:40px;height:40px;border:0;border-radius:5px;background:transparent;color:var(--ink,#141414);font-size:26px;line-height:1;cursor:pointer}
.book-call-close:hover{background:var(--bg-2,#F4F4F2)}
.book-call-close:focus-visible{outline:2px solid var(--gold,#133D38);outline-offset:2px}
.book-call-frame{flex:1;width:100%;border:0}
@media (max-width:600px){.book-call-modal{width:100vw;height:100dvh;border-radius:0}}

/* loading state: shown until the booking page inside the frame has loaded */
.book-call-body{position:relative;flex:1;display:flex}
.book-call-loading{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;background:#fff;color:var(--muted,#666);font-family:var(--mono,'Azeret Mono',ui-monospace,monospace);font-size:11.5px;letter-spacing:.12em;text-transform:uppercase;transition:opacity .25s}
.book-call-spinner{width:28px;height:28px;border-radius:50%;border:2.5px solid var(--line,rgba(20,20,20,.14));border-top-color:var(--gold,#133D38);animation:book-call-spin .8s linear infinite}
@keyframes book-call-spin{to{transform:rotate(360deg)}}
.book-call-modal.is-loaded .book-call-loading{opacity:0;pointer-events:none}
@media (prefers-reduced-motion:reduce){.book-call-spinner{animation-duration:2.4s}}

/* thank-you message after the modal closes; fades out by itself after 6 seconds */
.book-call-toast{position:fixed;left:50%;bottom:22px;z-index:902;max-width:min(520px,calc(100vw - 32px));margin:0;padding:14px 20px;border-radius:5px;background:var(--ink,#141414);color:#fff;font-size:14px;line-height:1.5;box-shadow:0 10px 30px rgba(0,0,0,.25);transform:translate(-50%,12px);opacity:0;transition:opacity .3s,transform .3s}
.book-call-toast.is-on{opacity:1;transform:translate(-50%,0)}
@media (max-width:600px){.book-call-toast{bottom:76px}}
