/* AVS Web Studio — shared interactive component styles.
   Used by every page that includes the "ask a question" widget (avs-faq-ask)
   and/or the request form + live spec panel (avs-contact). Linked after styles.css. */

/* ---------- shared form field base ---------- */
.avs-in,.avs-ta{width:100%;box-sizing:border-box;background:var(--bg-elevated);border:1px solid var(--line-1);border-radius:var(--radius-md);padding:13px 15px;color:var(--text-primary);font-family:var(--font-body);font-size:15px;outline:none;transition:border-color var(--dur-base) var(--ease-out), box-shadow var(--dur-base) var(--ease-out)}
.avs-in:focus,.avs-ta:focus{border-color:var(--amethyst-500);box-shadow:var(--glow-focus)}
.avs-ta{min-height:96px;resize:vertical;line-height:1.5}
.avs-in::placeholder,.avs-ta::placeholder{color:var(--text-faint)}

.h-link{background-image:var(--grad-line);background-repeat:no-repeat;background-position:left bottom;background-size:0% 1px;transition:background-size var(--dur-base) var(--ease-out), color var(--dur-fast) var(--ease-out)}
.h-link:hover{background-size:100% 1px;color:var(--amethyst-100)}

/* ---------- image-slot placeholder (design tool's fillable image slots,
   never filled with a real photo yet — rendered as a static placeholder box) ---------- */
.img-slot{position:relative;width:100%;height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;text-align:center;padding:12px;box-sizing:border-box;color:inherit;background:rgba(127,127,127,.08);border:1.5px dashed currentColor;border-radius:12px;opacity:.9}
.img-slot.is-circle{border-radius:50%}
.img-slot-icon{opacity:.45}
.img-slot-cap{max-width:90%;font-size:13px;font-weight:500;letter-spacing:.01em;opacity:.75;font-family:var(--font-body)}

/* ================= avs-faq-ask: "Не нашли ответ?" mini widget ================= */
.faa-wrap{padding-top:20px}
.faa-trigger{display:inline-flex;align-items:center;gap:11px;background:none;border:none;padding:6px 0;cursor:pointer;text-align:left}
.faa-trigger-label{font-family:var(--font-mono);font-size:13px;letter-spacing:0.02em;color:var(--text-muted)}
.faa-link{display:inline-flex;align-items:center;gap:7px;font-family:var(--font-mono);font-weight:500;font-size:13px;letter-spacing:0.04em;color:var(--amethyst-300);transition:color var(--dur-base) var(--ease-out)}
.faa-trigger:hover .faa-link{color:var(--amethyst-100)}
.faa-arrow{transition:transform var(--dur-base) var(--ease-out)}
.faa-trigger:hover .faa-arrow{transform:translateX(3px)}

