/* Quick Contact v1 — isolated styles; hosted with each site on Jino. */
#quick-contact-root { --qc-accent:#df282a; --qc-ink:#16202e; --qc-muted:#586373; font-family:Arial,Helvetica,sans-serif; }
#quick-contact-root, #quick-contact-root * { box-sizing:border-box; }
#quick-contact-root .qc-trigger {
  position:fixed; bottom:calc(22px + env(safe-area-inset-bottom, 0px)); right:22px;
  z-index:10500; display:inline-flex; align-items:center; gap:12px; border:1px solid rgba(255,255,255,.32);
  padding:9px 20px 9px 10px; min-height:57px; border-radius:32px; background:var(--qc-accent);
  color:#fff; box-shadow:0 8px 28px rgba(0,0,0,.34),0 0 0 0 rgba(223,40,42,.35);
  font-family:inherit; font-size:16px; font-weight:700; cursor:pointer;
  transition:transform .15s ease,box-shadow .2s ease;
}
#quick-contact-root .qc-trigger:hover { transform:translateY(-2px); box-shadow:0 12px 32px rgba(0,0,0,.4); }
#quick-contact-root .qc-trigger:focus-visible,
#quick-contact-root .qc-close:focus-visible,
#quick-contact-root .qc-submit:focus-visible,
#quick-contact-root .qc-call:focus-visible { outline:3px solid #efc85d; outline-offset:3px; }
#quick-contact-root .qc-trigger-icon {
  display:grid; width:38px; height:38px; place-items:center; background:rgba(255,255,255,.18);
  border-radius:50%; flex:none;
}
#quick-contact-root .qc-overlay { position:fixed; inset:0; z-index:10501; display:flex; align-items:flex-end; justify-content:flex-end; padding:20px; }
#quick-contact-root .qc-overlay[hidden] { display:none!important; }
#quick-contact-root .qc-backdrop { position:absolute; inset:0; background:rgba(5,11,20,.68); backdrop-filter:blur(5px); }
#quick-contact-root .qc-dialog {
  position:relative; z-index:1; width:min(430px,100%); max-height:min(740px,calc(100dvh - 40px));
  overflow:auto; overscroll-behavior:contain; padding:0!important; margin:0!important; background:#fff; color:var(--qc-ink); border-radius:22px;
  box-shadow:0 24px 75px rgba(0,0,0,.45); font-family:inherit; font-size:15px; line-height:1.45;
  transform:translateY(18px); opacity:0; transition:transform .22s ease,opacity .22s ease;
}
#quick-contact-root .qc-dialog.qc-visible { transform:translateY(0); opacity:1; }
#quick-contact-root .qc-head {
  background:var(--qc-accent); color:#fff; padding:22px 22px 19px;
  display:flex; align-items:flex-start; justify-content:space-between; gap:14px;
}
#quick-contact-root .qc-eyebrow { display:block; font-size:12px; letter-spacing:.06em; opacity:.87; margin-bottom:6px; }
#quick-contact-root .qc-head h2 { font:700 25px/1.2 Arial,Helvetica,sans-serif; color:#fff; padding:0; margin:0; }
#quick-contact-root .qc-close {
  background:rgba(255,255,255,.2); border:0; border-radius:50%; color:#fff;
  font:30px/1 Arial,Helvetica,sans-serif; cursor:pointer; width:40px; height:40px; flex:none;
}
#quick-contact-root .qc-content { padding:20px 22px 22px; }
#quick-contact-root .qc-intro {
  margin:0 0 16px; background:#f1f3f6; border-radius:14px; padding:12px 14px;
  font-size:15px; line-height:1.45; color:#333b49;
}
#quick-contact-root .qc-form { display:grid; gap:8px; }
#quick-contact-root .qc-form label {
  color:var(--qc-ink); font:600 13px/1.25 Arial,Helvetica,sans-serif;
  margin:5px 0 0; padding:0;
}
#quick-contact-root .qc-form textarea, #quick-contact-root .qc-form input:not(.qc-trap) {
  display:block; width:100%; min-height:46px; border:1px solid #d4d9e1; background:#f7f8fb; color:#202938;
  padding:12px 13px; border-radius:12px; font:15px/1.35 Arial,Helvetica,sans-serif;
  outline:none; box-shadow:none; margin:0; transition:border-color .15s ease;
}
#quick-contact-root .qc-form textarea { resize:vertical; min-height:82px; max-height:210px; }
#quick-contact-root .qc-form textarea:focus, #quick-contact-root .qc-form input:focus {
  border-color:var(--qc-accent); background:#fff; box-shadow:0 0 0 3px rgba(223,40,42,.11);
}
#quick-contact-root .qc-form input::placeholder,#quick-contact-root .qc-form textarea::placeholder { color:#788395; }
#quick-contact-root .qc-form .qc-trap { position:absolute!important; left:-20000px!important; height:1px!important; width:1px!important; opacity:0!important; }
#quick-contact-root .qc-submit {
  margin-top:9px; width:100%; min-height:52px; border:0; border-radius:12px;
  background:var(--qc-accent); color:#fff; font:700 16px/1.2 Arial,Helvetica,sans-serif; cursor:pointer;
  display:flex; justify-content:center; align-items:center; gap:10px;
}
#quick-contact-root .qc-submit:hover { filter:brightness(.92); }
#quick-contact-root .qc-submit:disabled { opacity:.55; cursor:wait; }
#quick-contact-root .qc-status { min-height:16px; font:13px/1.35 Arial,Helvetica,sans-serif; color:#536070; }
#quick-contact-root .qc-status[data-state="success"] { color:#166534; font-weight:700; }
#quick-contact-root .qc-status[data-state="error"] { color:#a10e24; font-weight:700; }
#quick-contact-root .qc-separator {
  display:flex; align-items:center; gap:12px; margin:8px 0 13px; color:#758091; font-size:12px;
}
#quick-contact-root .qc-separator:before,#quick-contact-root .qc-separator:after { content:""; height:1px; background:#dce1e8; flex:1; }
#quick-contact-root .qc-call {
  width:100%; display:flex; align-items:center; justify-content:center; gap:10px; min-height:45px;
  border:1px solid #e0e4eb; border-radius:12px; background:#f8fafc; text-decoration:none!important;
  color:#242e3d; font:600 15px/1.2 Arial,Helvetica,sans-serif;
}
#quick-contact-root .qc-call:hover { background:#eef2f6; }
body.qc-lock-scroll { overflow:hidden!important; }
@media(max-width:620px) {
  #quick-contact-root .qc-trigger {
    right:14px; bottom:calc(15px + env(safe-area-inset-bottom,0px));
    min-height:56px; padding:8px 16px 8px 8px; font-size:15px;
  }
  #quick-contact-root .qc-overlay { padding:0; align-items:flex-end; }
  #quick-contact-root .qc-dialog {
    width:100%; max-width:none; max-height:calc(100dvh - env(safe-area-inset-top,0px) - 12px);
    border-radius:19px 19px 0 0; padding-bottom:env(safe-area-inset-bottom,0px);
  }
  #quick-contact-root .qc-content { padding:16px 18px 20px; }
  #quick-contact-root .qc-head { padding:17px 18px 15px; }
  #quick-contact-root .qc-head h2 { font-size:23px; }
}
@media(prefers-reduced-motion:reduce) {
  #quick-contact-root *,#quick-contact-root *:before,#quick-contact-root *:after { transition:none!important; animation:none!important; }
}


