.page--automation .section h2 { font-size: clamp(28px, 3vw, 42px); }
.page--automation .section .lead { font-size: 18px; }
.auto-eyebrow { color: var(--auto); }
@media (max-width: 599.98px) {
  .page--automation .section .lead { font-size: 16px; }
}
.auto-hero h1 { font-size: clamp(38px, 4.6vw, 64px); line-height: 1.04; }
.auto-hero .split__text { gap: 22px; }
.auto-hero .page-head__actions { padding-top: 6px; }
.auto-hero__media {
  display: flex; flex-direction: column; align-items: center; gap: 18px;
  padding: 44px 24px 36px; border-radius: var(--r-panel);
  background-color: var(--deep); background-image: var(--dots); background-size: var(--dot-size) var(--dot-size);
}
.auto-hero__media .phone-frame { --pw: 264px; }
.auto-hero__caption { font-size: 14px; color: rgba(255,255,255,.8); text-align: center; }
@media (min-width: 900px) {
  .auto-hero { padding: 80px 0 96px; }
  .auto-hero .split { gap: 64px; }
  .auto-hero .split__text { flex: 1 1 416px; }
  .auto-hero .split__media { flex: 1 1 356px; }
}
@media (max-width: 899.98px) {
  .auto-hero .split { gap: 28px; }
  .auto-hero .split__text { gap: 18px; }
  .auto-hero h1 { line-height: 1.06; }
}
@media (max-width: 599.98px) {
  .auto-hero .page-head__actions { padding-top: 4px; gap: 10px; }
  .auto-hero__media { padding: 32px 20px 24px; gap: 16px; }
  .auto-hero__media .phone-frame { --pw: 240px; }
}
.auto-pair { gap: 20px; }
.auto-card { background: var(--bg); padding: 28px 30px; }
.auto-card__title { font-size: 19px; }
.auto-list { font-size: 16px; color: var(--ink-2); }
.auto-way {
  min-width: 0; display: flex; flex-direction: column; gap: 22px; padding: 32px;
  background: var(--surface); border: 1px solid var(--line); border-radius: var(--r-panel);
}
.auto-way__title { font-size: 22px; font-weight: 700; }
@media (max-width: 599.98px) {
  .auto-pair { gap: 14px; }
  .auto-card { padding: 22px 20px; gap: 14px; }
  .auto-card__title { font-size: 17px; }
  .auto-list { font-size: 15px; }
  .auto-way { padding: 22px 20px; gap: 18px; }
  .auto-way__title { font-size: 17px; font-weight: 650; }
}
.auto-pic { display: flex; flex-direction: column; justify-content: center; padding: 22px; border-radius: 14px; }
.auto-pic--way { min-height: 262px; }
.auto-pic--rule { min-height: 304px; padding: 18px; gap: 8px; }
.auto-pic--hi { gap: 4px; }
.auto-pic--chat { background: #E5DDD5; }
.auto-pic--flow { align-items: center; background: var(--surface-2); }
.auto-pic--plain { padding: 20px; gap: 12px; background: var(--surface); border: 1px solid var(--line); }
.wa-menu { width: 100%; max-width: 300px; display: flex; flex-direction: column; gap: 4px; }
.wa-menu--reply { align-self: flex-start; max-width: 280px; margin-top: 6px; }
.wa-msg, .wa-btn {
  display: block; padding: 7px 10px; border-radius: 8px; background: #FFFFFF; box-shadow: 0 1px 1px rgba(0,0,0,.1);
  font-size: 14px; line-height: 1.4; color: #111B21;
}
.wa-msg--timed { padding: 8px 10px 5px; }
.wa-msg--out { align-self: flex-end; background: #D9FDD3; }
.wa-msg--in { align-self: flex-start; max-width: 90%; }
.wa-msg--short { padding: 5px 12px; }
.wa-time { display: block; text-align: right; font-size: 11px; color: #667781; }
.wa-btn { padding: 9px 10px; font-weight: 600; text-align: center; color: #027EB5; }
.wa-menu--reply .wa-btn { padding: 7px 10px; font-size: 13px; }
.flow { width: 100%; max-width: 300px; display: flex; flex-direction: column; }
.flow__step {
  display: flex; flex-direction: column; gap: 2px; padding: 9px 14px;
  background: var(--surface); border: 1px solid var(--line); border-radius: 10px;
}
.flow__kind { font-size: 12px; font-weight: 700; color: var(--auto); }
.flow__text { font-size: 14px; color: var(--ink); }
.flow__line { display: block; align-self: center; width: 2px; height: 18px; background: var(--fieldline); }
.kw__label { display: block; font-size: 13px; color: var(--ink-3); }
.kw__words { display: flex; flex-wrap: wrap; gap: 8px; }
.kw__word { padding: 5px 14px; border-radius: var(--r-chip); background: var(--auto-soft); font-size: 14px; font-weight: 600; color: var(--auto); }
.kw__go { display: flex; align-items: center; gap: 10px; font-size: 13px; color: var(--ink-3); }
.kw__go .icon { width: 18px; height: 18px; }
.kw__step {
  padding: 5px 12px; border: 1px solid var(--line); border-radius: 10px; background: var(--bg);
  font-size: 14px; font-weight: 600; color: var(--ink);
}
@media (max-width: 599.98px) {
  .auto-pic { padding: 18px; }
  .auto-pic--way, .auto-pic--rule { min-height: 0; }
  .auto-pic--rule.auto-pic--chat { padding: 16px; }
  .auto-pic--plain { padding: 18px; }
  .wa-menu { max-width: 260px; }
  .flow { max-width: none; }
}
.auto-kinds {
  list-style: none; margin: 0; padding: 0;
  display: grid; grid-template-columns: repeat(auto-fit, minmax(min(250px, 100%), 1fr)); gap: 20px;
}
.auto-kind {
  display: flex; flex-direction: column; gap: 10px; padding: 24px;
  background: var(--bg); border: 1px solid var(--line); border-radius: var(--r-card);
}
.auto-kind__icon {
  flex: none; width: 44px; height: 44px; margin-bottom: 4px; border-radius: 12px;
  background: var(--auto-soft); color: var(--auto); display: flex; align-items: center; justify-content: center;
}
.auto-kind__body { display: flex; flex-direction: column; gap: 10px; }
.auto-kind__title { font-size: 18px; }
.auto-kind__text { font-size: 15px; color: var(--ink-2); }
.auto-note {
  display: flex; align-items: center; gap: 16px; margin-top: 20px; padding: 18px 22px;
  border: 1px dashed var(--fieldline); border-radius: var(--r-card); font-size: 15px; color: var(--ink-2);
}
.auto-note strong { color: var(--ink); }
.auto-note__icon {
  flex: none; width: 40px; height: 40px; border-radius: 12px; background: var(--surface-2); color: var(--ink-2);
  display: flex; align-items: center; justify-content: center;
}
.auto-note__icon .icon { width: 22px; height: 22px; }
@media (min-width: 900px) { .auto-kinds { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
@media (min-width: 600px) and (max-width: 899.98px) {
  .auto-kinds { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .auto-kind:last-child:nth-child(odd) { grid-column: 1 / -1; }
}
@media (max-width: 599.98px) {
  .auto-kinds { display: flex; flex-direction: column; gap: 12px; }
  .auto-kind { flex-direction: row; gap: 14px; padding: 16px; }
  .auto-kind__icon { width: 40px; height: 40px; margin: 0; border-radius: 11px; }
  .auto-kind__icon .icon { width: 22px; height: 22px; }
  .auto-kind__body { gap: 4px; }
  .auto-kind__title { font-size: 17px; }
  .auto-note { align-items: flex-start; gap: 14px; margin-top: 16px; padding: 16px 18px; }
  .auto-note__icon { border-radius: 11px; }
}
.auto-views { display: flex; flex-wrap: wrap; align-items: flex-start; gap: 32px; }
.auto-view { flex: 1 1 400px; min-width: 0; display: flex; flex-direction: column; gap: 16px; }
.auto-view__caption { display: flex; flex-direction: column; gap: 4px; }
.auto-view__title { font-size: 17px; font-weight: 650; color: var(--ink); }
.auto-view__text { font-size: 15px; color: var(--ink-2); }
@media (max-width: 599.98px) {
  .auto-views { gap: 28px; }
  .auto-view { gap: 12px; }
}
.auto-rules { gap: 20px; }
@media (min-width: 900px) { .auto-rules { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 899.98px) { .auto-rules { grid-template-columns: minmax(0, 1fr); } }
.auto-rule {
  min-width: 0; display: flex; flex-direction: column; gap: 18px; padding: 26px;
  background: var(--bg); border: 1px solid var(--line); border-radius: var(--r-panel);
}
.auto-rule__text { font-size: 15px; color: var(--ink-2); }
.auto-rule__list { gap: 8px; font-size: 15px; color: var(--ink-2); }
.ticks > li.auto-no::before {
  background: var(--ink-3);
  -webkit-mask-image: url(/assets/img/ui-cross-a08febfe.svg); mask-image: url(/assets/img/ui-cross-a08febfe.svg);
}
@media (max-width: 599.98px) {
  .auto-rules { gap: 14px; }
  .auto-rule { padding: 20px; gap: 16px; }
}
.auto-forms { display: flex; flex-wrap: wrap-reverse; align-items: center; gap: 56px; }
.auto-forms__media { flex: 1 1 410px; min-width: 0; }
.auto-forms__text { flex: 1 1 370px; min-width: 0; display: flex; flex-direction: column; gap: 20px; }
.auto-forms__head { display: flex; flex-direction: column; gap: 14px; }
.auto-forms__types { display: flex; flex-direction: column; gap: 10px; }
.auto-forms__types-title { font-size: 15px; font-weight: 700; }
.auto-chips {
  list-style: none; margin: 0; padding: 0;
  display: flex; flex-wrap: wrap; gap: 8px; font-size: 14px; color: var(--ink);
}
.auto-chips > li { padding: 5px 13px; border: 1px solid var(--line); border-radius: var(--r-chip); background: var(--surface); }
@media (max-width: 899.98px) {
  .auto-forms { flex-flow: column nowrap; align-items: stretch; gap: 20px; }
  .auto-forms__text { display: contents; }
  .auto-forms__head { order: 1; }
  .auto-forms__lead { order: 2; }
  .auto-forms__media { order: 3; flex: none; }
  .auto-forms__types { order: 4; }
  .auto-forms__list { order: 5; }
}
@media (max-width: 599.98px) {
  .auto-forms__head { gap: 10px; }
  .auto-forms__types-title { font-size: 17px; font-weight: 650; }
  .auto-chips > li { padding: 6px 13px; }
}
.auto-langs { display: flex; flex-wrap: wrap; align-items: center; gap: 56px; }
.auto-langs__text { flex: 1 1 320px; min-width: 0; display: flex; flex-direction: column; gap: 14px; }
.auto-chips--langs { flex: 1.4 1 460px; min-width: 0; gap: 10px; font-size: 15px; font-weight: 500; }
.auto-chips--langs > li { padding: 7px 16px; background: var(--bg); }
@media (max-width: 899.98px) {
  .auto-langs { flex-direction: column; align-items: stretch; gap: 24px; }
  .auto-langs__text, .auto-chips--langs { flex: none; }
}
@media (max-width: 599.98px) {
  .auto-langs__text { gap: 10px; }
  .auto-chips--langs { gap: 8px; }
  .auto-chips--langs > li { padding: 7px 14px; }
}
.auto-publish { gap: 20px; }
.auto-after { margin-top: 20px; font-size: 15px; color: var(--ink-2); }
@media (max-width: 599.98px) {
  .auto-publish { gap: 12px; }
  .auto-publish .step { padding: 20px; background: var(--surface); border: 1px solid var(--line); border-radius: var(--r-card); }
  .auto-after { margin-top: 16px; }
}
.auto-faq { border-bottom: 0; }
.auto-faq__inner { display: flex; flex-wrap: wrap; gap: 56px; }
.auto-faq__head { flex: 1 1 270px; min-width: 0; display: flex; flex-direction: column; gap: 14px; }
.auto-faq__more { font-size: 16px; color: var(--ink-2); }
.auto-faq__list { flex: 2 1 510px; min-width: 0; }
@media (max-width: 899.98px) {
  .auto-faq__inner { flex-direction: column; gap: 20px; }
  .auto-faq__head, .auto-faq__list { flex: none; }
}
@media (max-width: 599.98px) {
  .auto-faq__head { gap: 10px; }
  .auto-faq__more { font-size: 15px; }
}
