/* Vacancy card actions — compact layout */
.vp-vacancy-actions{
  display:grid;
  grid-template-columns: 1fr 1fr;
  gap:10px;
  margin-top:auto;          /* push actions to the bottom */
  padding-top:12px;
}

/* 3 actions: details (full width) + 2 half buttons */
.vp-vacancy-actions--3 .vp-btn-details{ grid-column: 1 / -1; }

/* 1 action: full width */
.vp-vacancy-actions--1 .vp-btn-details{ grid-column: 1 / -1; }

/* 2 actions: 2 columns on desktop-like widths */
.vp-vacancy-actions--2 .vp-btn-details{ grid-column: 1 / -1; }
.vp-vacancy-actions--2 .vp-btn-calc{ grid-column: 1 / -1; }
.vp-vacancy-actions--2 .vp-btn-callback{ grid-column: 1 / -1; }

.vp-btn{
  height: 44px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  text-align:center;
  padding:0 14px;
  border-radius:14px;
  border: 1px solid transparent;
  text-decoration:none;
  cursor:pointer;
  font-weight:700;
  font-size:14px;
  line-height:1;
}

/* Button icons */
.vp-btn .vp-ico{
  display:inline-flex;
  width:18px;
  height:18px;
  margin-right:8px;
  flex:0 0 18px;
}
.vp-btn .vp-ico svg{ display:block; width:18px; height:18px; }

.vp-btn-details{
  background: linear-gradient(90deg, #00C853, #00B0FF);
  color:#fff;
}

/* Calculator button — presentable secondary */
.vp-btn-calc{
  background:#ffffff;
  border-color: rgba(0,160,169,.35);
  color:#0b7285;
}
.vp-btn-calc:hover{
  background: rgba(0,160,169,.08);
}

.vp-btn-callback{
  background:#f8fafc;
  border-color:#e5e7eb;
  color:#111;
}

/* SINGLE: make callback primary (main conversion action) */
.vp-single-ctabox .vp-btn-primary{
  background: linear-gradient(90deg, #00C853, #00B0FF);
  color:#fff;
  border-color: transparent;
  box-shadow: 0 10px 26px rgba(0,0,0,.12);
}
.vp-single-ctabox .vp-btn-primary:hover{
  filter: brightness(1.02);
}



/* SINGLE: CTA box under highlights (Variant A) */
.vp-single-ctabox{
  margin-top: 16px;
  background: #fff;
  border: 1px solid rgba(15,23,42,.10);
  border-radius: 18px;
  padding: 14px;
  box-shadow: 0 12px 30px rgba(2,6,23,.06);
}
.vp-single-cta-row{
  display:flex;
  gap: 12px;
  align-items: stretch;
}
.vp-btn-block{
  width:100%;
}
.vp-single-ctabox .vp-btn-primary{
  height: 48px;
  border-radius: 16px;
  font-weight: 800;
}
.vp-btn-calc-icon{
  width: 52px;
  min-width: 52px;
  height: 48px;
  padding: 0;
  border-radius: 16px;
  background: #fff;
  border: 1px solid rgba(0,160,169,.35);
  color:#0b7285;
  box-shadow: 0 10px 24px rgba(2,6,23,.06);
}

/* Icon-only calc button: center icon (remove default icon right margin) */
.vp-btn-calc-icon .vp-ico{
  margin-right: 0;
}
.vp-btn-calc-icon:hover{
  background: rgba(0,160,169,.06);
  border-color: rgba(0,160,169,.55);
}
.vp-btn-calc-icon:active{
  transform: translateY(1px);
}
.vp-sr{
  position:absolute!important;
  width:1px;height:1px;
  padding:0;margin:-1px;
  overflow:hidden;clip:rect(0,0,0,0);
  white-space:nowrap;border:0;
}
@media (max-width: 520px){
  .vp-single-cta-row{ gap: 10px; }
  .vp-btn-calc-icon{ width: 48px; min-width:48px; }
}
/* SINGLE: embedded calculator wrapper */
.vp-single-calcwrap{
  width:100%;
  margin-top: 12px;
}
.vp-single-calcwrap .owcalc{
  margin: 0;
  padding: 0;
  max-width: none;
}


.vp-vacancies-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
    gap: 24px;
}

.vp-vacancy-card {
    background: #ffffff;
    border-radius: 14px;
    box-shadow: 0 6px 24px rgba(0,0,0,.08);
    overflow: hidden;
    display: flex;
    flex-direction: column;
    transition: transform .2s ease, box-shadow .2s ease;
}

.vp-vacancy-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 10px 32px rgba(0,0,0,.12);
}

.vp-vacancy-image img {
    width: 100%;
    height: 220px;
    object-fit: cover;
}

.vp-vacancy-content {
    padding: 18px;
    display: flex;
    flex-direction: column;
    gap: 10px;
    flex: 1;
}

