/* ============================================
   02-components.css
   Компоненты: принципы, цитата, шаги, бриф, мощь,
   тарифы, отзывы, FAQ, контакты, перебивки, AI-чат
   ============================================ */

/* ── ПРИНЦИПЫ ── */
.an-principles { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
.an-principle {
  background: var(--an-navy-2);
  border: 1px solid rgba(255,255,255,0.06);
  border-radius: 12px;
  padding: 28px 24px;
  transition: transform 0.3s, border-color 0.3s;
}
.an-principle:hover { transform: translateY(-4px); border-color: rgba(255,193,7,0.4); }
.an-principle-icon {
  width: 56px; height: 56px;
  display: grid; place-items: center;
  background: rgba(255,193,7,0.1);
  border: 1px solid rgba(255,193,7,0.25);
  border-radius: 12px;
  margin-bottom: 18px;
}
.an-principle-icon i { font-size: 26px; color: var(--an-gold); }
.an-principle h3 { font-family: 'Unbounded', sans-serif; font-size: 16px; color: var(--an-paper); margin: 0 0 10px; }
.an-principle p { color: var(--an-mute); font-size: 14px; line-height: 1.6; margin: 0; }

/* ── ЦИТАТА ── */
.an-quote {
  display: grid;
  grid-template-columns: 320px 1fr;
  gap: 32px;
  align-items: stretch;
  background: var(--an-navy);
  border-radius: 12px;
  overflow: hidden;
  margin-top: 56px;
}
.an-quote img {
  width: 100%;
  height: 100%;
  min-height: 420px;
  object-fit: cover;
  object-position: center 15%;
  filter: grayscale(0.35) contrast(1.1);
}
.an-quote blockquote {
  margin: 0;
  padding: 40px 40px 40px 0;
  font-family: 'Cormorant Garamond', serif;
  font-style: italic;
  font-size: clamp(22px, 3vw, 32px);
  line-height: 1.35;
  align-self: center;
}
.an-quote cite {
  display: block;
  margin-top: 18px;
  font-family: 'Manrope', sans-serif;
  font-style: normal;
  font-size: 12px;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--an-gold);
}

/* ── ТРИ ШАГА ── */
.an-steps { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.an-step-card {
  background: linear-gradient(180deg, rgba(255,193,7,0.06) 0%, var(--an-navy-2) 100%);
  border: 1px solid rgba(255,193,7,0.2);
  border-radius: 14px;
  padding: 32px 28px;
  position: relative;
  transition: transform 0.3s, border-color 0.3s, box-shadow 0.3s;
}
.an-step-card:hover { transform: translateY(-6px); border-color: rgba(255,193,7,0.5); box-shadow: 0 20px 40px rgba(0,0,0,0.3); }
.an-step-num {
  position: absolute;
  top: 16px; right: 24px;
  font-family: 'Unbounded', sans-serif;
  font-size: 56px;
  font-weight: 900;
  color: rgba(255,193,7,0.12);
  line-height: 1;
}
.an-step-icon {
  width: 56px; height: 56px;
  display: grid; place-items: center;
  background: rgba(255,193,7,0.12);
  border: 1px solid rgba(255,193,7,0.3);
  border-radius: 12px;
  margin-bottom: 18px;
}
.an-step-icon i { font-size: 26px; color: var(--an-gold); }
.an-step-sub { font-size: 11px; letter-spacing: 0.16em; text-transform: uppercase; color: var(--an-mute); margin: 0 0 6px; }
.an-step-card h3 { font-family: 'Unbounded', sans-serif; font-size: 22px; margin: 0 0 12px; color: var(--an-paper); }
.an-step-card > p { color: var(--an-mute); font-size: 14px; line-height: 1.65; margin: 0 0 18px; }
.an-step-tags { display: flex; flex-wrap: wrap; gap: 8px; }
.an-step-tags span {
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--an-gold);
  background: rgba(255,193,7,0.1);
  border: 1px solid rgba(255,193,7,0.3);
  padding: 4px 10px;
  border-radius: 100px;
}

/* ── ОНЛАЙН-БРИФ ── */
.an-brief {
  background: var(--an-navy-2);
  border: 1px solid rgba(255,193,7,0.15);
  border-radius: 16px;
  padding: 40px;
  position: relative;
  overflow: hidden;
}
.an-brief::before {
  content: '';
  position: absolute;
  top: -60px; right: -60px;
  width: 200px; height: 200px;
  background: radial-gradient(circle, rgba(255,193,7,0.15), transparent 70%);
  pointer-events: none;
}
.an-brief-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; position: relative; }
.an-field { display: flex; flex-direction: column; gap: 8px; }
.an-field-wide { grid-column: 1 / -1; }
.an-field > span { font-size: 13px; font-weight: 600; color: var(--an-mute); letter-spacing: 0.04em; }
.an-field input,
.an-field select,
.an-field textarea {
  background: var(--an-ink);
  border: 1px solid rgba(255,255,255,0.1);
  color: var(--an-paper);
  padding: 14px 16px;
  border-radius: 8px;
  font-size: 14px;
  outline: none;
  transition: border-color 0.25s, box-shadow 0.25s;
  width: 100%;
}
.an-field input:focus,
.an-field select:focus,
.an-field textarea:focus {
  border-color: var(--an-gold);
  box-shadow: 0 0 0 3px rgba(255,193,7,0.12);
}
.an-field textarea { min-height: 120px; resize: vertical; }

/* ── ЧЕКБОКС СОГЛАСИЯ ── */
form.an-form .an-field-checkbox,
form.an-brief-form .an-field-checkbox,
label.an-field-checkbox,
.an-field-checkbox {
  display: flex !important;
  flex-direction: row !important;
  align-items: flex-start !important;
  justify-content: flex-start !important;
  gap: 10px !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 8px 0 12px !important;
  padding: 0 !important;
  text-align: left !important;
  grid-column: 1 / -1 !important;
  box-sizing: border-box !important;
  font-size: 13px !important;
  color: var(--an-mute) !important;
  line-height: 1.5 !important;
  cursor: pointer !important;
}
form.an-form .an-field-checkbox input[type="checkbox"],
form.an-brief-form .an-field-checkbox input[type="checkbox"],
label.an-field-checkbox input[type="checkbox"],
.an-field-checkbox input[type="checkbox"] {
  display: inline-block !important;
  width: 18px !important;
  height: 18px !important;
  min-width: 18px !important;
  max-width: 18px !important;
  margin: 2px 0 0 !important;
  padding: 0 !important;
  flex: 0 0 18px !important;
  accent-color: var(--an-gold) !important;
  cursor: pointer !important;
  position: static !important;
  vertical-align: top !important;
}
form.an-form .an-field-checkbox span,
form.an-brief-form .an-field-checkbox span,
label.an-field-checkbox span,
.an-field-checkbox span {
  display: inline-block !important;
  font-size: 13px !important;
  line-height: 1.5 !important;
  color: var(--an-mute) !important;
  text-align: left !important;
  flex: 1 1 auto !important;
  margin: 0 !important;
  padding: 0 !important;
  width: auto !important;
}
form.an-form .an-field-checkbox a,
form.an-brief-form .an-field-checkbox a,
label.an-field-checkbox a,
.an-field-checkbox a {
  color: var(--an-gold) !important;
  text-decoration: underline !important;
}
form.an-form .an-field-checkbox a:hover,
form.an-brief-form .an-field-checkbox a:hover,
label.an-field-checkbox a:hover,
.an-field-checkbox a:hover {
  color: var(--an-gold-2) !important;
}

/* ── СООБЩЕНИЕ ПОСЛЕ ОТПРАВКИ ── */
.an-brief-actions { display: flex; align-items: center; gap: 20px; margin-top: 28px; flex-wrap: wrap; position: relative; }
.an-brief-note { color: var(--an-mute); font-size: 13px; margin: 0; display: flex; align-items: center; gap: 6px; }
.an-brief-note i { color: var(--an-gold); }

