/* =========================================================
   ЗАГОЛОВОК И ЛИД
   ========================================================= */

/* H1 страницы */
.countdown-title {
  font-size: 36px;
  font-weight: 400;
  margin: 0 0 2px; /* почти без отступа */
  text-align: center;
  color: var(--jlia-heading);
}

/* Текст под H1 (SEO-lead) */
.countdown-lead {
  font-size: 14px;        /* уменьшили */
  color: #6b7280;         /* менее контрастный */
  line-height: 1.45;
  margin: 0;              /* без лишних отступов */
  text-align: center;
  font-weight: 400;       /* можно 600 для жирного */
  font-style: italic;     /* курсив */
  color: #6b7280;
}
/* Линия под lead — работает и на страницах, и на записях */
p.countdown-lead::after {
  content: "";
  display: block;
  height: 3px;
  margin: 12px auto 0;
  width: 100%;
/*  max-width: 1500px;*/
  border-radius: 3px;
  background: linear-gradient(90deg,#a78bfa,#60a5fa,#fbbf24);
  opacity: .55;
}


/* =========================================================
   БЫСТРЫЙ ОТВЕТ
   ========================================================= */

.countdown-summary {
  background: #ffffff;
  border-radius: 12px;
  padding: 16px 20px;
  box-shadow: 0 2px 8px rgba(0,0,0,0.05);
}

.countdown-summary > div {
  margin-bottom: 6px;
}

.countdown-summary strong {
  font-weight: 600;
}

/* =========================================================
   ОСНОВНОЙ ТАЙМЕР
   ========================================================= */

.countdown-main {
  background: none;
  padding: 0;
  box-shadow: none;
}

/* Сетка таймера */
.timer-board {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 16px;
  text-align: center;
  margin-bottom: 20px;
}

/* Элемент таймера */
.timer-item {
  background: #f1f5f9;
  border-radius: 12px;
  padding: 16px 8px;
}

/* Число */
.timer-num {
  display: block;
  font-size: 32px;
  font-weight: 700;
}

/* Подпись */
.timer-label {
  font-size: 14px;
  color: #64748b;
}

/* =========================================================
   КНОПКИ ТАЙМЕРА
   ========================================================= */

.timer-actions {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
}

/* Фикс кликабельности */
.timer-actions {
  pointer-events: auto !important;
}

.timer-actions button {
  pointer-events: auto !important;
  cursor: pointer;
}

/* Кнопка */
.timer-actions .btn {
  padding: 10px 16px;
  border-radius: 8px;
  border: 1px solid #cbd5e1;
  background: #ffffff;
  opacity: 0.6;
}

/* =========================================================
   HTML-КОД ТАЙМЕРА
   ========================================================= */

.countdown-embed {
  background: #ffffff;
  border-radius: 12px;
  padding: 20px;
  border: 1px dashed #cbd5e1;
}

.countdown-embed textarea {
  width: 100%;
  resize: none;
  font-family: monospace;
  padding: 10px;
  margin: 12px 0;
}

/* =========================================================
   РЕКЛАМНЫЙ БЛОК
   ========================================================= */

.ad-block {
  min-height: 90px;
  background: #eef2f7;
  border-radius: 12px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #64748b;
  font-size: 14px;
}

/* =========================================================
   ПРОЧИЕ БЛОКИ
   ========================================================= */

.related-countdowns {
  background: #ffffff;
  border-radius: 12px;
  padding: 20px;
}

.countdown-units {
  background: #ffffff;
  border-radius: 12px;
  padding: 20px;
}

.units-list {
  list-style: none;
  padding: 0;
  margin: 0;
}

.units-list li {
  padding: 6px 0;
}

.date-info {
  background: #ffffff;
  border-radius: 12px;
  padding: 20px;
}

.date-info-list {
  list-style: none;
  padding: 0;
  margin: 0;
}

.date-info-list li {
  padding: 4px 0;
}

/* =========================================================
   ТЕГИ С ИЗОБРАЖЕНИЯМИ
   ========================================================= */

.tag-tiles--image .tag-tiles-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
  gap: 12px;
}

.tag-tiles--image .tag-tile {
  background: #ffffff;
  border-radius: 12px;
  overflow: hidden;
  text-align: center;
}

.tag-tiles--image img {
  width: 100%;
  height: 90px;
  object-fit: cover;
}

.tag-tiles--image .tag-tile-title {
  display: block;
  padding: 8px;
}

/* =========================================================
   ТЕКСТОВЫЕ ТЕГИ
   ========================================================= */

.tag-tiles--text .tag-tiles-grid {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.tag-tiles--text .tag-tile {
  background: #e5e7eb;
  border-radius: 8px;
  padding: 6px 12px;
  font-size: 14px;
}

/* =========================================================
   FULLSCREEN
   ========================================================= */

.fullscreen-page {
  min-height: 100vh;
  background: #0f172a;
  display: flex;
  align-items: center;
  justify-content: center;
}

.fullscreen-timer {
  color: #ffffff;
  text-align: center;
}

.fullscreen-caption {
  font-size: 32px;
  margin-bottom: 32px;
}

.fullscreen-board {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 24px;
}

.fullscreen-board .num {
  font-size: 96px;
  font-weight: 700;
  display: block;
}

.fullscreen-board .label {
  font-size: 18px;
  opacity: 0.8;
}

/* =========================================================
   SINGLE POST
   ========================================================= */

.single-post .site-main h1.countdown-title {
  font-size: 38px;
  font-weight: 400;
  line-height: 1.2;
  margin: 0 0 4px;
  text-align: center;
  color: var(--jlia-heading);
}

.single-post .site-main p.countdown-lead {
  font-size: 13px;
  line-height: 1.45;
  color: rgba(107,114,128,.7);
  margin: 0;

  max-width: none;
}

/* Линия под lead */


/* Центрируем верх страницы */


/* FIX ширины */
.single-post .site-main h1.countdown-title,
.single-post .site-main p.countdown-lead {
  display: block;
  width: 100%;
  box-sizing: border-box;

}

/* Линия — 100% */
/* .site-main p.countdown-lead::after {*/
/*   content: "";*/
/*   display: block;*/
/*   width: 100%;*/
/*   height: 3px;*/
/*   margin: 12px 0 0;*/
/*   border-radius: 3px;*/
/*   background: linear-gradient(90deg,#a78bfa,#60a5fa,#fbbf24);v
/*   opacity: .55;*/
/* }*/




/* Убираем линию над H1 (если она включалась в экспериментах) */
.countdown-title::before{ content:none !important; display:none !important; }
