/* =========================================================
   Vector Lex — Shop Archive (Premium)
   Scope: only product archive (shop + categories)
   ========================================================= */

body.post-type-archive-product .shop-page{
  position: relative;
  isolation: isolate;
  padding: 78px 0 72px;
}

body.post-type-archive-product .shop-page::before{
  content:"";
  position: absolute;
  left: 50%;
  top: -120px;
  width: min(1200px, 94vw);
  height: 240px;
  transform: translateX(-50%);
  background: radial-gradient(closest-side, rgba(255,255,255,.08), rgba(255,255,255,0) 70%);
  opacity: .22;
  pointer-events: none;
}

body.post-type-archive-product .shop-page__inner{
  width: min(1180px, calc(100% - 48px));
  margin: 0 auto;
}
@media (max-width: 560px){
  body.post-type-archive-product .shop-page__inner{
    width: calc(100% - 24px);
  }
}

/* -------------------------
   Hero: align like Journal
------------------------- */
body.post-type-archive-product .vl-shopHero{
  margin-bottom: 18px;
}

body.post-type-archive-product .vl-shopHero .vl-edition__head{
  padding: 14px 0 8px;
  text-align: center;
}

body.post-type-archive-product .vl-shopHero .vl-edition__subtitle{
  max-width: 760px;
  margin-left: auto;
  margin-right: auto;
}

/* chips under nav */
body.post-type-archive-product .vl-shopChips{
  margin-top: 14px;
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
}

body.post-type-archive-product .vl-shopChip{
  display: inline-flex;
  align-items: center;
  justify-content: center;

  padding: 8px 12px;
  border-radius: 999px;

  font-family: var(--vl-font-ui);
  font-weight: 700;
  font-size: 12px;
  letter-spacing: .06em;
  text-transform: uppercase;

  color: rgba(255,255,255,.78);
  text-decoration: none;

  border: 1px solid rgba(255,255,255,.10);
  background: rgba(255,255,255,.03);

  transition: transform .18s ease, border-color .18s ease, color .18s ease, background .18s ease;
}

body.post-type-archive-product .vl-shopChip:hover{
  transform: translateY(-1px);
  color: rgba(255,255,255,.92);
  border-color: rgba(255,255,255,.18);
  background: rgba(255,255,255,.05);
}

body.post-type-archive-product .vl-shopChip.is-active,
body.post-type-archive-product .vl-shopChip[aria-current="page"]{
  color: rgba(255,255,255,.95);
  border-color: rgba(255,255,255,.22);
  background: rgba(255,255,255,.08);
}


/* -------------------------
   Sections preview (your class names)
   (compatible with your markup + existing journal styles)
------------------------- */
body.post-type-archive-product .vl-secPreview__ttl{
  font-family: var(--vl-font-ui);
  font-weight: 700;
  font-size: 12px;
  letter-spacing: .06em;
  text-transform: uppercase;
  color: rgba(255,255,255,.58);
}

body.post-type-archive-product .vl-secPreview__txt{
  margin-top: 8px;
  font-family: var(--vl-font-copy);
  font-weight: 700;
  font-size: 22px;
  color: rgba(255,255,255,.90);
}

body.post-type-archive-product .vl-secPreview__meta{
  margin-top: 10px;
  font-family: var(--vl-font-ui);
  font-size: 13px;
  line-height: 1.6;
  color: rgba(255,255,255,.62);
  max-width: 420px;
}

/* -------------------------
   Woo controls (ordering)
------------------------- */
body.post-type-archive-product .woocommerce-notices-wrapper{
  margin: 16px 0 18px;
}

body.post-type-archive-product .woocommerce-ordering{
  margin: 10px 0 18px;
}

body.post-type-archive-product .woocommerce-ordering select{
  border-radius: 14px;
  padding: 10px 12px;

  color: rgba(255,255,255,.88);
  background: rgba(255,255,255,.03);
  border: 1px solid rgba(255,255,255,.10);

  outline: none;
}

body.post-type-archive-product .woocommerce-ordering select:focus{
  border-color: rgba(255,255,255,.18);
}

/* -------------------------
   Grid
------------------------- */
body.post-type-archive-product .vl-cyber-grid{
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
  padding-top: 8px;
}

/* -------------------------
   Product card (Dossier)
------------------------- */
body.post-type-archive-product .vl-dossier-card{
  position: relative;
  border-radius: 22px;
  overflow: hidden;

  border: 1px solid rgba(255,255,255,.08);
  background:
    radial-gradient(820px 280px at 22% 0%, rgba(210,214,222,.10), rgba(0,0,0,0) 60%),
    linear-gradient(180deg, rgba(255,255,255,.03), rgba(255,255,255,.015));

  box-shadow:
    0 14px 40px rgba(0,0,0,.44),
    inset 0 1px 0 rgba(255,255,255,.06);

  padding: 16px 16px 14px;
  transition: transform .18s ease, border-color .18s ease, background .18s ease;

  /* фикс одинаковой высоты и “прибитого” низа */
  display: flex;
  flex-direction: column;
  height: 100%;
}

body.post-type-archive-product .vl-dossier-card::after{
  content:"";
  position:absolute;
  inset: 0;
  background: radial-gradient(600px 220px at 28% 10%, rgba(255,255,255,.08), rgba(0,0,0,0) 55%);
  opacity: 0;
  pointer-events: none;
  transition: opacity .18s ease;
}

body.post-type-archive-product .vl-dossier-card:hover{
  transform: translateY(-2px);
  border-color: rgba(255,255,255,.14);
  background:
    radial-gradient(820px 280px at 22% 0%, rgba(210,214,222,.12), rgba(0,0,0,0) 60%),
    linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.018));
}

body.post-type-archive-product .vl-dossier-card:hover::after{
  opacity: .55;
}

/* overlay link */
body.post-type-archive-product .vl-dossier-link{
  position: absolute;
  inset: 0;
  z-index: 1;
}

/* head */
body.post-type-archive-product .vl-dossier-head{
  display:flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;

  position: relative;
  z-index: 2;
}

body.post-type-archive-product .vl-cat-badge{
  display:inline-flex;
  align-items:center;
  padding: 6px 10px;
  border-radius: 999px;

  font-family: var(--vl-font-ui);
  font-weight: 800;
  font-size: 10px;
  letter-spacing: .10em;
  text-transform: uppercase;

  color: rgba(255,255,255,.80);
  border: 1px solid rgba(255,255,255,.10);
  background: rgba(255,255,255,.03);

  box-shadow: none !important; /* чтобы не было “ореола” */
}

body.post-type-archive-product .vl-dossier-status{
  display:flex;
  align-items:center;
  gap: 10px;
}

body.post-type-archive-product .vl-id-text{
  font-family: var(--vl-font-ui);
  font-weight: 700;
  font-size: 10px;                 /* меньше */
  letter-spacing: .08em;           /* чуть “техничнее” */
  color: rgba(255,255,255,.40);    /* тише */
}

body.post-type-archive-product .vl-neon-check{
  color: rgba(255,255,255,.85);
  filter: drop-shadow(0 0 10px rgba(255,255,255,.10));
}

/* body */
body.post-type-archive-product .vl-dossier-body{
  margin-top: 12px;
  position: relative;
  z-index: 2;

  /* растягиваем середину, чтобы футер стал на один уровень */
  flex: 1 1 auto;
}

body.post-type-archive-product .vl-dossier-title{
  margin: 0;
  font-family: var(--vl-font-display);
  font-weight: 700;

  /* чуть компактнее (премиальнее в 3 колонки) */
  font-size: 20px;
  line-height: 1.15;

  /* резерв под 4 строки */
  min-height: 4.6em; /* 1.15 * 4 */

  letter-spacing: .01em;
}

body.post-type-archive-product .vl-dossier-title a{
  color: rgba(255,255,255,.92);
  text-decoration: none;

  position: relative;
  z-index: 3; /* выше overlay */

  /* обрезаем до 4 строк */
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 4;
  overflow: hidden;
}