/* Attention, variant A: brief 'shake off droplets' movement + soft halo.
   6s after entering a page, then at most twice more per tab.
   Only the call-to-action moves; it never opens the form automatically. */
#quick-contact-root .qc-trigger::after {
  content:""; position:absolute; inset:-4px; border-radius:inherit;
  border:2px solid rgba(255,255,255,.65); opacity:0;
  transform:scale(.95); pointer-events:none;
}
#quick-contact-root .qc-trigger.qc-attention {
  animation:qc-splash-shake .82s ease-in-out both;
}
#quick-contact-root .qc-trigger.qc-attention::after {
  animation:qc-splash-halo .82s ease-out both;
}
@keyframes qc-splash-shake {
   0%,100% {transform:translate(0,0) rotate(0deg)}
   9% {transform:translate(-2px,-1px) rotate(-1.2deg)}
  19% {transform:translate(3px,1px) rotate(1.2deg)}
  30% {transform:translate(-2px,0) rotate(-.9deg)}
  42% {transform:translate(2px,-1px) rotate(.8deg)}
  54% {transform:translate(-1px,0) rotate(-.5deg)}
  69% {transform:translate(1px,0) rotate(.25deg)}
  83% {transform:translate(0,0) rotate(0deg)}
}
@keyframes qc-splash-halo {
  0% {opacity:0; transform:scale(.96)}
  20% {opacity:.85; transform:scale(1.01)}
  75% {opacity:.2; transform:scale(1.10)}
  100% {opacity:0; transform:scale(1.14)}
}
@media (prefers-reduced-motion:reduce) {
  #quick-contact-root .qc-trigger.qc-attention,
  #quick-contact-root .qc-trigger.qc-attention::after {animation:none!important}
}