/* ── ПРОДАКШН-МОЩЬ ── */
.an-power-subnav { display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 48px; }
.an-power-subnav a {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 10px 18px;
  background: rgba(255,193,7,0.06);
  border: 1px solid rgba(255,193,7,0.2);
  border-radius: 100px;
  color: var(--an-gold);
  font-size: 13px;
  font-weight: 600;
  transition: background 0.25s, border-color 0.25s, transform 0.25s;
}
.an-power-subnav a:hover { background: rgba(255,193,7,0.14); border-color: var(--an-gold); transform: translateY(-2px); }

.an-prod-split {
  display: grid;
  grid-template-columns: 0.8fr 1.2fr;
  gap: 48px;
  align-items: start;
  margin-bottom: 72px;
}
.an-prod-split:last-child { margin-bottom: 0; }
.an-prod-split-left { position: sticky; top: calc(var(--an-header-h) + 80px); }
body.has-topbar .an-prod-split-left { top: calc(var(--an-topbar-h) + var(--an-header-h) + 80px); }
.an-prod-h3 { font-family: 'Unbounded', sans-serif; font-size: clamp(22px, 3vw, 32px); color: var(--an-paper); margin: 0 0 12px; }
.an-prod-lead { color: var(--an-mute); font-size: 15px; max-width: 420px; margin: 0; }