.faa-formwrap{overflow:hidden;max-height:0;opacity:0;margin-top:0;transition:max-height var(--dur-slow) var(--ease-out),opacity var(--dur-base) var(--ease-out),margin-top var(--dur-base) var(--ease-out)}
.faa-formwrap.is-open{max-height:620px;opacity:1;margin-top:4px}
.faa-card{position:relative;border:1px solid var(--line-2);border-radius:var(--radius-lg);background:var(--bg-surface);padding:clamp(18px,2.4vw,24px);overflow:hidden}
.faa-glow{position:absolute;inset:0;border-radius:var(--radius-lg);pointer-events:none;opacity:0}
@keyframes faaIgnite{
  0%{opacity:0;box-shadow:0 0 0 1px rgba(138,111,209,0),0 0 0 0 rgba(138,111,209,0)}
  18%{opacity:1;box-shadow:0 0 0 1.5px rgba(138,111,209,0.9),0 0 30px 5px rgba(138,111,209,0.45)}
  100%{opacity:0;box-shadow:0 0 0 1px rgba(138,111,209,0),0 0 0 0 rgba(138,111,209,0)}
}
.faa-form-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:16px}
.faa-form-eyebrow{font-family:var(--font-mono);font-size:10px;letter-spacing:0.16em;text-transform:uppercase;color:var(--amethyst-300)}
.faa-collapse-btn{background:none;border:none;padding:4px;cursor:pointer;color:var(--text-faint);display:inline-flex;transition:color var(--dur-base) var(--ease-out)}
.faa-collapse-btn:hover{color:var(--text-muted)}
.faa-ta,.faa-in{background:var(--bg-elevated);border:1px solid var(--line-1);border-radius:var(--radius-md);color:var(--text-primary);outline:none;transition:border-color var(--dur-base) var(--ease-out),box-shadow var(--dur-base) var(--ease-out)}
.faa-ta:focus,.faa-in:focus{border-color:var(--amethyst-500);box-shadow:var(--glow-focus)}
.faa-ta::placeholder,.faa-in::placeholder{color:var(--text-faint)}
.faa-ta{width:100%;box-sizing:border-box;min-height:64px;resize:vertical;padding:12px 14px;font-family:var(--font-body);font-size:15px;line-height:1.5}
.faa-fields{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:14px}
.faa-field-label{display:block;font-family:var(--font-mono);font-size:10px;letter-spacing:0.14em;text-transform:uppercase;color:var(--text-muted);margin-bottom:7px}
.faa-in{width:100%;box-sizing:border-box;padding:11px 14px;font-family:var(--font-body);font-size:14px}
.faa-chips{display:flex;flex-wrap:wrap;gap:6px}
.faa-chip{display:inline-flex;align-items:center;padding:8px 12px;line-height:1;font-family:var(--font-mono);font-size:12px;letter-spacing:0.03em;border-radius:var(--radius-sm);cursor:pointer;user-select:none;white-space:nowrap;border:1px solid var(--line-2);background:transparent;color:var(--text-secondary);transition:border-color var(--dur-base) var(--ease-out),background var(--dur-base) var(--ease-out),color var(--dur-base) var(--ease-out)}
.faa-chip.is-active{border-color:var(--amethyst-500);background:rgba(138,111,209,0.14);color:var(--amethyst-100)}
.faa-contact-wrap{margin-top:14px}
.faa-contact-input-wrap{position:relative}
.faa-contact-in{font-family:var(--font-mono);font-size:14px;padding-right:92px}
.faa-badge{position:absolute;right:11px;top:50%;transform:translateY(-50%);font-family:var(--font-mono);font-size:9px;letter-spacing:0.12em;color:var(--amethyst-300);background:rgba(138,111,209,0.12);border:1px solid rgba(138,111,209,0.3);border-radius:4px;padding:3px 7px;pointer-events:none;white-space:nowrap}
.faa-consent{display:flex;align-items:flex-start;gap:11px;cursor:pointer;margin-top:16px}
.faa-checkbox{flex:none;width:18px;height:18px;margin-top:1px;border-radius:4px;display:flex;align-items:center;justify-content:center;box-sizing:border-box;border:1px solid var(--line-2);background:transparent;transition:border-color var(--dur-base) var(--ease-out),background var(--dur-base) var(--ease-out)}
.faa-checkbox.is-checked{border-color:var(--amethyst-500);background:rgba(138,111,209,0.14)}
.faa-check-icon{display:none}
.faa-checkbox.is-checked .faa-check-icon{display:block}
.faa-consent-text{font-size:13px;line-height:1.5;color:var(--text-muted)}
.faa-submit-row{display:flex;align-items:center;gap:16px;flex-wrap:wrap;margin-top:16px}
.faa-submit{display:inline-flex;align-items:center;gap:9px;border-radius:var(--radius-md);padding:12px 20px;border:none;font-family:var(--font-display);font-weight:600;font-size:14px;letter-spacing:var(--ls-button);transition:transform var(--dur-base) var(--ease-out),box-shadow var(--dur-base) var(--ease-out),background var(--dur-base) var(--ease-out),color var(--dur-base) var(--ease-out);background:var(--bg-overlay);color:var(--text-faint);cursor:not-allowed}
.faa-submit.is-active{background:var(--grad-accent);color:var(--text-on-accent);cursor:pointer;pointer-events:auto}
.faa-submit:not(.is-active){pointer-events:none}
.faa-submit.is-active:hover{transform:translateY(-2px);box-shadow:var(--glow-amethyst)}
.faa-submit-note{font-family:var(--font-mono);font-size:11px;color:var(--text-faint)}
.faa-sent{display:flex;align-items:center;gap:14px}
.faa-sent-icon{flex:none;width:36px;height:36px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:var(--grad-accent);color:var(--text-on-accent)}
.faa-sent-title{font-family:var(--font-display);font-weight:600;font-size:15px;color:var(--text-primary)}
.faa-sent-sub{font-size:13px;color:var(--text-muted);margin-top:2px}
.faa-sent-accent{font-family:var(--font-mono);color:var(--amethyst-300)}

