/* Rachy, the website AI assistant: a robot launcher (bottom-left by default) and a chat panel. */
.rachy { --rc-blue: #2D5BFF; --rc-violet: #7B3CF5; --rc-pink: #FF3D9A; --rc-ink: #0F172A; --rc-muted: #64748B;
    --rc-grad: linear-gradient(135deg, #4CC6FF 0%, #2D5BFF 35%, #7B3CF5 68%, #FF3D9A 100%);
    position: fixed; left: 2rem; bottom: calc(2rem + var(--wa-lift, 0px)); z-index: 460;
    display: flex; flex-direction: column; align-items: flex-start; gap: .7rem; pointer-events: none; font-family: var(--font-body, 'Inter', sans-serif);
    transition: bottom .35s cubic-bezier(.2, .8, .2, 1); }
.rachy--right { left: auto; right: 2rem; align-items: flex-end; bottom: calc(2rem + 72px + var(--wa-lift, 0px)); }
body:not(:has(.wa-float)) .rachy--right { bottom: calc(2rem + var(--wa-lift, 0px)); }
body:has(.rachy--right:not([hidden])) .back-to-top { bottom: calc(2rem + 144px + var(--wa-lift, 0px)) !important; }
/* the floating services dock sits bottom-centre: lift Rachy above it while it's showing */
body:has(.sv-dock-nav.is-on) .rachy--left { bottom: calc(5.4rem + var(--wa-lift, 0px)); }
.rachy[hidden] { display: none; }
.rachy > * { pointer-events: auto; }
body:has(.rachy--hide-wa:not([hidden])) .wa-float-bubble { display: none !important; }
body.rachy-open .wa-float, body.rachy-open .back-to-top { opacity: 0; visibility: hidden; }

/* ---- the robot */
.rachy-bot { position: relative; flex: none; width: 46px; height: 52px; display: inline-block; }
.rachy-bot svg { width: 100%; height: 100%; display: block; overflow: visible; }
.rachy-float { animation: rachyFloat 3.4s ease-in-out infinite; filter: drop-shadow(0 8px 10px rgba(91, 47, 214, .35)); }
.rachy-shadow { transform-box: fill-box; transform-origin: center; animation: rachyShadow 3.4s ease-in-out infinite; }
.rachy-jet { transform-box: fill-box; transform-origin: top center; animation: rachyJet .45s ease-in-out infinite alternate; }
.rachy-eyes { transform-box: fill-box; transform-origin: center; transform: translate(var(--rc-ex, 0px), var(--rc-ey, 0px)); transition: transform .25s ease-out; }
.rachy-eye { transform-box: fill-box; transform-origin: center; animation: rachyBlink 5.5s infinite; filter: drop-shadow(0 0 3px #7DF9FF); }
.rachy-eye + .rachy-eye { animation-delay: .04s; }
.rachy-tip { animation: rachyTip 2.4s ease-in-out infinite; }
.rachy-tip-glow { transform-box: fill-box; transform-origin: center; animation: rachyPulse 2.4s ease-in-out infinite; }
.rachy-arm { transform-box: view-box; transform-origin: 72px 70px; }
.rachy-launch:hover .rachy-arm, .rachy.is-nudge .rachy-launch .rachy-arm, .rachy-launch.is-hello .rachy-arm { animation: rachyWave 1.1s ease-in-out 2; }
@keyframes rachyFloat { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-5px); } }
@keyframes rachyShadow { 0%, 100% { transform: scale(1); opacity: .28; } 50% { transform: scale(.78); opacity: .16; } }
@keyframes rachyJet { from { transform: scaleY(.75); opacity: .65; } to { transform: scaleY(1.1); opacity: 1; } }
@keyframes rachyBlink { 0%, 93%, 100% { transform: scaleY(1); } 95.5% { transform: scaleY(.1); } }
@keyframes rachyTip { 0%, 100% { opacity: 1; } 50% { opacity: .45; } }
@keyframes rachyPulse { 0%, 100% { transform: scale(.8); opacity: .15; } 50% { transform: scale(1.35); opacity: .35; } }
@keyframes rachyWave { 0%, 100% { transform: rotate(0); } 25% { transform: rotate(-28deg); } 50% { transform: rotate(6deg); } 75% { transform: rotate(-22deg); } }
.rachy.is-thinking .rachy-eyes { animation: rachyScan 1.1s ease-in-out infinite; transition: none; }
@keyframes rachyScan { 0%, 100% { transform: translate(-3px, -1px); } 50% { transform: translate(3px, -1px); } }
.rachy.is-thinking .rachy-tip { animation-duration: .5s; }

/* ---- launcher: just the robot, with a glowing halo; its name slides out on hover */
.rachy-launch { position: relative; width: 84px; height: 92px; padding: 0; border: 0; background: none; cursor: pointer; display: block;
    animation: rachyIn .7s cubic-bezier(.2, .8, .2, 1) .9s both; -webkit-tap-highlight-color: transparent; }
.rachy-launch .rachy-bot { position: absolute; inset: 0; width: 100%; height: 100%; transition: transform .35s cubic-bezier(.2, .8, .2, 1); }
.rachy-launch:hover .rachy-bot, .rachy-launch:focus-visible .rachy-bot { transform: scale(1.06) rotate(-3deg); }
.rachy-halo { position: absolute; left: 50%; top: 46%; width: 74px; height: 74px; margin: -37px 0 0 -37px; border-radius: 50%;
    background: radial-gradient(circle, rgba(123, 60, 245, .38) 0%, rgba(255, 61, 154, .16) 45%, transparent 70%); animation: rachyHalo 3.4s ease-in-out infinite; }
@keyframes rachyHalo { 0%, 100% { transform: scale(.9); opacity: .8; } 50% { transform: scale(1.12); opacity: 1; } }
.rachy-label { position: absolute; left: calc(100% + .35rem); top: 50%; display: flex; flex-direction: column; gap: .2rem; padding: .55rem .9rem; border-radius: 14px;
    background: #0B0D22; color: #fff; text-align: left; white-space: nowrap; line-height: 1; box-shadow: 0 14px 30px -12px rgba(76, 58, 245, .6);
    border: 1px solid rgba(255, 255, 255, .12); opacity: 0; transform: translate(-8px, -50%); pointer-events: none; transition: opacity .25s, transform .35s cubic-bezier(.2, .8, .2, 1); }
.rachy-label strong { font: 800 .9rem/1 var(--font-heading, inherit); background: linear-gradient(90deg, #fff, #C9D6FF 60%, #FFC1E0); -webkit-background-clip: text; background-clip: text; color: transparent; }
.rachy-label small { font-size: .68rem; font-weight: 500; color: rgba(255, 255, 255, .65); }
.rachy-label .rachy-dot { width: 6px; height: 6px; margin-right: .3rem; }
.rachy--right .rachy-label { left: auto; right: calc(100% + .35rem); transform: translate(8px, -50%); }
.rachy-launch:hover .rachy-label, .rachy-launch:focus-visible .rachy-label { opacity: 1; transform: translate(0, -50%); }
.rachy.is-nudge .rachy-label { opacity: 0 !important; }
.rachy.is-open { z-index: 3000; }
.rachy.is-open .rachy-launch { animation: none; opacity: 0; visibility: hidden; pointer-events: none; }
.rachy-launch-text, .rachy-launch-spark { display: none; }
@keyframes rachyIn { from { opacity: 0; transform: translateY(16px) scale(.9); } to { opacity: 1; transform: none; } }
/* Over a button or link (e.g. the hero's Book a free call), the robot steps aside to the screen edge and peeks out; hover or focus brings it back.
   Uses translate, not transform, so it adds to the entrance animation instead of being overridden by it. */
.rachy-launch { transition: translate .4s cubic-bezier(.2, .8, .2, 1); }
.rachy.is-tucked .rachy-launch { translate: calc(-100% - 2rem + 30px) 0; }
.rachy--right.is-tucked .rachy-launch { translate: calc(100% + 2rem - 30px) 0; }
.rachy.is-tucked .rachy-launch:hover, .rachy.is-tucked .rachy-launch:focus-visible { translate: 0 0; }
@keyframes rachyFlow { 0% { background-position: 0% 50%; } 50% { background-position: 100% 50%; } 100% { background-position: 0% 50%; } }
@keyframes rachyFloat { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-3px); } }

/* ---- pop-ups: speech bubbles from the robot */
.rachy-nudge { position: relative; width: 264px; margin-left: .5rem; padding: .85rem 2.1rem .8rem 1rem; border-radius: 18px; background: #fff; color: var(--rc-ink);
    border: 1px solid rgba(123, 60, 245, .16); box-shadow: 0 24px 50px -18px rgba(15, 23, 42, .4); font-size: .86rem; line-height: 1.45; cursor: pointer;
    opacity: 0; visibility: hidden; transform: translateY(12px) scale(.92); transform-origin: bottom left; transition: opacity .3s, transform .45s cubic-bezier(.2, 1.3, .3, 1), visibility 0s linear .45s; }
.rachy-nudge::after { content: ''; position: absolute; left: 30px; bottom: -7px; width: 14px; height: 14px; background: #fff; border: solid rgba(123, 60, 245, .16); border-width: 0 1px 1px 0; transform: rotate(45deg); }
.rachy--right .rachy-nudge { margin: 0 .5rem 0 0; transform-origin: bottom right; }
.rachy--right .rachy-nudge::after { left: auto; right: 30px; }
.rachy.is-nudge .rachy-nudge { opacity: 1; visibility: visible; transform: none; transition: opacity .3s, transform .45s cubic-bezier(.2, 1.3, .3, 1); }
.rachy.is-open .rachy-nudge { display: none; }
/* The bubble waits while the robot is tucked at the screen edge or the footer is on screen (after .is-nudge, so it wins) */
.rachy.is-tucked .rachy-nudge, .rachy.is-at-footer .rachy-nudge { opacity: 0; visibility: hidden; pointer-events: none; }
.rachy-nudge strong { display: flex; align-items: center; gap: .35rem; font-size: .78rem; margin-bottom: .2rem; color: #4C1D95; }
.rachy-nudge strong em { font-style: normal; font-size: .58rem; font-weight: 800; letter-spacing: .06em; padding: .1rem .35rem; border-radius: 99px; color: #fff; background: var(--rc-grad); }
.rachy-nudge span { display: block; color: #334155; transition: opacity .25s; }
.rachy-nudge span.is-swap { opacity: 0; }
.rachy-nudge small { display: inline-flex; align-items: center; gap: .3rem; margin-top: .45rem; font-size: .72rem; font-weight: 700; color: var(--rc-violet); }
.rachy-nudge small::after { content: '→'; transition: transform .2s; }
.rachy-nudge:hover small::after { transform: translateX(3px); }
.rachy-nudge-x { position: absolute; top: .4rem; right: .4rem; width: 26px; height: 26px; border: 0; border-radius: 50%; background: transparent; color: #94A3B8; cursor: pointer; font-size: .8rem; }
.rachy-nudge-x:hover { background: #F1F5F9; color: var(--rc-ink); }

/* ---- panel */
.rachy-panel { position: fixed; left: 2rem; bottom: 2rem; width: 392px; height: min(640px, calc(100vh - 4rem)); display: flex; flex-direction: column;
    background: #fff; border-radius: 24px; overflow: hidden; color: var(--rc-ink);
    box-shadow: 0 40px 90px -30px rgba(15, 23, 42, .5), 0 0 0 1px rgba(15, 23, 42, .06);
    opacity: 0; visibility: hidden; transform: translateY(18px) scale(.97); transform-origin: bottom left;
    transition: opacity .25s, transform .4s cubic-bezier(.2, .8, .2, 1), visibility 0s linear .4s; }
.rachy--right .rachy-panel { left: auto; right: 2rem; transform-origin: bottom right; }
.rachy.is-open .rachy-panel { opacity: 1; visibility: visible; transform: none; transition: opacity .25s, transform .4s cubic-bezier(.2, .8, .2, 1); }

.rachy-head { position: relative; display: flex; align-items: center; gap: .7rem; padding: 1rem 1rem 1rem 1.1rem; color: #fff; background: #0B0D22; isolation: isolate; overflow: hidden; }
.rachy-head::before { content: ''; position: absolute; inset: 0; z-index: -1; opacity: .9;
    background: radial-gradient(120% 140% at 0% 0%, rgba(45, 91, 255, .7), transparent 55%), radial-gradient(120% 140% at 100% 100%, rgba(255, 61, 154, .55), transparent 55%), radial-gradient(80% 120% at 60% 0%, rgba(123, 60, 245, .6), transparent 60%); }
.rachy-bot--head { width: 46px; height: 48px; }
.rachy-head-text { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: .15rem; }
.rachy-head-text strong { font: 800 1.05rem/1.1 var(--font-heading, inherit); display: inline-flex; align-items: center; gap: .4rem; }
.rachy-head-text > span { font-size: .76rem; color: rgba(255, 255, 255, .78); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.rachy-badge { font-size: .62rem; font-weight: 800; letter-spacing: .08em; padding: .18rem .45rem; border-radius: 999px; background: rgba(255, 255, 255, .16); border: 1px solid rgba(255, 255, 255, .25); }
.rachy-dot { display: inline-block; width: 7px; height: 7px; margin-right: .4rem; border-radius: 50%; background: #2BE07A; box-shadow: 0 0 0 3px rgba(43, 224, 122, .25); vertical-align: 1px; }
.rachy-icon-btn { flex: none; width: 34px; height: 34px; border: 0; border-radius: 50%; background: rgba(255, 255, 255, .1); color: #fff; cursor: pointer; font-size: .9rem; transition: background .2s; }
.rachy-icon-btn:hover { background: rgba(255, 255, 255, .22); }

.rachy-log { flex: 1 1 auto; min-height: 0; overflow-y: auto; -webkit-overflow-scrolling: touch; touch-action: pan-y; overscroll-behavior: contain; padding: 1.1rem 1rem .6rem; display: flex; flex-direction: column; gap: .7rem; background: linear-gradient(180deg, #F7F8FF 0%, #fff 140px); scroll-behavior: smooth; }
.rachy-msg { display: flex; max-width: 88%; animation: rachyMsg .35s cubic-bezier(.2, .8, .2, 1) both; }
.rachy-msg--bot { align-self: flex-start; }
.rachy-msg--me { align-self: flex-end; }
@keyframes rachyMsg { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }
.rachy-bubble { padding: .7rem .9rem; border-radius: 16px 16px 16px 6px; background: #fff; border: 1px solid #E8EAF6; font-size: .9rem; line-height: 1.55; color: #1E293B; overflow-wrap: anywhere; box-shadow: 0 6px 16px -12px rgba(15, 23, 42, .25); }
.rachy-msg--me .rachy-bubble { border-radius: 16px 16px 6px 16px; border: 0; color: #fff; background: linear-gradient(135deg, #2D5BFF 0%, #7B3CF5 100%); box-shadow: 0 10px 20px -12px rgba(76, 58, 245, .7); }
.rachy-bubble p, .rachy-bubble li { font-size: inherit; line-height: inherit; color: inherit; }
.rachy-bubble p { margin: 0 0 .5rem; } .rachy-bubble p:last-child { margin: 0; }
.rachy-bubble ul, .rachy-bubble ol { margin: .2rem 0 .5rem; padding-left: 1.15rem; list-style: disc; }
.rachy-bubble ol { list-style: decimal; } .rachy-bubble li { margin: .15rem 0; }
.rachy-bubble a { color: var(--rc-violet); font-weight: 600; text-decoration: underline; text-underline-offset: 2px; }
.rachy-bubble strong { color: #0F172A; }
.rachy-bubble code { font-size: .82em; background: #F1F5F9; padding: .05rem .3rem; border-radius: 5px; }

.rachy-typing { display: inline-flex; align-items: center; gap: .55rem; color: var(--rc-muted); font-size: .82rem; }
.rachy-typing i { display: inline-flex; gap: 4px; } .rachy-typing b { width: 6px; height: 6px; border-radius: 50%; background: var(--rc-violet); animation: rachyDot 1.2s infinite ease-in-out; }
.rachy-typing b:nth-child(2) { animation-delay: .15s; background: #A24BE0; } .rachy-typing b:nth-child(3) { animation-delay: .3s; background: var(--rc-pink); }
@keyframes rachyDot { 0%, 80%, 100% { transform: translateY(0); opacity: .45; } 40% { transform: translateY(-4px); opacity: 1; } }

.rachy-quick, .rachy-actions, .rachy-suggest { display: flex; flex-wrap: wrap; gap: .45rem; }
.rachy-suggest { align-self: stretch; animation: rachyMsg .4s cubic-bezier(.2, .8, .2, 1) .15s both; }
.rachy-suggest::before { content: 'Suggested'; flex-basis: 100%; font-size: .66rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: #94A3B8; }
.rachy-suggest .rachy-chip { background: #F7F5FF; }
.rachy-suggest .rachy-chip::before { content: '↳ '; color: var(--rc-violet); }
.rachy-actions { margin-top: -.2rem; padding-left: .1rem; }
.rachy-chip { border: 1px solid rgba(123, 60, 245, .25); background: #fff; color: #4C1D95; font-family: inherit; font-weight: 600; font-size: .8rem; line-height: 1.2; padding: .5rem .8rem; border-radius: 999px; cursor: pointer; text-align: left; transition: background .2s, border-color .2s, transform .2s; }
.rachy-chip:hover { background: #F5F0FF; border-color: var(--rc-violet); transform: translateY(-1px); }
.rachy-act { display: inline-flex; align-items: center; gap: .45rem; padding: .55rem .9rem; border-radius: 999px; font-family: inherit; font-weight: 700; font-size: .8rem; line-height: 1; text-decoration: none !important; color: #fff !important; background: linear-gradient(135deg, #2D5BFF, #7B3CF5); box-shadow: 0 10px 20px -12px rgba(76, 58, 245, .8); transition: transform .2s; }
.rachy-act:hover { transform: translateY(-2px); }
.rachy-act--whatsapp { background: linear-gradient(135deg, #2BE07A, #128C7E); }
.rachy-act--page { background: #fff; color: #4C1D95 !important; border: 1px solid rgba(123, 60, 245, .3); box-shadow: none; }
.rachy-saved { align-self: center; font-size: .76rem; font-weight: 600; color: #047857; background: #ECFDF5; border: 1px solid #A7F3D0; padding: .35rem .7rem; border-radius: 999px; }

.rachy-form { display: flex; align-items: flex-end; gap: .5rem; margin: 0 .8rem; padding: .45rem .45rem .45rem .9rem; border: 1.5px solid #E2E8F0; border-radius: 18px; background: #fff; transition: border-color .2s, box-shadow .2s; }
.rachy-form:focus-within { border-color: var(--rc-violet); box-shadow: 0 0 0 4px rgba(123, 60, 245, .12); }
.rachy-input { flex: 1; border: 0; outline: 0; resize: none; font-family: inherit; font-weight: 400; font-size: .92rem; line-height: 1.45; color: var(--rc-ink); background: transparent; max-height: 120px; padding: .35rem 0; }
.rachy-send { flex: none; width: 38px; height: 38px; border: 0; border-radius: 12px; cursor: pointer; color: #fff; background: var(--rc-grad); font-size: .9rem; transition: transform .2s, opacity .2s; }
.rachy-send:disabled { opacity: .45; cursor: default; }
.rachy-send:not(:disabled):hover { transform: translateY(-1px) rotate(-6deg); }
.rachy-foot { margin: .45rem 0 .7rem; text-align: center; font-size: .7rem; color: #94A3B8; }
.rachy-foot a { color: #64748B; font-weight: 600; }

/* ---- phones: a round mascot button, full-screen chat */
/* ---- phones: the robot alone, full-screen chat */
@media (max-width: 640px) {
    .rachy { left: 1rem; bottom: calc(1rem + var(--wa-lift, 0px)); }
    .rachy--right { left: auto; right: 1rem; bottom: calc(1rem + 66px + var(--wa-lift, 0px)); }
    body:has(.rachy--right:not([hidden])) .back-to-top { bottom: calc(1rem + 132px + var(--wa-lift, 0px)) !important; right: calc(1rem + 2px) !important; }
    body:has(.sv-dock-nav.is-on) .rachy--left { bottom: calc(5rem + var(--wa-lift, 0px)); }
    .rachy--no-phone { display: none !important; }
    .rachy-launch { width: 66px; height: 72px; }
    /* no stepping aside on phones: it made the robot jump in and out while scrolling */
    .rachy.is-tucked .rachy-launch, .rachy--right.is-tucked .rachy-launch { translate: none; }
    .rachy-label { display: none; }
    .rachy-halo { width: 58px; height: 58px; margin: -29px 0 0 -29px; }
    .rachy-nudge { width: min(260px, calc(100vw - 2rem)); }
    .rachy-panel, .rachy--right .rachy-panel { inset: 0; left: 0; right: 0; bottom: 0; width: 100%; height: 100%; height: 100dvh; border-radius: 0; transform: translateY(30px); }
    .rachy-input { font-size: 16px; } /* stops iOS zooming in */
    html:has(body.rachy-open), body.rachy-open { overflow: hidden; }
}
@media (prefers-reduced-motion: reduce) {
    .rachy *, .rachy *::before, .rachy *::after { animation: none !important; transition-duration: .01s !important; }
}

/* ---------- "Ask Rachy AI" section at the end of pages (includes/ask_rachy.html) ---------- */
.ask-rachy { position: relative; padding: clamp(4.5rem, 9vw, 7rem) 0; overflow: hidden; color: #fff; background: #07051A; isolation: isolate; }
.ask-rachy::before { content: ''; position: absolute; inset: 0; z-index: -1; pointer-events: none;
    background: radial-gradient(55% 60% at 8% 0%, rgba(109, 40, 217, .42), transparent 70%), radial-gradient(50% 55% at 100% 100%, rgba(219, 39, 119, .28), transparent 70%); }
.ask-rachy-wrap { position: relative; display: grid; grid-template-columns: 1.05fr .95fr; gap: clamp(2rem, 5vw, 4.5rem); align-items: center; }
.ask-rachy-kick { display: inline-flex; align-items: center; gap: .6rem; font-size: .78rem; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; color: #C4B5FD; }
.ask-rachy-kick::before { content: ''; width: 28px; height: 2px; border-radius: 2px; background: linear-gradient(110deg, #8B5CF6, #EC4899 55%, #FB923C); }
.ask-rachy h2 { margin: .9rem 0 0; font-family: var(--font-heading, inherit); font-size: clamp(2rem, 4.2vw, 3.2rem); line-height: 1.05; letter-spacing: -.035em; color: #fff; }
.ask-rachy-grad { background: linear-gradient(120deg, #C4B5FD, #F9A8D4 55%, #FDBA74); -webkit-background-clip: text; background-clip: text; color: transparent; }
.ask-rachy-copy p { max-width: 520px; margin: 1.1rem 0 0; font-size: 1.05rem; line-height: 1.65; color: rgba(226, 232, 255, .72); }
.ask-rachy-ticks { display: flex; flex-wrap: wrap; gap: .5rem 1.4rem; margin: 1.6rem 0 0; padding: 0; list-style: none; color: rgba(226, 232, 255, .8); font-size: .92rem; font-weight: 600; }
.ask-rachy-ticks i { color: #F9A8D4; margin-right: .35rem; }
.ask-rachy-card { position: relative; padding: 1.4rem; border-radius: 28px; background: linear-gradient(160deg, rgba(255, 255, 255, .09), rgba(255, 255, 255, .03));
    border: 1px solid rgba(255, 255, 255, .14); box-shadow: 0 40px 80px -40px rgba(76, 29, 149, .9), inset 0 1px 0 rgba(255, 255, 255, .1); }
.ask-rachy-card::before { content: ''; position: absolute; inset: -1px; z-index: -1; border-radius: inherit; background: linear-gradient(135deg, #4CC6FF, #7B3CF5 45%, #FF3D9A);
    opacity: .35; filter: blur(22px); will-change: transform; transform: translateZ(0); }
.ask-rachy-head { display: flex; align-items: center; gap: .8rem; }
.ask-rachy-bot { flex: none; width: 66px; height: 72px; will-change: transform; transform: translateZ(0); }
.ask-rachy-bot svg { width: 100%; height: 100%; overflow: visible; }
.ask-rachy-head strong { display: flex; align-items: center; gap: .4rem; color: #fff; font-family: var(--font-heading, inherit); font-size: 1.1rem; }
.ask-rachy-head strong em { font-style: normal; font-size: .62rem; font-weight: 800; letter-spacing: .06em; padding: .12rem .4rem; border-radius: 99px; background: linear-gradient(135deg, #2D5BFF, #FF3D9A); }
.ask-rachy-head small { display: flex; align-items: center; gap: .35rem; margin-top: .2rem; font-size: .8rem; color: rgba(226, 232, 255, .7); }
.ask-rachy-head small i { width: 7px; height: 7px; border-radius: 50%; background: #2BE07A; box-shadow: 0 0 0 3px rgba(43, 224, 122, .25); }
.ask-rachy-bubble { margin: 1.1rem 0 1rem; padding: .9rem 1.05rem; border-radius: 18px 18px 18px 6px; background: rgba(255, 255, 255, .95); color: #1E293B; font-size: .93rem; line-height: 1.55; }
.ask-rachy-form { display: flex; align-items: center; gap: .5rem; padding: .4rem .4rem .4rem 1.1rem; border-radius: 18px; background: #0B0D22; border: 1.5px solid rgba(255, 255, 255, .16);
    transition: border-color .2s, box-shadow .2s; will-change: transform; transform: translateZ(0); }
.ask-rachy-form:focus-within { border-color: #A78BFA; box-shadow: 0 0 0 4px rgba(167, 139, 250, .2); }
.ask-rachy-form input { flex: 1; min-width: 0; border: 0; outline: 0; background: transparent; color: #fff; font-family: inherit; font-size: 1rem; font-weight: 500; padding: .55rem 0; }
.ask-rachy-form input::placeholder { color: rgba(226, 232, 255, .55); }
.ask-rachy-form button { flex: none; width: 44px; height: 44px; border: 0; border-radius: 13px; color: #fff; cursor: pointer; background: linear-gradient(135deg, #4CC6FF, #2D5BFF 35%, #7B3CF5 68%, #FF3D9A); transition: transform .2s; }
.ask-rachy-form button:hover { transform: translateY(-2px) rotate(-6deg); }
.ask-rachy-chips { display: flex; flex-wrap: wrap; gap: .45rem; margin-top: .9rem; }
.ask-rachy-chips button { border: 1px solid rgba(255, 255, 255, .18); background: rgba(255, 255, 255, .06); color: #E9E5FF; font-family: inherit; font-size: .82rem; font-weight: 600; padding: .5rem .8rem; border-radius: 999px; cursor: pointer; text-align: left; transition: background .2s, border-color .2s, transform .2s; }
.ask-rachy-chips button:hover { background: rgba(167, 139, 250, .2); border-color: #A78BFA; transform: translateY(-1px); }
.ask-rachy.is-idle .ask-rachy-bot *, .ask-rachy.is-idle .ask-rachy-bot *::before { animation-play-state: paused !important; }
.ask-rv { opacity: 0; transform: translateY(24px); transition: opacity .8s ease, transform .9s cubic-bezier(.16, 1, .3, 1); }
.ask-rv + .ask-rv { transition-delay: .12s; }
.ask-rv.is-in { opacity: 1; transform: none; }
@media (max-width: 900px) { .ask-rachy-wrap { grid-template-columns: 1fr; } }
@media (max-width: 600px) { .ask-rachy-card { padding: 1.1rem; border-radius: 22px; } .ask-rachy-form input { font-size: 16px; } }
@media (prefers-reduced-motion: reduce) { .ask-rv { opacity: 1; transform: none; transition: none; } }

/* ---------- Premium chat details ---------- */
/* replies appear word by word */
.rachy-w { opacity: 0; filter: blur(3px); animation: rachyWord .32s ease-out forwards; }
@keyframes rachyWord { to { opacity: 1; filter: none; } }

/* copy and thumbs under each answer */
.rachy-msg--bot { flex-direction: column; align-items: flex-start; }
.rachy-tools { display: flex; gap: .15rem; margin: .3rem 0 0 .2rem; opacity: 0; transform: translateY(-3px); animation: rachyToolsIn .35s ease .1s forwards; }
@keyframes rachyToolsIn { to { opacity: 1; transform: none; } }
.rachy-tools button { width: 28px; height: 28px; border: 0; border-radius: 8px; background: transparent; color: #94A3B8; cursor: pointer; font-size: .78rem; transition: background .2s, color .2s, transform .2s; }
.rachy-tools button:hover { background: #F1F0FB; color: var(--rc-violet); }
.rachy-tools button.is-on { color: var(--rc-violet); background: #F3EEFF; }
.rachy-tools button.is-on i { font-weight: 900; }
.rachy-tools.is-rated button[data-t="up"]:not(.is-on), .rachy-tools.is-rated button[data-t="down"]:not(.is-on) { opacity: .45; }
.rachy-tools.is-rated button[data-t="up"]:not(.is-on):hover, .rachy-tools.is-rated button[data-t="down"]:not(.is-on):hover { opacity: 1; }
.rachy-tools button.is-pop { animation: rachyPop .45s cubic-bezier(.2, 1.6, .4, 1); }
@keyframes rachyPop { 0% { transform: scale(1); } 40% { transform: scale(1.35) rotate(-8deg); } 100% { transform: scale(1); } }

/* failed message: try again */
.rachy-msg--err .rachy-bubble { border-color: #FECACA; background: #FFF7F7; }
.rachy-retry { margin: .45rem 0 0 .1rem; border: 1px solid rgba(123, 60, 245, .3); background: #fff; color: #5B21B6; border-radius: 999px; padding: .4rem .8rem; font-family: inherit; font-size: .78rem; font-weight: 700; cursor: pointer; }
.rachy-retry:hover { background: #F5F0FF; }

/* "New chat" confirmation pop-up */
.rachy-confirm { position: absolute; inset: 0; z-index: 20; display: grid; place-items: center; padding: 1.2rem; background: rgba(11, 13, 34, .45); opacity: 0; transition: opacity .2s ease; }
.rachy-confirm[hidden] { display: none; }
.rachy-confirm.is-on { opacity: 1; }
.rachy-confirm-card { width: 100%; max-width: 300px; padding: 1.4rem 1.3rem 1.2rem; border-radius: 22px; background: #fff; text-align: center;
    box-shadow: 0 30px 70px -20px rgba(15, 23, 42, .55); transform: translateY(14px) scale(.94); transition: transform .35s cubic-bezier(.2, 1.3, .3, 1); }
.rachy-confirm.is-on .rachy-confirm-card { transform: none; }
.rachy-confirm-ic { display: inline-grid; place-items: center; width: 52px; height: 52px; border-radius: 16px; color: #fff; font-size: 1.15rem; background: var(--rc-grad); box-shadow: 0 12px 24px -10px rgba(123, 60, 245, .7); }
.rachy-confirm h3 { margin: .85rem 0 .35rem; font: 800 1.12rem/1.2 var(--font-heading, inherit); color: var(--rc-ink); }
.rachy-confirm p { margin: 0 0 1.1rem; font-size: .86rem; line-height: 1.5; color: #64748B; }
.rachy-confirm-actions { display: flex; gap: .5rem; }
.rachy-btn { flex: 1; border: 0; border-radius: 12px; padding: .7rem .6rem; font-family: inherit; font-size: .84rem; font-weight: 700; cursor: pointer; transition: transform .2s, background .2s; }
.rachy-btn:hover { transform: translateY(-1px); }
.rachy-btn--ghost { background: #F1F5F9; color: #334155; }
.rachy-btn--ghost:hover { background: #E2E8F0; }
.rachy-btn--danger { color: #fff; background: linear-gradient(135deg, #7B3CF5, #FF3D9A); box-shadow: 0 10px 20px -10px rgba(255, 61, 154, .7); }

/* little notices */
.rachy-toast { position: absolute; left: 50%; bottom: 5.4rem; z-index: 25; transform: translate(-50%, 10px); padding: .5rem .9rem; border-radius: 999px; background: #0B0D22; color: #fff;
    font-size: .8rem; font-weight: 600; white-space: nowrap; box-shadow: 0 12px 26px -10px rgba(15, 23, 42, .6); opacity: 0; pointer-events: none; transition: opacity .25s, transform .35s cubic-bezier(.2, 1.3, .3, 1); }
.rachy-toast.is-on { opacity: 1; transform: translate(-50%, 0); }

/* bigger window on desktop */
.rachy.is-wide .rachy-panel { width: min(620px, calc(100vw - 4rem)); height: min(820px, calc(100vh - 4rem)); }
.rachy-panel { transition: opacity .25s, transform .4s cubic-bezier(.2, .8, .2, 1), visibility 0s linear .4s, width .35s cubic-bezier(.2, .8, .2, 1), height .35s cubic-bezier(.2, .8, .2, 1); }

/* voice input */
.rachy-mic { flex: none; width: 34px; height: 34px; margin-bottom: 2px; border: 0; border-radius: 10px; background: #F1F0FB; color: #6D28D9; cursor: pointer; font-size: .85rem; transition: background .2s, color .2s; }
.rachy-mic[hidden] { display: none; }
.rachy-mic:hover { background: #E9E2FF; }
.rachy-mic.is-rec { color: #fff; background: #E11D48; animation: rachyRec 1.2s ease-in-out infinite; }
@keyframes rachyRec { 0%, 100% { box-shadow: 0 0 0 0 rgba(225, 29, 72, .45); } 50% { box-shadow: 0 0 0 7px rgba(225, 29, 72, 0); } }
.rachy-form:has(.rachy-mic:not([hidden])) { padding-left: .45rem; }

/* unread reply badge on the robot */
.rachy-unread { position: absolute; top: 4px; right: 6px; z-index: 2; min-width: 20px; height: 20px; padding: 0 5px; border-radius: 999px; background: #FF3D9A; color: #fff;
    font-size: .7rem; font-weight: 800; line-height: 20px; text-align: center; box-shadow: 0 0 0 3px #fff; transform: scale(0); transition: transform .35s cubic-bezier(.2, 1.6, .4, 1); }
.rachy-unread.is-on { transform: scale(1); }

@media (max-width: 640px) { .rachy-only-desktop { display: none; } .rachy-toast { bottom: 6.2rem; } }
@media (prefers-reduced-motion: reduce) { .rachy-w { opacity: 1; filter: none; animation: none; } }

/* welcome tiles (new chat) */
.rachy-tiles { display: grid; grid-template-columns: 1fr 1fr; gap: .5rem; margin-top: .2rem; }
.rachy-tiles-title { grid-column: 1 / -1; margin: .2rem 0 0; font-size: .66rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; color: #94A3B8; }
.rachy-tile { display: flex; flex-direction: column; align-items: flex-start; gap: .55rem; padding: .8rem .85rem; border-radius: 16px; border: 1px solid #ECE9F8; background: #fff;
    color: #1E1B4B; font-family: inherit; font-size: .82rem; font-weight: 600; line-height: 1.35; text-align: left; cursor: pointer;
    box-shadow: 0 6px 16px -14px rgba(76, 29, 149, .5); transition: transform .25s cubic-bezier(.2, .8, .2, 1), border-color .2s, box-shadow .25s; }
.rachy-tile i { display: inline-grid; place-items: center; width: 30px; height: 30px; border-radius: 10px; font-size: .78rem; color: #fff; background: var(--rc-grad); }
.rachy-tile:hover { transform: translateY(-2px); border-color: #C4B5FD; box-shadow: 0 14px 26px -16px rgba(123, 60, 245, .6); }
.rachy-tile:nth-of-type(1) { animation: rachyMsg .4s ease .05s both; } .rachy-tile:nth-of-type(2) { animation: rachyMsg .4s ease .12s both; }
.rachy-tile:nth-of-type(3) { animation: rachyMsg .4s ease .19s both; } .rachy-tile:nth-of-type(4) { animation: rachyMsg .4s ease .26s both; }

/* the pages an answer is based on */
.rachy-sources { display: flex; flex-wrap: wrap; align-items: center; gap: .3rem; margin: .4rem 0 0 .15rem; font-size: .72rem; animation: rachyToolsIn .35s ease forwards; }
.rachy-sources span { color: #16A34A; font-weight: 700; margin-right: .1rem; }
.rachy-sources a { padding: .2rem .55rem; border-radius: 999px; background: #F5F3FF; border: 1px solid #E9E2FF; color: #5B21B6 !important; font-weight: 600; text-decoration: none !important; }
.rachy-sources a:hover { background: #EDE9FE; }
.rachy .rachy-input:focus, .rachy .rachy-input:focus-visible { outline: none !important; box-shadow: none !important; border: 0 !important; }

/* header status while Rachy works */
.rachy-dot--busy { background: #FBBF24 !important; box-shadow: 0 0 0 3px rgba(251, 191, 36, .3) !important; animation: rachyBusy 1s ease-in-out infinite; }
@keyframes rachyBusy { 50% { opacity: .35; } }

/* in-chat contact card */
.rachy-act--form { border: 0; cursor: pointer; font-family: inherit; background: linear-gradient(135deg, #7B3CF5, #FF3D9A); }
.rachy-act--form:disabled { opacity: .5; cursor: default; }
.rachy-card-form { display: flex; flex-direction: column; gap: .5rem; padding: 1rem; border-radius: 18px; background: #fff; border: 1px solid #E9E2FF;
    box-shadow: 0 16px 34px -20px rgba(76, 29, 149, .55); animation: rachyMsg .35s cubic-bezier(.2, .8, .2, 1) both; }
.rachy-card-form strong { font-size: .92rem; color: var(--rc-ink); } .rachy-card-form strong i { color: var(--rc-violet); margin-right: .3rem; }
.rachy-card-form small { margin-top: -.3rem; font-size: .74rem; color: #64748B; }
.rachy-card-form input { width: 100%; padding: .6rem .75rem; border: 1.5px solid #E2E8F0; border-radius: 11px; font-family: inherit; font-size: .88rem; outline: 0; transition: border-color .2s, box-shadow .2s; }
.rachy-card-form input:focus { border-color: var(--rc-violet); box-shadow: 0 0 0 3px rgba(123, 60, 245, .12); }
.rachy-card-form.is-bad input:invalid { border-color: #F87171; }
.rachy-card-form > div { display: flex; gap: .45rem; margin-top: .2rem; }
@media (max-width: 640px) { .rachy-card-form input { font-size: 16px; } }

/* tooltips on the answer tools */
.rachy-tools button { position: relative; }
.rachy-tools button::after { content: attr(data-tip); position: absolute; left: 50%; bottom: calc(100% + 6px); transform: translate(-50%, 4px); padding: .3rem .5rem; border-radius: 7px;
    background: #0B0D22; color: #fff; font-size: .68rem; font-weight: 600; white-space: nowrap; opacity: 0; pointer-events: none; transition: opacity .15s, transform .2s; }
.rachy-tools button:hover::after { opacity: 1; transform: translate(-50%, 0); }
.rachy-tools button[data-t="regen"]:hover i { animation: rachySpin .6s ease; }
@keyframes rachySpin { to { transform: rotate(360deg); } }

/* "What went wrong?" after a thumbs down */
.rachy-why { display: flex; flex-wrap: wrap; align-items: center; gap: .35rem; margin: .45rem 0 0 .15rem; animation: rachyMsg .3s ease both; }
.rachy-why span { flex-basis: 100%; font-size: .72rem; font-weight: 700; color: #64748B; }
.rachy-why button { border: 1px solid #FBCFE8; background: #FFF5FA; color: #9D174D; border-radius: 999px; padding: .32rem .7rem; font-family: inherit; font-size: .74rem; font-weight: 700; cursor: pointer; transition: background .2s; }
.rachy-why button:hover { background: #FCE7F3; }
.rachy-panel { overscroll-behavior: contain; }

/* =====================  Premium motion (transform / opacity only, so it stays smooth)  ===================== */

/* opening: the chat springs out of the robot, then its parts arrive one after another */
.rachy-panel { transform: translateY(26px) scale(.86); }
.rachy.is-open .rachy-panel { transition: opacity .22s ease, transform .55s cubic-bezier(.2, 1.25, .3, 1), width .35s cubic-bezier(.2, .8, .2, 1), height .35s cubic-bezier(.2, .8, .2, 1); }
.rachy.is-opening .rachy-head > *,
.rachy.is-opening .rachy-log > *,
.rachy.is-opening .rachy-form,
.rachy.is-opening .rachy-foot { animation: rachyRise .55s cubic-bezier(.2, 1, .3, 1) both; }
.rachy.is-opening .rachy-head > :nth-child(2) { animation-delay: .06s; }
.rachy.is-opening .rachy-head > :nth-child(n+3) { animation-delay: .1s; }
.rachy.is-opening .rachy-log > :nth-child(1) { animation-delay: .12s; }
.rachy.is-opening .rachy-log > :nth-child(2) { animation-delay: .18s; }
.rachy.is-opening .rachy-log > :nth-child(n+3) { animation-delay: .22s; }
.rachy.is-opening .rachy-form { animation-delay: .2s; }
.rachy.is-opening .rachy-foot { animation-delay: .26s; }
@keyframes rachyRise { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: none; } }

/* header: a slow drifting aurora (runs only while the chat is open) */
.rachy-head::after { content: ''; position: absolute; z-index: -1; left: -30%; top: -120%; width: 160%; height: 340%; pointer-events: none; will-change: transform;
    background: radial-gradient(circle at 25% 50%, rgba(76, 198, 255, .38), transparent 32%), radial-gradient(circle at 70% 45%, rgba(255, 61, 154, .34), transparent 30%),
                radial-gradient(circle at 50% 60%, rgba(123, 60, 245, .4), transparent 36%);
    animation: rachyAurora 10s ease-in-out infinite alternate; }
@keyframes rachyAurora { 0% { transform: translate3d(-6%, 0, 0) rotate(0deg); } 50% { transform: translate3d(5%, 4%, 0) rotate(8deg); } 100% { transform: translate3d(-2%, -3%, 0) rotate(-6deg); } }
.rachy:not(.is-open) .rachy-head::after { animation-play-state: paused; }

/* messages: visitor slides in from the right, Rachy from the left */
.rachy-msg--me { animation-name: rachyMeIn; animation-duration: .45s; animation-timing-function: cubic-bezier(.2, 1.3, .3, 1); }
.rachy-msg--bot { animation-name: rachyBotIn; animation-duration: .45s; animation-timing-function: cubic-bezier(.2, 1.1, .3, 1); }
@keyframes rachyMeIn { from { opacity: 0; transform: translate3d(22px, 6px, 0) scale(.94); } to { opacity: 1; transform: none; } }
@keyframes rachyBotIn { from { opacity: 0; transform: translate3d(-16px, 6px, 0) scale(.97); } to { opacity: 1; transform: none; } }
.rachy-msg--me .rachy-bubble { transform-origin: bottom right; }

/* suggestion chips and action buttons pop in one by one */
.rachy-suggest .rachy-chip, .rachy-actions > * { animation: rachyChipIn .45s cubic-bezier(.2, 1.4, .3, 1) both; }
.rachy-suggest .rachy-chip:nth-of-type(2), .rachy-actions > :nth-child(2) { animation-delay: .07s; }
.rachy-suggest .rachy-chip:nth-of-type(3), .rachy-actions > :nth-child(3) { animation-delay: .14s; }
@keyframes rachyChipIn { from { opacity: 0; transform: translateY(8px) scale(.9); } to { opacity: 1; transform: none; } }

/* thinking: shimmering label and skeleton lines */
.rachy-typing span { background: linear-gradient(90deg, #94A3B8 0%, #7B3CF5 40%, #FF3D9A 55%, #94A3B8 80%); background-size: 220% 100%;
    -webkit-background-clip: text; background-clip: text; color: transparent; font-weight: 600; animation: rachyShimmerText 1.8s linear infinite; }
@keyframes rachyShimmerText { from { background-position: 120% 0; } to { background-position: -120% 0; } }
.rachy-skel { display: flex; flex-direction: column; gap: .4rem; margin-top: .6rem; }
.rachy-skel i { position: relative; display: block; height: 8px; border-radius: 6px; background: #EEF0F8; overflow: hidden; }
.rachy-skel i:nth-child(1) { width: 92%; } .rachy-skel i:nth-child(2) { width: 74%; } .rachy-skel i:nth-child(3) { width: 48%; }
.rachy-skel i::after { content: ''; position: absolute; inset: 0; transform: translateX(-100%); will-change: transform;
    background: linear-gradient(90deg, transparent, rgba(123, 60, 245, .16), transparent); animation: rachySkel 1.3s ease-in-out infinite; }
.rachy-skel i:nth-child(2)::after { animation-delay: .12s; } .rachy-skel i:nth-child(3)::after { animation-delay: .24s; }
@keyframes rachySkel { to { transform: translateX(100%); } }
.rachy-msg--typing .rachy-bubble { min-width: 210px; }

/* send button: the arrow flies off */
.rachy-send i { display: inline-block; }
.rachy-send.is-sent i { animation: rachyFly .55s cubic-bezier(.4, 0, .2, 1); }
@keyframes rachyFly { 0% { transform: none; opacity: 1; } 45% { transform: translate3d(0, -26px, 0) scale(.6); opacity: 0; } 46% { transform: translate3d(0, 18px, 0); opacity: 0; } 100% { transform: none; opacity: 1; } }
.rachy-form:focus-within { animation: rachyFocus .5s ease; }
@keyframes rachyFocus { 0% { box-shadow: 0 0 0 0 rgba(123, 60, 245, .35); } 100% { box-shadow: 0 0 0 4px rgba(123, 60, 245, .12); } }

/* jump to the latest message */
.rachy-down { position: absolute; left: 50%; bottom: 7.4rem; z-index: 15; display: inline-flex; align-items: center; gap: .35rem; padding: .45rem .8rem; border: 0; border-radius: 999px;
    background: #0B0D22; color: #fff; font-family: inherit; font-size: .75rem; font-weight: 700; cursor: pointer; box-shadow: 0 12px 26px -10px rgba(15, 23, 42, .6);
    transform: translate(-50%, 12px) scale(.9); opacity: 0; pointer-events: none; transition: transform .35s cubic-bezier(.2, 1.3, .3, 1), opacity .2s; }
.rachy-down.is-on { transform: translate(-50%, 0); opacity: 1; pointer-events: auto; }
.rachy-down i { animation: rachyNudgeDown 1.4s ease-in-out infinite; }
@keyframes rachyNudgeDown { 50% { transform: translateY(2px); } }

/* confetti when a visitor shares their details */
.rachy-confetti { position: absolute; left: 50%; top: 45%; z-index: 30; width: 8px; height: 12px; border-radius: 2px; pointer-events: none; will-change: transform, opacity;
    animation: rachyConfetti 1.15s cubic-bezier(.2, .7, .3, 1) forwards; }
@keyframes rachyConfetti { 0% { transform: translate3d(0, 0, 0) rotate(0) scale(.6); opacity: 1; }
    100% { transform: translate3d(var(--dx), var(--dy), 0) rotate(var(--r)) scale(1); opacity: 0; } }
.rachy-saved { animation: rachyChipIn .5s cubic-bezier(.2, 1.4, .3, 1) both; }

/* unread badge: a soft ripple */
.rachy-unread.is-on::after { content: ''; position: absolute; inset: 0; border-radius: inherit; border: 2px solid #FF3D9A; animation: rachyRipple 1.6s ease-out infinite; }
@keyframes rachyRipple { from { transform: scale(1); opacity: .8; } to { transform: scale(2.1); opacity: 0; } }

.rachy-unread::before { content: attr(data-count); }  /* digit drawn by CSS: not counted as button text (::after is the ripple) */