/* Кастинг-борд */
.an-casting-board {
  background: linear-gradient(135deg, var(--an-navy-2) 0%, #1a2d45 100%);
  border: 1px solid rgba(255,193,7,0.2);
  border-radius: 16px;
  padding: 24px;
}
.an-casting-board-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding-bottom: 16px;
  margin-bottom: 20px;
  border-bottom: 1px solid rgba(255,193,7,0.15);
}
.an-casting-code {
  font-family: 'Courier New', monospace;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.14em;
  color: var(--an-gold);
  background: rgba(255,193,7,0.12);
  padding: 6px 12px;
  border-radius: 4px;
}
.an-casting-dots { display: flex; gap: 6px; }
.an-casting-dots i { width: 12px; height: 12px; border-radius: 50%; display: block; }
.an-casting-dots i:nth-child(1) { background: #ff6b6b; }
.an-casting-dots i:nth-child(2) { background: #ffd93d; }
.an-casting-dots i:nth-child(3) { background: #6bcb77; }
.an-casting-board-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
.an-casting-sticker {
  background: rgba(13,28,48,0.85);
  border: 1px solid rgba(255,193,7,0.25);
  border-radius: 10px;
  padding: 18px 12px;
  text-align: center;
  position: relative;
  transition: transform 0.3s;
  backdrop-filter: blur(6px);
}
.an-casting-sticker:nth-child(odd) { transform: rotate(-1.5deg); }
.an-casting-sticker:nth-child(even) { transform: rotate(1.5deg); }
.an-casting-sticker:hover { transform: rotate(0) scale(1.04); }
.an-sticker-pin {
  position: absolute;
  top: -6px; left: 50%;
  transform: translateX(-50%);
  width: 14px; height: 14px;
  background: var(--an-gold);
  border: 2px solid rgba(255,255,255,0.25);
  border-radius: 50%;
}
.an-sticker-icon { font-size: 28px; margin-bottom: 8px; }
.an-casting-sticker strong { display: block; font-family: 'Unbounded', sans-serif; font-size: 12px; color: var(--an-gold); margin-bottom: 4px; }
.an-casting-sticker small { color: var(--an-mute); font-size: 10px; letter-spacing: 0.06em; text-transform: uppercase; }
.an-casting-board-note { margin: 20px 0 0; text-align: center; color: var(--an-mute); font-size: 11px; font-style: italic; }

/* Техника */
.an-tech-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; }
.an-tech-card {
  background: var(--an-navy-2);
  border: 1px solid rgba(255,255,255,0.06);
  border-radius: 12px;
  padding: 22px 18px;
  text-align: center;
  transition: transform 0.3s, border-color 0.3s;
}
.an-tech-card:hover { transform: translateY(-4px); border-color: rgba(255,193,7,0.4); }
.an-tech-icon {
  width: 56px; height: 56px;
  margin: 0 auto 14px;
  display: grid; place-items: center;
  background: rgba(255,193,7,0.1);
  border: 1px solid rgba(255,193,7,0.25);
  border-radius: 12px;
}
.an-tech-icon i { font-size: 26px; color: var(--an-gold); }
.an-tech-card h4 { font-family: 'Unbounded', sans-serif; font-size: 13px; color: var(--an-paper); margin: 0 0 6px; }
.an-tech-card p { color: var(--an-mute); font-size: 12px; margin: 0 0 10px; }
.an-tech-spec {
  display: inline-block;
  font-size: 11px;
  font-weight: 600;
  color: var(--an-gold);
  background: rgba(255,193,7,0.1);
  border: 1px solid rgba(255,193,7,0.25);
  padding: 3px 10px;
  border-radius: 100px;
}

/* Команда */
.an-team-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; }
.an-team-card {
  background: var(--an-navy-2);
  border: 1px solid rgba(255,255,255,0.06);
  border-radius: 12px;
  padding: 24px 18px;
  text-align: center;
  transition: transform 0.3s, border-color 0.3s;
}
.an-team-card:hover { transform: translateY(-4px); border-color: rgba(255,193,7,0.4); }
.an-team-icon { font-size: 36px; margin-bottom: 12px; }
.an-team-card h4 { font-family: 'Unbounded', sans-serif; font-size: 13px; color: var(--an-gold); margin: 0 0 6px; }
.an-team-card p { color: var(--an-mute); font-size: 12px; margin: 0; line-height: 1.5; }

/* Пайплайн */
.an-pipeline { display: flex; flex-direction: column; gap: 12px; position: relative; }
.an-pipeline::before {
  content: '';
  position: absolute;
  left: 23px; top: 20px; bottom: 20px;
  width: 2px;
  background: linear-gradient(to bottom, var(--an-gold), rgba(255,193,7,0.1));
}
.an-pipeline-item {
  display: flex;
  align-items: flex-start;
  gap: 18px;
  background: var(--an-navy-2);
  border: 1px solid rgba(255,255,255,0.06);
  border-radius: 10px;
  padding: 16px 20px;
  position: relative;
  transition: transform 0.3s, border-color 0.3s;
}
.an-pipeline-item:hover { transform: translateX(4px); border-color: rgba(255,193,7,0.4); }
.an-pipeline-num {
  flex-shrink: 0;
  width: 46px; height: 46px;
  display: grid; place-items: center;
  background: var(--an-ink);
  border: 2px solid var(--an-gold);
  border-radius: 50%;
  font-family: 'Unbounded', sans-serif;
  font-size: 12px;
  font-weight: 700;
  color: var(--an-gold);
  position: relative;
  z-index: 1;
}
.an-pipeline-item h4 { font-family: 'Unbounded', sans-serif; font-size: 14px; color: var(--an-paper); margin: 0 0 4px; }
.an-pipeline-item p { color: var(--an-mute); font-size: 13px; margin: 0; line-height: 1.5; }

/* ── ПЕРЕБИВКИ ── */
.an-break {
  position: relative;
  min-height: 70vh;
  display: grid;
  place-items: center;
  overflow: hidden;
  isolation: isolate;
  text-align: center;
  padding: 0 24px;
  width: 100%;
  max-width: 100vw;
}
.an-break-bg {
  position: absolute;
  inset: 0;
  z-index: -2;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  will-change: transform;
}
.an-break::after {
  content: '';
  position: absolute;
  inset: 0;
  z-index: -1;
  background: linear-gradient(180deg, rgba(13,28,48,0.85) 0%, rgba(13,28,48,0.55) 50%, rgba(13,28,48,0.9) 100%);
}
.an-break-inner {
  max-width: 100%;
  width: 100%;
  position: relative;
  z-index: 1;
  padding: 0 8px;
  box-sizing: border-box;
}
.an-break-kicker {
  font-family: 'Unbounded', sans-serif;
  font-size: 13px;
  letter-spacing: 0.4em;
  text-transform: uppercase;
  color: var(--an-gold);
  margin: 0 0 20px;
}
.an-break-title {
  font-family: 'Unbounded', sans-serif;
  font-weight: 900;
  font-size: clamp(28px, 6vw, 96px);
  line-height: 1.05;
  letter-spacing: -0.03em;
  color: #fff;
  margin: 0 0 20px;
  text-transform: uppercase;
  text-shadow: 0 8px 40px rgba(0,0,0,0.5);
  word-wrap: break-word;
  overflow-wrap: break-word;
  hyphens: auto;
  max-width: 100%;
}
.an-break-title em {
  font-style: normal;
  color: var(--an-gold);
  display: block;
  word-wrap: break-word;
  overflow-wrap: break-word;
}
.an-break-text {
  font-family: 'Cormorant Garamond', serif;
  font-style: italic;
  font-size: clamp(18px, 2.2vw, 26px);
  color: #d7e2ef;
  max-width: 720px;
  margin: 0 auto;
  line-height: 1.5;
}

/* Базовые фоны для главной страницы */
.an-break-1 .an-break-bg { background-image: url("/templates/artnonstop_kinostudiya/images/parallax-1.jpg"); }
.an-break-2 .an-break-bg { background-image: url("/templates/artnonstop_kinostudiya/images/casting-bg.jpg"); }
.an-break-3 .an-break-bg { background-image: url("/templates/artnonstop_kinostudiya/images/founder.jpg"); }
.an-break-4 .an-break-bg { background-image: url("/templates/artnonstop_kinostudiya/images/parallax-4.jpg"); }

/* Базовые анимации перебивок (главная) */
.an-break-1 .an-break-inner { opacity: 0; transform: translateY(60px); transition: opacity 1s ease, transform 1s ease; }
.an-break-1.is-visible .an-break-inner { opacity: 1; transform: translateY(0); }

.an-break-2 .an-break-inner { opacity: 0; transform: scale(0.85); transition: opacity 1.1s ease, transform 1.1s cubic-bezier(0.2, 0.9, 0.3, 1.2); }
.an-break-2.is-visible .an-break-inner { opacity: 1; transform: scale(1); }

.an-break-3 .an-break-inner { opacity: 0; transform: translateX(-80px); transition: opacity 1s ease, transform 1s cubic-bezier(0.2, 0.9, 0.3, 1); }
.an-break-3.is-visible .an-break-inner { opacity: 1; transform: translateX(0); }

.an-break-4 .an-break-inner { opacity: 0; transform: translateY(-60px); transition: opacity 1s ease, transform 1s cubic-bezier(0.2, 0.9, 0.3, 1); }
.an-break-4.is-visible .an-break-inner { opacity: 1; transform: translateY(0); }

/* ── ТАРИФЫ ── */
.an-tariffs { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; }
.an-tariff {
  background: var(--an-navy-2);
  border: 1px solid rgba(255,255,255,0.06);
  border-radius: 12px;
  padding: 24px 20px 22px;
  display: flex;
  flex-direction: column;
  min-height: 420px;
  transition: border-color 0.3s, transform 0.3s;
}
.an-tariff:hover { border-color: var(--an-gold); transform: translateY(-4px); }
.an-tariff.featured { background: linear-gradient(180deg, #2a4263 0%, var(--an-navy-2) 100%); border-color: var(--an-gold); box-shadow: 0 18px 40px rgba(0,0,0,0.28); }
.an-tariff h3 { font-family: 'Unbounded', sans-serif; font-size: 18px; margin: 0 0 6px; }
.an-tariff .price { font-family: 'Unbounded', sans-serif; color: var(--an-gold); font-size: 20px; margin: 10px 0 6px; }
.an-tariff-desc { font-size: 12px; color: var(--an-mute); margin: 0 0 16px; font-style: italic; }
.an-tariff ul { list-style: none; padding: 0; margin: 0 0 20px; flex: 1; color: #c5d1e0; font-size: 13px; }
.an-tariff li { padding: 6px 0 6px 14px; position: relative; }
.an-tariff li::before { content: ""; position: absolute; left: 0; top: 12px; width: 6px; height: 6px; background: var(--an-gold); }
.an-tariff .an-btn { width: 100%; justify-content: center; margin-top: auto; }

/* ── ОТЗЫВЫ ── */
.an-reviews { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.an-rev { background: var(--an-navy-2); padding: 28px 24px; border-left: 3px solid var(--an-gold); border-radius: 0 10px 10px 0; }
.an-rev-icon {
  width: 52px; height: 52px;
  display: grid; place-items: center;
  background: rgba(255,193,7,0.12);
  border: 1px solid rgba(255,193,7,0.3);
  border-radius: 50%;
  margin-bottom: 16px;
}
.an-rev-icon i { font-size: 26px; color: var(--an-gold); }
.an-rev p { margin: 0 0 16px; color: #d5deea; }
.an-rev strong { display: block; font-family: 'Unbounded', sans-serif; font-size: 13px; }
.an-rev span { color: var(--an-mute); font-size: 13px; }

/* ── FAQ ── */
.an-faq { display: grid; gap: 8px; }
.an-acc { background: var(--an-navy-2); border: 1px solid rgba(255,255,255,0.05); border-radius: 10px; overflow: hidden; }
.an-acc button {
  width: 100%;
  text-align: left;
  background: transparent;
  border: 0;
  color: var(--an-paper);
  padding: 16px 20px;
  font-size: 15px;
  font-weight: 700;
  cursor: pointer;
  display: flex;
  justify-content: space-between;
  gap: 16px;
}
.an-acc button:hover { color: var(--an-gold); }
.an-acc .plus { color: var(--an-gold); font-family: 'Unbounded', sans-serif; }
.an-acc .panel { max-height: 0; overflow: hidden; transition: max-height 0.35s, padding 0.35s; color: var(--an-mute); padding: 0 20px; }
.an-acc.open .panel { max-height: 600px; padding: 0 20px 20px; }

/* ── КОНТАКТЫ ── */
.an-contacts {
  display: grid;
  grid-template-columns: 0.9fr 1.1fr;
  gap: 28px;
  background: var(--an-navy);
  padding: 32px;
  border-radius: 12px;
}
.an-form { display: grid; gap: 12px; }
.an-form input, .an-form select, .an-form textarea {
  width: 100%;
  background: var(--an-ink);
  border: 1px solid rgba(255,255,255,0.1);
  color: var(--an-paper);
  padding: 14px;
  border-radius: 6px;
  outline: none;
}
.an-form input:focus, .an-form select:focus, .an-form textarea:focus { border-color: var(--an-gold); }
.an-form textarea { min-height: 120px; resize: vertical; }
.an-note { font-size: 13px; color: var(--an-mute); margin-top: 8px; }

.an-ok {
  display: none;
  background: rgba(255,193,7,0.12);
  border: 1px solid rgba(255,193,7,0.4);
  border-radius: 8px;
  color: var(--an-gold);
  padding: 14px 18px;
  font-size: 14px;
  font-weight: 600;
  margin: 0 0 16px;
  text-align: center;
  animation: an-ok-pop 0.35s ease-out;
}
.an-ok.is-visible { display: block; }
@keyframes an-ok-pop {
  0% { opacity: 0; transform: translateY(-8px); }
  100% { opacity: 1; transform: translateY(0); }
}
.an-meta p { margin: 0 0 10px; color: #d0dbe8; }
.an-meta a { color: var(--an-gold); }

/* ── REVEAL ── */
.reveal { opacity: 0; transform: translateY(18px); transition: opacity 0.7s, transform 0.7s; }
.reveal.on { opacity: 1; transform: none; }

/* ── AI-ЧАТ ── */
#aiChatWidget { font-family: 'Manrope', sans-serif !important; }
#aiChatToggle {
  background: var(--an-gold) !important;
  color: var(--an-ink) !important;
  box-shadow: 0 6px 24px rgba(255,193,7,0.4) !important;
}
#aiChatToggle:hover { background: var(--an-gold-2) !important; transform: scale(1.06) !important; }
#aiChatReminder {
  background: var(--an-navy-2) !important;
  color: var(--an-gold) !important;
  border: 1px solid rgba(255,193,7,0.3) !important;
}
#aiChatWindow {
  background: var(--an-navy-2) !important;
  border: 1px solid rgba(255,193,7,0.2) !important;
  border-radius: 16px !important;
  box-shadow: 0 20px 60px rgba(0,0,0,0.5) !important;
}
#aiChatHeader {
  background: linear-gradient(135deg, #1a2d45 0%, var(--an-navy-2) 100%) !important;
  color: var(--an-paper) !important;
  border-bottom: 1px solid rgba(255,193,7,0.15) !important;
  border-radius: 16px 16px 0 0 !important;
  font-family: 'Unbounded', sans-serif !important;
  font-size: 13px !important;
  letter-spacing: 0.06em !important;
}
#aiChatHeader i { color: var(--an-gold) !important; }
#aiChatClose { color: var(--an-mute) !important; }
#aiChatClose:hover { color: var(--an-gold) !important; }
#aiChatMessages {
  background: var(--an-ink) !important;
  color: var(--an-paper) !important;
  font-size: 14px !important;
  line-height: 1.55 !important;
}
#aiChatInput {
  background: var(--an-ink) !important;
  color: var(--an-paper) !important;
  border: 1px solid rgba(255,193,7,0.2) !important;
  border-radius: 20px !important;
}
#aiChatInput::placeholder { color: var(--an-mute) !important; }
#aiChatInput:focus {
  border-color: var(--an-gold) !important;
  box-shadow: 0 0 0 3px rgba(255,193,7,0.12) !important;
}
#aiChatSend {
  background: var(--an-gold) !important;
  color: var(--an-ink) !important;
  border-radius: 20px !important;
}
#aiChatSend:hover { background: var(--an-gold-2) !important; transform: translateY(-2px) !important; }
#aiChatFastReg {
  background: var(--an-gold) !important;
  color: var(--an-ink) !important;
}
#aiChatFastReg:hover { background: var(--an-gold-2) !important; }
#aiChatWindow > div:last-of-type,
#aiChatWindow > div[style*="border-top"] {
  background: var(--an-navy-2) !important;
  border-top-color: rgba(255,193,7,0.15) !important;
}
#aiChatFastRegWrapper {
  background: var(--an-navy-2) !important;
  border-top-color: rgba(255,193,7,0.15) !important;
}
/* ── КНОПКА «НАВЕРХ» ── */
#anScrollTop {
  position: fixed;
  bottom: 20px;
  right: 20px;
  z-index: 9999998;
  width: 60px;
  height: 60px;
  border-radius: 50%;
  border: 0;
  cursor: pointer;
  background: var(--an-gold);
  color: var(--an-ink);
  font-size: 28px;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 6px 24px rgba(255,193,7,0.4);
  opacity: 0;
  visibility: hidden;
  transform: translateY(20px);
  transition: opacity 0.3s, visibility 0.3s, transform 0.3s, background 0.25s;
}
#anScrollTop.visible {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}
#anScrollTop:hover {
  background: var(--an-gold-2);
  transform: translateY(-2px);
}
#anScrollTop i { font-size: 28px; line-height: 1; }