/* Client-selected reply preferences: six independent channels, multi-select. */
#quick-contact-root .qc-channel-header{
  display:flex;justify-content:space-between;align-items:baseline;gap:7px;margin:9px 0 1px;
}
#quick-contact-root .qc-channel-header strong{font:700 14px/1.2 Arial,Helvetica,sans-serif;color:#16202e;}
#quick-contact-root .qc-channel-header small{font-size:11px;color:#6b7584;text-align:right;}
#quick-contact-root .qc-channels{
  display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:5px;margin:5px 0 3px;
}
#quick-contact-root .qc-channel{
  display:flex;position:relative;flex-direction:column;align-items:center;justify-content:center;gap:5px;
  border:2px solid transparent;border-radius:11px;background:#f1f4f8;color:#344055;box-shadow:none;
  min-width:0;min-height:73px;padding:5px 0;cursor:pointer;
  font-family:Arial,Helvetica,sans-serif;line-height:1.1;
  transition:border-color .16s ease,background .16s ease,box-shadow .16s ease;
}
#quick-contact-root .qc-channel:hover{background:#e8edf5;}
#quick-contact-root .qc-channel[aria-pressed="true"]{
  background:#fff1f1;border-color:var(--qc-accent);color:#111;
  box-shadow:0 0 0 1px rgba(223,40,42,.12);
}
#quick-contact-root .qc-channel:focus-visible{outline:3px solid #e6c45c;outline-offset:2px;}
#quick-contact-root .qc-channel-image{
  width:32px;height:32px;flex:none;border-radius:50%;display:grid;place-items:center;
  color:#fff;font-size:17px;font-weight:800;
}
#quick-contact-root .qc-ch-phone{background:#516075;}
#quick-contact-root .qc-ch-max{background:#7455e6;}
#quick-contact-root .qc-ch-telegram{background:#25a8e0;}
#quick-contact-root .qc-ch-whatsapp{background:#24be61;}
#quick-contact-root .qc-ch-vk{background:#0077ff;font-size:12px;}
#quick-contact-root .qc-ch-viber{background:#7855b4;}
#quick-contact-root .qc-channel-label{font-size:9px;font-weight:600;letter-spacing:-.2px;white-space:nowrap;}
#quick-contact-root .qc-tick{
  display:none;position:absolute;top:-6px;right:-5px;z-index:1;
  width:18px;height:18px;line-height:14px;text-align:center;
  border:2px solid #fff;border-radius:50%;background:var(--qc-accent);
  color:#fff;font:700 11px/14px Arial,Helvetica,sans-serif;
}
#quick-contact-root .qc-channel[aria-pressed="true"] .qc-tick{display:block;}
#quick-contact-root .qc-channel-extra[hidden]{display:none!important;}
#quick-contact-root .qc-channel-extra{display:grid;gap:6px;margin:4px 0 0;}
#quick-contact-root .qc-channel-extra label{margin:2px 0!important;}
#quick-contact-root .qc-channel-hint{
  margin:0!important;font-size:11px!important;line-height:1.3!important;color:#677485!important;
}
#quick-contact-root .qc-form label small{font-weight:400;color:#6b7480;}
@media(max-width:620px){
  #quick-contact-root .qc-channel{min-height:67px;padding:5px 0;gap:4px;border-radius:10px;}
  #quick-contact-root .qc-channel-image{width:29px;height:29px;font-size:15px;}
  #quick-contact-root .qc-channel-image svg{width:23px;height:23px;}
  #quick-contact-root .qc-ch-vk{font-size:11px;}
  #quick-contact-root .qc-channel-label{font-size:9px;}
  #quick-contact-root .qc-channel-header{margin:5px 0 0;}
}