body.post-type-archive-product .vl-dossier-desc{
  margin-top: 10px;

  font-family: var(--vl-font-ui);
  font-size: 13px;
  line-height: 1.6;
  color: rgba(255,255,255,.62);

  /* резерв ровно под 4 строки */
  min-height: 6.4em; /* 1.6 * 4 */
  max-height: 6.4em;

  overflow: hidden;

  /* премиальный fade без прямоугольника */
  -webkit-mask-image: linear-gradient(180deg, #000 0%, #000 76%, transparent 100%);
  mask-image: linear-gradient(180deg, #000 0%, #000 76%, transparent 100%);
}

body.post-type-archive-product .vl-dossier-desc p{
  margin: 0;
}

/* ВАЖНО: .vl-desc-mask больше не нужен (fade делаем mask-ом) */
body.post-type-archive-product .vl-desc-mask{
  display: none !important;
}

/* foot */
body.post-type-archive-product .vl-dossier-foot{
  margin-top: auto;       /* футер внизу */
  padding-top: 12px;      /* ← ВОЗДУХ сверху (единый отступ) */

  display:flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 12px;

  position: relative;
  z-index: 2;
}

@media (max-width: 560px){
  body.post-type-archive-product .vl-dossier-foot{
    padding-top: 10px;
  }
}

body.post-type-archive-product .vl-tech-specs{
  display:flex;
  gap: 8px;
  flex-wrap: nowrap; /* важно: чтобы футер не “прыгал” */
  overflow: hidden;
}

body.post-type-archive-product .vl-spec-chip{
  display:inline-flex;
  align-items:center;
  gap: 8px;
  padding: 7px 10px;
  border-radius: 999px;

  max-width: 160px;

  font-family: var(--vl-font-ui);
  font-weight: 700;
  font-size: 12px;

  color: rgba(255,255,255,.76);
  border: 1px solid rgba(255,255,255,.10);
  background: rgba(255,255,255,.03);

  box-shadow: none !important; /* убрать “черную тень/ореол” */
}

body.post-type-archive-product .vl-spec-chip span{
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

body.post-type-archive-product .vl-action-group{
  display:flex;
  align-items:center;
  gap: 10px;
}

body.post-type-archive-product .vl-price-tag{
  padding: 7px 9px;
  border-radius: 13px;

  border: 1px solid rgba(255,255,255,.10);
  background: rgba(255,255,255,.03);

  color: rgba(255,255,255,.92);
  font-family: var(--vl-font-ui);
  font-weight: 900;
  font-size: 13px;         /* было 14 */
  white-space: nowrap;

  box-shadow: none !important;
}

body.post-type-archive-product .vl-price-tag .amount{
  color: rgba(255,255,255,.92);
}

body.post-type-archive-product .vl-arrow-btn{
  width: 36px;             /* было 40 */
  height: 36px;            /* было 40 */
  border-radius: 12px;

  display:inline-flex;
  align-items:center;
  justify-content:center;

  border: 1px solid rgba(255,255,255,.10);
  background: rgba(255,255,255,.03);
  color: rgba(255,255,255,.90);

  text-decoration: none;
  position: relative;
  z-index: 4;

  transition: transform .18s ease, border-color .18s ease, background .18s ease;

  box-shadow: none !important;
}

body.post-type-archive-product .vl-arrow-btn:hover{
  transform: translateY(-0.5px);
  border-color: rgba(255,255,255,.22);
  background: rgba(255,255,255,.06);
  color: rgba(255,255,255,.98); /* ← стрелка/иконка станет белее */
}

/* =========================================================
   Woo Pagination — Vector Lex style (Journal/Product-like)
   ========================================================= */

body.post-type-archive-product .woocommerce-pagination{
  margin: 42px 0 0;      /* больше воздуха сверху */
  padding-top: 10px;      /* карман под hover-подъём */
}
body.post-type-archive-product .woocommerce-pagination ul.page-numbers{
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;

  margin: 0;
  padding: 0;
  list-style: none;

  border: 0 !important;
  background: transparent !important;
}

body.post-type-archive-product .woocommerce-pagination ul.page-numbers li{
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
}

/* ЕДИНЫЙ стиль кнопок пагинации: как на товаре/журнале */
body.post-type-archive-product .woocommerce-pagination .page-numbers a,
body.post-type-archive-product .woocommerce-pagination .page-numbers span{
  display: inline-flex !important;
  align-items: center;
  justify-content: center;

  height: 42px;
  min-width: 42px;
  padding: 0 14px;

  /* скруглённый прямоугольник */
  border-radius: 14px;

  font-family: var(--vl-font-ui);
  font-weight: 900;
  font-size: 12px;
  letter-spacing: .06em;

  color: rgba(255,255,255,.82);
  text-decoration: none;

  border: 1px solid rgba(255,255,255,.10) !important;
  background: rgba(255,255,255,.03) !important;

  /* убираем лишние тени */
  box-shadow: none !important;

  /* плавность (без transform) */
  transition: border-color .18s ease, background .18s ease, color .18s ease;

  /* фикс “исчезающих цифр” */
  opacity: 1 !important;
  -webkit-text-fill-color: currentColor !important;
  filter: none !important;
}

/* hover */
body.post-type-archive-product .woocommerce-pagination .page-numbers a:hover{
  transform: none !important;
  border-color: rgba(255,255,255,.18) !important;
  background: rgba(255,255,255,.05) !important;
  color: rgba(255,255,255,.92) !important;
}

/* active/current page = белая */
body.post-type-archive-product .woocommerce-pagination .page-numbers .current{
  background: rgba(255,255,255,.88) !important;
  border-color: rgba(255,255,255,.92) !important;
  color: rgba(0,0,0,.86) !important;
  box-shadow: none !important;
}

/* чтобы цифры не пропадали при клике */
body.post-type-archive-product .woocommerce-pagination .page-numbers a:active,
body.post-type-archive-product .woocommerce-pagination .page-numbers a:focus,
body.post-type-archive-product .woocommerce-pagination .page-numbers a:focus-visible{
  opacity: 1 !important;
  -webkit-text-fill-color: currentColor !important;
  filter: none !important;
}
/* hover */
body.post-type-archive-product .woocommerce-pagination .page-numbers a:hover{
  border-color: rgba(255,255,255,.20) !important;
  background: rgba(255,255,255,.06) !important;
  color: rgba(255,255,255,.92) !important;
}
/* current */
body.post-type-archive-product .woocommerce-pagination .page-numbers .current{
  /* светлая активная */
  background: rgba(255,255,255,.88) !important;
  border-color: rgba(255,255,255,.92) !important;

  /* текст темнее */
  color: rgba(0,0,0,.86) !important;

  /* чисто, без теней */
  box-shadow: none !important;
}

/* dots */
body.post-type-archive-product .woocommerce-pagination .page-numbers .dots{
  color: rgba(255,255,255,.55);
  border-color: rgba(255,255,255,.08) !important;
  background: rgba(255,255,255,.02) !important;
  padding: 0 12px;
}

/* next/prev чуть шире */
body.post-type-archive-product .woocommerce-pagination .page-numbers .next,
body.post-type-archive-product .woocommerce-pagination .page-numbers .prev{
  min-width: 46px;
}

/* -------------------------
   Responsive (Shop archive)
------------------------- */
@media (max-width: 1024px){
  body.post-type-archive-product .vl-cyber-grid{
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 560px){

  /* общие отступы страницы */
  body.post-type-archive-product .shop-page{
    padding: 64px 0 56px;
  }

  /* сетка товаров */
  body.post-type-archive-product .vl-cyber-grid{
    grid-template-columns: 1fr;
    gap: 14px;
  }

  /* карточка */
  body.post-type-archive-product .vl-dossier-card{
    border-radius: 20px;
    padding: 14px 14px 12px;
  }

  body.post-type-archive-product .vl-dossier-title{
    font-size: 20px;
  }

  /* ---------- Chips (разделы): 1 ряд + mask + “воздух” сверху/снизу ---------- */
  body.post-type-archive-product .vl-shopChips{
    --vl-fade: 18px;

    margin-top: 12px;
    gap: 8px;

    display: flex;
    flex-wrap: nowrap;
    overflow-x: auto;
    overflow-y: hidden;

    /* “высота сверху/снизу”, чтобы ничего не подрезалось */
    padding: 8px 2px 10px;

    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;

    /* mask-fade по краям (без прямоугольников) */
    -webkit-mask-image: linear-gradient(
      90deg,
      transparent 0,
      #000 var(--vl-fade),
      #000 calc(100% - var(--vl-fade)),
      transparent 100%
    );
    mask-image: linear-gradient(
      90deg,
      transparent 0,
      #000 var(--vl-fade),
      #000 calc(100% - var(--vl-fade)),
      transparent 100%
    );

    scroll-padding-left: var(--vl-fade);
    scroll-padding-right: var(--vl-fade);
  }

  body.post-type-archive-product .vl-shopChips::-webkit-scrollbar{
    display: none;
  }

  body.post-type-archive-product .vl-shopChip{
    flex: 0 0 auto;
    white-space: nowrap;

    padding: 7px 10px;
    font-size: 10px;
    letter-spacing: .08em;
  }

  /* на мобилке убираем “подъём”, чтобы точно не резалось при тапе */
  body.post-type-archive-product .vl-shopChip:hover,
  body.post-type-archive-product .vl-shopChip:active{
    transform: none !important;
  }

  /* ---------- Pagination: 1 ряд + mask + scroll ---------- */
  body.post-type-archive-product .woocommerce-pagination{
    margin-top: 24px;
    padding-top: 10px; /* карман */
    position: relative;
  }

  body.post-type-archive-product .woocommerce-pagination ul.page-numbers{
    --vl-fade: 18px;

    display: flex;
    align-items: center;
    justify-content: flex-start;

    flex-wrap: nowrap !important; /* строго 1 ряд */

    overflow-x: auto;
    overflow-y: hidden;

    width: 100%;
    padding: 6px 2px 2px;
    gap: 8px;

    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;

    /* mask-fade по краям */
    -webkit-mask-image: linear-gradient(
      90deg,
      transparent 0,
      #000 var(--vl-fade),
      #000 calc(100% - var(--vl-fade)),
      transparent 100%
    );
    mask-image: linear-gradient(
      90deg,
      transparent 0,
      #000 var(--vl-fade),
      #000 calc(100% - var(--vl-fade)),
      transparent 100%
    );

    scroll-padding-left: var(--vl-fade);
    scroll-padding-right: var(--vl-fade);
  }

  body.post-type-archive-product .woocommerce-pagination ul.page-numbers::-webkit-scrollbar{
    display: none;
  }

  body.post-type-archive-product .woocommerce-pagination ul.page-numbers li{
    flex: 0 0 auto;
  }

  body.post-type-archive-product .woocommerce-pagination .page-numbers a,
  body.post-type-archive-product .woocommerce-pagination .page-numbers span{
    height: 38px;
    min-width: 38px;
    padding: 0 12px;
    border-radius: 12px;

    font-size: 11px;
    letter-spacing: .06em;
  }
}


















































































/* =========================================================
   Vector Lex — Single Product (NEW / 2 columns)
   Scope: only .vl-single-product--two (не ломает другие страницы)
   ========================================================= */

.vl-single-product--two{
  --vl-accent: rgba(245,246,248,.92);
  --vl-accent-soft: rgba(255,255,255,.10);
  --vl-accent-soft-2: rgba(255,255,255,.06);

  --vl-text: rgba(255,255,255,.92);
  --vl-muted: rgba(255,255,255,.72);
  --vl-muted-2: rgba(255,255,255,.58);

  --vl-border: rgba(255,255,255,.10);
  --vl-border-2: rgba(255,255,255,.06);

  --vl-card: rgba(18,18,18,.88);
  --vl-card-2: rgba(16,16,16,.82);

  --vl-radius: 22px;
  --vl-radius-sm: 16px;

  --vl-gap: clamp(16px, 2vw, 28px);
  --vl-max: 1320px;
  --vl-word-blue: #5A94D6;
--vl-word-blue-glow: rgba(90,148,214,.35);
  
    --vl-pad: clamp(14px, 1.6vw, 20px);

  /* Silver glass (как в Journal) */
  --vl-silver: rgba(210,214,222,.08);
  --vl-silver-soft: rgba(210,214,222,.06);
  --vl-paper: rgba(245,246,248,.96);
  --vl-paper-border: rgba(245,246,248,.86);

  --vl-glass:
    radial-gradient(720px 220px at 18% 0%, var(--vl-silver), rgba(0,0,0,0) 55%),
    rgba(255,255,255,.02);

  --vl-glass-soft:
    radial-gradient(720px 220px at 18% 0%, var(--vl-silver-soft), rgba(0,0,0,0) 55%),
    rgba(255,255,255,.018);

  --vl-focus-border: rgba(210,214,222,.30);
  --vl-focus-ring: rgba(210,214,222,.12);
  
    /* Clean glow (без чёрной “грязи”) */
--vl-shadow-clean: inset 0 1px 0 rgba(255,255,255,.08);

  /* высота “липкого” положения (если шапка Astra липкая — можно поднять до 96px) */
  --vl-sticky-top: 88px;

  padding: clamp(18px, 3vw, 42px) 16px;
}

.vl-single-product--two,
.vl-single-product--two *{
  box-sizing: border-box;
}

.vl-single-product--two a{
  color: var(--vl-text);
  text-decoration: none;
}
.vl-single-product--two a:hover{ color:#fff; }

.vl-single-product--two img{ max-width:100%; height:auto; display:block; }

/* =========================
   2-column layout
   ========================= */
.vl-single-product--two .vl-product-layout{
  width: min(var(--vl-max), 100%);
  margin: 0 auto;
  display: grid;
  grid-template-columns: minmax(0, 1fr) 360px;
  gap: var(--vl-gap);
  align-items: start;
}

.vl-single-product--two .vl-product-main{ min-width:0; }
.vl-single-product--two .vl-product-side{ min-width:0; }

/* =========================
   Header / Title / Chips
   ========================= */
.vl-single-product--two .vl-product-head{
  padding: 0 var(--vl-pad) 10px;
}

.vl-single-product--two .vl-product-title{
  margin: 0;
  font-family: var(--vl-font-display, Georgia, "Times New Roman", serif);
  font-weight: 600;
  font-size: clamp(22px, 1.6vw, 30px);
  line-height: 1.12;
  letter-spacing: .1px;
  text-wrap: balance;
  max-width: 100%;
  color: #fff;

  position: relative;
  padding-bottom: 14px;
}

.vl-single-product--two .vl-product-title::after{
  content:"";
  position:absolute;
  left:0;
  right:0;
  bottom:0;
  height: 1px;
  background: linear-gradient(to right,
    rgba(255,255,255,0) 0%,
    rgba(255,255,255,0.06) 22%,
    rgba(255,255,255,0.12) 50%,
    rgba(255,255,255,0.06) 78%,
    rgba(255,255,255,0) 100%
  );
  pointer-events:none;
}

.vl-single-product--two .vl-product-submeta{
  margin-top: 10px;
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
  align-items: center;
}


/* =========================
   Badges above title
   ========================= */
.vl-single-product--two .vl-product-badges{
  margin: 0 0 10px;
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  align-items: center;
}

.vl-single-product--two .vl-badge{
  display: inline-flex;
  align-items: center;
  gap: 8px;

  padding: 8px 12px;
  border-radius: 999px;

  border: 1px solid rgba(255,255,255,.10);
  background:
    radial-gradient(220px 120px at 18% 0%, rgba(210,214,222,.10), rgba(0,0,0,0) 60%),
    rgba(255,255,255,.02);
  backdrop-filter: blur(10px);

  font-family: "PT Sans", system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .12em;
  text-transform: uppercase;
  line-height: 1;

  color: rgba(255,255,255,.78);
  white-space: nowrap;
}

.vl-single-product--two .vl-badge--ready{
  border-color: rgba(255,255,255,.14);
  color: rgba(255,255,255,.86);
}

.vl-single-product--two .vl-badge--ready::before{
  content:"";
  width: 7px;
  height: 7px;
  border-radius: 999px;
background: var(--vl-word-blue);
box-shadow: 0 0 16px var(--vl-word-blue-glow);
}

.vl-single-product--two .vl-badge--instant{
  color: rgba(255,255,255,.72);
}



.vl-single-product--two .vl-product-chips{
  margin-top: 14px;
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}







/* =========================
   Unified panel: file + price + buy + meta row
   ========================= */
.vl-single-product--two .vl-purchase-rail{
  margin-top: 14px;
}

.vl-single-product--two .vl-purchase-rail__inner{
  background: var(--vl-glass);
  border: 1px solid rgba(255,255,255,.10);
  border-radius: var(--vl-radius);
  backdrop-filter: blur(10px);
  box-shadow: var(--vl-shadow-clean);

  padding: clamp(14px, 1.4vw, 18px);

  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

/* =========================
   Variable product: variants as rows
   ========================= */
.vl-single-product--two .vl-purchase-rail__inner--vlist{
  display: block;
}

.vl-single-product--two .vl-vrow{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;

  padding: 12px;
  border-radius: calc(var(--vl-radius) - 6px);
  border: 1px solid rgba(255,255,255,.06);
  background: rgba(255,255,255,.02);
}

.vl-single-product--two .vl-vrow + .vl-vrow{
  margin-top: 10px;
}

@media (max-width: 560px){
  .vl-single-product--two .vl-vrow{
    flex-direction: column;
    align-items: stretch;
    gap: 10px;
  }
}




/* LEFT: file card */
.vl-single-product--two .vl-filecard{
  display: flex;
  align-items: center;
  gap: 12px;
  min-width: 0;
  flex: 1 1 auto;
}

.vl-single-product--two .vl-filecard__icon{
  width: 34px;
  height: 34px;
  flex: 0 0 auto;
  opacity: .92;
}

.vl-single-product--two .vl-filecard__meta{ min-width:0; }

.vl-single-product--two .vl-filecard__name{
  font-family: "PT Sans", system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  font-weight: 800;
  font-size: 14px;
  line-height: 1.25;
  color: rgba(255,255,255,.92);

  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 62ch;
}

.vl-single-product--two .vl-filecard__sub{
  margin-top: 4px;
  font-family: "PT Sans", system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  font-size: 12px;
  line-height: 1.25;
  letter-spacing: .02em;
  color: rgba(255,255,255,.62);
}



/* RIGHT: price + buy */
.vl-single-product--two .vl-buyrail{
  display: flex;
  align-items: center;
  justify-content: flex-end;
  flex-wrap: wrap;

  gap: 7px 12px;

  flex: 0 0 300px;
  max-width: 100%;
}




.vl-single-product--two .vl-buyrail .btn-shop.vl-buy-btn{
  flex: 0 0 auto;
  width: auto !important;
}

.vl-single-product--two .vl-buyrail__price{
  display: flex;
  align-items: center;

  /* даём цене “воздух” по высоте, кнопка при этом не меняется */
  padding: 4px 0;
}

@media (min-width: 561px){
  .vl-single-product--two .vl-buyrail .btn-shop.vl-buy-btn{
    flex: 0 0 auto;
    width: auto !important;
  }
}

.vl-single-product--two .vl-buyrail__kicker{
  font-family: "PT Sans", system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: rgba(255,255,255,.62);
  line-height: 1;
}

/* PRICE in buyrail — premium blue chip */
.vl-single-product--two .vl-buyrail__value{
  position: relative;
  overflow: hidden;
  isolation: isolate;

  display: inline-flex;
  align-items: center;
  justify-content: center;

  min-height: 48px;
  padding: 0 18px;
  border-radius: 16px;

  border: 1px solid rgba(95, 170, 255, .42);

  background:
    radial-gradient(160px 90px at 22% 0%, rgba(120, 190, 255, .34), rgba(28, 96, 180, .12) 54%, rgba(0, 0, 0, 0) 76%),
    linear-gradient(135deg, rgba(9, 35, 78, .98), rgba(12, 74, 150, .96) 48%, rgba(7, 27, 61, .98));

  box-shadow:
    0 0 0 1px rgba(70, 160, 255, .08),
    0 12px 28px rgba(0, 96, 210, .22),
    inset 0 1px 0 rgba(255, 255, 255, .18),
    inset 0 -1px 0 rgba(0, 0, 0, .28);

  transition:
    transform .22s ease,
    border-color .22s ease,
    box-shadow .22s ease;
}

.vl-single-product--two .vl-buyrail__value::before{
  content: "";
  position: absolute;
  inset: 1px;
  border-radius: inherit;
  background: linear-gradient(180deg, rgba(255,255,255,.12), rgba(255,255,255,0) 48%);
  pointer-events: none;
  z-index: 0;
}

.vl-single-product--two .vl-buyrail__value::after{
  content: "";
  position: absolute;
  top: -45%;
  left: -38%;
  width: 42%;
  height: 190%;
  transform: rotate(24deg);
  background: linear-gradient(90deg, rgba(255,255,255,0), rgba(255,255,255,.16), rgba(255,255,255,0));
  opacity: .72;
  pointer-events: none;
  z-index: 0;
}

.vl-single-product--two .vl-buyrail__value .price{
  position: relative;
  z-index: 1;

  margin: 0;
  display: inline-flex;
  align-items: baseline;
  white-space: nowrap;

  font-family: "PT Sans", system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  font-weight: 800;
  font-size: clamp(20px, 1.35vw, 23px);
  line-height: 1;
  letter-spacing: .1px;
  font-variant-numeric: tabular-nums;

  color: #fff;
  text-shadow: 0 1px 12px rgba(160, 210, 255, .24);
}

.vl-single-product--two .vl-buyrail__value .woocommerce-Price-amount,
.vl-single-product--two .vl-buyrail__value .woocommerce-Price-amount bdi{
  display: inline-flex;
  align-items: baseline;
}

.vl-single-product--two .vl-buyrail__value .woocommerce-Price-currencySymbol{
  display: inline-block;
  opacity: .96;
  font-size: .82em;
  position: relative;
  top: -0.08em;
  margin-left: -0.08em !important;
}

@media (hover: hover){
  .vl-single-product--two .vl-purchase-rail__inner:hover .vl-buyrail__value{
    transform: translateY(-1px);
    border-color: rgba(120, 195, 255, .62);
    box-shadow:
      0 0 0 1px rgba(70, 160, 255, .12),
      0 16px 34px rgba(0, 110, 230, .30),
      inset 0 1px 0 rgba(255, 255, 255, .22),
      inset 0 -1px 0 rgba(0, 0, 0, .30);
  }
}


/* BUY button — silver -> white hover */
.vl-single-product--two .vl-purchase-rail .btn-shop.vl-buy-btn{
  height: 48px;
  padding: 0 18px;
  border-radius: 16px;

  border: 1px solid rgba(255,255,255,.55);
  background: linear-gradient(180deg, rgba(245,246,248,.92), rgba(230,233,238,.84));
  color: rgba(13,13,13,.92);
  -webkit-text-fill-color: rgba(13,13,13,.92);

  box-shadow: inset 0 1px 0 rgba(255,255,255,.85);
}

.vl-single-product--two .vl-purchase-rail .btn-shop.vl-buy-btn i{
  font-size: 18px;
  line-height: 1;
  opacity: .9;
  color: rgba(13,13,13,.92);
}

@media (hover:hover){
  .vl-single-product--two .vl-purchase-rail .btn-shop.vl-buy-btn:hover{
    background: #fff;
    border-color: rgba(255,255,255,.82);
    box-shadow:
      0 0 0 4px rgba(255,255,255,.10),
      0 0 32px rgba(255,255,255,.16),
      inset 0 1px 0 rgba(255,255,255,.95);
    transform: translateY(-1px);
  }
}




/* NOTE */
.vl-single-product--two .vl-purchase-rail__note{
  margin-top: 12px;
  font-family: "PT Sans", system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  font-size: 12.5px;
  font-weight: 700;
  line-height: 1.45;
  color: #fff;
  text-align: left;

  display: inline-flex;
  align-items: center;
  justify-content: flex-start;
  gap: 8px;

  max-width: 100%;
}

.vl-single-product--two .vl-purchase-rail__note-accent{
  width: 7px;
  height: 7px;
  flex: 0 0 auto;
  border-radius: 999px;
  background: rgba(70,160,255,.98);
  box-shadow: 0 0 0 4px rgba(70,160,255,.10), 0 0 18px rgba(70,160,255,.42);
}







/* =========================
   Work description accordion
   ========================= */

.vl-single-product--two .vl-work-desc{
  margin-top: 10px;
}

.vl-single-product--two .vl-work-desc__details{
  position: relative;
  overflow: hidden;

  border-radius: var(--vl-radius);
  border: 1px solid rgba(255,255,255,.085);
  background:
    radial-gradient(440px 170px at 10% 0%, rgba(255,255,255,.045), rgba(0,0,0,0) 62%),
    radial-gradient(320px 150px at 100% 0%, rgba(255,255,255,.040), rgba(0,0,0,0) 58%),
    linear-gradient(180deg, rgba(255,255,255,.038), rgba(255,255,255,.016));

  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.045),
    var(--vl-shadow-clean);

  backdrop-filter: blur(10px);
}

.vl-single-product--two .vl-work-desc__details::before{
  content: "";
  position: absolute;
  inset: 0 14px auto;
  height: 1px;

  background: linear-gradient(
    to right,
    rgba(255,255,255,0),
    rgba(235,239,245,.16),
    rgba(255,255,255,0)
  );

  opacity: .85;
  pointer-events: none;
}

.vl-single-product--two .vl-work-desc__summary{
  position: relative;
  z-index: 1;

  list-style: none;
  cursor: pointer;

  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;

  padding: 15px 17px;
}

.vl-single-product--two .vl-work-desc__summary::-webkit-details-marker{
  display: none;
}

.vl-single-product--two .vl-work-desc__summary-main{
  min-width: 0;

  display: grid;
  gap: 7px;
}

.vl-single-product--two .vl-work-desc__kicker{
  display: inline-flex;
  align-items: center;
  gap: 8px;

  width: fit-content;

  font-family: "PT Sans", system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  font-size: 12px;
  font-weight: 900;
  line-height: 1.2;
  letter-spacing: .11em;
  text-transform: uppercase;

  color: rgba(255,255,255,.78);
}

.vl-single-product--two .vl-work-desc__kicker::before{
  content: "";
  width: 8px;
  height: 8px;
  flex: 0 0 8px;

  border-radius: 999px;
  background: rgba(232,236,242,.92);

  box-shadow:
    0 0 0 4px rgba(255,255,255,.055),
    0 0 16px rgba(255,255,255,.080);
}

.vl-single-product--two .vl-work-desc__preview{
  min-width: 0;

  font-family: var(--vl-font-copy, "PT Serif", Georgia, "Times New Roman", serif);
  font-size: 15.5px;
  line-height: 1.45;

  color: rgba(255,255,255,.78);

  display: -webkit-box;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;

  overflow: hidden;
}

.vl-single-product--two .vl-work-desc__toggle{
  flex: 0 0 auto;

  min-width: 128px;
  height: 42px;
  padding: 0 14px;

  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 9px;

  border-radius: 14px;
  border: 1px solid rgba(255,255,255,.105);
  background:
    radial-gradient(90px 60px at 30% 12%, rgba(255,255,255,.075), rgba(0,0,0,0) 68%),
    linear-gradient(180deg, rgba(255,255,255,.036), rgba(255,255,255,.014));

  font-family: "PT Sans", system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  font-size: 12px;
  font-weight: 900;
  line-height: 1;
  letter-spacing: .04em;

  color: rgba(255,255,255,.86);

  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.050),
    0 0 14px rgba(255,255,255,.025);

  transition:
    border-color .18s ease,
    background .18s ease,
    box-shadow .18s ease,
    transform .18s ease;
}

.vl-single-product--two .vl-work-desc__toggle::before{
  content: "Развернуть";
}

.vl-single-product--two .vl-work-desc__toggle::after{
  content: "";
  width: 8px;
  height: 8px;

  border-right: 2px solid currentColor;
  border-bottom: 2px solid currentColor;

  transform: rotate(45deg) translateY(-2px);
  transform-origin: center;

  opacity: .82;
  transition: transform .18s ease;
}

.vl-single-product--two .vl-work-desc__details[open]{
  border-color: rgba(255,255,255,.125);

  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.055),
    var(--vl-shadow-clean),
    0 0 0 1px rgba(255,255,255,.025);
}

.vl-single-product--two .vl-work-desc__details[open] .vl-work-desc__preview{
  display: none;
}

.vl-single-product--two .vl-work-desc__details[open] .vl-work-desc__toggle::before{
  content: "Свернуть";
}

.vl-single-product--two .vl-work-desc__details[open] .vl-work-desc__toggle::after{
  transform: rotate(225deg) translateY(-1px);
}

.vl-single-product--two .vl-work-desc__body{
  position: relative;
  z-index: 1;

  padding: 0 17px 17px;

  font-family: var(--vl-font-copy, "PT Serif", Georgia, "Times New Roman", serif);
  font-size: 16px;
  line-height: 1.8;

  color: rgba(255,255,255,.82);
}

.vl-single-product--two .vl-work-desc__body::before{
  content: "";
  display: block;

  height: 1px;
  margin-bottom: 14px;

  background: linear-gradient(
    to right,
    rgba(255,255,255,0),
    rgba(235,239,245,.14),
    rgba(255,255,255,0)
  );
}

.vl-single-product--two .vl-work-desc__body p{
  margin: 0 0 12px;
}

.vl-single-product--two .vl-work-desc__body p:last-child{
  margin-bottom: 0;
}

@media (hover:hover){
  .vl-single-product--two .vl-work-desc__summary:hover .vl-work-desc__toggle{
    border-color: rgba(255,255,255,.155);
    background:
      radial-gradient(94px 64px at 30% 12%, rgba(255,255,255,.105), rgba(0,0,0,0) 68%),
      linear-gradient(180deg, rgba(255,255,255,.045), rgba(255,255,255,.017));

    box-shadow:
      inset 0 1px 0 rgba(255,255,255,.070),
      0 0 18px rgba(255,255,255,.045);

    transform: translateY(-1px);
  }
}

.vl-single-product--two .vl-work-desc__summary:focus-visible{
  outline: none;

  box-shadow:
    inset 0 0 0 2px rgba(255,255,255,.16);

  border-radius: var(--vl-radius);
}

@media (max-width: 680px){
  .vl-single-product--two .vl-work-desc{
    margin-top: 9px;
  }

  .vl-single-product--two .vl-work-desc__summary{
    align-items: flex-start;
    flex-direction: column;
    gap: 12px;

    padding: 15px;
  }

  .vl-single-product--two .vl-work-desc__toggle{
    width: 100%;
    min-width: 0;
  }

  .vl-single-product--two .vl-work-desc__body{
    padding: 0 15px 15px;

    font-size: 15px;
    line-height: 1.75;
  }
}

/* =========================
   Titles for blocks
   ========================= */
.vl-single-product--two .vl-block-title{
  margin: 18px 0 10px;
  display: inline-flex;
  align-items: center;
  gap: 10px;

  font-size: 12px;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: rgba(255,255,255,.72);
}

.vl-single-product--two .vl-block-title::before{
  content:"";
  width: 10px;
  height: 10px;
  border-radius: 999px;
  background: var(--vl-accent);
  box-shadow: 0 0 22px rgba(210,214,222,.22);
}

/* =========================
   Cards / Typography (Vector Lex)
   ========================= */

.vl-single-product--two .vl-card{
  background: var(--vl-glass);
  border: 1px solid rgba(255,255,255,.10);
  backdrop-filter: blur(10px);

  box-shadow: var(--vl-shadow-clean);

  border-radius: var(--vl-radius);
  padding: var(--vl-pad);
}
/* Основной текст: PT Serif (или твой --vl-font-copy) */
/* Базовый “prose” стиль */
.vl-single-product--two .typography-cyber{
  font-family: var(--vl-font-copy, "PT Serif", Georgia, "Times New Roman", serif);
  font-size: 16px;
  line-height: 1.85;
  color: rgba(255,255,255,.82);
  font-weight: 400;
}
.vl-single-product--two .typography-cyber p{ margin: 0 0 12px; }
.vl-single-product--two .typography-cyber p:last-child{ margin-bottom: 0; }

.vl-single-product--two .typography-cyber ul,
.vl-single-product--two .typography-cyber ol{
  margin: 10px 0 14px 20px;
}

.vl-single-product--two .typography-cyber li{ margin: 6px 0; }

.vl-single-product--two .typography-cyber strong,
.vl-single-product--two .typography-cyber b{
  font-weight: 700;
  color: #fff;
}

/* Заголовки внутри задания — компактно, editorial */
.vl-single-product--two .typography-cyber h2,
.vl-single-product--two .typography-cyber h3,
.vl-single-product--two .typography-cyber h4{
  font-family: var(--vl-font-copy, "PT Serif", Georgia, "Times New Roman", serif);
  font-weight: 400;                 /* как ты хочешь */
  color: rgba(255,255,255,.96);
  letter-spacing: .05px;
  line-height: 1.24;
  text-wrap: balance;
  margin: 18px 0 10px;
}

/* Иерархия — за счёт размеров и ритма (а не жирности) */
.vl-single-product--two .typography-cyber h2{
  font-size: 20px;
  line-height: 1.18;
  margin-top: 26px;
  padding-bottom: 8px;
  border-bottom: 1px solid rgba(255,255,255,.08); /* лёгкое выделение */
}

.vl-single-product--two .typography-cyber h3{
  font-size: 18px;
  line-height: 1.22;
  margin-top: 20px;
}

.vl-single-product--two .typography-cyber h4{
  font-size: 16px;
  line-height: 1.24;
  margin-top: 16px;
}

/* Ссылки — аккуратно, без кислотности */
.vl-single-product--two .typography-cyber a{
  color: rgba(245,246,248,.92);
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 3px;
}
.vl-single-product--two .typography-cyber a:hover{
  color: #fff;
  text-decoration-thickness: 2px;
}


/* =========================
   TASK block (main focus)
   ========================= */
.vl-single-product--two .vl-task-block{ margin-top: 16px; }
.vl-single-product--two .vl-task-card{
  padding-top: clamp(18px, 1.2vw, 22px) !important;
}
.vl-single-product--two .vl-task-content{ padding-top: 0; }



/* buttons (anchors) — серебристый стиль как в журнале */
.vl-single-product--two .btn-shop{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;

  cursor: pointer;
  user-select: none;
  text-decoration: none;

  font-family: var(--vl-font-ui, system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif);
  font-weight: 800;

  border-radius: 14px;
  border: 1px solid rgba(255,255,255,.16);
  background: linear-gradient(180deg, rgba(255,255,255,.14), rgba(255,255,255,.04));
  color: rgba(255,255,255,.92);

  /* без внешних “пятен” */
  box-shadow: none;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.10);

  transition: transform .16s ease, background .16s ease, border-color .16s ease;
}

@media (hover:hover){
  .vl-single-product--two .btn-shop:hover{
    background: linear-gradient(180deg, rgba(255,255,255,.18), rgba(255,255,255,.06));
    border-color: rgba(255,255,255,.24);
    transform: translateY(-1px);
  }
}

.vl-single-product--two .btn-shop:focus-visible{
  outline: none;
  box-shadow: 0 0 0 3px rgba(255,255,255,.10), inset 0 1px 0 rgba(255,255,255,.10);
}

/* primary buy button — чуть ярче, но всё ещё серебро */
.vl-single-product--two .vl-buy-btn{
  padding: 11px 14px;
  border-color: rgba(255,255,255,.22);
  background: linear-gradient(180deg, rgba(255,255,255,.20), rgba(255,255,255,.06));
  color: rgba(255,255,255,.96);
}

@media (hover:hover){
  .vl-single-product--two .vl-buy-btn:hover{
    border-color: rgba(255,255,255,.30);
    background: linear-gradient(180deg, rgba(255,255,255,.24), rgba(255,255,255,.08));
  }
}

/* task content spacing */
.vl-single-product--two .vl-task-content{ padding-top: 2px; }

/* pagination */
/* pagination — как в журнале */
/* pagination — как в журнале (wp_link_pages) */
.vl-single-product--two .vl-product-pages-nav{
  margin-top: 18px;
  display: flex;
  justify-content: center;
}

.vl-single-product--two .vl-product-pages-nav .vl-pages{
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 8px;
}

/* перебиваем underline от .typography-cyber a (у тебя он влияет на цифры) */
.vl-single-product--two .vl-product-pages-nav a{
  text-decoration: none !important;
}

.vl-single-product--two .vl-page-pill{
  display: inline-flex;
  align-items: center;
  justify-content: center;

  min-width: 38px;
  height: 38px;
  padding: 0 10px;

  border-radius: 12px;
  border: 1px solid rgba(255,255,255,.10);
  background: rgba(255,255,255,.02);

  font-family: "PT Sans", system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  font-weight: 800;
  font-size: 13px;

  color: rgba(255,255,255,.70);
  -webkit-text-fill-color: rgba(255,255,255,.70);

  transition: background .18s ease, border-color .18s ease, transform .18s ease, color .18s ease;
}

@media (hover:hover){
  .vl-single-product--two .vl-product-pages-nav a:hover .vl-page-pill{
    background: rgba(245,246,248,.92);
    border-color: rgba(245,246,248,.82);
    color: rgba(0,0,0,.82);
    -webkit-text-fill-color: rgba(0,0,0,.82);
    transform: translateY(-1px);
  }
}


/* текущая страница — белая + мягкое свечение */
.vl-single-product--two .vl-page-pill.is-current{
  background: rgba(245,246,248,.98);
  border-color: rgba(255,255,255,.90);

  color: rgba(0,0,0,.86);
  -webkit-text-fill-color: rgba(0,0,0,.86);

  box-shadow:
  0 0 0 3px rgba(255,255,255,.08),
  0 0 18px rgba(255,255,255,.12),
  inset 0 1px 0 rgba(255,255,255,.95);

  cursor: default;
}


/* "Показать полностью" */
.vl-single-product--two .vl-read-more-wrapper{
  margin-top: 14px;
  display: flex;
  justify-content: center;
}

/* важно: чтобы не подчеркивалось внутри typography-cyber */
.vl-single-product--two .typography-cyber a.btn-shop{
  text-decoration: none !important;
}

.vl-single-product--two .vl-more-btn{
  padding: 12px 16px;
  border-radius: 14px;
  border: 1px solid rgba(255,255,255,.16);
  background:
    radial-gradient(220px 120px at 18% 0%, rgba(210,214,222,.08), rgba(0,0,0,0) 60%),
    linear-gradient(180deg, rgba(255,255,255,.10), rgba(255,255,255,.03));
  color: rgba(255,255,255,.92);
}

@media (hover:hover){
  .vl-single-product--two .vl-more-btn:hover{
    border-color: rgba(255,255,255,.24);
    background:
      radial-gradient(220px 120px at 18% 0%, rgba(210,214,222,.10), rgba(0,0,0,0) 60%),
      linear-gradient(180deg, rgba(255,255,255,.14), rgba(255,255,255,.05));
    transform: translateY(-1px);
  }
}
/* =========================
   RIGHT SIDEBAR
   ========================= */
.vl-single-product--two .vl-product-side{
  display: grid;
  gap: var(--vl-gap);
}

/* Order card */
.vl-single-product--two .vl-sidecard{
  border-radius: var(--vl-radius);
  border: 1px solid rgba(255,255,255,.10);
  background: var(--vl-glass);
  backdrop-filter: blur(10px);

  box-shadow: var(--vl-shadow-clean);
  padding: 18px;
}
.vl-single-product--two .vl-sidecard-head{ margin-bottom: 10px; }
.vl-single-product--two .vl-sidecard-kicker{
  font-size: 12px;
  letter-spacing: .10em;
  text-transform: uppercase;
  color: rgba(255,255,255,.70);
  margin-bottom: 6px;
}
.vl-single-product--two .vl-sidecard-title{
  margin: 0;
  font-family: var(--vl-font-copy, "PT Serif", Georgia, "Times New Roman", serif);
  font-weight: 600;
  font-size: 18px;
  line-height: 1.22;
  color: rgba(255,255,255,.94);
}

.vl-single-product--two .vl-sidecard-text{
  margin: 10px 0 14px;
  font-family: var(--vl-font-copy, "PT Serif", Georgia, "Times New Roman", serif);
  font-size: 14px;
  line-height: 1.65;
  color: rgba(255,255,255,.72);
}

/* Order CTA — secondary (glass) (не конкурирует с "Купить") */
.vl-single-product--two .vl-order-cta{
  width: 100%;
  height: 48px;
  border-radius: 16px;

  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 12px;

  border: 1px solid rgba(255,255,255,.14);
  background: var(--vl-glass-soft);
  backdrop-filter: blur(10px);

  color: rgba(255,255,255,.92);
  -webkit-text-fill-color: rgba(255,255,255,.92);

  box-shadow: inset 0 1px 0 rgba(255,255,255,.06);
  transition: transform .16s ease, background .16s ease, border-color .16s ease, box-shadow .16s ease;
}

.vl-single-product--two .vl-order-cta i{
  font-size: 18px;
  line-height: 1;
  opacity: .9;
  color: rgba(255,255,255,.88);
}

@media (hover:hover){
  .vl-single-product--two .vl-order-cta:hover{
    border-color: rgba(255,255,255,.22);
    background: var(--vl-glass);
    box-shadow:
      inset 0 1px 0 rgba(255,255,255,.08),
      0 0 0 4px rgba(255,255,255,.06);
    transform: translateY(-1px);
  }
}

.vl-single-product--two .vl-order-cta:active{
  transform: translateY(0);
}

.vl-single-product--two .vl-order-cta:focus-visible{
  outline: none;
  box-shadow:
    0 0 0 3px rgba(90,148,214,.18),
    inset 0 1px 0 rgba(255,255,255,.08);
}


.vl-single-product--two .vl-sidecard-note{
  margin-top: 12px;
  font-size: 12px;
  line-height: 1.45;
  color: rgba(255,255,255,.62);
}


/* Reviews trust card in right sidebar */
.vl-single-product--two .vl-sidebox--reviews{
  padding: 16px 18px;
}

.vl-single-product--two .vl-reviews-inline{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px 18px;
  flex-wrap: wrap;
}

.vl-single-product--two .vl-reviews-inline-title{
  margin: 0;
  white-space: nowrap;
}

.vl-single-product--two .vl-reviews-inline-items{
  display: inline-flex;
  align-items: center;
  justify-content: flex-end;
  gap: 14px;
  flex-wrap: nowrap;
  min-width: 0;
}

.vl-single-product--two .vl-reviews-item{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-width: 0;
}

.vl-single-product--two .vl-reviews-icon{
  width: 24px;
  height: 24px;
  display: block;
  object-fit: contain;
  flex: 0 0 24px;
  filter: drop-shadow(0 0 8px rgba(80,160,255,.14));
}

.vl-single-product--two .vl-reviews-score{
  font-family: "PT Sans", system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  font-size: 15px;
  line-height: 1;
  font-weight: 800;
  letter-spacing: .02em;
  color: rgba(255,255,255,.94);
}

.vl-single-product--two .vl-reviews-divider{
  width: 1px;
  height: 18px;
  flex: 0 0 1px;
  background: rgba(255,255,255,.12);
  box-shadow: 0 0 8px rgba(80,160,255,.08);
}

@media (max-width: 768px){
  .vl-single-product--two .vl-sidebox--reviews{
    padding: 14px 16px;
  }

  .vl-single-product--two .vl-reviews-inline{
    justify-content: center;
    text-align: center;
  }

  .vl-single-product--two .vl-reviews-inline-items{
    justify-content: center;
  }

  .vl-single-product--two .vl-reviews-inline-title{
    width: 100%;
  }

  .vl-single-product--two .vl-reviews-icon{
    width: 22px;
    height: 22px;
    flex-basis: 22px;
  }

  .vl-single-product--two .vl-reviews-score{
    font-size: 14px;
  }
}


/* Journal blocks */
.vl-single-product--two .vl-sidebox{
  background: var(--vl-glass);
  border: 1px solid rgba(255,255,255,.10);
  border-radius: var(--vl-radius);
  padding: 16px;
  backdrop-filter: blur(10px);
  box-shadow: var(--vl-shadow-clean);
}

.vl-single-product--two .vl-sidebox-head{
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 12px;
}

.vl-single-product--two .vl-sidebox-title{
  margin: 0;
  font-size: 12px;
  letter-spacing: .10em;
  text-transform: uppercase;
  color: rgba(255,255,255,.80);
}



.vl-single-product--two .vl-sidebox-list{
  display: grid;
  gap: 10px;
}

.vl-single-product--two .vl-sidepost{
  border-radius: 16px;
  overflow: hidden;
  border: 1px solid rgba(255,255,255,.06);
  background: rgba(255,255,255,.02);
}

.vl-single-product--two .vl-sidepost-link{
  display: block;
  padding: 12px;
}

@media (hover:hover){
  .vl-single-product--two .vl-sidepost{
    transition: transform .18s ease, border-color .18s ease;
  }

  .vl-single-product--two .vl-sidepost-link{
    transition: background .18s ease;
  }

  .vl-single-product--two .vl-sidepost-link:hover{
    background:
      radial-gradient(220px 120px at 18% 0%, rgba(210,214,222,.10), rgba(0,0,0,0) 60%),
      linear-gradient(135deg, rgba(255,255,255,.05), rgba(255,255,255,.02));
  }

  .vl-single-product--two .vl-sidepost:hover{
    border-color: rgba(255,255,255,.14);
    transform: translateY(-1px);
  }
}

.vl-single-product--two .vl-sidepost-date{
  display: inline-flex;
  font-size: 12px;
  color: rgba(255,255,255,.58);
  margin-bottom: 6px;
}
.vl-single-product--two .vl-sidepost-title{
  font-family: var(--vl-font-copy, "PT Serif", Georgia, "Times New Roman", serif);
  font-weight: 600;
  font-size: 13px;
  line-height: 1.25;
  color: rgba(255,255,255,.92);
  margin-bottom: 6px;
}

.vl-single-product--two .vl-sidepost-excerpt{
  font-family: var(--vl-font-copy, "PT Serif", Georgia, "Times New Roman", serif);
}

/* 2–3 строки + “маска затемнения” */
.vl-single-product--two .vl-sidepost-excerpt{
  position: relative;
  font-size: 12.5px;
  line-height: 1.45;
  color: rgba(255,255,255,.70);

  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
  padding-right: 6px;
    -webkit-mask-image: linear-gradient(to bottom, #000 0%, #000 72%, transparent 100%);
  mask-image: linear-gradient(to bottom, #000 0%, #000 72%, transparent 100%);
  -webkit-mask-size: 100% 100%;
  mask-size: 100% 100%;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
}

.vl-single-product--two .vl-sidepost-excerpt::after{
  display: none;
}

.vl-single-product--two .vl-sidebox-empty{
  font-size: 13px;
  color: rgba(255,255,255,.62);
  padding: 12px;
  border-radius: 16px;
  background: rgba(255,255,255,.02);
  border: 1px solid rgba(255,255,255,.06);
}

/* =========================
   MODALS via :target (Preview + Buy)
   ========================= */

/* Buy modal */
.vl-single-product--two .vl-modal,
.vl-single-product--two .vl-preview-modal{
  position: fixed;
  inset: 0;
  z-index: 9999;
  display: none;
}

.vl-single-product--two .vl-modal:target,
.vl-single-product--two .vl-preview-modal:target{
  display: block;
}

.vl-single-product--two .vl-modal__overlay,
.vl-single-product--two .vl-preview-modal__overlay{
  position: absolute;
  inset: 0;
  background: rgba(0,0,0,.74);
  backdrop-filter: blur(10px);
}

.vl-single-product--two .vl-modal__dialog,
.vl-single-product--two .vl-preview-modal__dialog{
  position: relative;
  width: min(920px, 92vw);
  margin: 6vh auto;
  border-radius: 24px;
  border: 1px solid rgba(255,255,255,.10);
  background: rgba(18,18,18,.96);
  box-shadow: 0 40px 120px rgba(0,0,0,.72);
  overflow: hidden;
}

.vl-single-product--two .vl-modal__close,
.vl-single-product--two .vl-preview-modal__close{
  position: absolute;
  right: 12px;
  top: 12px;
  width: 42px;
  height: 42px;
  border-radius: 14px;
  border: 1px solid rgba(255,255,255,.10);
  background: rgba(255,255,255,.04);
  color: rgba(255,255,255,.92);
  font-size: 22px;
  line-height: 1;
  display: grid;
  place-items: center;
}
.vl-single-product--two .vl-modal__close:hover,
.vl-single-product--two .vl-preview-modal__close:hover{
  background: rgba(30,144,255,.10);
  border-color: rgba(30,144,255,.22);
}

.vl-single-product--two .vl-modal__content-wrapper{
  padding: 22px;
}

.vl-single-product--two .vl-modal__title,
.vl-single-product--two .vl-preview-modal__title{
  margin: 0 0 8px;
  font-family: var(--vl-font-ui, system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif);
  font-size: 18px;
  font-weight: 950;
  color: #fff;
}
.vl-single-product--two .vl-modal__subtitle,
.vl-single-product--two .vl-preview-modal__subtitle{
  margin: 0 0 16px;
  color: rgba(255,255,255,.72);
  line-height: 1.45;
  font-size: 13.5px;
}

/* buy form */
.vl-single-product--two .vl-input-group{
  position: relative;
  margin: 12px 0 14px;
}
.vl-single-product--two .vl-input-icon{
  position: absolute;
  left: 14px;
  top: 50%;
  transform: translateY(-50%);
  font-size: 18px;
  color: rgba(255,255,255,.65);
}
.vl-single-product--two .vl-field__input{
  width: 100%;
  height: 52px;
  padding: 0 14px 0 44px;
  border-radius: 16px;
  border: 1px solid rgba(255,255,255,.10);
  background: rgba(255,255,255,.03);
  color: rgba(255,255,255,.92);
  outline: none;
  font-family: var(--vl-font-ui, system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif);
}
.vl-single-product--two .vl-field__input:focus{
  border-color: rgba(30,144,255,.45);
  box-shadow: 0 0 0 4px rgba(30,144,255,.12);
}

.vl-single-product--two .vl-logged-user-box{
  display: flex;
  gap: 10px;
  align-items: center;
  padding: 12px 14px;
  border-radius: 16px;
  border: 1px solid rgba(255,255,255,.10);
  background: rgba(255,255,255,.03);
  color: rgba(255,255,255,.82);
  margin-bottom: 14px;
}
.vl-single-product--two .vl-logged-user-box i{
  font-size: 20px;
  color: rgba(255,255,255,.90);
}

.vl-single-product--two .vl-legal{
  margin: 12px 0 0;
  font-size: 12px;
  line-height: 1.45;
  color: rgba(255,255,255,.62);
}
.vl-single-product--two .vl-legal a{ color: rgba(30,144,255,.92); }
.vl-single-product--two .vl-legal a:hover{ color:#6fb2ff; }

.vl-single-product--two .vl-modal__actions{
  margin-top: 14px;
  display: flex;
  justify-content: flex-end;
}
.vl-single-product--two .vl-buy-submit{
  min-width: 160px;
  height: 48px;
  padding: 0 16px;
  border-radius: 16px;
  color: #fff;
  background: linear-gradient(180deg, rgba(30,144,255,1), rgba(21,112,210,1));
  font-weight: 950;
}
.vl-single-product--two .vl-modal__error{
  margin-top: 12px;
  padding: 12px 14px;
  border-radius: 16px;
  border: 1px solid rgba(255,120,120,.35);
  background: rgba(255,80,80,.08);
  color: rgba(255,255,255,.88);
}

/* Preview modal gallery */
.vl-single-product--two .vl-preview-grid{
  padding: 22px;
  padding-top: 6px;
  display: grid;
  gap: 12px;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
}
.vl-single-product--two .vl-preview-item{
  margin: 0;
  border-radius: 18px;
  overflow: hidden;
  border: 1px solid rgba(255,255,255,.10);
  background: rgba(255,255,255,.03);
  box-shadow: 0 18px 60px rgba(0,0,0,.45);
}
.vl-single-product--two .vl-preview-img{
  width: 100%;
  height: auto;
  display: block;
}

/* Scroll lock (современные браузеры) */
@supports selector(:has(*)){
  html:has(.vl-single-product--two #vl-buy-modal:target),
  html:has(.vl-single-product--two #vl-preview-modal:target){
    overflow: hidden;
  }
}

/* =========================
   Responsive
   ========================= */
@media (max-width: 1100px){
  .vl-single-product--two .vl-product-layout{
    grid-template-columns: 1fr;
  }
  .vl-single-product--two .vl-task-topbar{
    position: static
  } /* закрыли .vl-task-topbar */
}   /* закрыли @media 1100 */



/* =========================
   PRODUCT TASK: Tables (dark premium)
   ========================= */

.vl-single-product--two .vl-task-content .wp-block-table{
  margin: 14px 0;
  border: 1px solid rgba(255,255,255,.14);
  border-radius: 16px;
  overflow: hidden;
  background: rgba(255,255,255,.02);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.06);
}

/* База таблицы */
.vl-single-product--two .vl-task-content table{
  width: 100%;
  border-collapse: collapse;
  font-size: 14px;           /* делаем компактнее */
  line-height: 1.35;
  color: rgba(255,255,255,.86);
  background: transparent;
}

/* ВАЖНО: перебиваем Word/Doc inline font-size внутри ячеек */
.vl-single-product--two .vl-task-content table td *,
.vl-single-product--two .vl-task-content table th *{
  font-size: inherit !important;
  line-height: inherit !important;
}

/* Границы ячеек */
.vl-single-product--two .vl-task-content th,
.vl-single-product--two .vl-task-content td{
  border: 1px solid rgba(255,255,255,.14) !important;
  padding: 10px 12px;
  vertical-align: top;
}

/* Шапка таблицы */
.vl-single-product--two .vl-task-content th{
  background: rgba(255,255,255,.06);
  color: rgba(255,255,255,.92);
  font-weight: 800;
}

/* Лёгкая “зебра” для читаемости */
.vl-single-product--two .vl-task-content tbody tr:nth-child(even) td{
  background: rgba(255,255,255,.015);
}

/* VL — tables on single product (task/description) */
body.single-product .vl-task-content table,
body.single-product .woocommerce-product-details__short-description table,
body.single-product .woocommerce-Tabs-panel table{
  width: 100% !important;
  border-collapse: collapse !important;
  font-size: 14px !important;
  line-height: 1.35 !important;
  color: rgba(255,255,255,.86) !important;
  background: transparent !important;
}

body.single-product .vl-task-content th,
body.single-product .vl-task-content td,
body.single-product .woocommerce-product-details__short-description th,
body.single-product .woocommerce-product-details__short-description td,
body.single-product .woocommerce-Tabs-panel th,
body.single-product .woocommerce-Tabs-panel td{
  border: 1px solid rgba(255,255,255,.16) !important;
  border-color: rgba(255,255,255,.16) !important;
  border-style: solid !important;
  padding: 10px 12px !important;
  vertical-align: top !important;
  background: transparent !important;
}

body.single-product .vl-task-content th,
body.single-product .woocommerce-product-details__short-description th,
body.single-product .woocommerce-Tabs-panel th{
  background: rgba(255,255,255,.06) !important;
  color: rgba(255,255,255,.92) !important;
  font-weight: 800 !important;
}

body.single-product .vl-task-content tbody tr:nth-child(even) td,
body.single-product .woocommerce-product-details__short-description tbody tr:nth-child(even) td,
body.single-product .woocommerce-Tabs-panel tbody tr:nth-child(even) td{
  background: rgba(255,255,255,.015) !important;
}

/* перебиваем Word/Docs inline font-size внутри ячеек */
body.single-product .vl-task-content td *,
body.single-product .vl-task-content th *{
  font-size: inherit !important;
  line-height: inherit !important;
}



@media (max-width: 560px){
    


  /* tighter edges + overall rhythm */
  .vl-single-product--two{
    --vl-pad: 12px;
    --vl-gap: 14px;
    --vl-radius: 18px;
    --vl-radius-sm: 14px;
  }

  /* badges smaller */
  .vl-single-product--two .vl-product-badges{
    margin: 0 0 8px;
    gap: 6px;
  }
  .vl-single-product--two .vl-badge{
    padding: 6px 10px;
    font-size: 10px;
    letter-spacing: .10em;
  }

  /* title smaller */
  .vl-single-product--two .vl-product-title{
    font-size: clamp(18px, 6vw, 22px);
    line-height: 1.15;
    padding-bottom: 10px;
  }

  /* prose a bit tighter on mobile */
  .vl-single-product--two .typography-cyber{
    font-size: 15px;
    line-height: 1.7;
  }

  /* purchase panel: stack, but NO huge gap */
  .vl-single-product--two .vl-purchase-rail{ margin-top: 10px; }

  .vl-single-product--two .vl-purchase-rail__inner{
    flex-direction: column;
    align-items: stretch;
    justify-content: flex-start; /* важно */
    gap: 10px;
    padding: 12px;
  }

  /* document row */
  .vl-single-product--two .vl-filecard{
    width: 100%;
    flex: 0 0 auto;          /* важно: убирает “растягивание” */
    gap: 10px;
    align-items: flex-start;
  }
  .vl-single-product--two .vl-filecard__icon{
    width: 30px;
    height: 30px;
  }
  .vl-single-product--two .vl-filecard__name{
    font-size: 13px;
    white-space: normal;
    max-width: 100%;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
  }
  .vl-single-product--two .vl-filecard__sub{
    font-size: 11px;
    margin-top: 2px;
  }

  /* price + button in ONE row */
  .vl-single-product--two .vl-buyrail{
    width: 100%;
    flex: 0 0 auto;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
  }

.vl-single-product--two .vl-buyrail__value{
  min-height: 42px;
  padding: 0 14px;
  border-radius: 14px;
}

.vl-single-product--two .vl-buyrail__value .price{
  font-size: clamp(18px, 5.4vw, 22px);
}

  .vl-single-product--two .vl-buyrail .btn-shop.vl-buy-btn{
    width: auto !important;
    padding: 10px 12px;
    font-size: 12px;
    border-radius: 12px;
    white-space: nowrap;
  }
  
  
  

  .vl-single-product--two .vl-purchase-rail__note{
    text-align: left;
  }

  /* task topbar a bit tighter */
  .vl-single-product--two .vl-task-topbar{
    padding: 10px;
    border-radius: 16px;
  }

  .vl-single-product--two .vl-task-block{ margin-top: 12px; }
}




/* =========================
   Mobile polish (tight + premium)
   ========================= */
@media (max-width: 560px){

  /* 1) меньше боковых отступов у всей страницы товара (Astra container) */
  body.single-product .site-content .ast-container{
    padding-left: 12px !important;
    padding-right: 12px !important;
  }

  /* 2) tighter internal system on mobile */
  .vl-single-product--two{
    --vl-pad: 12px;
    --vl-gap: 14px;
    --vl-radius: 18px;
    --vl-radius-sm: 14px;
  }

  /* 3) бейдж “ГОТОВАЯ РАБОТА” компактнее */
  .vl-single-product--two .vl-product-badges{
    margin: 0 0 6px;
    gap: 6px;
  }
  .vl-single-product--two .vl-badge{
    padding: 6px 10px;
    font-size: 10px;
    letter-spacing: .10em;
    gap: 6px;
  }
  .vl-single-product--two .vl-badge--ready::before{
    width: 6px;
    height: 6px;
  }

  /* 4) H1 меньше + аккуратнее (на всякий случай даю fallback селекторы) */
  .vl-single-product--two .vl-product-title,
  .vl-single-product--two h1.product_title,
  .vl-single-product--two .entry-title{
    font-size: clamp(20px, 7.2vw, 26px) !important;
    line-height: 1.10 !important;
    padding-bottom: 10px !important;
  }

  /* 5) поджимаем “шапку” блока (чтобы ближе к краям) */
  .vl-single-product--two .vl-product-head{
    padding-left: 0 !important;
    padding-right: 0 !important;
    padding-bottom: 8px !important;
  }

  /* 6) текст/контент в “Содержании задания” — мобильный ритм */
  .vl-single-product--two .typography-cyber{
    font-size: 15px;
    line-height: 1.75;
  }
  .vl-single-product--two .typography-cyber p{
    margin: 0 0 10px;
  }

  /* заголовки внутри контента (если встречаются) */
  .vl-single-product--two .vl-task-content h2{
    font-size: 18px;
    line-height: 1.25;
    margin: 14px 0 8px;
  }
  .vl-single-product--two .vl-task-content h3{
    font-size: 16px;
    line-height: 1.25;
    margin: 12px 0 6px;
  }

  /* 7) ещё немного “tight” для карточек */
  .vl-single-product--two .vl-card{
    padding: 12px;
  }

  /* 8) purchase rail: чтобы не было лишних пустот */
  .vl-single-product--two .vl-purchase-rail__inner{
    padding: 12px;
    gap: 10px;
  }
}




/* Reduced motion */
@media (prefers-reduced-motion: reduce){
  .vl-single-product--two .btn-shop{
    transition: none !important;
  }
}









/* =========================
   Material specs card
   ========================= */

.vl-single-product--two .vl-material-specs{
  position: relative;
  overflow: hidden;

  padding: 20px;

  border-color: rgba(232,236,242,.14);
  background:
    radial-gradient(440px 190px at 10% 0%, rgba(245,248,252,.070), rgba(0,0,0,0) 62%),
    radial-gradient(340px 160px at 100% 0%, rgba(255,255,255,.055), rgba(0,0,0,0) 58%),
    linear-gradient(180deg, rgba(255,255,255,.046), rgba(255,255,255,.020));

  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.055),
    var(--vl-shadow-clean),
    0 0 0 1px rgba(255,255,255,.035);
}

.vl-single-product--two .vl-material-specs::before{
  content: "";
  position: absolute;
  inset: 0 0 auto 0;
  height: 1px;

  background: linear-gradient(
    to right,
    rgba(255,255,255,0),
    rgba(245,248,252,.26),
    rgba(255,255,255,.16),
    rgba(255,255,255,0)
  );

  pointer-events: none;
}

.vl-single-product--two .vl-material-specs__head{
  position: relative;
  z-index: 1;

  margin-bottom: 16px;
  padding-bottom: 14px;

  border-bottom: 1px solid rgba(255,255,255,.075);
}

.vl-single-product--two .vl-material-specs__titlebox{
  min-width: 0;
}

.vl-single-product--two .vl-material-specs__title{
  margin: 0;

  font-family: var(--vl-font-copy, "PT Serif", Georgia, "Times New Roman", serif);
  font-size: 18px;
  font-weight: 600;
  line-height: 1.16;

  color: rgba(255,255,255,.96);
  text-wrap: balance;
  text-shadow: 0 1px 10px rgba(255,255,255,.035);
}

.vl-single-product--two .vl-material-specs__list{
  position: relative;
  z-index: 1;

  margin: 0;
  padding: 0;
  list-style: none;

  display: grid;
  gap: 10px;
}

.vl-single-product--two .vl-material-specs__item{
  position: relative;

  display: grid;
  grid-template-columns: 42px minmax(0, 1fr);
  align-items: center;
  gap: 12px;

  min-height: 68px;
  padding: 12px 13px;

  border-radius: 17px;
  border: 1px solid rgba(255,255,255,.085);
  background:
    radial-gradient(160px 90px at 0% 0%, rgba(255,255,255,.045), rgba(0,0,0,0) 64%),
    linear-gradient(180deg, rgba(255,255,255,.038), rgba(255,255,255,.017));

  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.042),
    0 10px 24px rgba(0,0,0,.11);
}

.vl-single-product--two .vl-material-specs__item::after{
  content: "";
  position: absolute;
  inset: 10px auto 10px 0;
  width: 2px;

  border-radius: 999px;
  background: linear-gradient(
    to bottom,
    rgba(255,255,255,0),
    rgba(235,239,245,.28),
    rgba(255,255,255,0)
  );

  opacity: .72;
  pointer-events: none;
}

.vl-single-product--two .vl-material-specs__item-icon{
  width: 38px;
  height: 38px;
  flex: 0 0 38px;

  display: inline-flex;
  align-items: center;
  justify-content: center;

  border-radius: 14px;
  border: 1px solid rgba(255,255,255,.115);
  background:
    radial-gradient(82px 60px at 30% 12%, rgba(255,255,255,.115), rgba(0,0,0,0) 66%),
    linear-gradient(180deg, rgba(255,255,255,.042), rgba(255,255,255,.017));

  color: rgba(232,236,242,.94);

  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.065),
    0 0 18px rgba(255,255,255,.040);
}

.vl-single-product--two .vl-material-specs__item-icon svg{
  width: 21px;
  height: 21px;
  display: block;
}

/* Все иконки в одной серебристой гамме */
.vl-single-product--two .vl-material-specs__item--subject .vl-material-specs__item-icon,
.vl-single-product--two .vl-material-specs__item--university .vl-material-specs__item-icon,
.vl-single-product--two .vl-material-specs__item--type .vl-material-specs__item-icon,
.vl-single-product--two .vl-material-specs__item--date .vl-material-specs__item-icon{
  color: rgba(232,236,242,.94);
}

.vl-single-product--two .vl-material-specs__content{
  min-width: 0;

  display: grid;
  gap: 5px;
}

.vl-single-product--two .vl-material-specs__label{
  display: block;
  min-width: 0;

  font-family: "PT Sans", system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  font-size: 11px;
  font-weight: 900;
  line-height: 1.15;
  letter-spacing: .075em;
  text-transform: uppercase;

  color: rgba(255,255,255,.50);
}

.vl-single-product--two .vl-material-specs__value{
  display: block;
  min-width: 0;
  margin: 0;

  font-family: "PT Sans", system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  font-size: 14.5px;
  font-weight: 850;
  line-height: 1.34;

  color: rgba(255,255,255,.92);

  overflow-wrap: anywhere;
  text-shadow: 0 1px 0 rgba(0,0,0,.22);
}

@media (hover:hover){
  .vl-single-product--two .vl-material-specs__item{
    transition:
      border-color .18s ease,
      background .18s ease,
      box-shadow .18s ease,
      transform .18s ease;
  }

  .vl-single-product--two .vl-material-specs__item-icon{
    transition:
      border-color .18s ease,
      background .18s ease,
      box-shadow .18s ease,
      transform .18s ease;
  }

  .vl-single-product--two .vl-material-specs__item:hover{
    border-color: rgba(255,255,255,.13);
    background:
      radial-gradient(170px 95px at 0% 0%, rgba(255,255,255,.060), rgba(0,0,0,0) 64%),
      linear-gradient(180deg, rgba(255,255,255,.050), rgba(255,255,255,.021));

    box-shadow:
      inset 0 1px 0 rgba(255,255,255,.060),
      0 12px 28px rgba(0,0,0,.14);

    transform: translateY(-1px);
  }

  .vl-single-product--two .vl-material-specs__item:hover .vl-material-specs__item-icon{
    border-color: rgba(255,255,255,.16);
    background:
      radial-gradient(88px 64px at 30% 12%, rgba(255,255,255,.150), rgba(0,0,0,0) 66%),
      linear-gradient(180deg, rgba(255,255,255,.050), rgba(255,255,255,.021));

    box-shadow:
      inset 0 1px 0 rgba(255,255,255,.075),
      0 0 22px rgba(255,255,255,.060);

    transform: translateY(-1px);
  }
}

@media (max-width: 520px){
  .vl-single-product--two .vl-material-specs{
    padding: 17px;
  }

  .vl-single-product--two .vl-material-specs__head{
    margin-bottom: 15px;
    padding-bottom: 13px;
  }

  .vl-single-product--two .vl-material-specs__title{
    font-size: 18px;
  }

  .vl-single-product--two .vl-material-specs__item{
    grid-template-columns: 38px minmax(0, 1fr);
    gap: 11px;

    min-height: 64px;
    padding: 11px 12px;

    border-radius: 16px;
  }

  .vl-single-product--two .vl-material-specs__item-icon{
    width: 36px;
    height: 36px;

    border-radius: 13px;
  }

  .vl-single-product--two .vl-material-specs__item-icon svg{
    width: 20px;
    height: 20px;
  }

  .vl-single-product--two .vl-material-specs__value{
    font-size: 14px;
    line-height: 1.34;
  }
}



/* =========================
   Purchase benefits below rail
   ========================= */

.vl-single-product--two .vl-purchase-benefits{
  margin-top: 10px;

  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
}

.vl-single-product--two .vl-purchase-benefits__item{
  position: relative;
  overflow: hidden;

  min-height: 50px;
  padding: 8px 12px;

  display: grid;
  grid-template-columns: 30px minmax(0, 1fr);
  align-items: center;
  gap: 10px;

  border-radius: 15px;
  border: 1px solid rgba(255,255,255,.085);
  background:
    radial-gradient(130px 74px at 0% 0%, rgba(255,255,255,.045), rgba(0,0,0,0) 64%),
    linear-gradient(180deg, rgba(255,255,255,.038), rgba(255,255,255,.016));

  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.045),
    0 9px 22px rgba(0,0,0,.10);
}

.vl-single-product--two .vl-purchase-benefits__item::before{
  content: "";
  position: absolute;
  inset: 0 12px auto;
  height: 1px;

  background: linear-gradient(
    to right,
    rgba(255,255,255,0),
    rgba(235,239,245,.16),
    rgba(255,255,255,0)
  );

  opacity: .85;
  pointer-events: none;
}

.vl-single-product--two .vl-purchase-benefits__check{
  width: 30px;
  height: 30px;
  flex: 0 0 30px;

  display: inline-flex;
  align-items: center;
  justify-content: center;

  border-radius: 11px;
  border: 1px solid rgba(255,255,255,.105);
  background:
    radial-gradient(60px 44px at 30% 12%, rgba(255,255,255,.105), rgba(0,0,0,0) 68%),
    linear-gradient(180deg, rgba(255,255,255,.035), rgba(255,255,255,.014));

  color: rgba(232,236,242,.94);

  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.060),
    0 0 15px rgba(255,255,255,.035);
}