@media (max-width: 720px) {
  #anScrollTop {
    width: 48px;
    height: 48px;
    bottom: 15px;
    right: 15px;
    font-size: 22px;
  }
  #anScrollTop i { font-size: 22px; }
}


/* ── EXIT-POPUP «НЕ УХОДИТЕ!» (ДИЗАЙН КИНОСТУДИИ) ── */

.an-exit-popup {

  position: fixed;

  top: 50%;

  left: 50%;

  transform: translate(-50%, -50%);

  width: 340px;

  max-width: 90vw;

  background: var(--an-navy-2);

  border: 1px solid rgba(255,193,7,0.25);

  border-radius: 16px;

  box-shadow: 0 20px 60px rgba(0,0,0,0.5);

  z-index: 9999999;

  text-align: center;

  padding: 28px 24px 24px;

  font-family: 'Manrope', system-ui, sans-serif;

}

.an-exit-close {

  position: absolute;

  top: 12px;

  right: 16px;

  font-size: 24px;

  cursor: pointer;

  color: var(--an-mute);

  transition: color 0.2s;

  line-height: 1;

}

.an-exit-close:hover { color: var(--an-gold); }

.an-exit-title {

  margin: 0 0 10px;

  font-family: 'Unbounded', sans-serif;

  font-size: 20px;

  font-weight: 800;

  color: var(--an-gold);

  letter-spacing: 0.02em;

}

.an-exit-text {

  margin: 0 0 20px;

  color: var(--an-mute);

  font-size: 14px;

  line-height: 1.5;

}

.an-exit-btn {

  width: 100%;

  border: 0;

  border-radius: 25px;

  padding: 12px;

  margin-bottom: 12px;

  cursor: pointer;

  font-family: 'Manrope', system-ui, sans-serif;

  font-size: 15px;

  font-weight: 700;

  transition: background 0.25s, color 0.25s, transform 0.2s;

}

.an-exit-btn-primary {

  background: var(--an-gold);

  color: var(--an-ink);

}

.an-exit-btn-primary:hover {

  background: var(--an-gold-2);

  transform: translateY(-2px);

}

.an-exit-btn-outline {

  background: transparent;

  color: var(--an-gold);

  border: 1px solid var(--an-gold);

}

.an-exit-btn-outline:hover {

  background: rgba(255,193,7,0.12);

  transform: translateY(-2px);

}

.an-exit-input {

  width: 100%;

  padding: 12px 18px;

  border: 1px solid rgba(255,193,7,0.2);

  border-radius: 25px;

  margin-bottom: 12px;

  box-sizing: border-box;

  text-align: center;

  background: var(--an-ink);

  color: var(--an-paper);

  font-family: 'Manrope', system-ui, sans-serif;

  font-size: 14px;

  outline: none;

  transition: border-color 0.25s, box-shadow 0.25s;

}

.an-exit-input::placeholder { color: var(--an-mute); }

.an-exit-input:focus {

  border-color: var(--an-gold);

  box-shadow: 0 0 0 3px rgba(255,193,7,0.12);

}
/* ── EXIT-POPUP: затемнение (CSS-only) ── */
body:has(.an-exit-popup)::before {
  content: '';
  position: fixed;
  inset: 0;
  background: rgba(9, 20, 34, 0.65);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
  z-index: 9999998;
  pointer-events: none;
  animation: an-exit-fade 0.3s ease-out;
}
@keyframes an-exit-fade {
  from { opacity: 0; }
  to { opacity: 1; }
}
.an-exit-popup {
  z-index: 9999999 !important;
}



/* ============================================================

   ОБЁРТКА TOP-B (полоса модулей регистрации)

   ============================================================ */

.an-top-b {

    margin: 0 0 32px 0;

}

@media (max-width: 720px) {

    .an-top-b { margin: 0 0 20px 0; }

}
/* ============================================================
   МОДУЛЬ РЕГИСТРАЦИИ КИНОСТУДИИ — горизонтальная полоса
   (дизайн Артнонстоп, mod_film_registration)
   ============================================================ */

