/* Чат АиБ — новый дизайн (перенос макета Claude Design). */

:root{
  --bg:#0F0A07; --bg2:#17110B; --surface:#1B140D; --surface2:#221A11;
  --line:rgba(245,238,230,0.10); --line2:rgba(245,238,230,0.16);
  --ink:#F5EEE6; --muted:rgba(245,238,230,0.64); --faint:rgba(245,238,230,0.40);
  --vio:#FF6A4D; --aqua:#FFB25E;
}

*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{margin:0;background:var(--bg);color:var(--ink);font-family:'Manrope',system-ui,-apple-system,sans-serif;}
a{color:inherit;text-decoration:none;}
img{max-width:100%;}
input,button,textarea{font-family:inherit;}
input:focus,textarea:focus{outline:none;}
a:focus-visible,button:focus-visible,input:focus-visible{outline:2px solid var(--aqua);outline-offset:2px;}
::selection{background:var(--vio);color:#0F0A07;}
::-webkit-scrollbar{width:10px;height:10px;}
::-webkit-scrollbar-thumb{background:rgba(255,106,77,.35);border-radius:20px;}
canvas#kb-webgl{display:block;}

/* ---- page wrapper ---- */
.ds{position:relative;background:var(--bg);color:var(--ink);font-size:16px;line-height:1.5;-webkit-font-smoothing:antialiased;overflow-x:clip;}

/* ---- keyframes ---- */
@keyframes kbPulse{0%,100%{opacity:1;transform:scale(1);}50%{opacity:.3;transform:scale(.78);}}
@keyframes kbBob{0%,100%{transform:translateY(0);}50%{transform:translateY(8px);}}
@keyframes kbType{0%,60%,100%{opacity:.22;transform:translateY(0);}30%{opacity:1;transform:translateY(-4px);}}
@keyframes kbMarq{from{transform:translateX(0);}to{transform:translateX(-50%);}}
@keyframes kbFloat{0%,100%{transform:translateY(0);}50%{transform:translateY(-6px);}}
@keyframes kbSpin{from{transform:rotate(0);}to{transform:rotate(360deg);}}
@keyframes kbSpinFA{from{transform:rotate(0);}to{transform:rotate(360deg);}}

/* ---- helpers ---- */
.kb-dot{display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--vio);margin:0 3px;animation:kbType 1.1s infinite;}
.kb-dot:nth-child(2){animation-delay:.18s;}
.kb-dot:nth-child(3){animation-delay:.36s;}
.kb-marq-track{display:flex;width:max-content;animation:kbMarq 32s linear infinite;}
.kb-faq summary::-webkit-details-marker{display:none;}
.kb-faq summary{list-style:none;cursor:pointer;}
.kb-faq[open] .kb-plus{transform:rotate(45deg);}
.kb-navlink{position:relative;transition:color .18s ease;}
.kb-navlink:hover{color:#F5EEE6;}

/* ---- mobile menu toggle ---- */
.nav-toggle{display:none;background:none;border:none;color:var(--ink);font-size:22px;cursor:pointer;padding:6px;line-height:1;}

@media (prefers-reduced-motion: reduce){
  *{animation-duration:.001ms !important;animation-iteration-count:1 !important;scroll-behavior:auto !important;}
}

@media (max-width:880px){
  .kb-navlinks{display:none !important;}
  .kb-navlinks.active{display:flex !important;flex-direction:column;position:absolute;top:100%;left:0;right:0;background:rgba(15,10,7,0.97);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border-bottom:1px solid var(--line);padding:18px 24px;gap:18px;align-items:flex-start;}
  .nav-toggle{display:block;}
  .kb-hero-copy{max-width:100% !important;}
  .kb-two{grid-template-columns:1fr !important;}
  .kb-pin{grid-template-columns:1fr !important;}
  .kb-pin-sticky{position:relative !important;top:auto !important;height:auto !important;margin-bottom:20px;}
  .kb-step{min-height:auto !important;padding:34px 0 !important;}
  .kb-hide-sm{display:none !important;}
}

/* ================= preserved PHP components ================= */

/* ---- site banner (in normal flow, above sticky header) ---- */
.site-banner{position:relative;z-index:70;background:linear-gradient(105deg,rgba(255,178,94,.15),rgba(255,106,77,.15));border-bottom:1px solid var(--line2);color:var(--ink);padding:12px 46px 12px 20px;text-align:center;font-size:14px;line-height:1.5;}
.site-banner-close{position:absolute;right:14px;top:50%;transform:translateY(-50%);background:none;border:none;color:var(--muted);font-size:24px;line-height:1;cursor:pointer;}
.site-banner-close:hover{color:var(--ink);}

/* ---- sales stopped notice ---- */
.sales-stopped-notice{display:flex;gap:12px;align-items:center;justify-content:center;max-width:720px;margin:28px auto 0;padding:16px 22px;border:1px solid var(--line2);border-radius:14px;background:rgba(255,106,77,.08);color:var(--muted);font-size:14.5px;}
.sales-stopped-notice i{color:var(--aqua);}

/* ---- email modal ---- */
.modal{position:fixed;inset:0;z-index:200;background:rgba(0,0,0,.62);backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);}
.modal-content{max-width:440px;width:calc(100% - 36px);margin:14vh auto 0;background:var(--surface);border:1px solid var(--line2);border-radius:20px;overflow:hidden;box-shadow:0 40px 100px -40px #000;}
.modal-header{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:20px 24px;border-bottom:1px solid var(--line);}
.modal-header h3{margin:0;font-family:'Unbounded',sans-serif;font-weight:600;font-size:18px;}
.modal .close{cursor:pointer;font-size:26px;line-height:1;color:var(--muted);}
.modal .close:hover{color:var(--ink);}
.modal-body{padding:24px;}
.help-block{display:flex;gap:8px;align-items:flex-start;font-size:13px;color:var(--faint);margin-top:8px;line-height:1.5;}
.help-block i{color:var(--aqua);margin-top:2px;}
.modal-buttons{display:flex;gap:12px;margin-top:20px;flex-wrap:wrap;}

/* ---- forms ---- */
.form-group{display:flex;flex-direction:column;gap:8px;margin-bottom:8px;}
.form-group label,.form-label{font-size:14px;color:var(--muted);}
.form-input,.modal-body input[type="email"],.modal-body input[type="text"]{width:100%;background:var(--surface2);border:1px solid var(--line2);border-radius:12px;padding:13px 16px;color:var(--ink);font-size:15px;transition:border-color .16s ease;}
.form-input:focus,.modal-body input:focus{border-color:var(--vio);}

/* ---- pill buttons (used by modal, auth panel) ---- */
.cta-button{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:13px 22px;border:none;cursor:pointer;border-radius:999px;font-weight:700;font-size:14px;background:linear-gradient(105deg,var(--aqua),var(--vio));color:#0F0A07;transition:transform .16s ease,box-shadow .16s ease;text-align:center;}
.cta-button:hover{transform:translateY(-1px);color:#0F0A07;}
.secondary-button{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:13px 22px;border:1px solid var(--line2);cursor:pointer;border-radius:999px;font-weight:600;font-size:14px;background:transparent;color:var(--ink);transition:border-color .16s ease;text-align:center;}
.secondary-button:hover{border-color:var(--aqua);color:var(--ink);}

/* ---- buy buttons (pricing) ---- */
.buy-button{cursor:pointer;font-family:inherit;}
.buy-button.is-disabled{opacity:.45;cursor:not-allowed;filter:grayscale(.35);}

/* ---- demo chat (messages injected by jQuery) ---- */
.alice-conversation{scrollbar-width:thin;}
.alice-message{display:flex;animation:kbMsgIn .3s ease;}
@keyframes kbMsgIn{from{opacity:0;transform:translateY(8px);}to{opacity:1;transform:none;}}
.alice-message.bot{justify-content:flex-start;}
.alice-message.user{justify-content:flex-end;}
.message-bubble{max-width:86%;padding:12px 16px;font-size:14.5px;line-height:1.56;border-radius:16px;word-wrap:break-word;overflow-wrap:anywhere;}
.alice-message.bot .message-bubble{background:var(--surface2);border:1px solid var(--line);color:var(--ink);border-radius:16px 16px 16px 4px;white-space:pre-wrap;}
.alice-message.user .message-bubble{background:linear-gradient(105deg,var(--aqua),var(--vio));color:#0F0A07;font-weight:500;border-radius:16px 16px 4px 16px;}
.alisa-answer-btn{align-self:flex-start;margin-top:8px;background:transparent;border:1px solid var(--line2);color:var(--aqua);border-radius:999px;padding:6px 13px;font-size:12.5px;cursor:pointer;transition:border-color .16s ease;}
.alisa-answer-btn:hover{border-color:var(--aqua);}
.alice-auth-panel{padding:12px 16px;border-top:1px solid var(--line);background:rgba(22,15,9,.5);}
.auth-panel-content{display:flex;gap:8px;flex-wrap:wrap;align-items:center;}
.auth-key-input{flex:1;min-width:150px;background:var(--surface);border:1px solid var(--line2);border-radius:999px;padding:11px 16px;color:var(--ink);font-size:14px;}
.auth-button{padding:11px 18px;font-size:13.5px;}

/* ---- back to top ---- */
.back-to-top{position:fixed;right:22px;bottom:22px;width:46px;height:46px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:linear-gradient(105deg,var(--aqua),var(--vio));color:#0F0A07;opacity:0;pointer-events:none;transition:opacity .3s ease,transform .16s ease;z-index:60;box-shadow:0 10px 30px -12px var(--vio);}
.back-to-top.visible{opacity:1;pointer-events:auto;}
.back-to-top:hover{transform:translateY(-2px);color:#0F0A07;}

/* spinner used in demo "Думаю..." */
.fa-spin{animation:kbSpinFA 1s linear infinite;}