.vl-single-product--two .vl-purchase-benefits__check svg{
  width: 18px;
  height: 18px;
  display: block;
}

.vl-single-product--two .vl-purchase-benefits__content{
  min-width: 0;

  display: flex;
  align-items: center;
}

.vl-single-product--two .vl-purchase-benefits__title{
  display: block;

  font-family: "PT Sans", system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  font-size: 13px;
  font-weight: 900;
  line-height: 1.18;
  letter-spacing: .01em;

  color: rgba(255,255,255,.90);

  overflow-wrap: anywhere;
}

@media (hover:hover){
  .vl-single-product--two .vl-purchase-benefits__item,
  .vl-single-product--two .vl-purchase-benefits__check{
    transition:
      border-color .18s ease,
      background .18s ease,
      box-shadow .18s ease,
      transform .18s ease;
  }

  .vl-single-product--two .vl-purchase-benefits__item:hover{
    border-color: rgba(255,255,255,.125);
    background:
      radial-gradient(140px 80px at 0% 0%, rgba(255,255,255,.060), rgba(0,0,0,0) 65%),
      linear-gradient(180deg, rgba(255,255,255,.048), rgba(255,255,255,.020));

    box-shadow:
      inset 0 1px 0 rgba(255,255,255,.060),
      0 11px 26px rgba(0,0,0,.13);

    transform: translateY(-1px);
  }

  .vl-single-product--two .vl-purchase-benefits__item:hover .vl-purchase-benefits__check{
    border-color: rgba(255,255,255,.155);
    background:
      radial-gradient(64px 48px at 30% 12%, rgba(255,255,255,.135), rgba(0,0,0,0) 68%),
      linear-gradient(180deg, rgba(255,255,255,.045), rgba(255,255,255,.017));

    box-shadow:
      inset 0 1px 0 rgba(255,255,255,.075),
      0 0 20px rgba(255,255,255,.055);

    transform: translateY(-1px);
  }
}

