/* vcp-buttons.css v2 — единая система кнопок VCP Travel (07.10.2026)
   Подключать ПОСЛЕ vcp-fonts.css. Только html-префикс, без important-флагов.
   Варианты: primary / secondary (outline) / tertiary (текстовая ссылка) / icon / chip; размеры M (48) и L (56);
   тон on-dark для тёмных секций (hero главной, FAQ Японии). */
html:root{
  --btn-h-m:48px; --btn-h-l:56px; --btn-icon:48px; --btn-tap:48px;
  --btn-px-m:24px; --btn-px-l:32px; --btn-gap:12px; --btn-gap-sm:8px;
  --btn-radius:12px; --btn-border:1.5px;
  --btn-font:var(--font-text,"Golos Text",Arial,sans-serif);
  --btn-fs-m:15px; --btn-fs-l:16px; --btn-fw:600; --btn-fw-2:500; --btn-ls:0.01em; --btn-lh:1.2;
  --btn-navy:#1a2744; --btn-navy-hover:#0d182c; --btn-navy-active:#08101f;
  --btn-paper:#fff; --btn-paper-hover:#f7f4ee; --btn-cream:#efe2c8;
  --btn-ondark:#f3f4f6; --btn-ondark-hover:#fff; --btn-ondark-line:rgba(237,237,243,.42); --btn-ondark-line-hover:rgba(237,237,243,.72);
  --btn-disabled-bg:#d9d7d1; --btn-disabled-fg:#7a776f;
  --btn-ring:0 0 0 2px #fff,0 0 0 4px #1a2744; --btn-ring-ondark:0 0 0 2px #141820,0 0 0 4px #f3f4f6;
  --btn-shadow:0 1px 2px rgba(15,23,42,.08),0 4px 12px rgba(15,23,42,.08);
  --btn-ease:160ms cubic-bezier(.2,.6,.2,1);
}
/* ---------- база ---------- */
html .hero__btn, html .sg-btn, html .jp-hero__actions .sg-btn, html .sc-btn, html .sc-hero__actions .sc-btn, html .submit-btn, html .visa-submit, html .visa-form--kp .visa-submit,
html .btn-primary.cab-cta, html .press-cta, html #press .press-cta, html .jp-faq__btn, html .vcp-cookie__btn, html .dest-btn{
  box-sizing:border-box; display:inline-flex; align-items:center; justify-content:center; gap:8px;
  min-height:var(--btn-h-m); height:auto; padding:0 var(--btn-px-m);
  font-family:var(--btn-font); font-size:var(--btn-fs-m); font-weight:var(--btn-fw); letter-spacing:var(--btn-ls);
  line-height:var(--btn-lh); text-transform:none; white-space:nowrap; text-decoration:none;
  border-radius:var(--btn-radius); border:var(--btn-border) solid transparent;
  cursor:pointer; -webkit-tap-highlight-color:transparent;
  transition:background-color var(--btn-ease),border-color var(--btn-ease),color var(--btn-ease),box-shadow var(--btn-ease),transform var(--btn-ease);
}
html .sg-btn svg, html .jp-hero__actions .sg-btn svg, html .sc-btn svg, html .sc-hero__actions .sc-btn svg{width:18px;height:18px;flex:0 0 auto}
/* ---------- PRIMARY (navy) ---------- */
html .sg-btn--fill, html .jp-hero__actions .sg-btn--fill, html .sc-btn--fill, html .sc-hero__actions .sc-btn--fill, html .submit-btn, html .btn-primary.cab-cta, html .press-cta, html #press .press-cta,
html .vcp-cookie__btn--solid, html .visa-submit, html .visa-form--kp .visa-submit{
  background:var(--btn-navy); border-color:var(--btn-navy); color:#fff; box-shadow:var(--btn-shadow);
}
html .sg-btn--fill:hover, html .jp-hero__actions .sg-btn--fill:hover, html .sc-btn--fill:hover, html .sc-hero__actions .sc-btn--fill:hover, html .submit-btn:hover, html .btn-primary.cab-cta:hover, html .press-cta:hover, html #press .press-cta:hover,
html .vcp-cookie__btn--solid:hover, html .visa-submit:hover:not(:disabled), html .visa-form--kp .visa-submit:hover:not(:disabled){
  background:var(--btn-navy-hover); border-color:var(--btn-navy-hover); color:#fff;
}
html .sg-btn--fill:active, html .jp-hero__actions .sg-btn--fill:active, html .sc-btn--fill:active, html .sc-hero__actions .sc-btn--fill:active, html .submit-btn:active, html .btn-primary.cab-cta:active, html .press-cta:active, html #press .press-cta:active,
html .vcp-cookie__btn--solid:active, html .visa-submit:active:not(:disabled), html .visa-form--kp .visa-submit:active:not(:disabled){
  background:var(--btn-navy-active); transform:translateY(1px); box-shadow:none;
}
/* L: отправка формы */
html .submit-btn, html .visa-submit, html .visa-form--kp .visa-submit{min-height:var(--btn-h-l); padding:0 var(--btn-px-l); font-size:var(--btn-fs-l)}
html .visa-submit::after{border-radius:inherit}
/* PRIMARY on-dark (hero главной, FAQ Японии) */
html .hero__btn--fill, html .jp-faq__btn{background:var(--btn-ondark); border-color:var(--btn-ondark); color:#141820; box-shadow:none}
html .hero__btn--fill:hover, html .jp-faq__btn:hover{background:var(--btn-ondark-hover); border-color:var(--btn-ondark-hover); color:#141820}
html .hero__btn--fill:active, html .jp-faq__btn:active{background:#e4e6ea; transform:translateY(1px)}
/* ---------- SECONDARY (outline) ---------- */
html .sg-btn--line, html .jp-hero__actions .sg-btn--line, html .sc-btn--line, html .sc-hero__actions .sc-btn--line, html .vcp-cookie__btn--ghost{background:var(--btn-paper); border-color:var(--btn-navy); color:var(--btn-navy); box-shadow:none}
html .sg-btn--line:hover, html .jp-hero__actions .sg-btn--line:hover, html .sc-btn--line:hover, html .sc-hero__actions .sc-btn--line:hover, html .vcp-cookie__btn--ghost:hover{background:var(--btn-paper-hover); color:var(--btn-navy)}
html .sg-btn--line:active, html .jp-hero__actions .sg-btn--line:active, html .sc-btn--line:active, html .sc-hero__actions .sc-btn--line:active, html .vcp-cookie__btn--ghost:active{background:var(--btn-cream); transform:translateY(1px)}
html .hero__btn--line{background:transparent; border-color:var(--btn-ondark-line); color:var(--btn-ondark)}
html .hero__btn--line:hover{border-color:var(--btn-ondark-line-hover); background:rgba(247,246,255,.06)}
html .hero__btn--line:active{background:rgba(247,246,255,.12); transform:translateY(1px)}
/* CHIP (выбор направления в попапе главной) = secondary M */
html .dest-btn{justify-content:space-between; font-weight:var(--btn-fw-2); background:var(--btn-paper); border-color:#e6e2d8; color:#0f1419; box-shadow:none}
html .dest-btn:hover{border-color:var(--btn-navy)}
html .dest-btn[aria-selected="true"]{background:#f6f1e4; border-color:var(--btn-navy)}
/* ---------- DISABLED / LOADING ---------- */
html .visa-submit:disabled, html .visa-form--kp .visa-submit:disabled, html .submit-btn:disabled,
html [class*="btn"][aria-disabled="true"]{background:var(--btn-disabled-bg); border-color:var(--btn-disabled-bg); color:var(--btn-disabled-fg); box-shadow:none; cursor:not-allowed; transform:none}
html [class*="btn"][aria-busy="true"], html .is-loading[class*="btn"]{position:relative; color:transparent; pointer-events:none}
html [class*="btn"][aria-busy="true"]::before, html .is-loading[class*="btn"]::before{content:""; position:absolute; inset:0; margin:auto; width:18px; height:18px;
  border-radius:50%; border:2px solid #fff; border-right-color:transparent; animation:vcp-btn-spin .7s linear infinite}
@keyframes vcp-btn-spin{to{transform:rotate(360deg)}}
@media (prefers-reduced-motion:reduce){html [class*="btn"]{transition:none}}
/* ---------- FOCUS-VISIBLE ---------- */
html .sg-btn:focus-visible, html .jp-hero__actions .sg-btn:focus-visible, html .sc-btn:focus-visible, html .sc-hero__actions .sc-btn:focus-visible, html .submit-btn:focus-visible, html .visa-submit:focus-visible,
html .btn-primary.cab-cta:focus-visible, html .press-cta:focus-visible, html #press .press-cta:focus-visible, html .vcp-cookie__btn:focus-visible, html .dest-btn:focus-visible,
html .close-btn:focus-visible, html .b2b-x:focus-visible, html .visa-bar__burger:focus-visible, html .visa-bar__close:focus-visible,
html .visa-bar__phone:focus-visible, html a[href^="tel:"]:focus-visible, html .site-foot__list button:focus-visible, html .site-foot__list a:focus-visible,
html .site-foot__soc a:focus-visible, html .vcp-cookie a:focus-visible{outline:none; box-shadow:var(--btn-ring); border-radius:var(--btn-radius)}
html .hero__btn:focus-visible, html .jp-faq__btn:focus-visible, html .rail-nav button:focus-visible{outline:none; box-shadow:var(--btn-ring-ondark)}
/* ---------- ICON 48×48 (display не трогаем: бургер на десктопе скрыт page-CSS) ---------- */
html .visa-sheet--b2b .b2b-x, html .visa-bar__burger, html .rail-nav button{min-width:var(--btn-icon); min-height:var(--btn-icon); width:var(--btn-icon); height:var(--btn-icon);
  padding:0; border-radius:var(--btn-radius); cursor:pointer}
html .rail-nav button{border-radius:50%}
/* крестик попапа главной: тап-зона 48 без сдвига шапки попапа */
html .close-btn{padding:8px; margin:-8px; border-radius:var(--btn-radius); cursor:pointer}
html .close-btn:hover, html .visa-sheet--b2b .b2b-x:hover{background:rgba(32,31,28,.06)}
/* ---------- TERTIARY: тап-зона 48px без сдвига вёрстки ---------- */
html .site-foot__list button, html .site-foot__list a, html a[href^="tel:"]:not([class*="btn"]), html .vcp-cookie__text a, html .jp-faq__tel{
  display:inline-block; padding-block:calc((var(--btn-tap) - 1.4em) / 2); margin-block:calc((1.4em - var(--btn-tap)) / 2);
  text-underline-offset:3px; font-weight:500}
html .visa-bar__phone{display:inline-flex; align-items:center; min-height:var(--btn-tap)}
html .site-foot__soc a{min-width:var(--btn-tap); min-height:var(--btn-tap); align-items:center; justify-content:center}
/* ---------- группы кнопок: 12 / 8 ---------- */
html .hero__cta, html .jp-hero__actions, html .sc-hero__actions, html .vcp-cookie__actions{gap:var(--btn-gap)}
@media (max-width:480px){
  html .hero__cta, html .jp-hero__actions, html .sc-hero__actions{gap:var(--btn-gap-sm)}
  html .hero__cta{display:flex; flex-direction:column; align-items:stretch}
  html .hero__btn, html .jp-hero__actions .sg-btn, html .sc-hero__actions .sc-btn, html .press-cta, html #press .press-cta, html .jp-faq__btn{width:100%}
}

/* ---------- v2 (07.10.2026): единая иконка «самолётик» у всех primary «Оставить заявку» / отправки формы ----------
   Правило: plane 20px, справа от текста, gap 8, currentColor (маска), у secondary/tertiary иконок нет.
   Стрелка → остаётся только у навигационных primary («Разобрать кейс →», «Смотреть все публикации →»).
   HTML-иконки в этих кнопках скрываются CSS-ом, чтобы не было дубля. */
html:root{--btn-icon-plane:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.8' stroke-linejoin='round' stroke-linecap='round'%3E%3Cpath d='M21.2 3.2 10.6 13.8'/%3E%3Cpath d='m21.2 3.2-7.1 17.6-3.5-7-7-3.5 17.6-7.1z'/%3E%3C/svg%3E"); --btn-icon-size:20px}
html .sg-btn--fill::before, html .jp-hero__actions .sg-btn--fill::before, html .sc-btn--fill::before, html .sc-hero__actions .sc-btn--fill::before,
html .btn-primary.cab-cta::before, html .submit-btn::before, html .visa-submit::before{
  content:""; order:2; flex:0 0 var(--btn-icon-size); width:var(--btn-icon-size); height:var(--btn-icon-size);
  background:currentColor; -webkit-mask:var(--btn-icon-plane) center/contain no-repeat; mask:var(--btn-icon-plane) center/contain no-repeat;
}
html .sg-btn--fill > svg, html .jp-hero__actions .sg-btn--fill > svg, html .btn-primary.cab-cta > svg, html .submit-btn > span[aria-hidden], html .submit-btn > span:only-of-type{display:none}
html .visa-submit > span{order:1}
html [aria-busy="true"]::before{-webkit-mask:none; mask:none; background:none}