/* Weather micro-scene: cloud, sunshine, light rain, a faint lightning bolt and shake. */
#quick-contact-root .qc-weather{
  position:absolute;bottom:calc(100% - 2px);right:6px;width:160px;height:105px;
  pointer-events:none;opacity:0;visibility:hidden;transform:translateY(9px);
}
#quick-contact-root .qc-weather svg{display:block;width:100%;height:100%;overflow:visible;}
#quick-contact-root .qc-weather-lightning{opacity:0;}
#quick-contact-root .qc-weather-rain{opacity:0;}
#quick-contact-root .qc-trigger.qc-weather-active{
  animation:qc-weather-shake 3.15s ease-in-out both;
}
#quick-contact-root .qc-trigger.qc-weather-active .qc-weather{
  visibility:visible;animation:qc-weather-appear 3.15s ease-out both;
}
#quick-contact-root .qc-trigger.qc-weather-active .qc-weather-sun{
  transform-origin:47px 31px;animation:qc-weather-sunshine 3.15s ease-out both;
}
#quick-contact-root .qc-trigger.qc-weather-active .qc-weather-cloud{
  animation:qc-weather-cloud-bob 3.15s ease-in-out both;
}
#quick-contact-root .qc-trigger.qc-weather-active .qc-weather-rain{
  animation:qc-weather-rain-show 3.15s ease-in-out both;
}
#quick-contact-root .qc-trigger.qc-weather-active .qc-raindrop{
  animation:qc-weather-drop .44s linear 3;
}
#quick-contact-root .qc-trigger.qc-weather-active .qc-r2{animation-delay:.12s;}
#quick-contact-root .qc-trigger.qc-weather-active .qc-r3{animation-delay:.24s;}
#quick-contact-root .qc-trigger.qc-weather-active .qc-r4{animation-delay:.08s;}
#quick-contact-root .qc-trigger.qc-weather-active .qc-r5{animation-delay:.20s;}
#quick-contact-root .qc-trigger.qc-weather-active .qc-weather-lightning{
  animation:qc-weather-flash 3.15s ease-out both;
}
#quick-contact-root .qc-trigger.qc-weather-active::after{
  animation:qc-weather-halo 3.15s ease-out both;
}
@keyframes qc-weather-appear{
  0%,7%{opacity:0;transform:translateY(11px)}
  15%,72%{opacity:1;transform:translateY(0)}
  86%,100%{opacity:0;transform:translateY(-4px)}
}
@keyframes qc-weather-sunshine{
  0%,15%{opacity:0;transform:scale(.7)}
  24%,65%{opacity:1;transform:scale(1)}
  87%,100%{opacity:0;transform:scale(.9)}
}
@keyframes qc-weather-cloud-bob{
  0%,100%{transform:translateY(0)}
  40%{transform:translateY(-3px)}
  72%{transform:translateY(1px)}
}
@keyframes qc-weather-rain-show{
  0%,25%{opacity:0}
  33%,72%{opacity:1}
  83%,100%{opacity:0}
}
@keyframes qc-weather-drop{
  0%{transform:translateY(-3px);opacity:0}
  25%{opacity:1}
  100%{transform:translateY(18px);opacity:0}
}
@keyframes qc-weather-flash{
  0%,39%,45%,100%{opacity:0}
  40%,41%{opacity:.72}
  42%,44%{opacity:.22}
}
@keyframes qc-weather-shake{
  0%,73%,100%{transform:translate(0,0) rotate(0)}
  76%{transform:translate(-3px,-1px) rotate(-1.4deg)}
  79%{transform:translate(4px,1px) rotate(1.5deg)}
  82%{transform:translate(-3px,0) rotate(-1.1deg)}
  85%{transform:translate(2px,-1px) rotate(.9deg)}
  88%{transform:translate(-1px,0) rotate(-.5deg)}
  92%{transform:translate(1px,0) rotate(.3deg)}
  96%{transform:translate(0,0) rotate(0)}
}
@keyframes qc-weather-halo{
  0%,72%,100%{opacity:0;transform:scale(1)}
  82%{opacity:.7;transform:scale(1.04)}
  94%{opacity:.12;transform:scale(1.13)}
}
@media(prefers-reduced-motion:reduce){
 #quick-contact-root .qc-trigger.qc-weather-active,
 #quick-contact-root .qc-trigger.qc-weather-active *{animation:none!important;}
 #quick-contact-root .qc-weather{display:none!important;}
}