@media (max-width: 920px){
  .vl-single-product--two .vl-purchase-benefits{
    grid-template-columns: 1fr;
  }

  .vl-single-product--two .vl-purchase-benefits__item{
    min-height: 50px;
  }
}

@media (max-width: 520px){
  .vl-single-product--two .vl-purchase-benefits{
    margin-top: 9px;
    gap: 8px;
  }

  .vl-single-product--two .vl-purchase-benefits__item{
    min-height: 48px;
    padding: 9px 11px;
    border-radius: 14px;

    grid-template-columns: 28px minmax(0, 1fr);
    gap: 9px;
  }

  .vl-single-product--two .vl-purchase-benefits__check{
    width: 28px;
    height: 28px;
    border-radius: 10px;
  }

  .vl-single-product--two .vl-purchase-benefits__check svg{
    width: 17px;
    height: 17px;
  }

  .vl-single-product--two .vl-purchase-benefits__title{
    font-size: 12.5px;
  }
}


/* Align right sidebar with purchase block */
@media (min-width: 1025px){
  .vl-single-product--two .vl-product-side{
    margin-top: clamp(125px, 7.8vw, 155px) !important;
  }
}


/* Reduce empty space before task content */
.vl-single-product--two .vl-task-card{
  padding-top: clamp(18px, 1.2vw, 22px) !important;
}

.vl-single-product--two .vl-task-content{
  padding-top: 0 !important;
}

.vl-single-product--two .vl-task-content > :first-child{
  margin-top: 0 !important;
}




/* =========================
   Single product top spacing
   ========================= */

body.single-product #content .ast-container{
  padding-top: 0 !important;
}

body.single-product #primary,
body.single-product .ast-woocommerce-container,
body.single-product .woocommerce{
  margin-top: 0 !important;
  padding-top: 0 !important;
}

body.single-product .vl-single-product--two{
  padding-top: clamp(8px, 1.3vw, 18px) !important;
}