/* ОБЁРТКА */
.mod-film-registration {
    background: linear-gradient(135deg, var(--an-navy-2) 0%, #0f2033 100%) !important;
    border: 1px solid rgba(255,193,7,0.28) !important;
    border-radius: 14px !important;
    padding: 16px 22px 16px 26px !important;
    box-shadow: 0 10px 30px rgba(0,0,0,0.3) !important;
    position: relative !important;
    overflow: hidden !important;
    font-family: 'Manrope', sans-serif !important;
    color: var(--an-paper) !important;
    max-width: 100% !important;
}

.mod-film-registration::before {
    content: '';
    position: absolute;
    top: 0; left: 0; bottom: 0;
    width: 4px;
    background: var(--an-gold);
    border-radius: 14px 0 0 14px;
}

/* ШАПКА — компактная, в одну строку с бейджем и описанием */
.film-header {
    display: flex !important;
    align-items: center !important;
    gap: 14px !important;
    flex-wrap: wrap !important;
    margin-bottom: 12px !important;
    text-align: left !important;
}

.film-badge {
    display: inline-block !important;
    background: var(--an-gold) !important;
    color: var(--an-ink) !important;
    font-family: 'Unbounded', sans-serif !important;
    font-size: 10px !important;
    font-weight: 700 !important;
    letter-spacing: 0.14em !important;
    text-transform: uppercase !important;
    padding: 5px 12px !important;
    border-radius: 6px !important;
    line-height: 1.4 !important;
    white-space: nowrap !important;
    flex-shrink: 0 !important;
}

.film-desc {
    font-size: 13px !important;
    color: var(--an-mute) !important;
    margin: 0 !important;
    line-height: 1.4 !important;
}

/* РЯД — табы + форма в одну строку */
.film-row {
    display: flex !important;
    align-items: center !important;
    gap: 14px !important;
    flex-wrap: wrap !important;
}

.film-tabs {
    display: flex !important;
    gap: 6px !important;
    flex-shrink: 0 !important;
    padding: 0 !important;
    border: none !important;
}

.film-tab {
    background: transparent !important;
    border: 1px solid rgba(255,193,7,0.3) !important;
    color: var(--an-mute) !important;
    font-family: 'Manrope', sans-serif !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    padding: 9px 16px !important;
    border-radius: 8px !important;
    cursor: pointer !important;
    transition: all 0.2s ease !important;
    white-space: nowrap !important;
}

.film-tab:hover:not(.active) {
    border-color: var(--an-gold) !important;
    color: var(--an-gold) !important;
    background: rgba(255,193,7,0.06) !important;
}

.film-tab.active {
    background: var(--an-gold) !important;
    color: var(--an-ink) !important;
    border-color: var(--an-gold) !important;
    font-weight: 700 !important;
    box-shadow: 0 4px 14px rgba(255,193,7,0.22) !important;
}

/* ФОРМА — все поля в одну строку */
.film-form {
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    flex: 1 !important;
    flex-wrap: wrap !important;
    min-width: 0 !important;
}

.film-fields {
    display: flex;                 /* ← без !important — JS управляет */
    align-items: center !important;
    gap: 8px !important;
    flex: 1 !important;
    flex-wrap: wrap !important;
    min-width: 0 !important;
}

.film-fields input {
    flex: 1 !important;
    min-width: 120px !important;
    height: 40px !important;
    background: rgba(255,255,255,0.05) !important;
    border: 1px solid rgba(255,255,255,0.1) !important;
    border-radius: 8px !important;
    padding: 10px 14px !important;
    color: var(--an-paper) !important;
    font-family: 'Manrope', sans-serif !important;
    font-size: 14px !important;
    outline: none !important;
    transition: border-color 0.2s, background 0.2s !important;
    box-sizing: border-box !important;
    width: auto !important;
}

.film-fields input::placeholder {
    color: var(--an-mute) !important;
    opacity: 0.7 !important;
}

.film-fields input:focus {
    border-color: var(--an-gold) !important;
    background: rgba(255,193,7,0.04) !important;
    box-shadow: 0 0 0 3px rgba(255,193,7,0.12) !important;
}

/* КНОПКА + СОГЛАСИЕ */
.film-actions {
    display: flex !important;
    align-items: center !important;
    gap: 12px !important;
    flex-shrink: 0 !important;
    flex-wrap: nowrap !important;
}

.film-consent {
    display: flex !important;
    align-items: center !important;
    gap: 6px !important;
    font-size: 11px !important;
    color: var(--an-mute) !important;
    cursor: pointer !important;
    white-space: nowrap !important;
    line-height: 1.3 !important;
}

.film-consent input[type="checkbox"] {
    width: 15px !important;
    height: 15px !important;
    accent-color: var(--an-gold) !important;
    cursor: pointer !important;
    flex-shrink: 0 !important;
}

.film-consent a {
    color: var(--an-gold) !important;
    text-decoration: underline !important;
    text-underline-offset: 2px !important;
}

.film-actions button[type="submit"] {
    background: var(--an-gold) !important;
    color: var(--an-ink) !important;
    border: none !important;
    border-radius: 8px !important;
    padding: 0 22px !important;
    height: 40px !important;
    font-family: 'Unbounded', sans-serif !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    letter-spacing: 0.12em !important;
    text-transform: uppercase !important;
    cursor: pointer !important;
    transition: all 0.2s ease !important;
    white-space: nowrap !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 6px !important;
    flex-shrink: 0 !important;
}

.film-actions button[type="submit"]:hover:not(:disabled) {
    background: var(--an-gold-2) !important;
    transform: translateY(-1px) !important;
    box-shadow: 0 8px 22px rgba(255,193,7,0.3) !important;
}

.film-actions button[type="submit"]:disabled {
    opacity: 0.35 !important;
    cursor: not-allowed !important;
}

/* СООБЩЕНИЕ — на всю ширину, под формой */
.film-message {
    margin-top: 10px !important;
    padding: 10px 14px !important;
    border-radius: 8px !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    text-align: left !important;
    line-height: 1.4 !important;
    width: 100% !important;
    box-sizing: border-box !important;
}

.film-message.success {
    background: rgba(255,193,7,0.12) !important;
    color: var(--an-gold) !important;
    border: 1px solid rgba(255,193,7,0.35) !important;
}

.film-message.error {
    background: rgba(220,53,69,0.15) !important;
    color: #ff8a95 !important;
    border: 1px solid rgba(220,53,69,0.4) !important;
}

.film-message.info {
    background: rgba(143,163,187,0.12) !important;
    color: var(--an-mute) !important;
    border: 1px solid rgba(143,163,187,0.3) !important;
}

/* ============================================================
   АДАПТАЦИЯ
   ============================================================ */

/* Планшет — поля могут переноситься, но без полного развала */
@media (max-width: 1100px) {
    .film-fields input {
        min-width: 100px !important;
        font-size: 13px !important;
    }
    .film-consent {
        font-size: 10px !important;
    }
}

/* Мобила — полный развал в столбик */
@media (max-width: 768px) {
    .mod-film-registration {
        padding: 16px 16px 16px 20px !important;
        border-radius: 12px !important;
    }
    .film-header {
        flex-direction: column !important;
        align-items: flex-start !important;
        gap: 8px !important;
    }
    .film-row {
        flex-direction: column !important;
        align-items: stretch !important;
        gap: 12px !important;
    }
    .film-tabs {
        width: 100% !important;
        justify-content: flex-start !important;
    }
    .film-form {
        flex-direction: column !important;
        align-items: stretch !important;
    }
    .film-fields {
        flex-direction: column !important;
        align-items: stretch !important;
    }
    .film-fields input {
        width: 100% !important;
        min-width: unset !important;
        height: 44px !important;
        font-size: 15px !important;
    }
    .film-actions {
        flex-direction: column !important;
        align-items: stretch !important;
        gap: 10px !important;
    }
    .film-consent {
        font-size: 12px !important;
        white-space: normal !important;
    }
    .film-actions button[type="submit"] {
        width: 100% !important;
        justify-content: center !important;
        height: 46px !important;
        font-size: 12px !important;
    }
}

@media (max-width: 480px) {
    .mod-film-registration {
        padding: 14px 14px 14px 18px !important;
    }
    .film-tab {
        font-size: 12px !important;
        padding: 8px 12px !important;
    }
}
/* ============================================================
   TOP-B: кнопка-закладка (как боковая вкладка «Услуги»)
   — заменяет старые стили .an-top-b-toggle
   ============================================================ */

/* Обёртка — по центру */
.an-top-b-wrapper {
    margin: 0 auto 32px auto !important;
    max-width: 1200px !important;
    padding: 0 24px !important;
    text-align: center !important;
}

/* КНОПКА-ЗАКЛАДКА */
.an-top-b-toggle {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px !important;
    background: var(--an-gold) !important;
    color: var(--an-ink) !important;
    border: none !important;
    border-radius: 0 0 14px 14px !important;       /* скругления только снизу */
    padding: 14px 32px !important;
    font-family: 'Unbounded', sans-serif !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    letter-spacing: 0.2em !important;              /* как у .an-sidebar-toggle */
    text-transform: uppercase !important;
    cursor: pointer !important;
    transition: all 0.25s ease !important;
    box-shadow: 0 -4px 20px rgba(255,193,7,0.15) !important;  /* тень вверх */
    white-space: nowrap !important;
    position: relative !important;
    z-index: 2 !important;
    animation: an-topb-pulse 2.5s ease-in-out infinite !important;
}

/* Пульсация — как у боковой кнопки */
@keyframes an-topb-pulse {
    0%, 100% { box-shadow: 0 -4px 20px rgba(255,193,7,0.15); }
    50% { box-shadow: 0 -6px 28px rgba(255,193,7,0.35); }
}

.an-top-b-toggle:hover {
    background: var(--an-gold-2) !important;
    transform: translateY(-2px) !important;
    box-shadow: 0 -8px 30px rgba(255,193,7,0.45) !important;
    animation: none !important;
}

/* Когда панель открыта — закладка «сливается» с панелью */
.an-top-b-toggle[aria-expanded="true"] {
    border-radius: 0 0 12px 12px !important;      /* снизу */
    box-shadow: none !important;
    animation: none !important;
    background: var(--an-gold) !important;
}

/* Убираем иконку-эмодзи и стрелку ▼ — делаем как у боковой */
.an-top-b-toggle-icon,
.an-top-b-toggle-arrow {
    display: none !important;
}

/* Оставляем только текст */
.an-top-b-toggle-text {
    display: inline-block !important;
    font-family: 'Unbounded', sans-serif !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    letter-spacing: 0.2em !important;
    text-transform: uppercase !important;
}

/* ПАНЕЛЬ — прикреплена к кнопке снизу, скругления снизу */
.an-top-b {
    max-height: 0 !important;
    overflow: hidden !important;
    transition: max-height 0.45s ease, opacity 0.3s ease !important;
    opacity: 0 !important;
    margin: 0 !important;                          /* вплотную к кнопке */
    position: relative !important;
    text-align: left !important;
    border-radius: 0 0 14px 14px !important;       /* скругления только снизу */
    background: var(--an-navy-2) !important;
    margin-top: 0 !important;
}

.an-top-b.is-open {
    max-height: 600px !important;
    opacity: 1 !important;
    margin-top: 0 !important;                      /* вплотную */
}

/* Внутри панели — обнуляем скругления обёртки модуля */
.an-top-b .mod-film-registration {
    border-radius: 0 0 14px 14px !important;       /* снизу */
    margin: 0 !important;
    box-shadow: none !important;
}

/* Убираем верхнюю границу у модуля — чтобы сливался с закладкой */
.an-top-b .mod-film-registration {
    border-top: none !important;
}

/* КРЕСТИК */
.an-top-b-close {
    position: absolute !important;
    top: 12px !important;
    right: 14px !important;
    background: transparent !important;
    border: none !important;
    color: var(--an-mute) !important;
    font-size: 20px !important;
    cursor: pointer !important;
    padding: 4px 8px !important;
    line-height: 1 !important;
    transition: color 0.2s !important;
    z-index: 5 !important;
}

.an-top-b-close:hover {
    color: var(--an-gold) !important;
}

/* Мобильные и планшеты: скрываем всё */
@media (max-width: 1100px) {
    .an-top-b-wrapper {
        display: none !important;
    }
}


/* ============================================================

   СТРАНИЦА «ВАКАНСИИ»: правки композиции

   ============================================================ */



/* 4 шага в одну строку */

@media (min-width: 1025px) {

    .an-steps-4 {

        display: grid !important;

        grid-template-columns: repeat(4, 1fr) !important;

        gap: 16px !important;

    }

    .an-steps-4 .an-step-card {

        padding: 24px 20px !important;

    }

    .an-steps-4 .an-step-num {

        font-size: 42px !important;

        top: 12px !important;

        right: 16px !important;

    }

    .an-steps-4 .an-step-card h3 {

        font-size: 18px !important;

    }

}

@media (max-width: 1024px) {

    .an-steps-4 {

        display: grid !important;

        grid-template-columns: repeat(2, 1fr) !important;

        gap: 14px !important;

    }

}

@media (max-width: 640px) {

    .an-steps-4 {

        grid-template-columns: 1fr !important;

    }

}



/* Форма отклика — 2 колонки */

.an-brief-form .an-brief-grid {

    display: grid !important;

    grid-template-columns: 1fr 1fr !important;

    gap: 16px 20px !important;

}

.an-brief-form .an-field-wide {

    grid-column: 1 / -1 !important;

}

.an-brief-form .an-field textarea {

    min-height: 140px !important;

}

@media (max-width: 768px) {

    .an-brief-form .an-brief-grid {

        grid-template-columns: 1fr !important;

    }

}



/* STRUCTURE — якорная кнопка */

.an-structure-cta {

    margin-top: 28px;

    text-align: center;

}

.an-structure-cta .an-btn {

    font-size: 13px;

}



/* Контакты — как на главной */

.an-contacts {

    display: grid !important;

    grid-template-columns: 0.9fr 1.1fr !important;

    gap: 28px !important;

    background: var(--an-navy) !important;

    padding: 36px !important;

    border-radius: 14px !important;

}

@media (max-width: 900px) {

    .an-contacts {

        grid-template-columns: 1fr !important;

        padding: 24px !important;

    }

}




/* ============================================================

   MAP-HOW: схема отбора в МАП

   ============================================================ */

.an-map-scheme {

    display: flex;

    flex-direction: column;

    gap: 16px;

    position: relative;

    margin-top: 32px;

}

.an-map-scheme::before {

    content: '';

    position: absolute;

    left: 35px;

    top: 30px;

    bottom: 30px;

    width: 2px;

    background: linear-gradient(to bottom, var(--an-gold) 0%, rgba(255,193,7,0.15) 100%);

    z-index: 0;

}

.an-map-step {

    display: flex;

    align-items: flex-start;

    gap: 20px;

    position: relative;

    z-index: 1;

}

.an-map-num {

    flex-shrink: 0;

    width: 72px;

    height: 72px;

    display: grid;

    place-items: center;

    background: var(--an-ink);

    border: 2px solid var(--an-gold);

    border-radius: 50%;

    font-family: 'Unbounded', sans-serif;

    font-size: 18px;

    font-weight: 800;

    color: var(--an-gold);

    box-shadow: 0 0 0 6px var(--an-ink);

}

.an-map-body {

    background: var(--an-navy-2);

    border: 1px solid rgba(255,193,7,0.15);

    border-radius: 14px;

    padding: 22px 26px;

    flex: 1;

    transition: border-color 0.25s, transform 0.25s;

}

.an-map-body:hover {

    border-color: rgba(255,193,7,0.4);

    transform: translateX(4px);

}

.an-map-body h3 {

    font-family: 'Unbounded', sans-serif;

    font-size: 18px;

    color: var(--an-paper);

    margin: 0 0 8px;

}

.an-map-body p {

    color: var(--an-mute);

    font-size: 14px;

    line-height: 1.6;

    margin: 0;

}

.an-map-branches {

    display: grid;

    grid-template-columns: 1fr 1fr;

    gap: 12px;

    margin-top: 16px;

}

.an-map-branch {

    display: flex;

    flex-direction: column;

    gap: 4px;

    padding: 14px 16px;

    border-radius: 10px;

    background: rgba(255,255,255,0.03);

    border: 1px solid rgba(255,255,255,0.08);

    transition: border-color 0.25s, transform 0.25s;

}

.an-map-branch:hover { transform: translateY(-2px); }

.an-map-branch i { font-size: 20px; margin-bottom: 4px; }

.an-map-branch strong {

    font-family: 'Unbounded', sans-serif;

    font-size: 13px;

    color: var(--an-paper);

}

.an-map-branch span { font-size: 12px; color: var(--an-mute); line-height: 1.5; }

.an-map-branch-yes {

    border-color: rgba(255,193,7,0.3);

    background: rgba(255,193,7,0.06);

}

.an-map-branch-yes i { color: var(--an-gold); }

.an-map-branch-yes strong { color: var(--an-gold); }

.an-map-branch-soft { border-color: rgba(143,163,187,0.3); }

.an-map-branch-soft i { color: var(--an-mute); }

@media (max-width: 720px) {

    .an-map-scheme::before { left: 25px; }

    .an-map-num {

        width: 52px;

        height: 52px;

        font-size: 14px;

        box-shadow: 0 0 0 4px var(--an-ink);

    }

    .an-map-body { padding: 18px 20px; }

    .an-map-body h3 { font-size: 16px; }

    .an-map-branches { grid-template-columns: 1fr; }

}




/* ============================================================

   ФОРМА ВАКАНСИЙ: форсируем 2 колонки

   ============================================================ */

form#vakansii-form .an-brief-grid,

form#vakansii-form-bottom .an-brief-grid {

    display: grid !important;

    grid-template-columns: 1fr 1fr !important;

    gap: 16px 20px !important;

    width: 100% !important;

}