/* Keep cards visually consistent */
.vp-vacancy-tags{
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.vp-vacancy-title{
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.vp-vacancy-tags span {
    font-size: 13px;
    color: #6b4eff;
    margin-right: 8px;
}

.vp-vacancy-title {
    font-size: 18px;
    font-weight: 600;
    line-height: 1.3;
}

.vp-vacancy-meta {
    display: flex;
    gap: 16px;
    font-size: 14px;
    color: #555;
}

.vp-vacancy-cta {
    margin-top: auto;
    padding: 14px;
    border-radius: 10px;
    background: linear-gradient(135deg, #6b4eff, #8367ff);
    color: #fff;
    border: none;
    cursor: pointer;
    font-weight: 600;
    transition: opacity .2s ease;
}

.vp-vacancy-cta:hover {
    opacity: .9;
}

.vp-archive-vacancies {
    max-width: 1100px;
    margin: 0 auto;
    padding: 20px;
}

.vp-filter-buttons {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin: 15px 0;
}

.vp-filter-btn {
    padding: 10px 14px;
    border-radius: 12px;
    text-decoration: none;
    background: #f3f3f3;
    color: #111;
    font-weight: 600;
}

.vp-filter-btn.is-active {
    background: #111;
    color: #fff;
}

.vp-filter-form {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    align-items: end;
    margin: 10px 0 25px;
}

.vp-filter-form input {
    padding: 10px 12px;
    border-radius: 10px;
    border: 1px solid #ddd;
}

.vp-filter-form button {
    padding: 10px 14px;
    border-radius: 10px;
    border: none;
    background: #00c46f;
    color: #fff;
    cursor: pointer;
}

.vp-filter-reset{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  height:42px;
  padding:0 14px;
  border-radius:10px;
  text-decoration:none;
  background:#eaeaea;
  color:#111;
  font-weight:600;
}
.vp-filter-form{
  display:flex;
  gap:10px;
  align-items:flex-end;
  flex-wrap:wrap;
}

.vp-filter-field{
  display:flex;
  flex-direction:column;
  gap:6px;
}

.vp-filter-label{
  font-weight:600;
  font-size:14px;
}

.vp-filter-submit{
  height: 42px;
}
.vp-filter-form input{
  height: 42px;
}
.vp-archive-list.is-loading {
  opacity: .55;
  pointer-events: none;
  transition: opacity .15s ease;
}
.vp-archive-list.is-loading::before{
  content:"Завантаження…";
  color: #111;
  display:block;
  margin: 10px 0 18px;
  font-weight:600;
}
/* SINGLE VACANCY */
.vp-single-vacancy{
  max-width: 1100px;
  margin: 0 auto;
  padding: 20px;
}

.vp-single-hero{
  margin-bottom: 26px;
}


/* SINGLE: Full-width calculator section */
.vp-single-calc-section{
  margin: 18px 0 28px;
}
.vp-single-calc-section.is-open{
  animation: vpFadeIn .22s ease both;
}
.vp-single-calc-section.is-flash .owcalc{
  box-shadow: 0 0 0 4px rgba(0,160,169,.18), 0 16px 40px rgba(2,6,23,.08);
}

@keyframes vpFadeIn{
  from{ opacity:0; transform: translateY(-6px); }
  to{ opacity:1; transform: translateY(0); }
}


.vp-single-hero-grid{
  display: grid;
  grid-template-columns: 1.15fr 1fr;
  gap: 22px;
  align-items: start;
}

@media (max-width: 900px){
  .vp-single-hero-grid{
    grid-template-columns: 1fr;
  }
}

.vp-single-image img{
  width: 100%;
  height: auto;
  border-radius: 16px;
  display: block;
}

.vp-single-badges{
  display:flex;
  flex-wrap:wrap;
  gap: 8px;
  margin-bottom: 10px;
}

.vp-badge{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding: 6px 10px;
  border-radius: 999px;
  font-size: 13px;
  font-weight: 600;
  background: #f2f2f2;
  color: #111;
}

.vp-badge-tag{
  background:#efeaff;
  color:#5b3fff;
}

.vp-single-title{
  font-size: 32px;
  line-height: 1.15;
  margin: 6px 0 10px;
}

.vp-single-lead{
  font-size: 16px;
  color:#444;
  margin: 0 0 16px;
}

.vp-single-highlights{
  display:grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
  margin: 0 0 18px;
}

@media (max-width: 520px){
  .vp-single-highlights{
    grid-template-columns: 1fr;
  }
}

.vp-highlight{
  border: 1px solid #eaeaea;
  border-radius: 14px;
  padding: 12px 14px;
  background: #fff;
}

.vp-highlight-label{
  font-size: 12px;
  color:#666;
  margin-bottom: 6px;
  font-weight: 600;
}

.vp-highlight-value{
  font-size: 15px;
  color:#111;
  font-weight: 600;
}

.vp-single-actions{
  display:flex;
  gap: 10px;
  flex-wrap: wrap;
}

.vp-btn-go{
  background:#111;
  color:#fff;
}

.vp-btn-callback{
  background:#f5f5f5;
  color:#111;
  border: 1px solid #e5e5e5;
}
.vp-rate-list{
  margin: 0;
  padding-left: 18px;
}
.vp-rate-list li{
  margin: 4px 0;
}
/* MODAL */
.vp-modal{ display:none; }
.vp-modal.is-open{ display:block; }

.vp-modal__overlay{
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,.55);
  z-index: 9998;
}

.vp-modal__dialog{
  position: fixed;
  z-index: 9999;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: min(520px, calc(100% - 28px));
  background: #fff;
  border-radius: 16px;
  padding: 18px;
  box-shadow: 0 14px 60px rgba(0,0,0,.25);
}

.vp-modal__close{
  position:absolute;
  top: 10px;
  right: 12px;
  width: 34px;
  height: 34px;
  border-radius: 10px;
  border: 1px solid #e5e5e5;
  background:#fff;
  cursor:pointer;
  font-size: 22px;
  line-height: 1;
}

.vp-modal__title{ margin: 6px 0 6px; font-size: 20px; }
.vp-modal__subtitle{ margin: 0 0 12px; color:#555; }

.vp-field{ display:block; margin: 0 0 10px; }
.vp-field span{ display:block; font-size: 13px; font-weight:600; margin:0 0 6px; color:#333; }
.vp-field input, .vp-field textarea{
  width:100%;
  border:1px solid #e5e5e5;
  border-radius: 12px;
  padding: 10px 12px;
  box-sizing:border-box;
}

.vp-form__msg{ margin-top:10px; font-weight:600; }

.vp-modal-lock{ overflow:hidden; }

/* CTA "Questions" block */
.vp-help-cta{
  margin-top: 34px;
  border-radius: 18px;
  padding: 18px;
  background: linear-gradient(90deg, #00C853, #00B0FF);
}

.vp-help-cta__inner{
  padding: 22px 18px;
  border-radius: 16px;
  text-align: center;
}

.vp-help-cta__title{
  margin: 0 0 10px;
  color: #fff;
  font-size: 22px;
  font-weight: 800;
}

.vp-help-cta__text{
  margin: 0 0 18px;
  color: rgba(255,255,255,.95);
  font-size: 16px;
  font-weight: 600;
}

.vp-help-cta__btn{
  display: inline-flex;
  align-items: center;
  justify-content: center;

  min-height: 46px;
  padding: 0 26px;

  border-radius: 999px;
  background: #fff;
  color: #00b0ff;

  font-weight: 800;
  text-decoration: none;
  border: none;
  cursor: pointer;
}

.vp-vacancies-grid--home{
  display:grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 18px;
}

@media (max-width: 1024px){
  .vp-vacancies-grid--home{
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 768px){
  .vp-vacancies-grid--home{
    grid-template-columns: 1fr;
  }
}
/* Pagination */
.vp-pagination{
  margin: 22px 0 10px;
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  align-items: center;
}

.vp-pagination a,
.vp-pagination span{
  display: inline-flex;
  align-items: center;
  justify-content: center;

  min-width: 40px;
  height: 40px;
  padding: 0 12px;

  border-radius: 10px;
  border: 1px solid #e5e5e5;
  text-decoration: none;
  font-weight: 700;
  line-height: 1;
  box-sizing: border-box;

  background: #fff;
  color: #111;
}

.vp-pagination a:hover{
  background: #f3f3f3;
}

.vp-pagination .current{
  background: #111;
  color: #fff;
  border-color: #111;
}

.vp-pagination .dots{
  border-color: transparent;
  background: transparent;
  min-width: 18px;
  padding: 0 6px;
}

.vp-pagination a.prev,
.vp-pagination a.next{
  min-width: 44px;
  padding: 0 14px;
}
.vp-pagination{
  justify-content: center;
}
/* Badge on image corner */
.vp-vacancy-image{
  position: relative; /* важливо */
}

.vp-vacancy-status-badge{
  position: absolute;
  top: 12px;
  right: 12px;
  z-index: 2;

  display: inline-flex;
  align-items: center;
  justify-content: center;

  height: 30px;
  padding: 0 12px;

  border-radius: 999px;
  font-size: 12px;
  font-weight: 900;

  backdrop-filter: blur(8px);
  border: 1px solid rgba(255,255,255,.45);
}

.vp-vacancy-status-badge.is-active{
  background: rgba(231, 251, 240, 0.92);
  color: #0b7a3b;
}

.vp-vacancy-status-badge.is-closed{
  background: #e91732;
  color: #fff;
}
.vp-closed-notice{
  margin: 18px 0 18px;
  border-radius: 18px;
  padding: 16px;
  background: linear-gradient(90deg, #111, #444);
}

.vp-closed-notice__inner{
  border-radius: 16px;
  padding: 18px 16px;
  text-align: center;
}

.vp-closed-notice__title{
  margin: 0 0 10px;
  color: #fff;
  font-size: 20px;
  font-weight: 900;
}

.vp-closed-notice__text{
  margin: 0 0 16px;
  color: rgba(255,255,255,.92);
  font-size: 15px;
  font-weight: 600;
}

.vp-closed-notice__btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height: 46px;
  padding: 0 26px;
  border-radius: 999px;
  background:#fff;
  color:#111;
  font-weight: 900;
  text-decoration:none;
}
.vp-filter-group{
  display:flex;
  flex-wrap:wrap;
  gap: 10px;
  margin: 0 0 12px;
}

.vp-filter-btn{
  border: 1px solid #e5e5e5;
  background: #fff;
  color: #111;
  border-radius: 999px;
  padding: 10px 14px;
  font-weight: 800;
  cursor: pointer;
  line-height: 1;
}

.vp-filter-btn:hover{
  background:#f5f5f5;
}

.vp-filter-btn.is-active{
  background: #111;
  color:#fff;
  border-color:#111;
}
/* =========================
   FILTERS (FINAL OVERRIDE)
   ========================= */

/* Контейнер фільтрів: 3 рядки */
.vp-archive-filters{
  display: flex;
  flex-direction: column;
  gap: 14px;
  margin: 15px 0 25px;
}

/* Ряд 1: типи */
.vp-filter-buttons{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  align-items:center;
  margin: 0;
}

/* Ряд 2: країни */
.vp-filter-countries{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  align-items:center;
  margin: 0;
}

/* Загальний стиль для кнопок фільтра (типи/країни) */
.vp-filter-btn{
  height: 44px;
  display:inline-flex;
  align-items:center;
  justify-content:center;

  padding: 0 14px;
  border-radius: 999px;

  border: 1px solid #e5e5e5;
  background: #fff;
  color: #111;

  font-weight: 800;
  text-decoration: none;
  cursor: pointer;
  line-height: 1;
  box-sizing: border-box;
}

.vp-filter-btn:hover{
  background:#f5f5f5;
}

.vp-filter-btn.is-active{
  background: #111;
  color:#fff;
  border-color:#111;
}

/* Ряд 3: місто + кнопки */
.vp-filter-form{
  display:flex;
  flex-wrap:wrap;
  gap:12px;
  align-items:flex-end;
  margin: 0;
}

/* Поле "Місто / Гео" як колонка: label над input */
.vp-filter-field{
  display:flex;
  flex-direction:column;
  gap:6px;
}

.vp-filter-label{
  font-weight:700;
  font-size:14px;
  margin:0;
}

/* input міста */
.vp-filter-form input,
.vp-filter-form input[name="city"]{
  height:44px;
  padding: 0 14px;
  border-radius: 10px;
  border: 1px solid #ddd;
  box-sizing: border-box;
  min-width: 260px;
}

/* кнопка Фільтрувати */
.vp-filter-form button,
.vp-filter-submit{
  height:44px;
  padding: 0 16px;
  border-radius: 10px;
  border: none;
  background: #1a1e2a;
  color: #fff;
  cursor: pointer;
  font-weight: 800;
  line-height: 1;
  display:inline-flex;
  align-items:center;
  justify-content:center;
}

/* кнопка Скинути */
.vp-filter-reset,
.vp-reset-btn{
  height:44px;
  padding: 0 16px;
  border-radius: 10px;
  border: none;
  background:#eaeaea;
  color:#111;
  cursor:pointer;
  font-weight: 800;
  line-height: 1;
  display:inline-flex;
  align-items:center;
  justify-content:center;
}

/* Loading */
.vp-archive-list.is-loading {
  opacity: .55;
  pointer-events: none;
  transition: opacity .15s ease;
}
.vp-archive-list.is-loading::before{
  content:"Завантаження…";
  color: #111;
  display:block;
  margin: 10px 0 18px;
  font-weight:700;
}

/* Mobile */
@media (max-width: 768px){
  .vp-filter-form input,
  .vp-filter-form input[name="city"]{
    width:100%;
    min-width:100%;
  }

  .vp-filter-form button,
  .vp-filter-reset,
  .vp-reset-btn{
    width:100%;
  }
}

main.vp-archive-vacancies .vp-archive-seo-text{
  margin-top: 22px;
  padding: 0;
  border: 0;
  background: transparent;
  box-shadow: none;
}

main.vp-archive-vacancies .vp-archive-seo-text .wp-block-group,
main.vp-archive-vacancies .vp-archive-seo-text .wp-block-group__inner-container{
  padding: 0;
  border: 0;
  background: transparent;
  box-shadow: none;
}

/* Social block */
.vp-social-block{ margin:22px 0 0; }
.vp-social-block__title{ margin:0 0 6px; font-size:22px; font-weight:900; }
.vp-social-block__text{ margin:0; color:#555; font-weight:600; }

.vp-social-grid{
  display:grid;
  grid-template-columns: 1fr 1fr;
  gap:16px;
  margin-top:14px;
}
@media (max-width:768px){ .vp-social-grid{ grid-template-columns:1fr; } }

.vp-social-card{
  border-radius:18px;
  padding:18px;
  border:1px solid #e8e8e8;
  background:#fff;
  display:flex;
  align-items:center;
  gap:14px;
}

.vp-social-card.is-viber{ background:#f3e9ff; }
.vp-social-card.is-telegram{ background:#d8ecff; }
.vp-social-card.is-instagram{ background:#fff1f6; }
.vp-social-card.is-facebook{ background:#e9f1ff; }
.vp-social-card.is-youtube{ background:#ffecec; }

.vp-social-card__icon{
  width:54px; height:54px;
  border-radius:16px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  background:rgba(255,255,255,.7);
  border:1px solid rgba(0,0,0,.06);
  flex:0 0 auto;
  font-weight:900;
}

.vp-social-card__name{ margin:0 0 10px; font-size:18px; font-weight:900; }

.vp-social-card__btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:40px;
  padding:0 18px;
  border-radius:999px;
  text-decoration:none;
  background:#fff;
  border:1px solid rgba(0,0,0,.08);
  font-weight:800;
  color:#111;
}

.vp-social-card__icon{
  width: 54px;
  height: 54px;
  border-radius: 16px;
  background: rgba(255,255,255,.7);
  display:flex;
  align-items:center;
  justify-content:center;
  flex: 0 0 54px;
}

.vp-social-card__icon svg{
  width: 28px;
  height: 28px;
}

.vp-social-card__icon img{
  width: 28px;
  height: 28px;
  object-fit: contain;
  display:block;
}

.vp-vacancy-image-link { display:block; text-decoration:none; color:inherit; }
.vp-vacancy-image-link img { display:block; width:100%; height:auto; }

/* -----------------------------------------
   Vacancies — No results marketing block
   (shown inside cards grid)
------------------------------------------ */
.vp-assist{
  /* allow theme to override via --ow-accent etc */
  --vp-accent: var(--ow-accent, #00A0A9);
  --vp-accent-2: var(--ow-accent-2, #53B0D8);
  --vp-dark: var(--ow-dark, #0D0D0D);
  --vp-yellow: var(--ow-yellow, #F2C20C);
  --vp-yellow-2: var(--ow-yellow-2, #FFD54A);
  /* IMPORTANT: do NOT inherit section text variables (often white).
     Keep readable defaults inside white cards; can be overridden by
     setting --vp-text/--vp-muted on .vp-assist from the theme if needed. */
  --vp-text: #0F172A;
  --vp-muted: #64748B;
  --vp-border: #E5E7EB;
  --vp-card: #ffffff;
  --vp-radius: var(--ow-radius, 18px);

  grid-column: 1 / -1;
  background: var(--vp-card);
  border: 1px solid var(--vp-border);
  border-radius: calc(var(--vp-radius) + 2px);
  box-shadow: 0 12px 30px rgba(2,6,23,.08);
  overflow: hidden;
  position: relative;

  color: var(--vp-text);
}

.vp-assist::before{
  content:"";
  position:absolute;
  inset:0 0 auto 0;
  height:4px;
  background: linear-gradient(90deg, var(--vp-accent), var(--vp-accent-2));
}

.vp-assist__inner{
  display:grid;
  grid-template-columns: 1.35fr .95fr;
  gap: 18px;
  padding: 18px;
}

.vp-assist__kicker{
  display:inline-flex;
  align-items:center;
  gap:8px;
  font-size:12px;
  font-weight:800;
  color: var(--vp-text);
  background: rgba(0,160,169,.08);
  border: 1px solid rgba(0,160,169,.18);
  padding: 6px 10px;
  border-radius: 999px;
  width: max-content;
  margin-bottom: 10px;
}

.vp-assist__title{ margin:0 0 8px; font-size:18px; line-height:1.25; color:var(--vp-text); letter-spacing:-.2px; }
.vp-assist__text{ margin:0 0 12px; font-size:14px; line-height:1.55; color:var(--vp-muted); }

.vp-assist__points{ display:grid; grid-template-columns:1fr 1fr; gap:10px; margin-top:10px; }
.vp-assist__point{ border:1px solid var(--vp-border); border-radius:14px; padding:10px; background:#FBFCFF; }
.vp-assist__point b{ display:block; font-size:13px; color:var(--vp-text); margin-bottom:4px; }
.vp-assist__point span{ font-size:12px; color:var(--vp-muted); line-height:1.4; }

.vp-assist__chips{ display:flex; flex-wrap:wrap; gap:8px; margin-top:12px; }
.vp-chip{
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:6px 10px;
  border-radius:999px;
  border:1px solid var(--vp-border);
  background:#F8FAFC;
  font-size:12px;
  color:var(--vp-text);
}
.vp-assist__mini{ margin-top:8px; font-size:12px; color:var(--vp-muted); }

.vp-assist__side{
  border-left: 1px solid var(--vp-border);
  padding-left: 16px;
  display:flex;
  flex-direction:column;
  justify-content:center;
  gap: 10px;
}


.vp-btn__icon{ display:inline-flex; align-items:center; justify-content:center; }
.vp-ico{ width:18px; height:18px; display:block; }
.vp-btn__label{ display:inline-block; }

.vp-assist__btn{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  width:100%;
  padding: 14px 16px;
  border-radius: 16px;
  font-weight: 900;
  text-decoration:none;
  border: 1px solid transparent;
  user-select:none;
  transition: transform .15s ease, box-shadow .15s ease, filter .15s ease, background .15s ease, border-color .15s ease;
  letter-spacing: -.2px;
}

/* Primary: "Зателефонувати Вам?" — yellow CTA like your site */
.vp-assist__btn--primary{
  justify-content: space-between;
  color:#0B1220;
  background: linear-gradient(135deg, var(--vp-yellow), var(--vp-yellow-2));
  border-color: rgba(0,0,0,.06);
  box-shadow: 0 14px 28px rgba(242,194,12,.22), 0 6px 14px rgba(2,6,23,.10);
  position:relative;
  overflow:hidden;
}
.vp-assist__btn--primary::before{
  content:"";
  position:absolute;
  inset:-40% -60% auto auto;
  width:220px;
  height:220px;
  background: radial-gradient(circle at 30% 30%, rgba(255,255,255,.45), rgba(255,255,255,0) 60%);
  transform: rotate(18deg);
  pointer-events:none;
}
.vp-assist__btn--primary .vp-btn__label{ flex:1; text-align:center; }

/* Some themes use a:hover { color: ... } which can override button label color on hover.
   Force readable colors with higher specificity inside the assist block. */
.vp-assist a.vp-assist__btn--primary:hover,
.vp-assist a.vp-assist__btn--primary:focus,
.vp-assist a.vp-assist__btn--primary:focus-visible{
  color:#0B1220;
}
.vp-assist a.vp-assist__btn--ghost:hover,
.vp-assist a.vp-assist__btn--ghost:focus,
.vp-assist a.vp-assist__btn--ghost:focus-visible,
.vp-assist a.vp-assist__btn--outline:hover,
.vp-assist a.vp-assist__btn--outline:focus,
.vp-assist a.vp-assist__btn--outline:focus-visible{
  color: var(--vp-text);
}

/* Secondary: Telegram (white button) */
.vp-assist__btn--ghost{
  color: var(--vp-text);
  background:#fff;
  border-color: var(--vp-border);
  box-shadow: 0 10px 20px rgba(2,6,23,.06);
}

/* Tertiary: call manager (white/outline) */
.vp-assist__btn--outline{
  color: var(--vp-text);
  background:#fff;
  border-color: var(--vp-border);
  box-shadow: 0 10px 20px rgba(2,6,23,.06);
}

.vp-assist__btn:hover{ transform: translateY(-1px); }
.vp-assist__btn--primary:hover{ filter: saturate(1.02); box-shadow: 0 18px 36px rgba(242,194,12,.26), 0 8px 18px rgba(2,6,23,.12); }
.vp-assist__btn--ghost:hover,
.vp-assist__btn--outline:hover{ border-color: #CBD5E1; box-shadow: 0 14px 28px rgba(2,6,23,.09); }

.vp-assist__arrow{ font-weight:900; opacity:.9; }
.vp-assist__note{ font-size:12px; color: var(--vp-muted); line-height:1.4; }

@media (max-width: 860px){
  .vp-assist__inner{ grid-template-columns: 1fr; }
  .vp-assist__side{ border-left:none; border-top: 1px solid var(--vp-border); padding-left:0; padding-top: 14px; }
  .vp-assist__points{ grid-template-columns:1fr; }
}

/* Extra filters (vacancy_tag) — "Додаткові умови" */
.vp-filter-more{
  margin-top: 10px;
  padding-top: 6px;
}
.vp-filter-more summary{
  cursor: pointer;
  font-weight: 700;
  color: var(--vp-text, #0F172A);
  user-select: none;
  outline: none;
}
.vp-filter-extra{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  padding-top: 12px;
}
.vp-extra-chip{
  display:flex;
  align-items:center;
  gap:10px;
  padding: 10px 12px;
  border-radius: 999px;
  border: 1px solid var(--vp-border, #E2E8F0);
  background: #fff;
  box-shadow: 0 10px 20px rgba(2,6,23,.04);
  cursor:pointer;
}
.vp-extra-chip input{
  width: 18px;
  height: 18px;
}
.vp-extra-chip span{
  font-size: 14px;
  font-weight: 700;
  color: var(--vp-text, #0F172A);
}
/* ------------------------------------------------------------------
 * Vacancies Archive — Filters v2 (tabs + quick chips + extra filters)
 * ------------------------------------------------------------------ */

.vp-filters2{
  --vp-accent:#00A0A9;
  --vp-accent2:#53B0D8;
  --vp-text:#0F172A;
  --vp-muted:#64748b;
  --vp-border:#E2E8F0;
  --vp-soft:#F8FAFC;

  background:#fff;
  border:1px solid var(--vp-border);
  border-radius: 18px;
  padding: 18px;
  box-shadow: 0 14px 42px rgba(2,6,23,.06);
}

.vp-filters2__row{
  position: relative;
}

.vp-filters2__row + .vp-filters2__row{
  margin-top: 12px;
}

/* Tabs / chips wrappers */
.vp-country-tabs,
.vp-type-chips{
  position: relative;
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  align-items:center;
}

/* Base button style inside v2 */
.vp-filters2 .vp-filter-btn,
.vp-filters2 .vp-more-toggle{
  height: 40px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;

  padding: 0 14px;
  border-radius: 14px;

  border: 1px solid var(--vp-border);
  background: var(--vp-soft);
  color: var(--vp-text);

  font-weight: 800;
  text-decoration: none;
  cursor: pointer;
  line-height: 1;
  box-sizing: border-box;
}

/* Hover states: keep text readable (some themes force button:hover {color:#fff}) */
.vp-filters2 .vp-filter-btn:not(.is-active):hover,
.vp-filters2 .vp-more-toggle:hover{
  background:#eef2f7;
  color: var(--vp-text) !important;
}

/* Active chip stays white-on-accent */
.vp-filters2 .vp-filter-btn.is-active:hover{
  color:#fff !important;
}

.vp-filters2 .vp-filter-btn.is-active{
  background: linear-gradient(135deg, var(--vp-accent), var(--vp-accent2));
  color:#fff;
  border-color: transparent;
  box-shadow: 0 10px 24px rgba(0,160,169,.22);
}

/* Small pointer under active country tab (like mock) */
.vp-filters2 .vp-country-tabs .vp-filter-btn.is-active{
  position: relative;
}
.vp-filters2 .vp-country-tabs .vp-filter-btn.is-active::after{
  content:"";
  position:absolute;
  left: 50%;
  bottom: -7px;
  width: 14px;
  height: 14px;
  transform: translateX(-50%) rotate(45deg);
  background: linear-gradient(135deg, var(--vp-accent), var(--vp-accent2));
  border-radius: 3px;
}

/* More panels */
.vp-more-panel{
  position: absolute;
  top: calc(100% + 10px);
  right: 0;
  z-index: 50;

  min-width: 260px;
  max-width: 520px;

  background:#fff;
  border:1px solid var(--vp-border);
  border-radius: 16px;
  padding: 12px;
  box-shadow: 0 18px 48px rgba(2,6,23,.12);
}

.vp-more-grid{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
}

.vp-more-panel .vp-filter-btn{
  height: 38px;
  border-radius: 12px;
}

/* Caret for dropdown toggles */
.vp-filters2 .vp-caret{
  font-size: 12px;
  opacity: .7;
  margin-left: 2px;
}

/* Optional: different label text on phone (e.g., "Інші країни" -> "Ще країни") */
.vp-filters2 .vp-label-mobile{ display:none; }
.vp-filters2 .vp-label-desktop{ display:inline; }

/* Dropdown-style panels (Other countries / All categories) */
.vp-more-panel--dropdown{
  padding: 10px;
  min-width: 300px;
  max-width: 360px;
}

.vp-more-panel--dropdown .vp-dd-search{
  position: relative;
  margin-bottom: 10px;
}

.vp-more-panel--dropdown .vp-dd-ico{
  position:absolute;
  left: 12px;
  top: 50%;
  transform: translateY(-50%);
  font-size: 16px;
  line-height: 1;
  opacity: .6;
  pointer-events: none;
}

.vp-more-panel--dropdown .vp-dd-input{
  width: 100%;
  height: 42px;
  border-radius: 14px;
  border: 1px solid var(--vp-border);
  background: var(--vp-soft);
  /* more left padding so the icon never overlaps placeholder */
  padding: 0 12px 0 46px !important;
  /* Some themes force input padding with !important; keep text aligned */
  text-indent: 0 !important;
  box-sizing: border-box;
}

.vp-more-panel--dropdown .vp-dd-list{
  max-height: 280px;
  overflow: auto;
  padding: 2px;
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.vp-more-panel--dropdown .vp-dd-item{
  width: 100%;
  justify-content: flex-start;
  height: 42px;
  border-radius: 14px;
  background: #fff;
  border: 1px solid transparent;
  padding: 0 12px;
}

.vp-more-panel--dropdown .vp-dd-item:hover{
  background: var(--vp-soft);
  border-color: var(--vp-border);
  color: var(--vp-text) !important;
}

.vp-more-panel--dropdown .vp-dd-check{
  width: 20px;
  height: 20px;
  border-radius: 7px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: rgba(0,160,169,.12);
  color: var(--vp-accent);
  font-weight: 900;
  opacity: 0;
  transform: scale(.96);
  transition: opacity .15s ease, transform .15s ease;
}

.vp-more-panel--dropdown .vp-dd-item.is-active .vp-dd-check{
  opacity: 1;
  transform: scale(1);
}

/* Override active gradient inside dropdown: keep readable list */
.vp-more-panel--dropdown .vp-filter-btn.is-active{
  background: rgba(0,160,169,.10) !important;
  color: var(--vp-text) !important;
  border-color: rgba(0,160,169,.22) !important;
  box-shadow: none !important;
}
.vp-more-panel--dropdown .vp-filter-btn.is-active::after{
  display: none !important;
}

/* Search row */
.vp-filters2 .vp-filter-form{
  /* The plugin has a legacy .vp-filter-form{display:flex}. In v2, the form is a wrapper */
  display:block;
  margin-top: 12px;
}

.vp-filters2 .vp-filter-label{
  margin: 0 0 6px;
}


.vp-filters2__row--search{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap: 14px;
}

.vp-search-field{
  flex: 1 1 auto;
}

.vp-search-input{
  position: relative;
}

.vp-search-ico{
  position:absolute;
  left: 12px;
  top: 50%;
  transform: translateY(-50%);
  font-size: 15px;
  opacity: .65;
}

.vp-filters2 .vp-filter-form input[name="city"]{
  width: 100%;
  min-width: 260px;
  height: 44px;
  padding: 0 14px 0 36px;
  border-radius: 14px;
  border:1px solid var(--vp-border);
  background:#fff;
  box-sizing: border-box;
}

.vp-search-actions{
  display:flex;
  gap:10px;
  flex: 0 0 auto;
}

.vp-filters2 .vp-filter-submit{
  height: 44px;
  border-radius: 14px;
  background: #0F172A;
}

.vp-filters2 .vp-filter-reset,
.vp-filters2 .vp-reset-btn{
  height: 44px;
  border-radius: 14px;
  background: #E5E7EB;
}

/* Extra filters */
.vp-filter-more{
  margin-top: 10px;
  border-top: 1px solid rgba(148,163,184,.35);
  padding-top: 10px;
}

.vp-filter-more summary{
  cursor: pointer;
  font-weight: 900;
  color: var(--vp-text);
  list-style: none;
}

.vp-filter-more summary::-webkit-details-marker{ display:none; }

.vp-filter-more summary::after{
  content:"▾";
  margin-left: 8px;
  opacity: .65;
}

.vp-filter-more[open] summary::after{
  content:"▴";
}

.vp-filter-extra{
  padding-top: 10px;
}

.vp-extra-row{
  display:flex;
  flex-wrap:wrap;
  gap:14px;
  align-items:center;
}

.vp-extra-check{
  display:inline-flex;
  align-items:center;
  gap:8px;
  font-weight: 800;
  color: var(--vp-text);
}

.vp-extra-check input{
  width: 18px;
  height: 18px;
  accent-color: var(--vp-accent);
}

.vp-extra-clear{
  margin-top: 10px;
  background: transparent;
  border: 0;
  color: var(--vp-muted);
  font-weight: 800;
  cursor: pointer;
  padding: 0;
}

.vp-extra-clear:hover{
  color: var(--vp-text);
}

/* Active chips */
.vp-active-filters{
  margin-top: 12px;
  display:flex;
  flex-wrap:wrap;
  gap:10px;
}

.vp-active-chip{
  height: 34px;
  padding: 0 12px;
  border-radius: 999px;
  border: 1px solid var(--vp-border);
  background: #fff;
  color: var(--vp-text);
  font-weight: 800;
  cursor: pointer;
  display:inline-flex;
  align-items:center;
  gap: 10px;
}

.vp-active-chip span{
  display:inline-flex;
  width: 18px;
  height: 18px;
  align-items:center;
  justify-content:center;
  border-radius: 999px;
  background:#EEF2F7;
}

.vp-active-chip--clear{
  background: #0F172A;
  color: #fff;
  border-color: transparent;
}
.vp-active-chip--clear:hover{
  opacity: .92;
}

@media (max-width: 900px){
  .vp-filters2{ padding: 14px; }

  /* Mobile: keep tabs/chips in a single row (horizontal scroll) */
  .vp-country-tabs,
  .vp-type-chips{
    flex-wrap: nowrap;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    padding-bottom: 2px;
    scrollbar-width: none; /* Firefox */
    scroll-snap-type: x proximity;
  }
  .vp-country-tabs::-webkit-scrollbar,
  .vp-type-chips::-webkit-scrollbar{ display:none; }

  .vp-filters2 .vp-filter-btn,
  .vp-filters2 .vp-more-toggle{
    scroll-snap-align: start;
  }

  /* Mobile dropdown as bottom-sheet (finger friendly) */
  .vp-more-panel{
    position: fixed;
    left: 12px;
    right: 12px;
    bottom: 12px;
    top: auto;
    max-width: none;
    max-height: 70vh;
    overflow: hidden;
    z-index: 9999;
    border-radius: 18px;
  }
  .vp-more-panel--dropdown{
    min-width: 0;
    max-width: none;
  }
  .vp-more-panel--dropdown .vp-dd-list{
    max-height: calc(70vh - 92px);
  }

  .vp-more-panel--dropdown .vp-dd-input{ height: 46px; }
  .vp-more-panel--dropdown .vp-dd-item{ height: 48px; }
}

/* Phone polish: avoid horizontal swiping; show chips as tidy multi-row grid */
@media (max-width: 600px){
  /* Countries + categories become a 2-col grid (no sideways scroll) */
  .vp-country-tabs,
  .vp-type-chips{
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
    overflow: visible;
    scroll-snap-type: none;
  }

  /* Buttons: allow 2-line labels without clipping */
  .vp-filters2 .vp-filter-btn,
  .vp-filters2 .vp-more-toggle{
    width: 100%;
    min-width: 0;
    height: auto;
    min-height: 42px;
    padding: 10px 12px;
    line-height: 1.15;
    text-align: center;
    white-space: normal;
  }

  /* Make all grid chips equal-height inside each row */
  .vp-country-tabs > button,
  .vp-type-chips > button{
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  /* Swap shorter label on phone */
  .vp-filters2 .vp-label-mobile{ display:inline; }
  .vp-filters2 .vp-label-desktop{ display:none; }

  /* The little pointer under active country tab is great on desktop, but on phone it fights with multi-row layout */
  .vp-filters2 .vp-country-tabs .vp-filter-btn.is-active::after{ display:none; }
}

@media (max-width: 768px){
  .vp-filters2__row--search{ flex-direction: column; align-items:stretch; }

  /* Keep buttons side-by-side on mobile */
  .vp-search-actions{
    width: 100%;
    display: grid;
    /* auto adapts: 1 button = full width, 2 buttons = 2 columns */
    grid-template-columns: repeat(auto-fit, minmax(0, 1fr));
    gap: 10px;
  }

  .vp-filters2 .vp-filter-submit,
  .vp-filters2 .vp-filter-reset{ width: 100%; height: 46px; }
  .vp-filters2 .vp-filter-form input[name="city"]{ min-width: 100%; height: 46px; }
}

/* ------------------------------------------------------------
   Category Picker shortcode: [vp_category_picker]
------------------------------------------------------------ */

.vp-catpick{
  --vp-accent:#00A0A9;
  --vp-accent2:#53B0D8;
  --vp-text:#0F172A;
  --vp-muted:#64748B;
  --vp-border: rgba(15,23,42,.10);
  --vp-soft:#F8FAFC;

  font-family: Inter, system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  border: 1px solid var(--vp-border);
  background: rgba(255,255,255,.92);
  border-radius: 18px;
  padding: 20px;
  box-shadow: 0 16px 40px rgba(2,6,23,.08);
}

.vp-catpick__title{
  margin:0;
  font-size: 18px;
  line-height: 1.2;
  font-weight: 900;
  color: var(--vp-text);
}

.vp-catpick__subtitle{
  margin: 6px 0 0;
  font-size: 14px;
  line-height: 1.45;
  color: var(--vp-muted);
}

.vp-catpick__chips{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin-top: 14px;
}

.vp-catpick__chip{
  height: 40px;
  position: relative;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;

  /* Keep the dot pinned to the start of the chip so it doesn't jump when the
     label wraps to a second line (mobile / long labels). */
  padding: 0 14px 0 36px;
  border-radius: 14px;

  border: 1px solid var(--vp-border);
  background: var(--vp-soft);
  color: var(--vp-text);

  font-weight: 800;
  text-decoration: none;
  cursor: pointer;
  line-height: 1;
  box-sizing: border-box;
}

.vp-catpick__dot{
  width: 10px;
  height: 10px;
  border-radius: 999px;
  border: 2px solid rgba(0,160,169,.30);
  background: transparent;
  box-sizing: border-box;
  position: absolute;
  left: 14px;
  top: 50%;
  transform: translateY(-50%);
}

.vp-catpick__icon{ line-height: 1; }

/* Hover state: some themes force a dark background on hover; keep text readable */
.vp-catpick__chip:hover{
  background:#0D0D0D !important;
  color:#fff !important;
  border-color: transparent;
}
.vp-catpick__chip:hover .vp-catpick__dot{
  border-color: rgba(255,255,255,.70);
}

.vp-catpick__chip.is-active,
.vp-catpick__chip.is-active:hover{
  background: linear-gradient(135deg, var(--vp-accent), var(--vp-accent2));
  color:#fff !important;
  border-color: transparent;
  box-shadow: 0 10px 24px rgba(0,160,169,.22);
}
.vp-catpick__chip.is-active .vp-catpick__dot{ border-color: rgba(255,255,255,.75); background:#fff; }

.vp-catpick__actions{
  margin-top: 14px;
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  align-items:center;
}

.vp-catpick__btn{
  height: 44px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  padding: 0 16px;
  border-radius: 14px;
  border: 1px solid transparent;
  text-decoration:none;
  cursor:pointer;
  font-weight: 900;
  font-size: 14px;
  line-height: 1;
}

.vp-catpick__btn--primary{
  background: linear-gradient(135deg, var(--vp-accent), var(--vp-accent2));
  color:#fff;
  box-shadow: 0 12px 30px rgba(0,160,169,.18);
}
.vp-catpick__btn--primary:hover{ filter: brightness(1.02); }

.vp-catpick__btn--secondary{
  background:#fff;
  border-color: rgba(15,23,42,.12);
  color:#0F172A;
}
.vp-catpick__btn--secondary:hover{ background: rgba(2,6,23,.02); }

.vp-catpick__arrow{ font-size: 18px; line-height: 0; }

.vp-catpick__tip{
  width: 100%;
  margin-top: 2px;
  font-size: 12.5px;
  line-height: 1.45;
  color: var(--vp-muted);
}

@media (max-width: 560px){
  .vp-catpick{ padding: 16px; }
  .vp-catpick__chips{ gap:8px; }
  .vp-catpick__chip{
    flex: 1 1 calc(50% - 8px);
    justify-content:center;
    /* allow 2-line labels on mobile without clipping */
    height: auto;
    min-height: 44px;
    padding: 10px 10px 10px 34px;
  }
  .vp-catpick__txt{
    line-height: 1.15;
    text-align: center;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
  }
  .vp-catpick__btn{ width: 100%; height: 46px; }
}

/* Overlay for mobile bottom-sheet dropdown */
.vp-dd-overlay{
  position: fixed;
  inset: 0;
  background: rgba(15,23,42,.35);
  backdrop-filter: blur(2px);
  z-index: 9998;
}

body.vp-dd-open{ overflow: hidden; }

/* Salary calculator: picked vacancies archive result */
.vp-calc-picked-note{
  margin: 0 0 18px;
  padding: 14px 16px;
  border: 1px solid rgba(246,184,0,.38);
  border-radius: 16px;
  background: linear-gradient(135deg, rgba(255,247,218,.92), rgba(255,255,255,.92));
  color: #12233d;
  font-weight: 700;
  box-shadow: 0 10px 28px rgba(15,35,65,.06);
}
.vp-vacancies-grid--picked{
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
}
.vp-calc-picked-fallback{
  margin: 22px 0 6px;
  padding: 20px;
  border: 1px solid rgba(205,218,236,.9);
  border-radius: 22px;
  background:
    radial-gradient(circle at 92% 0%, rgba(255,211,53,.22), transparent 34%),
    linear-gradient(135deg, #fff, #f8fbff);
  box-shadow: 0 18px 44px rgba(15,35,65,.08);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
}
.vp-calc-picked-fallback__text{display:flex;flex-direction:column;gap:6px;color:#12233d;}
.vp-calc-picked-fallback__text strong{font-size:18px;line-height:1.2;font-weight:900;}
.vp-calc-picked-fallback__text span{font-size:14px;line-height:1.45;color:#61718a;}
.vp-calc-picked-fallback__btn{
  display:inline-flex;align-items:center;justify-content:center;
  min-height:46px;padding:0 18px;border-radius:14px;
  background:#111827;color:#fff;text-decoration:none;font-weight:900;
  white-space:nowrap;box-shadow:0 12px 24px rgba(15,23,42,.18);
}
.vp-calc-picked-fallback__btn:hover{transform:translateY(-1px);color:#fff;text-decoration:none;}
@media (max-width: 980px){.vp-vacancies-grid--picked{grid-template-columns:repeat(2,minmax(0,1fr));}}
@media (max-width: 640px){
  .vp-vacancies-grid--picked{grid-template-columns:1fr;}
  .vp-calc-picked-fallback{align-items:stretch;flex-direction:column;}
  .vp-calc-picked-fallback__btn{width:100%;}
}