/* ================= avs-contact: "Оставьте заявку" form + live spec panel ================= */
.cta-section{position:relative;background:var(--bg-base);padding:calc(var(--space-section) / 2) 0;overflow:hidden}
.cta-edge{position:absolute;top:0;bottom:0;width:150px;background-image:linear-gradient(90deg,rgba(232,233,240,0.05) 1px,transparent 1px),linear-gradient(rgba(232,233,240,0.05) 1px,transparent 1px);background-size:30px 30px;opacity:.5;pointer-events:none}
.cta-edge-l{left:0;-webkit-mask-image:linear-gradient(90deg,#000,transparent);mask-image:linear-gradient(90deg,#000,transparent)}
.cta-edge-r{right:0;-webkit-mask-image:linear-gradient(270deg,#000,transparent);mask-image:linear-gradient(270deg,#000,transparent)}
.cta-inner{position:relative;max-width:1080px;margin:0 auto;padding:0 clamp(24px,6vw,64px)}
.cta-eyebrow{font-family:var(--font-mono);font-weight:500;font-size:var(--fs-eyebrow);letter-spacing:var(--ls-eyebrow);text-transform:uppercase;color:var(--amethyst-300)}
.cta-title{font-family:var(--font-display);font-weight:600;font-size:var(--fs-h2);line-height:var(--lh-heading);letter-spacing:var(--ls-heading);color:var(--text-primary);margin:16px 0 12px;max-width:620px}
.cta-accent{color:var(--amethyst-300)}
.cta-lead{max-width:500px;margin:0;font-size:var(--fs-body);line-height:var(--lh-body);color:var(--text-muted)}
.cta-grid{display:grid;grid-template-columns:1.05fr 0.95fr;gap:44px;margin-top:48px;align-items:start}
@media (max-width:820px){ .cta-grid{grid-template-columns:1fr !important} .cta-spec{position:static !important;top:auto !important} }

.cta-form{display:flex;flex-direction:column;gap:28px}
.cta-field-label{display:block;font-family:var(--font-mono);font-size:11px;letter-spacing:0.14em;text-transform:uppercase;color:var(--text-muted);margin-bottom:12px}
.cta-chips{display:flex;flex-wrap:wrap;gap:10px}
.cta-chip{display:inline-flex;align-items:center;gap:8px;padding:10px 15px;font-family:var(--font-mono);font-size:13px;letter-spacing:0.03em;line-height:1;border-radius:var(--radius-sm);cursor:pointer;user-select:none;white-space:nowrap;border:1px solid var(--line-2);background:transparent;color:var(--text-secondary);transition:border-color var(--dur-base) var(--ease-out),background var(--dur-base) var(--ease-out),color var(--dur-base) var(--ease-out)}
.cta-chip.is-active{border-color:var(--amethyst-500);background:rgba(138,111,209,0.14);color:var(--amethyst-100)}
.cta-label{display:block;font-family:var(--font-mono);font-size:11px;letter-spacing:0.14em;text-transform:uppercase;color:var(--text-muted);margin-bottom:8px}
.cta-label-note{color:var(--text-faint);text-transform:none;letter-spacing:0}

.cta-agree{display:flex;align-items:flex-start;gap:11px;cursor:pointer;margin-top:-6px;margin-bottom:20px}
.cta-checkbox{flex:none;width:18px;height:18px;margin-top:1px;border-radius:4px;display:flex;align-items:center;justify-content:center;box-sizing:border-box;border:1px solid var(--line-2);background:transparent;transition:border-color var(--dur-base) var(--ease-out), background var(--dur-base) var(--ease-out)}
.cta-checkbox.is-checked{border-color:var(--amethyst-500);background:rgba(138,111,209,0.14)}
.cta-check-icon{display:none}
.cta-checkbox.is-checked .cta-check-icon{display:block}
.cta-agree-text{font-size:var(--fs-small);line-height:1.5;color:var(--text-secondary)}
.cta-submit{width:100%;border-radius:var(--radius-md);padding:16px 20px;border:none;font-family:var(--font-display);font-weight:600;font-size:15px;letter-spacing:var(--ls-button);display:inline-flex;align-items:center;justify-content:center;gap:10px;transition:transform var(--dur-base) var(--ease-out), box-shadow var(--dur-base) var(--ease-out), background var(--dur-base) var(--ease-out), color var(--dur-base) var(--ease-out);background:var(--bg-overlay);color:var(--text-faint);box-shadow:none;cursor:not-allowed}
.cta-submit.is-active{background:var(--grad-accent);color:var(--text-on-accent);box-shadow:var(--shadow-md);cursor:pointer;pointer-events:auto}
.cta-submit:not(.is-active){pointer-events:none}
.cta-submit.is-active:hover{transform:translateY(-2px);box-shadow:var(--glow-amethyst)}
.cta-sent{display:flex;align-items:center;gap:14px;padding:16px 18px;border:1px solid rgba(138,111,209,0.45);border-radius:var(--radius-md);background:rgba(138,111,209,0.1)}
.cta-sent-icon{flex:none;width:36px;height:36px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:var(--grad-accent);color:var(--text-on-accent)}
.cta-sent-title{font-family:var(--font-display);font-weight:600;font-size:15px;color:var(--text-primary)}
.cta-sent-sub{font-size:13px;color:var(--text-muted);margin-top:2px}

.cta-spec{position:sticky;top:100px;background:var(--bg-surface);border:1px solid var(--line-2);border-radius:var(--radius-lg);padding:26px 28px;box-shadow:var(--shadow-md)}
.cta-spec-glow{position:absolute;inset:0;border-radius:var(--radius-lg);pointer-events:none;opacity:0}
@keyframes avsIgnite{
  0%{opacity:0;box-shadow:0 0 0 1px rgba(138,111,209,0), 0 0 0 0 rgba(138,111,209,0)}
  18%{opacity:1;box-shadow:0 0 0 1.5px rgba(138,111,209,0.95), 0 0 34px 6px rgba(138,111,209,0.5)}
  55%{opacity:1;box-shadow:0 0 0 1.5px rgba(138,111,209,0.55), 0 0 22px 3px rgba(138,111,209,0.32)}
  100%{opacity:0;box-shadow:0 0 0 1px rgba(138,111,209,0), 0 0 0 0 rgba(138,111,209,0)}
}
@keyframes avsPulse{
  0%{box-shadow:0 0 0 0 rgba(70,168,145,0.55)}
  70%{box-shadow:0 0 0 9px rgba(70,168,145,0)}
  100%{box-shadow:0 0 0 0 rgba(70,168,145,0)}
}
.cta-spec-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;padding-bottom:20px;border-bottom:1px solid var(--line-1)}
.cta-spec-kicker{font-family:var(--font-mono);font-size:11px;letter-spacing:0.14em;text-transform:uppercase;color:var(--text-faint)}
.cta-spec-sub{font-family:var(--font-mono);font-size:13px;letter-spacing:0.08em;color:var(--text-secondary);margin-top:4px}
.cta-stamp{flex:none;width:46px;height:46px;border-radius:50%;border:1px solid rgba(138,111,209,0.45);display:flex;flex-direction:column;align-items:center;justify-content:center}
.cta-stamp-label{font-family:var(--font-mono);font-size:7px;letter-spacing:0.16em;color:var(--text-faint)}
.cta-stamp-num{font-family:var(--font-mono);font-size:15px;line-height:1;color:var(--amethyst-300)}
.cta-spec-row{display:flex;flex-direction:column;gap:4px;padding:18px 0 4px;border-bottom:1px solid var(--line-1)}
.cta-spec-row-last{border-bottom:none;padding-bottom:6px}
.cta-spec-row-label{font-family:var(--font-mono);font-size:10px;letter-spacing:0.16em;color:var(--text-faint)}
.cta-spec-row-val{font-family:var(--font-mono);font-size:15px;line-height:1.45;word-break:break-word;color:var(--text-faint);transition:color var(--dur-base) var(--ease-out)}
.cta-spec-row-val.is-filled{color:var(--text-primary)}
.cta-spec-row-val.is-accent{color:var(--amethyst-300)}
.cta-spec-status-row{display:flex;align-items:center;gap:8px;margin-top:16px;padding-top:16px;border-top:1px dashed var(--line-2)}
.cta-spec-dot{width:7px;height:7px;border-radius:50%;background:var(--text-faint);transition:background var(--dur-base) var(--ease-out)}
.cta-spec-dot.is-sent{background:var(--aurora-500)}
.cta-spec-status-text{font-family:var(--font-mono);font-size:11px;letter-spacing:0.14em;color:var(--text-faint)}
.cta-spec-status-text.is-sent{color:var(--aurora-300)}
.cta-spec-fixed{font-size:13px;color:var(--text-muted);margin-top:10px;line-height:1.5}
