/* =========================================================
   CATEGORY PAGE — FINAL (NO STRETCH, NO DUPLICATE LINES)
   Lines: ONLY borders (no ::before/::after lines anywhere)
   ========================================================= */

.sp-cat{
  --cat-scale: .90;

  --cat-pad-x: calc(32px * var(--cat-scale));
  --cat-gap-lg: calc(46px * var(--cat-scale));
  --cat-gap-md: calc(28px * var(--cat-scale));
  --cat-gap-sm: calc(18px * var(--cat-scale));

  --cat-rule: rgba(195,150,98,.60);
  --cat-rule-soft: rgba(195,150,98,.35);
  --cat-rule-w: 1px;

  background: var(--bg-lite, #FCF7F1);
  padding: calc(44px * var(--cat-scale)) 0 calc(64px * var(--cat-scale));
}

.sp-cat__container{
  width: 90% !important;
  margin: 0 auto;
  padding: 0 clamp(20px, 2.5vw, 48px);
  box-sizing: border-box;
}
/* =========================================================
   FRESH
   ========================================================= */

.sp-cat-fresh{
  margin: 0 0 var(--cat-gap-lg);
}

.sp-cat-fresh__head{
  margin: 0 0 calc(18px * var(--cat-scale));
  padding: 0;
  border: 0 !important;
}

.sp-cat-fresh__title{
  margin-top: 0;
  margin-bottom: calc(24px * var(--cat-scale)); 
    font-family: var(--font-display, "Playfair Display", serif);
  font-weight: 400;
  font-size: clamp(34px, calc(48px * var(--cat-scale)), 48px);
  line-height: 1.05;
  color: var(--accent-primary, #c39662);
}

.sp-cat-fresh__grid{
  display: grid;
  grid-template-columns: minmax(0, 1.63fr) minmax(0, 1fr); /* ~62/38 */
  gap: var(--cat-gap-md);
  align-items: start;
}


@media (max-width: 868px) {
  .sp-cat-fresh__grid {
    grid-template-columns: minmax(0, 1.73fr) minmax(0, 1.2fr); /* ~65/35 */
  }
}


/* ===== FEATURE (LEFT) ===== */

.sp-fresh-feature{
  margin: 0;
  padding: 0;
}



.sp-fresh-feature__img,
.sp-fresh-feature__ph{
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.sp-fresh-feature__body{
  padding-top: calc(10px * var(--cat-scale));
}

.sp-fresh-feature__title{
  margin: 0;
  font-family: var(--font-display, "Playfair Display", serif);
  font-weight: 400;
  font-size: clamp(20px, calc(35px * var(--cat-scale)), 40px);
  line-height: 1.12;
}

.sp-fresh-feature__title a{
  color: var(--accent-primary, #c39662);
  text-decoration: none;

}
.sp-fresh-feature__title a:hover{
  color: var(--accent-soft, #d2ab7a);
}

/* ===== ASIDE (RIGHT) ===== */

.sp-fresh-aside{
  width: 100%;
  display: flex;
  flex-direction: column;
  gap: calc(14px * var(--cat-scale));
}

/* мини-карточки */
.sp-fresh-mini{
  margin: 0;
  padding: 0;
  border: 0 !important;
}

/* Линия между блоками в правой колонке */
.sp-fresh-mini:not(:first-child) {
  border-top: var(--cat-rule-w) solid var(--cat-rule-soft);
  padding-top: calc(14px * var(--cat-scale));
  margin-top: calc(14px * var(--cat-scale));
}

.sp-fresh-mini__body{
  margin-top: 0;
  padding-top: calc(14px * var(--cat-scale));
  border-top: var(--cat-rule-w) solid var(--cat-rule);
}

@media (max-width: 768px){
.sp-fresh-mini__body{
  margin-top: 0;
  padding-top: 6vw;
  border-top: var(--cat-rule-w) solid var(--cat-rule);
}
}

.sp-fresh-mini__media{
  display: block;
  position: relative;
  width: 100%;
  overflow: hidden;
  background: #e8e2db;
  margin: 0 0 calc(10px * var(--cat-scale));
  aspect-ratio: 16/9;
}

.sp-fresh-mini__img,
.sp-fresh-mini__ph{
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.sp-fresh-mini__title{
  margin: 0;
  font-family: var(--font-display, "Playfair Display", serif);
  font-weight: 400;
  font-size: clamp(12px, calc(35px * var(--cat-scale)), 40px);
  line-height: 1.35;
}

@media (max-width: 800px) {
  .sp-fresh-mini__title {
    font-size: clamp(12px, 3vw, 22px); /* Планшет/десктоп: больше */
  }
}

@media (min-width: 1025px) {
  .sp-fresh-mini__title {
    font-size: clamp(24px, 4vw, 40px); /* Десктоп: max 40px */
  }
}

.sp-fresh-mini__title a{
  color: var(--accent-primary, #c39662);
  text-decoration: none;
}
.sp-fresh-mini__title a:hover{
  color: var(--accent-soft, #d2ab7a);
}

/* =========================================================
   META (ONE SYSTEM)
   ========================================================= */

/* META — LOCKED FOR CATEGORY PAGE */
.sp-cat .sp-meta{
  margin: 0 0 calc(17px * var(--cat-scale)) !important;
  font-family: var(--font-ui, "Source Sans 3", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif) !important;
  font-weight: 400 !important;

  /* ВАЖНО: чтобы не “слетало” в аперкейс */
  text-transform: none !important;

  /* small-caps (и фолбэк через OpenType фичи) */
  font-variant-caps: all-small-caps !important;
  font-feature-settings: "smcp" 1, "c2sc" 1 !important;

  letter-spacing: var(--meta-ls, .12em) !important;
  line-height: 1.35 !important;

  /* размер */
  font-size: var(--meta-size, clamp(12px, 0.95vw, 18px)) !important;

  color: #6f635a !important;

  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.sp-meta__sep{
  display: inline-block;
  width: 6px;
  height: 6px;
  margin: 0 10px;
  background: rgba(195,150,98,.95);
  transform: translateY(-1px);
}

/* desktop: UP visible, DOWN hidden */
.sp-fresh-mini .sp-meta-up{ display: block; }
.sp-fresh-mini .sp-meta-down{ display: none; }

/* =========================================================
   CATEGORY LIST HEAD
   ========================================================= */

.sp-cat-list__head{
  display: flex;
  flex-direction: column;
  gap: calc(10px * var(--cat-scale));
  margin: 0 0 calc(10px * var(--cat-scale));
  padding: 0;
  border: 0 !important; /* выключаем любые линии темы */
}

.sp-cat-list__title{
  margin: 0 0 calc(14px * var(--cat-scale));
  font-family: var(--font-display, "Playfair Display", serif);
  font-weight: 400;
  font-size: var(--fresh-h2) !important;
  line-height: 1.02;
  color: var(--accent-primary, #c39662);
}

.sp-cat-sort{
  display: inline-flex;
}

.sp-cat-sort__btn{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: calc(34px * var(--cat-scale));
  padding: calc(9px * var(--cat-scale)) calc(14px * var(--cat-scale));
  border: 1px solid var(--cat-rule);
  background: transparent;
  font-family: "Source Sans 3",sans-serif !important;
  font-weight: 400;
  font-size: calc(11px * var(--cat-scale));
  letter-spacing: .16em;
  text-transform: uppercase;
  color: #6b5c4f;
  text-decoration: none;
  line-height: 1;
}

.sp-cat-sort__btn:first-child{ border-right: 0; }
.sp-cat-sort__btn:last-child{ border-left: 0; }

.sp-cat-sort__btn.is-active{
  background: var(--accent-primary, #c39662);
  border-color: var(--accent-primary, #c39662);
  color: #fff;
}


/* =========================================================
   NEWS LIST
   ========================================================= */

.sp-cat-newslist{
  display: flex;
  flex-direction: column;
  gap: var(--cat-gap-md);
}

.sp-cat-item{
  display: block;
  border: 0 !important;
}

/* линия перед каждой новостью - одна */
.sp-cat-item__thumb{
  display: block;
  width: 100%;
  margin-top: calc(18px * var(--cat-scale));
  border-top: var(--cat-rule-w) solid var(--cat-rule);
  padding-top: calc(18px * var(--cat-scale));
}

.sp-cat-item__thumb::before{ display:none !important; } /* вырубаем старую линию */

.sp-cat-item__img,
.sp-cat-item__ph{
  width: 100%;
  height: auto;
  display: block;
  object-fit: cover;
}

.sp-cat-item__body{
  padding-top: calc(12px * var(--cat-scale));
}

.sp-cat-item__title{
  margin: 0;
  font-family: var(--font-display, "Playfair Display", serif);
  font-weight: 400;
  font-size: var(--fresh-mini-title) !important;  line-height: 1.08;
}

.sp-cat-item__title a{
  color: var(--accent-primary, #c39662);
  text-decoration: none;
}
.sp-cat-item__title a:hover{
  color: var(--accent-soft, #d2ab7a);
}

/* =========================================================
   HARD KILL: если тема добавляет линии через hr/::before
   ========================================================= */
.sp-cat hr{ display:none !important; }
.sp-cat section::before,
.sp-cat section::after,
.sp-cat article::before,
.sp-cat article::after,
.sp-cat header::before,
.sp-cat header::after{
  content: none !important;
  display: none !important;
}

/* =========================================================
   RESPONSIVE
   ========================================================= */

@media (max-width: 1100px){
  .sp-cat__container{ max-width: 92%; }
}



@media (max-width: 768px){
  .sp-cat{ --cat-scale: .96; }
  .sp-cat__container{ max-width: 100%; padding: 0 20px; }
  .sp-cat-fresh__grid{ grid-template-columns: 1fr; }

  .sp-fresh-aside .sp-fresh-mini:nth-of-type(2){ display:none; }

  /* мобилка: у каждой карточки одна верхняя линия */
  .sp-fresh-feature{
     border-top: var(--cat-rule-w) solid var(--cat-rule);
     padding-top: 5vw;
  }

  .sp-fresh-mini{
    border-top: var(--cat-rule-w) solid var(--cat-rule);
    padding-top: calc(14px * var(--cat-scale));
  }

  /* На мобилке убираем линии между блоками, так как у каждого своя верхняя */
  .sp-fresh-mini:not(:first-child) {
    border-top: 0;
    padding-top: 0;
    margin-top: 0;
  }

  /* на мобилке разделители внутри aside не нужны */
  .sp-fresh-aside{
    border-top: 0;
    padding-top: 0;
  }

  /* meta switch */
  .sp-fresh-mini .sp-meta-up{ display:none; }
  .sp-fresh-mini .sp-meta-down{
    display:block;
    margin-top: calc(10px * var(--cat-scale));
  }
}
/* =========================================================
   FIX TYPO: keep 1600px look, prevent giant fonts
   ========================================================= */

.sp-cat{
  /* scale оставляем только для spacing */
  --cat-scale: .90;

  /* ===== typography tokens (independent from --cat-scale) ===== */
  --fresh-h2: clamp(34px, 2.2vw, 48px);   /* "Свежие публикации" */
  --fresh-feature-title: clamp(24px, 1.9vw, 36px); /* левый большой */
  --fresh-mini-title: clamp(20px, 1.55vw, 30px);   /* правые */
  --meta-size: clamp(12px, 0.95vw, 18px);          /* мета (люди • isk • дата) */
  --meta-ls: .12em;
}

/* Заголовок секции */
.sp-cat-fresh__title{
  font-size: var(--fresh-h2) !important;
}

/* Левый feature title */
.sp-fresh-feature__title{
  font-size: var(--fresh-feature-title) !important;
  line-height: 1.12;
}

/* Правые mini titles */
.sp-fresh-mini__title{
  font-size: var(--fresh-mini-title) !important;
  line-height: 1.28;
}


/* =========================================================
   Make wide screens NOT inflate further (1600+ stays same)
   ========================================================= */
@media (min-width: 1600px){
  .sp-cat{
    /* чуть стабилизируем, чтобы вообще не "расти" */
    --fresh-h2: 48px;
    --fresh-feature-title: 36px;
    --fresh-mini-title: 30px;
    --meta-size: 18px;
  }
}

/* =========================================================
   Mobile: tighter typography (prevents huge titles)
   ========================================================= */
@media (max-width: 768px){
  .sp-cat{
    --fresh-h2: clamp(26px, 7vw, 34px);
    --fresh-feature-title: clamp(22px, 6.2vw, 28px);
    --fresh-mini-title: clamp(18px, 5.2vw, 24px);
    --meta-size: clamp(11px, 3.2vw, 14px);
  }

.sp-cat .sp-meta{
    letter-spacing: .10em;
  }
}

/* убиваем внутренние линии, которые у тебя сейчас создают "гуляние" */
.sp-fresh-mini__body { border-top: 0 !important; padding-top: 0 !important; }
.sp-fresh-mini:not(:first-child){ border-top: 0 !important; padding-top: 0 !important; margin-top: 0 !important; }


/* =========================
   FRESH (stable grid)
   ========================= */

.sp-cat-fresh__grid{
  container-type: inline-size;
  display: grid;
  grid-template-columns: minmax(0, 1.63fr) minmax(0, 1fr);
  gap: var(--cat-gap-md);
  align-items: start;
  --fresh-top-h: clamp(260px, 38cqw, 420px);

}

/* левый блок */
.sp-fresh-feature{ margin:0; padding:0; }
.sp-fresh-feature__media{
  display: block;
  height: var(--fresh-top-h);
  position: relative;
  overflow: hidden;
  background: #e8e2db;
  margin-top: 10px;
  aspect-ratio: auto !important;
}

/* img внутри big */
.sp-fresh-feature__img,
.sp-fresh-feature__ph{
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.sp-fresh-feature__body{ padding-top: calc(10px * var(--cat-scale)); }

.sp-fresh-feature__title{
  margin:0;
  font-family: var(--font-display, "Playfair Display", serif);
  font-weight:400;
  font-size: var(--fresh-feature-title, clamp(24px, 1.9vw, 36px));
  line-height: 1.12;
}

.sp-fresh-aside{
  display: grid !important;
  grid-template-rows: var(--fresh-top-h) 1px auto;
  row-gap: calc(14px * var(--cat-scale));
  align-content: start;
}

/* линия в сетке (не псевдо, не JS) */
.sp-fresh-line{
  height:1px;
  background: rgba(195,150,98,.35);
}

/* убираем старые гуляющие бордеры и паддинги */
.sp-fresh-mini,
.sp-fresh-mini__body{
  margin:0;
  padding:0;
  border:0 !important;
}

.sp-fresh-mini__media{
  display:block;
  position:relative;
  width:100%;
  overflow:hidden;
  background:#e8e2db;
  margin: 0 0 calc(10px * var(--cat-scale));
  aspect-ratio: 16 / 9;
}

.sp-fresh-mini__img,
.sp-fresh-mini__ph{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
}

.sp-fresh-mini__title{
  margin:0;
  font-family: var(--font-display, "Playfair Display", serif);
  font-weight:400;
  font-size: var(--fresh-mini-title, clamp(20px, 1.55vw, 30px));
  line-height: 1.28;

}

/* типографика meta (чтобы не раздувало) */
.sp-cat{
  --fresh-h2: clamp(34px, 2.2vw, 48px);
  --fresh-feature-title: clamp(24px, 1.9vw, 36px);
  --fresh-mini-title: clamp(20px, 1.55vw, 30px);
  --meta-size: clamp(12px, 0.95vw, 18px);
}

.sp-cat-fresh__title{ font-size: var(--fresh-h2) !important; }
.sp-cat .sp-meta{ font-size: var(--meta-size) !important; }
/* wide: фиксируем потолок как “макет на 1600” */
@media (min-width: 1600px){
  .sp-cat{
    --fresh-h2: 48px;
    --fresh-feature-title: 36px;
    --fresh-mini-title: 30px;
    --meta-size: 18px;
  }
}

/* tablet tweak */
@media (max-width: 868px){
  .sp-cat-fresh__grid{
    grid-template-columns: minmax(0, 1.73fr) minmax(0, 1.2fr);
  }
}

/* mobile */
@media (max-width: 768px){
  .sp-cat-fresh__grid{
    grid-template-columns: 1fr;
  }
  .sp-fresh-aside{
    grid-template-rows: auto auto;
  }
  .sp-fresh-line{ display:none; }
}



.sp-fresh-mini--top{ height: 100%; }

.sp-fresh-mini--top .sp-fresh-mini__body{
  height: 100%;
  display: flex;
  flex-direction: column;
}

/* его картинка занимает всё свободное место внутри */
.sp-fresh-mini--top .sp-fresh-mini__media{
  flex: 1;
  min-height: 0;
}


@media (max-width: 768px){
  .sp-fresh-feature__media{
    height: auto;
    aspect-ratio: 16/10 !important;
    
  }
  .sp-fresh-aside{
    grid-template-rows: auto auto;
  }
  .sp-fresh-line{ display: none; }
}


/* ===== META CATEGORY: one line, shrink (no ellipsis on mobile) ===== */
body.category .sp-cat .sp-meta{
  margin: 0 0 17px 0 !important;
  font-family: "Source Sans 3",sans-serif !important;
  font-weight: 400 !important;

  text-transform: none !important;
  font-variant-caps: all-small-caps !important;
  font-feature-settings: "smcp" 1, "c2sc" 1 !important;

  display: inline-flex !important;
  align-items: center !important;
  gap: clamp(6px, 1.2vw, 12px) !important;

  line-height: 1.35 !important;
  font-size: clamp(12px, 1.2vw, 18px) !important;
  letter-spacing: clamp(.08em, .8vw, .12em) !important;

  color: #6f635a !important;

  white-space: nowrap !important;
  overflow: visible !important;
  text-overflow: clip !important;
}

/* точка-разделитель — без margin, gap рулит */
body.category .sp-cat .sp-meta__sep{
  flex: 0 0 auto;
  width: 4px;
  height: 4px;
  margin: 0 !important;
  background: rgba(195,150,98,.95);
  transform: translateY(0px);
}

/* мобилка: сильнее ужимаем, но НЕ режем */
@media (max-width: 520px){
  body.category .sp-cat .sp-meta{
    font-size: clamp(9px, 2.7vw, 12px) !important;
    letter-spacing: clamp(.05em, .6vw, .10em) !important;
    gap: clamp(4px, 1vw, 8px) !important;
  }
}

/* мини-превью: нормальная высота на любых ширинах */
.home-news .mini-thumb-wrap{
  display:block;
  position:relative;
  width:100%;
  aspect-ratio: 16 / 10;  /* можешь 4/3 или 16/9 */
  overflow:hidden;
  background:#f5f1eb;
}

.home-news .mini-thumb-wrap img{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}

/* если именно на ~832px кто-то занижает высоту — перекрываем */
@media (max-width: 904px){
  .home-news .mini-thumb-wrap{
    height:auto !important;
    max-height:none !important;
    min-height:0 !important;
  }
}


/* В мини-карточке оставить только ПЕРВЫЙ .sp-meta */
.sp-fresh-mini .sp-meta + .sp-meta{
  display: none !important;
}


@media (max-width: 768px){

  /* единые значения, чтобы всё совпало */
  .sp-cat{
    --m-rule-before: 14px; /* воздух ДО линии */
    --m-rule-after: 18px;  /* воздух ПОСЛЕ линии (до картинки) */
  }

  /* 1) FEATURE: убираем старую линию/паддинг с контейнера */
  .sp-fresh-feature{
    border-top: 0 !important;
    padding-top: 0 !important;
  }

  /* 2) FEATURE: делаем линию+воздух на media (как у mini) */
  .sp-fresh-feature__media{
    background: transparent !important;
    margin-top: var(--m-rule-before) !important;
    border-top: var(--cat-rule-w) solid var(--cat-rule);
    padding-top: var(--m-rule-after);
    box-sizing: content-box;
  }

  /* и двигаем absolute-картинку вниз */
  .sp-fresh-feature__img,
  .sp-fresh-feature__ph{
    top: var(--m-rule-after) !important;
    height: calc(100% - var(--m-rule-after)) !important;
  }

  /* 3) MINI: тоже по тем же переменным */
  .sp-fresh-mini__media{
    background: transparent !important;
    margin-top: var(--m-rule-before) !important;
    border-top: var(--cat-rule-w) solid var(--cat-rule);
    padding-top: var(--m-rule-after);
    box-sizing: content-box;
  }

  .sp-fresh-mini__img,
  .sp-fresh-mini__ph{
    top: var(--m-rule-after) !important;
    height: calc(100% - var(--m-rule-after)) !important;
  }

  /* 4) если на мобилке у списка тоже хочешь такую же геометрию */
  .sp-cat-item__thumb{
    margin-top: var(--m-rule-before) !important;
    padding-top: var(--m-rule-after) !important;
  }
}