form#vakansii-form .an-brief-grid > .an-field,

form#vakansii-form-bottom .an-brief-grid > .an-field {

    display: flex !important;

    flex-direction: column !important;

    gap: 8px !important;

    min-width: 0 !important;

    width: auto !important;

}



form#vakansii-form .an-brief-grid > .an-field-wide,

form#vakansii-form .an-brief-grid > .an-field-checkbox,

form#vakansii-form-bottom .an-brief-grid > .an-field-wide,

form#vakansii-form-bottom .an-brief-grid > .an-field-checkbox {

    grid-column: 1 / -1 !important;

}



form#vakansii-form .an-field input,

form#vakansii-form .an-field select,

form#vakansii-form .an-field textarea,

form#vakansii-form-bottom .an-field input,

form#vakansii-form-bottom .an-field select,

form#vakansii-form-bottom .an-field textarea {

    width: 100% !important;

    box-sizing: border-box !important;

}



@media (max-width: 768px) {

    form#vakansii-form .an-brief-grid,

    form#vakansii-form-bottom .an-brief-grid {

        grid-template-columns: 1fr !important;

    }

}
/* ============================================================
   ФОРМА ВАКАНСИЙ — собственная сетка (не зависит от .an-brief-grid)
   ============================================================ */
.an-vakansii-fields {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 20px !important;
    width: 100% !important;
}

.an-v-field {
    display: flex !important;
    flex-direction: column !important;
    gap: 8px !important;
    min-width: 0 !important;
}

.an-v-field-wide {
    grid-column: 1 / -1 !important;
}

.an-v-field label {
    display: block !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    color: var(--an-mute) !important;
    letter-spacing: 0.04em !important;
    margin: 0 !important;
}

.an-v-field input,
.an-v-field select,
.an-v-field textarea {
    width: 100% !important;
    background: var(--an-ink) !important;
    border: 1px solid rgba(255,255,255,0.1) !important;
    color: var(--an-paper) !important;
    padding: 14px 16px !important;
    border-radius: 8px !important;
    font-size: 14px !important;
    font-family: 'Manrope', sans-serif !important;
    outline: none !important;
    box-sizing: border-box !important;
    transition: border-color 0.25s, box-shadow 0.25s !important;
}

.an-v-field input:focus,
.an-v-field select:focus,
.an-v-field textarea:focus {
    border-color: var(--an-gold) !important;
    box-shadow: 0 0 0 3px rgba(255,193,7,0.12) !important;
}

.an-v-field textarea {
    min-height: 140px !important;
    resize: vertical !important;
}

.an-v-checkbox {
    display: flex !important;
    flex-direction: row !important;
    align-items: flex-start !important;
    gap: 10px !important;
    font-size: 13px !important;
    color: var(--an-mute) !important;
    line-height: 1.5 !important;
    cursor: pointer !important;
}

.an-v-checkbox input[type="checkbox"] {
    width: 18px !important;
    height: 18px !important;
    flex-shrink: 0 !important;
    margin: 2px 0 0 0 !important;
    accent-color: var(--an-gold) !important;
    cursor: pointer !important;
}

.an-v-checkbox label {
    font-size: 13px !important;
    color: var(--an-mute) !important;
    line-height: 1.5 !important;
    cursor: pointer !important;
}

.an-v-checkbox a {
    color: var(--an-gold) !important;
    text-decoration: underline !important;
}

@media (max-width: 768px) {
    .an-vakansii-fields {
        grid-template-columns: 1fr !important;
    }
}




/* ============================================================

   ФОРМА ВАКАНСИЙ — полностью изолированная сетка (vk-*)

   ============================================================ */



.vk-form-box {

    background: var(--an-navy-2);

    border: 1px solid rgba(255,193,7,0.18);

    border-radius: 16px;

    padding: 40px;

    position: relative;

    overflow: hidden;

}



.vk-grid {

    display: grid;

    grid-template-columns: 1fr 1fr;

    gap: 20px;

    width: 100%;

}



.vk-field {

    display: flex;

    flex-direction: column;

    gap: 8px;

    min-width: 0;

}



.vk-wide {

    grid-column: 1 / -1;

}



.vk-field label {

    display: block;

    font-size: 13px;

    font-weight: 600;

    color: var(--an-mute);

    letter-spacing: 0.04em;

    margin: 0;

}



.vk-field input,

.vk-field select,

.vk-field textarea {

    width: 100%;

    background: var(--an-ink);

    border: 1px solid rgba(255,255,255,0.1);

    color: var(--an-paper);

    padding: 14px 16px;

    border-radius: 8px;

    font-size: 14px;

    font-family: 'Manrope', sans-serif;

    outline: none;

    box-sizing: border-box;

    transition: border-color 0.25s, box-shadow 0.25s;

}



.vk-field input:focus,

.vk-field select:focus,

.vk-field textarea:focus {

    border-color: var(--an-gold);

    box-shadow: 0 0 0 3px rgba(255,193,7,0.12);

}



.vk-field textarea {

    min-height: 140px;

    resize: vertical;

}



.vk-check {

    display: flex;

    flex-direction: row;

    align-items: flex-start;

    gap: 10px;

    font-size: 13px;

    color: var(--an-mute);

    line-height: 1.5;

    cursor: pointer;

}



.vk-check input[type="checkbox"] {

    width: 18px;

    height: 18px;

    flex-shrink: 0;

    margin: 2px 0 0 0;

    accent-color: var(--an-gold);

    cursor: pointer;

}



.vk-check label {

    font-size: 13px;

    color: var(--an-mute);

    line-height: 1.5;

    cursor: pointer;

    margin: 0;

}



.vk-check a {

    color: var(--an-gold);

    text-decoration: underline;

}



.vk-actions {

    display: flex;

    align-items: center;

    gap: 20px;

    flex-wrap: wrap;

    margin-top: 28px;

}



.vk-submit {

    background: var(--an-gold);

    color: var(--an-ink);

    border: none;

    border-radius: 8px;

    padding: 14px 28px;

    font-family: 'Unbounded', sans-serif;

    font-size: 12px;

    font-weight: 700;

    letter-spacing: 0.14em;

    text-transform: uppercase;

    cursor: pointer;

    transition: all 0.2s ease;

}



.vk-submit:hover {

    background: var(--an-gold-2);

    transform: translateY(-2px);

    box-shadow: 0 10px 30px rgba(255,193,7,0.3);

}



.vk-note {

    color: var(--an-mute);

    font-size: 13px;

}



@media (max-width: 768px) {

    .vk-form-box {

        padding: 24px 20px;

    }

    .vk-grid {

        grid-template-columns: 1fr;

    }

}




/* Joomla оборачивает email в <joomla-hidden-mail> — обнуляем обёртку */

.vk-field joomla-hidden-mail,

.vk-field joomla-hidden-mail > span {

    display: contents !important;

}




/* ============================================================

   ФОРМА ВАКАНСИЙ — flex-сетка (не зависит от grid-конфликтов)

   ============================================================ */

.vk-flex-fields {

    display: flex !important;

    flex-wrap: wrap !important;

    gap: 20px !important;

    width: 100% !important;

}



.vk-flex-field {

    display: flex !important;

    flex-direction: column !important;

    gap: 8px !important;

    flex: 1 1 calc(50% - 10px) !important;

    min-width: 220px !important;

    max-width: calc(50% - 10px) !important;

    box-sizing: border-box !important;

    margin: 0 !important;

}



.vk-flex-wide {

    flex: 1 1 100% !important;

    max-width: 100% !important;

}



.vk-flex-field > span {

    display: block !important;

    font-size: 13px !important;

    font-weight: 600 !important;

    color: var(--an-mute) !important;

    letter-spacing: 0.04em !important;

    margin: 0 !important;

}



.vk-flex-field input,

.vk-flex-field select,

.vk-flex-field textarea {

    width: 100% !important;

    background: var(--an-ink) !important;

    border: 1px solid rgba(255,255,255,0.1) !important;

    color: var(--an-paper) !important;

    padding: 14px 16px !important;

    border-radius: 8px !important;

    font-size: 14px !important;

    font-family: 'Manrope', sans-serif !important;

    outline: none !important;

    box-sizing: border-box !important;

    transition: border-color 0.25s, box-shadow 0.25s !important;

}



.vk-flex-field input:focus,

.vk-flex-field select:focus,

.vk-flex-field textarea:focus {

    border-color: var(--an-gold) !important;

    box-shadow: 0 0 0 3px rgba(255,193,7,0.12) !important;

}



.vk-flex-field textarea {

    min-height: 140px !important;

    resize: vertical !important;

}



.vk-flex-check {

    display: flex !important;

    flex-direction: row !important;

    align-items: flex-start !important;

    gap: 10px !important;

    flex: 1 1 100% !important;

    max-width: 100% !important;

    font-size: 13px !important;

    color: var(--an-mute) !important;

    line-height: 1.5 !important;

    cursor: pointer !important;

    margin: 0 !important;

}



.vk-flex-check input[type="checkbox"] {

    width: 18px !important;

    height: 18px !important;

    flex-shrink: 0 !important;

    margin: 2px 0 0 0 !important;

    accent-color: var(--an-gold) !important;

    cursor: pointer !important;

}



.vk-flex-check span {

    font-size: 13px !important;

    color: var(--an-mute) !important;

    line-height: 1.5 !important;

}



.vk-flex-check a {

    color: var(--an-gold) !important;

    text-decoration: underline !important;

}



@media (max-width: 768px) {

    .vk-flex-field {

        flex: 1 1 100% !important;

        max-width: 100% !important;

    }

}




/* ============================================================

   ФОРМА ВАКАНСИЙ — float-сетка (независимая от grid/flex)

   ============================================================ */

.vk-form2 {

    background: var(--an-navy-2) !important;

    border: 1px solid rgba(255,193,7,0.15) !important;

    border-radius: 16px !important;

    padding: 40px !important;

}



.vk-form2 form {

    display: block !important;

    width: 100% !important;

}



.vk-r {

    display: block !important;

    width: 100% !important;

    margin: 0 0 20px 0 !important;

    overflow: hidden !important;

}



.vk-r::after {

    content: '' !important;

    display: table !important;

    clear: both !important;

}



.vk-c {

    float: left !important;

    width: 48% !important;

    margin-right: 4% !important;

    box-sizing: border-box !important;

}



.vk-c:nth-child(2n) {

    margin-right: 0 !important;

}



.vk-c.vk-full {

    float: none !important;

    width: 100% !important;

    margin-right: 0 !important;

}



.vk-c label {

    display: block !important;

    font-size: 13px !important;

    font-weight: 600 !important;

    color: var(--an-mute) !important;

    margin: 0 0 8px 0 !important;

}



.vk-c input,

.vk-c select,

.vk-c textarea {

    display: block !important;

    width: 100% !important;

    background: var(--an-ink) !important;

    border: 1px solid rgba(255,255,255,0.1) !important;

    color: var(--an-paper) !important;

    padding: 14px 16px !important;

    border-radius: 8px !important;

    font-size: 14px !important;

    font-family: 'Manrope', sans-serif !important;

    outline: none !important;

    box-sizing: border-box !important;

}



.vk-c input:focus,

.vk-c select:focus,

.vk-c textarea:focus {

    border-color: var(--an-gold) !important;

}



.vk-c textarea {

    min-height: 140px !important;

    resize: vertical !important;

}



.vk-check2 {

    display: block !important;

    overflow: hidden !important;

}



.vk-check2 input[type="checkbox"] {

    float: left !important;

    width: 18px !important;

    height: 18px !important;

    margin: 2px 10px 0 0 !important;

    accent-color: var(--an-gold) !important;

}



.vk-check2 label {

    display: block !important;

    margin-left: 28px !important;

    font-size: 13px !important;

    color: var(--an-mute) !important;

    line-height: 1.5 !important;

    cursor: pointer !important;

}



.vk-check2 a {

    color: var(--an-gold) !important;

}



.vk-actions2 {

    display: block !important;

    margin-top: 24px !important;

    overflow: hidden !important;

}



.vk-actions2 button {

    background: var(--an-gold) !important;

    color: var(--an-ink) !important;

    border: none !important;

    border-radius: 8px !important;

    padding: 14px 28px !important;

    font-family: 'Unbounded', sans-serif !important;

    font-size: 12px !important;

    font-weight: 700 !important;

    letter-spacing: 0.14em !important;

    text-transform: uppercase !important;

    cursor: pointer !important;

    float: left !important;

}



.vk-actions2 button:hover {

    background: var(--an-gold-2) !important;

}



.vk-actions2 span {

    display: block !important;

    margin-left: 240px !important;

    padding-top: 16px !important;

    font-size: 13px !important;

    color: var(--an-mute) !important;

}



@media (max-width: 768px) {

    .vk-form2 { padding: 24px 20px !important; }

    .vk-c {

        float: none !important;

        width: 100% !important;

        margin-right: 0 !important;

    }

    .vk-actions2 span {

        margin-left: 0 !important;

        padding-top: 12px !important;

    }

}




/* Кнопка + подпись — в одну строку, без наложения */

.vk-actions2 {

    display: flex !important;

    align-items: center !important;

    gap: 20px !important;

    flex-wrap: wrap !important;

    margin-top: 24px !important;

    overflow: visible !important;

}



.vk-actions2 button {

    float: none !important;

    flex-shrink: 0 !important;

}



.vk-actions2 span {

    display: inline-block !important;

    margin-left: 0 !important;

    padding-top: 0 !important;

    font-size: 13px !important;

    color: var(--an-mute) !important;

}



/* Пустая ячейка — резерв */

.vk-c.vk-empty {

    visibility: hidden !important;

}



/* Мобильная версия */

@media (max-width: 768px) {

    .vk-actions2 {

        flex-direction: column !important;

        align-items: stretch !important;

    }

    .vk-actions2 button {

        width: 100% !important;

    }

    .vk-c.vk-empty {

        display: none !important;

    }

}




/* Якоря: отступ от sticky-меню */

html {

    scroll-behavior: smooth;

    scroll-padding-top: 140px;

}



section[id],

div[id]:not(.an-hero):not(.an-break):not(.an-top-b) {

    scroll-margin-top: 140px;

}



#kastingi-form-section,

#roles,

#map-how,

#structure,

#about,

#arthel,

#how-to-join,

#faq,

#kastingi-contacts {

    scroll-margin-top: 160px;

}