
/* ==========================================================================
   1. ROOT & GENERAL STYLES
   ========================================================================== */
:root {
  --color-primary: #0F172A;
  --color-accent: #F59E0B;
  --color-accent-hover: #D97706;
  --color-text: #1E293B;
  --color-link: #F59E0B;
  --color-bg: #F8FAFC;
}

body {
  font-family: "Oswald", sans-serif;
  background-color: var(--color-bg) !important;
  color: var(--color-text);
  margin: 0;
  padding: 0;
}

/* Üldine nupu põhistiil */
.button, .btn-primary {
  background-color: var(--color-accent) !important;
  color: #fff !important;
  padding: 12px 28px;
  border-radius: 50px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 1px;
  transition: 0.3s;
  border: none;
  display: inline-block;
  text-decoration: none;
  cursor: pointer;
}

/* Spetsiifiline "Loe edasi" (btn-sm) disain */
.button.btn-sm {
  padding: 10px 25px !important;
  font-size: 13px;
  font-weight: 700 !important;
  letter-spacing: 0.5px;
}

.button:hover, .btn-primary:hover, .button.btn-sm:hover {
  background-color: var(--color-accent-hover) !important;
  transform: translateY(-2px);
  box-shadow: 0 4px 12px rgba(245, 158, 11, 0.3);
}

/* ==========================================================================
   2. HEADER & NAVIGATION
   ========================================================================== */
.site-header {
  position: sticky;
  top: 0;
  z-index: 9999;
  background: #ffffff !important;
  border-bottom: 1px solid #e2e8f0;
  width: 100%;
}

.site-header__inner {
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
  min-height: 80px;
  max-width: 1200px;
  margin: 0 auto;
  padding: 15px 20px;
}

.site-title a {
  font-size: 52px !important; 
  font-weight: 800 !important;
  text-transform: uppercase !important;
  line-height: 0.85 !important;
  color: #000 !important;
  display: block !important;
  text-decoration: none;
}

.site-description-bottom {
  display: block !important;
  font-size: 16px !important;
  margin: 5px 0 0 0 !important;
  color: #444 !important;
  text-transform: uppercase !important;
  letter-spacing: 1px !important;
}

@media (min-width: 769px) {
  .menu-toggle { display: none !important; }
  .main-navigation ul {
      display: flex !important;
      gap: 30px;
      list-style: none;
      margin: 0;
      padding: 0;
  }
}

/* ==========================================================================
   3. HERO SLIDER
   ========================================================================== */
.hero-slide {
  width: 100%;
  height: 600px !important;
  display: flex !important;
  align-items: center !important; 
  justify-content: center !important;
  text-align: center !important;
  color: #fff;
}

.hero-title {
  font-size: 90px !important; 
  font-weight: 900 !important;
  text-transform: uppercase !important;
  line-height: 1.1;
  text-shadow: 2px 4px 10px rgba(0,0,0,0.3);
}

/* ==========================================================================
   4. UUDISTE SEKSTIOON (SWIPER & CARDS)
   ========================================================================== */
.news-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 30px;
}

.news-swiper {
  overflow: visible !important; /* Et nooled saaksid külgedel paista */
  position: relative;
  padding-bottom: 60px !important;
  width: 100% !important;
}

.news-swiper .swiper-wrapper {
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: nowrap !important;
  align-items: stretch !important;
}

.news-swiper .swiper-slide {
  width: 33.333% !important;
  flex-shrink: 0 !important;
  height: auto !important;
  display: flex !important;
  padding: 15px;
  box-sizing: border-box !important;
}

/* Kaardi disain */
.post-card {
  background: #fff;
  border-radius: 20px;
  box-shadow: 0 10px 30px rgba(0,0,0,0.05);
  display: flex;
  flex-direction: column;
  width: 100%;
  overflow: hidden;
  transition: transform 0.3s ease;
}

.post-card:hover {
  transform: translateY(-5px);
}

.post-card__image img {
  width: 100% !important;
  height: 220px !important;
  object-fit: cover !important;
  display: block !important;
}

.post-card__content {
  padding: 25px;
  display: flex;
  flex-direction: column;
  flex-grow: 1;
}

.post-card__title a {
  color: #E67E22 !important;
  text-decoration: none;
  font-size: 22px;
  font-weight: 700;
  display: block;
  margin-bottom: 15px;
}

.post-card__excerpt {
  font-size: 15px;
  color: #64748B;
  line-height: 1.6;
  margin-bottom: 20px;
}

.post-card__footer {
  margin-top: auto; /* Sunnib nupu põhja */
  padding-top: 10px;
}

/* SWIPER NAVIGATSIOON (Nooled ja täpid) */
.news-swiper .swiper-button-next,
.news-swiper .swiper-button-prev {
  background: #fff;
  width: 45px;
  height: 45px;
  border-radius: 50%;
  box-shadow: 0 4px 10px rgba(0,0,0,0.1);
  color: #F59E0B !important;
  top: 45%; /* Keskel püstsuunas */
}

.news-swiper .swiper-button-next:after,
.news-swiper .swiper-button-prev:after {
  font-size: 18px !important;
  font-weight: bold;
}

.news-swiper .swiper-pagination-bullet-active {
  background: #F59E0B !important;
  width: 25px !important; /* Piklik aktiivne täpp */
  border-radius: 5px !important;
}

/* ==========================================================================
   5. RESPONSIVE SEADED
   ========================================================================== */
@media (max-width: 1024px) {
  .news-swiper .swiper-slide { width: 50% !important; }
  .hero-title { font-size: 60px !important; }
}

@media (max-width: 768px) {
  .news-swiper .swiper-slide { width: 100% !important; }
  .hero-slide { height: 450px !important; }
  .hero-title { font-size: 42px !important; }
  .news-swiper .swiper-button-next,
  .news-swiper .swiper-button-prev { display: none; } /* Mobiilis peidame nooled */
}
/* Sunnime nupu õigesse kuju (et ei veniks laiaks) */
.news-slider-section .post-card__footer .button.btn-sm {
  display: inline-block !important;
  width: auto !important;
  background-color: #F59E0B !important; /* Oranž */
  color: #ffffff !important;
  padding: 10px 25px !important;
  border-radius: 50px !important; /* Ümarad otsad */
  text-transform: uppercase;
  font-weight: 700;
  text-decoration: none;
  font-size: 14px;
}

.news-slider-section .post-card__footer .button.btn-sm:hover {
  background-color: #D97706 !important;
  transform: translateY(-2px);
}

/* Slideri nooled */
.news-swiper-container .swiper-button-next,
.news-swiper-container .swiper-button-prev {
  background: #F59E0B !important;
  color: #fff !important;
  width: 40px;
  height: 40px;
  border-radius: 50%;
}

.news-swiper-container .swiper-button-next:after,
.news-swiper-container .swiper-button-prev:after {
  font-size: 16px !important;
}

/* Täpid slideri all */
.news-swiper-container .swiper-pagination-bullet-active {
  background: #F59E0B !important;
  width: 20px;
  border-radius: 5px;
}
/* Сетка для карточек */
.posts-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: 30px;
    margin-bottom: 50px;
}

/* Сама карточка */
.post-card {
    background: #ffffff;
    border-radius: 20px; /* Сильное скругление */
    overflow: hidden;
    display: flex;
    flex-direction: column;
    box-shadow: 0 10px 25px rgba(0,0,0,0.05); /* Мягкая тень */
    height: 100%;
    transition: transform 0.3s ease;
}

.post-card:hover {
    transform: translateY(-5px);
}

/* Оформление картинки */
.post-card__image-wrapper {
    height: 220px;
    overflow: hidden;
}

.post-card__img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.post-card__no-image {
    height: 100%;
    background: #eee;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #999;
}

/* Текстовая часть */
.post-card__content {
    padding: 25px;
    display: flex;
    flex-direction: column;
    flex-grow: 1;
}

.post-card__title a {
    color: #F59E0B; /* Оранжевый как на макете */
    text-decoration: none;
    font-size: 1.25rem;
    font-weight: 700;
}

.post-card__excerpt {
    color: #666;
    font-size: 0.95rem;
    margin: 15px 0 25px;
    flex-grow: 1;
}

/* Кнопка */
.post-card .button {
    background-color: #F59E0B !important;
    color: #fff !important;
    padding: 10px 25px;
    border-radius: 10px;
    text-decoration: none;
    font-weight: 600;
    display: inline-block;
    transition: 0.3s;
}

.post-card .button:hover {
    background-color: #F59E0B !important;
}
.news-slider-container {
    position: relative;
    padding-bottom: 50px;
}

.news-swiper .swiper-slide {
    height: auto; /* Чтобы карточки были одной высоты */
}

.post-card {
    height: 100%;
    display: flex;
    flex-direction: column;
}

.post-card__content {
    flex-grow: 1; /* Прижимает кнопку к низу */
}

/* Стилизация стрелок (оранжевые) */
.news-swiper-button-next, .news-swiper-button-prev {
    color: #F59E0B;
    position: absolute;
    top: 50%;
    z-index: 10;
    cursor: pointer;
}

.news-swiper-pagination {
    text-align: center;
    margin-top: 20px;
}
/* Делаем так, чтобы стрелки были видны по бокам */
.news-slider-outer {
    padding: 0 40px 50px 40px; /* Отступы для стрелок и точек */
}

/* Оранжевый цвет стрелок и точек */
.news-section .swiper-button-next, 
.news-section .swiper-button-prev {
    color: #F59E0B;
}

.news-section .swiper-pagination-bullet-active {
    background: #F59E0B;
}

/* Чтобы все карточки были одной высоты */
.news-swiper-container .swiper-slide {
    height: auto;
    display: flex;
}
.post-card {
    height: 100%;
    display: flex;
    flex-direction: column;
}
/* Контейнер для стрелок */
.news-slider-navigation {
    display: flex;
    gap: 10px;
}

/* Сбрасываем абсолютное положение Swiper */
.news-slider-navigation .swiper-button-prev,
.news-slider-navigation .swiper-button-next {
    position: static; /* Важно! */
    width: 40px;
    height: 40px;
    margin: 0;
    background: #fff;
    border: 1px solid #e0e0e0;
    border-radius: 8px;
    color: #F59E0B; /* Твой оранжевый цвет */
}

/* Размер иконки внутри стрелок */
.news-slider-navigation .swiper-button-prev:after,
.news-slider-navigation .swiper-button-next:after {
    font-size: 16px;
    font-weight: bold;
}

/* Эффект при наведении */
.news-slider-navigation .swiper-button-prev:hover,
.news-slider-navigation .swiper-button-next:hover {
    background: #F59E0B;
    color: #fff;
    border-color: #F59E0B;
}
/* ОБЩИЕ СТИЛИ ДЛЯ СТРЕЛОК (Hero и Новости) */
.home-slider__arrow,
.news-slider-navigation .swiper-button-prev,
.news-slider-navigation .swiper-button-next {
    width: 44px !important;
    height: 44px !important;
    background: #fff !important;
    border: 1px solid #F59E0B !important; /* Оранжевая рамка */
    border-radius: 10px !important;       /* Скругление */
    color: #F59E0B !important;            /* Цвет иконки */
    display: flex !important;
    align-items: center;
    justify-content: center;
    transition: all 0.3s ease;
    cursor: pointer;
    z-index: 10;
}

/* Иконки внутри стрелок (используем встроенный шрифт Swiper) */
.home-slider__arrow::after,
.news-slider-navigation .swiper-button-prev::after,
.news-slider-navigation .swiper-button-next::after {
    font-family: swiper-icons;
    font-size: 18px !important;
    text-transform: none !important;
    letter-spacing: 0;
    font-variant: initial;
    line-height: 1;
}

.home-slider__arrow--prev::after, .swiper-button-prev::after { content: 'prev'; }
.home-slider__arrow--next::after, .swiper-button-next::after { content: 'next'; }

/* Позиционирование стрелок в главном слайдере (Hero) */
.home-slider__arrow {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
}
.home-slider__arrow--prev { left: 20px; }
.home-slider__arrow--next { right: 20px; }

/* Эффект наведения для всех стрелок */
.home-slider__arrow:hover,
.news-slider-navigation .swiper-button-prev:hover,
.news-slider-navigation .swiper-button-next:hover {
    background: #F59E0B !important;
    color: #fff !important;
}

/* Скрываем стандартные SVG если они остались */
.home-slider__arrow svg { display: none; }
/* Monster Info Block */
.monster-card-wrapper {
    background: #fff;
    border-radius: 15px;
    overflow: hidden;
    /* Убираем тени, если нужно строго как на макете, либо оставляем для объема: */
    box-shadow: 0 10px 30px rgba(0,0,0,0.05);
}

.monster-card__image-bg {
    background-color: #f6d6de; /* Тот самый розовый фон */
    height: 100%;
    display: flex;
    align-items: flex-end;
    justify-content: center;
    padding-top: 40px;
}

.monster-card__image-bg img {
    max-height: 400px;
    width: auto;
}

.monster-card__title {
    color: #F59E0B; /* Оранжевый цвет заголовка */
    font-size: 2.5rem;
    font-weight: 700;
    margin-bottom: 1.5rem;
}

.monster-card__text {
    font-size: 1.1rem;
    line-height: 1.6;
    color: #444;
}

/* Стили для списка внутри контента */
.monster-card__text ul {
    margin-top: 20px;
    padding-left: 20px;
}

.monster-card__text li {
    margin-bottom: 10px;
    list-style-type: disc;
}

/* Мобильная адаптация */
@media (max-width: 767px) {
    .monster-card__image-bg {
        padding-bottom: 0;
    }
    .monster-card__title {
        font-size: 1.8rem;
    }
}
/* Стили для гамбургера */
.menu-toggle {
    display: none; /* Скрыто на десктопе */
    background: none;
    border: none;
    cursor: pointer;
    padding: 10px;
}

@media screen and (max-width: 768px) {
    .menu-toggle {
        display: flex;
        align-items: center;
        gap: 8px;
    }

    .hamburger-inner, .hamburger-inner::before, .hamburger-inner::after {
        width: 24px;
        height: 2px;
        background-color: #F59E0B; /* Цвет полосок */
        display: block;
        position: relative;
        transition: 0.3s;
    }

    .hamburger-inner::before, .hamburger-inner::after {
        content: "";
        position: absolute;
    }

    .hamburger-inner::before { top: -8px; }
    .hamburger-inner::after { bottom: -8px; }

    /* Скрываем само меню, пока не нажат гамбургер */
    .menu-main-container {
        display: none;
    }

    .main-navigation.toggled .menu-main-container {
        display: block;
        position: absolute;
        top: 100%;
        left: 0;
        width: 100%;
        background: #fff;
        z-index: 99;
    }
}
/* Позиционирование навигации в правый угол */
.site-header__inner {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.main-navigation {
    margin-left: auto; /* Принудительно вправо */
}

/* Стили иконки гамбургера */
.menu-toggle {
    display: none; /* Скрыто на десктопе */
    background: transparent;
    border: none;
    padding: 10px;
    cursor: pointer;
}

@media screen and (max-width: 768px) {
    .menu-toggle {
        display: block; /* Показываем на мобильных */
        z-index: 999;
    }

    /* Рисуем 3 полоски */
    .hamburger-inner, .hamburger-inner::before, .hamburger-inner::after {
        width: 25px;
        height: 2px;
        background-color: #333; /* Цвет полосок */
        display: block;
        transition: 0.3s;
        position: relative;
    }

    .hamburger-inner::before, .hamburger-inner::after {
        content: "";
        position: absolute;
        left: 0;
    }

    .hamburger-inner::before { top: -8px; }
    .hamburger-inner::after { bottom: 8px; }

    /* Скрываем само меню изначально */
    .menu-main-container {
        display: none;
        position: absolute;
        top: 100%;
        right: 0;
        background: #fff;
        width: 200px;
        box-shadow: 0 5px 15px rgba(0,0,0,0.1);
        padding: 20px;
    }

    /* Показываем меню, когда добавлен класс .toggled */
    .main-navigation.toggled .menu-main-container {
        display: block;
    }
    
    /* Дополнительно: анимация крестика при нажатии */
    .menu-toggle.is-active .hamburger-inner {
        background-color: transparent;
    }
    .menu-toggle.is-active .hamburger-inner::before {
        transform: rotate(45deg);
        top: 0;
    }
    .menu-toggle.is-active .hamburger-inner::after {
        transform: rotate(-45deg);
        bottom: 0;
    }
}
/* Шапка сайта */
.site-header {
    width: 100%;
    background: #ffffff;
    border-bottom: 1px solid #eee;
}

/* Контейнер: разносим лого и меню по краям */
.site-header__inner {
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    width: 100% !important;
    max-width: 100% !important;
    padding: 15px 30px;
    box-sizing: border-box;
    position: relative;
}

/* Кнопка Гамбургер */
.menu-toggle {
    background: #F59E0B !important;
    border: none !important;
    padding: 10px 20px !important;
    border-radius: 5px !important;
    cursor: pointer !important;
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;
    z-index: 10001;
}

.menu-toggle span {
    color: #ffffff !important;
    font-family: 'Oswald', sans-serif !important;
    font-weight: bold !important;
    text-transform: uppercase;
}

/* Выпадающее меню (контейнер) */
.menu-main-container {
    display: none; /* Скрыто по умолчанию */
    position: absolute;
    top: 100%;
    right: 30px;
    background: #ffffff !important;
    box-shadow: 0 10px 30px rgba(0,0,0,0.2);
    z-index: 99999;
    min-width: 250px;
    border: 1px solid #ddd;
    border-radius: 5px;
}

/* Класс, который добавляет JavaScript при клике */
.menu-main-container.menu-open {
    display: block !important;
}

/* Стили для вкладок (ссылок) меню */
.menu-main-container ul {
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important;
}

.menu-main-container ul li {
    border-bottom: 1px solid #f0f0f0;
}

.menu-main-container ul li a {
    display: block !important;
    padding: 15px 20px !important;
    color: #000000 !important; /* Черный текст вкладок */
    text-decoration: none !important;
    font-family: 'Oswald', sans-serif !important;
    font-size: 18px !important;
    font-weight: bold !important;
    background: #ffffff !important;
}

.menu-main-container ul li a:hover {
    background: #f9f9f9 !important;
    color: #F59E0B !important; /* Оранжевый при наведении */
}
/* --- ОБЩИЕ СТИЛИ --- */
.site-header {
    width: 100%;
    background: #ffffff;
    border-bottom: 1px solid #eee;
}

.site-header__inner {
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    padding: 15px 30px;
    position: relative;
}

/* --- КОМПЬЮТЕРНАЯ ВЕРСИЯ (Экран больше 768px) --- */
@media (min-width: 769px) {
    /* Скрываем кнопку гамбургера на ПК */
    .menu-toggle {
        display: none !important;
    }

    /* Показываем меню в строку */
    .menu-main-container {
        display: block !important;
        position: static !important;
        box-shadow: none !important;
        border: none !important;
    }

    .menu-main-container ul {
        display: flex !important;
        gap: 20px;
    }

    .menu-main-container ul li {
        border: none !important;
    }

    .menu-main-container ul li a {
        padding: 10px 0 !important;
        font-size: 16px !important;
    }
}

/* --- МОБИЛЬНАЯ ВЕРСИЯ (Экран меньше 768px) --- */
@media (max-width: 768px) {
    .menu-toggle {
        display: flex !important; /* Показываем гамбургер */
        background: #333;
        border: none;
        padding: 10px 15px;
        border-radius: 5px;
        cursor: pointer;
    }

    .menu-main-container {
        display: none; /* Скрываем до клика */
        position: absolute;
        top: 100%;
        right: 30px;
        background: #fff;
        box-shadow: 0 10px 30px rgba(0,0,0,0.2);
        z-index: 9999;
        min-width: 200px;
        border: 1px solid #ddd;
    }

    /* Класс для открытия через JS */
    .menu-main-container.menu-open {
        display: block !important;
    }

    .menu-main-container ul {
        flex-direction: column;
    }

    .menu-main-container ul li a {
        padding: 15px 20px !important;
        border-bottom: 1px solid #eee;
        color: #000 !important;
    }
}
/* --- PROGRESS BAR (Полоска сверху) --- */
.progress-container {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 4px;
    background: transparent;
    z-index: 10000;
}

.progress-bar {
    height: 100%;
    background-color: #F59E0B;
    width: 0%; /* Управляется через JS */
}

/* --- HEADER --- */
.site-header {
    width: 100%;
    background: #ffffff;
    border-bottom: 1px solid #eee;
}

.site-header__inner {
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    padding: 15px 30px; /* Отступы на компьютере */
    position: relative;
}

/* --- MOBILE FIX (Гамбургер в самый край) --- */
@media (max-width: 768px) {
    .site-header__inner {
        padding: 15px 10px !important; /* Уменьшаем отступы, чтобы кнопка была справа */
    }
    
    .menu-toggle {
        margin-left: auto; /* Принудительно толкаем вправо */
    }

    .menu-main-container {
        display: none;
        position: absolute;
        top: 100%;
        right: 10px; /* Выравниваем по кнопке */
        background: #fff;
        box-shadow: 0 10px 30px rgba(0,0,0,0.2);
        z-index: 9999;
        min-width: 200px;
    }

    .menu-main-container.menu-open {
        display: block !important;
    }
}

/* --- DESKTOP (Меню текстом) --- */
@media (min-width: 769px) {
    .menu-toggle { display: none !important; }
    .menu-main-container { display: block !important; }
    .menu-main-container ul { 
        display: flex !important; 
        gap: 20px; 
        list-style: none;
        margin: 0;
        padding: 0;
    }
    .menu-main-container ul li a {
        text-decoration: none;
        color: #000;
        font-family: 'Oswald', sans-serif;
        font-weight: bold;
    }
}
.footer-content {
    max-width: 1200px; /* Ширина контейнера как у хедера */
    margin: 0 auto;
    padding: 0 15px;
    /* Выравнивание текста по центру */
    text-align: center; 
}

.site-info, .site-info a {
    color: #666666; /* Цвет текста (серый) */
    font-size: 14px;
    text-decoration: none;
    font-family: sans-serif;
}

.site-info a:hover {
    color: #000000; /* Цвет при наведении */
}
/* footer */

.site-footer {
    margin-top: 70px;
    padding: 56px 0 34px;
    background: var(--color-bg-light);
    color: var(--color-text);
}

.site-footer__top {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 48px;
    padding-bottom: 46px;
    border-bottom: 1px solid var(--color-border);
}

.site-footer__title {
    margin: 0 0 18px;
    color: var(--color-text-dark);
    font-size: 20px;
    line-height: 1.25;
}

.site-footer__menu {
    margin: 0;
    padding: 0;
    list-style: none;
}

.site-footer__menu li + li {
    margin-top: 10px;
}

.site-footer__menu a {
    color: var(--color-text-muted);
    text-decoration: none;
    transition: color 0.25s ease;
}

.site-footer__menu a:hover {
    color: var(--color-link);
}

.site-footer__bottom {
    display: grid;
    grid-template-columns: 260px minmax(0, 1fr) 220px;
    gap: 32px;
    align-items: center;
    padding-top: 30px;
}

.site-footer__logo {
    display: inline-flex;
    align-items: center;
    flex-shrink: 0;
    color: inherit;
    text-decoration: none;
}

.site-footer__logo svg {
    display: block;
    width: 150px;
    height: 40px;
}

.site-footer__info {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 10px 18px;
    color: var(--color-text-muted);
    text-align: center;
    font-size: 15px;
}

.site-footer__slogan {
    width: 100%;
    color: var(--color-text-dark);
    font-weight: 700;
}

.site-footer__info a {
    color: var(--color-text-muted);
    text-decoration: none;
    transition: color 0.25s ease;
}

.site-footer__info a:hover {
    color: var(--color-link);
}

.site-footer__socials {
    display: flex;
    justify-content: flex-end;
    gap: 10px;
}

.site-footer__social {
    width: 42px;
    height: 42px;
    border-radius: 50%;
    background: var(--color-accent-soft);
    color: #F59E0B !important;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
    transition: 0.25s ease;
}

.site-footer__social svg {
    width: 20px;
    height: 20px;
    fill: currentColor;
}

.site-footer__social:hover {
    background: var(--color-link);
    color: var(--color-text-light) !important;
    transform: translateY(-2px);
}

@media (max-width: 991.98px) {
    .site-footer__bottom {
        grid-template-columns: 1fr;
        text-align: center;
    }

    .site-footer__logo {
        justify-self: center;
    }

    .site-footer__socials {
        justify-content: center;
    }
}

@media (max-width: 767.98px) {
    .site-footer {
        margin-top: 50px;
        padding: 42px 0 30px;
    }

    .site-footer__top {
        grid-template-columns: 1fr;
        gap: 30px;
        padding-bottom: 34px;
    }

    .site-footer__bottom {
        gap: 24px;
        padding-top: 26px;
    }
}
/* =========================================================
   BUILDER TEMPLATE
========================================================= */

.builder-page {
    padding-bottom: 20px;
}

.builder-page__hero {
    padding: 64px 0 34px;
    text-align: center;
}

.builder-page__title {
    margin: 0;
    font-size: clamp(38px, 5vw, 64px);
    line-height: 1.05;
}

/* =========================================================
   BUILDER SECTION
========================================================= */

.builder-section {
    padding: 34px 0;
}

.builder-card {
    padding: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
}

.builder-section__title {
    margin: 0 0 18px;
    font-size: clamp(28px, 3vw, 42px);
    line-height: 1.12;
}

.builder-section__text {
    font-size: 17px;
    line-height: 1.75;
}

.builder-section__text p:last-child {
    margin-bottom: 0;
}

/* =========================================================
   TEXT + MEDIA
========================================================= */

.builder-text-media {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 460px;
    gap: 42px;
    align-items: center;
}

.builder-text-media--reverse {
    grid-template-columns: 460px minmax(0, 1fr);
}

.builder-text-media--reverse .builder-text-media__media {
    order: -1;
}

.builder-text-media__content,
.builder-text-media__media {
    min-width: 0;
}

.builder-text-media__image-link {
    display: block;
    overflow: hidden;
    border-radius: var(--radius-md);
}

.builder-text-media__image {
    display: block;
    width: 100%;
    height: auto;
    border-radius: var(--radius-md);
    object-fit: cover;
    transition: transform 0.25s ease;
}

.builder-text-media__image-link:hover .builder-text-media__image {
    transform: scale(1.04);
}
/* Контейнер всей формы */
.custom-contact-form {
    background: #f9f9f9; /* Светлый фон как на примере */
    padding: 30px;
    border-radius: 15px;
    box-shadow: 0 10px 25px rgba(0,0,0,0.05);
    max-width: 900px;
    margin: 0 auto;
}

/* Строка с тремя полями */
.custom-contact-form .form-row {
    display: flex;
    gap: 20px;
    margin-bottom: 20px;
}

/* Группировка поля и текста */
.custom-contact-form .form-group {
    flex: 1;
    display: flex;
    flex-direction: column;
}

.custom-contact-form label {
    font-weight: bold;
    margin-bottom: 8px;
    font-family: sans-serif;
    font-size: 14px;
}

/* Стили полей ввода */
.custom-contact-form input[type="text"],
.custom-contact-form input[type="email"],
.custom-contact-form textarea {
    border: 1px solid #ddd;
    border-radius: 8px;
    padding: 12px;
    width: 100%;
    box-sizing: border-box;
}

/* Сообщение на всю ширину */
.custom-contact-form .full-width {
    margin-bottom: 20px;
}

/* Кнопка "Submit" */
.custom-contact-form .form-submit input {
    background-color: #F59E0B; /* Оранжевый цвет как на примере */
    color: white;
    border: none;
    padding: 12px 35px;
    border-radius: 8px;
    font-weight: bold;
    cursor: pointer;
    transition: background 0.3s;
}

.custom-contact-form .form-submit input:hover {
    background-color: #F59E0B;
}

/* Адаптивность для мобилок */
@media (max-width: 768px) {
    .custom-contact-form .form-row {
        flex-direction: column;
    }
}
.builder-slider-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 30px;
}
.builder-slider-nav {
    display: flex;
    gap: 12px;
}
.builder-slider-nav button {
    background-color: #F59E0B;
    color: #fff;
    border: none;
    width: 44px;
    height: 44px;
    border-radius: 50%;
    cursor: pointer;
    font-size: 24px;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background 0.2s ease;
}
.builder-slider-nav button:hover {
    background-color: #F59E0B;
}
.builder-post-card {
    background: #fff;
    border-radius: 20px;
    overflow: hidden;
    height: auto;
    display: flex;
}
.builder-post-card__inner {
    display: flex;
    flex-direction: column;
    width: 100%;
    box-shadow: 0 4px 15px rgba(0,0,0,0.05);
}
.builder-post-card__image {
    width: 100%;
    height: 220px;
    object-fit: cover;
    display: block;
}
.builder-post-card__content {
    padding: 25px;
    display: flex;
    flex-direction: column;
    flex-grow: 1;
}
.builder-post-card__title {
    color: #F59E0B;
    font-size: 20px;
    margin: 0 0 15px 0;
    line-height: 1.4;
}
.builder-post-card__excerpt {
    color: #666;
    font-size: 15px;
    line-height: 1.6;
    margin-bottom: 25px;
    flex-grow: 1;
}
.builder-post-card__btn {
    align-self: flex-start;
    background-color: #F59E0B;
    color: #fff;
    padding: 10px 22px;
    border-radius: 8px;
    text-decoration: none;
    font-weight: bold;
    font-size: 15px;
    transition: background 0.2s ease;
}
.builder-post-card__btn:hover {
    background-color: #F59E0B;
}
.builder-slider-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 30px;
}
.builder-slider-nav {
    display: flex;
    gap: 12px;
}
.builder-slider-nav button {
    background-color: #F59E0B;
    color: #fff;
    border: none;
    width: 44px;
    height: 44px;
    border-radius: 50%;
    cursor: pointer;
    font-size: 24px;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background 0.2s ease;
}
.builder-slider-nav button:hover {
    background-color: #F59E0B;
}
.builder-post-card {
    background: #fff;
    border-radius: 20px;
    overflow: hidden;
    height: auto;
    display: flex;
}
.builder-post-card__inner {
    display: flex;
    flex-direction: column;
    width: 100%;
    box-shadow: 0 4px 15px rgba(0,0,0,0.05);
}
.builder-post-card__image {
    width: 100%;
    height: 220px;
    object-fit: cover;
    display: block;
}
.builder-post-card__content {
    padding: 25px;
    display: flex;
    flex-direction: column;
    flex-grow: 1;
}
.builder-post-card__title {
    color: #000000;
    font-size: 20px;
    margin: 0 0 15px 0;
    line-height: 1.4;
}
.builder-post-card__excerpt {
    color: #666;
    font-size: 15px;
    line-height: 1.6;
    margin-bottom: 25px;
    flex-grow: 1;
}
.builder-post-card__btn {
    align-self: flex-start;
    background-color: #F59E0B;
    color: #fff;
    padding: 10px 22px;
    border-radius: 8px;
    text-decoration: none;
    font-weight: bold;
    font-size: 15px;
    transition: background 0.2s ease;
}
.builder-post-card__btn:hover {
    background-color: #000000;
}
.builder-slider-nav button {
    background-color: #F59E0B;
    color: #fff;
    border: none;
    width: 44px;
    height: 44px;
    border-radius: 50%;
    cursor: pointer;
    display: inline-flex; /* Изменено для идеального выравнивания SVG */
    align-items: center;
    justify-content: center;
    transition: background 0.2s ease, opacity 0.2s ease;
    padding: 0;
}

.builder-slider-nav button:hover {
    background-color: #F59E0B;
}

/* Стили для внутренней иконки */
.builder-slider-nav button svg {
    display: block;
    width: 20px;
    height: 20px;
}
/* Контейнер для двух колонок */
.builder-two-columns {
    display: grid;
    grid-template-columns: 1fr 1fr; /* Делит пространство на две равные части */
    gap: 40px; /* Отступ между левой и правой колонкой */
    margin: 40px 0; /* Отступы сверху и снизу от всего блока */
}

/* Стили для заголовков в колонках */
.builder-column__title {
    color: #000000; /* Фирменный оранжевый цвет */
    font-size: 28px;
    margin-bottom: 15px;
    line-height: 1.3;
    font-weight: bold;
}

/* Стили для текста в колонках */
.builder-column__text {
    font-size: 16px;
    line-height: 1.6;
    color: #333;
}

/* Адаптивность под мобильные устройства (экраны меньше 768px) */
@media (max-width: 768px) {
    .builder-two-columns {
        grid-template-columns: 1fr; /* Перестраивает колонки в одну линию */
        gap: 24px; /* Уменьшает отступ между ними на телефонах */
    }
}
/* Контейнер для блока похожих записей */
.related-posts-container {
    margin-top: 50px !important;
    padding-top: 30px !important;
    border-top: 1px solid #f0f0f0 !important;
    width: 100% !important;
}

/* Общий заголовок "Seotud postitused" */
.related-posts-main-title {
    font-size: 26px !important;
    color: #0b1c3f !important; /* Насыщенный темный или замените на #F59E0B если хотите оранжевый */
    margin-bottom: 24px !important;
    font-weight: 700 !important;
    letter-spacing: -0.5px;
}

/* Сетка из карточек - автоматическое распределение */
.custom-related-grid {
    display: grid !important;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)) !important;
    gap: 20px !important;
    width: 100% !important;
}

/* Внешний вид карточки */
.custom-post-card {
    background: #ffffff !important;
    border-radius: 14px !important;
    box-shadow: 0 5px 20px rgba(0, 0, 0, 0.05) !important;
    overflow: hidden !important;
    display: flex !important;
    flex-direction: column !important;
    height: 100% !important;
    border: 1px solid #f4f4f4 !important;
    transition: transform 0.2s ease, box-shadow 0.2s ease !important;
}

.custom-post-card:hover {
    transform: translateY(-4px) !important;
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.08) !important;
}

/* Изображение в карточке */
.custom-post-card__image {
    width: 100% !important;
    height: 160px !important;
    overflow: hidden !important;
}

.custom-post-card__img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    transition: transform 0.3s ease !important;
}

.custom-post-card:hover .custom-post-card__img {
    transform: scale(1.03) !important;
}

/* Текстовая часть карточки */
.custom-post-card__content {
    padding: 18px !important;
    display: flex !important;
    flex-direction: column !important;
    flex-grow: 1 !important;
}

/* Дата публикации */
.custom-post-card__date {
    display: block !important;
    font-size: 12px !important;
    color: #999999 !important;
    margin-bottom: 6px !important;
}

/* Стили заголовка статьи */
.custom-post-card__content h4 {
    margin: 0 0 10px 0 !important;
    font-size: 18px !important;
    line-height: 1.4 !important;
    font-weight: 700 !important;
}

.custom-post-card__content h4 a {
    color: #F59E0B !important; /* Текстовые ссылки становятся оранжевыми */
    text-decoration: none !important;
}

.custom-post-card__content h4 a:hover {
    color: #e05a00 !important;
}

/* Краткий отрывок текста */
.custom-post-card__excerpt {
    font-size: 14px !important;
    color: #555555 !important;
    line-height: 1.5 !important;
    margin-bottom: 15px !important;
    flex-grow: 1 !important; /* Выталкивает кнопку ровно вниз */
}

/* Превращаем текстовую ссылку в стильную кнопку плашку "Loe edasi" */
.custom-post-card__btn {
    align-self: flex-start !important;
    background-color: #F59E0B !important; /* Оранжевый фон плашки */
    color: #ffffff !important;
    padding: 8px 18px !important;
    border-radius: 6px !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    text-decoration: none !important;
    display: inline-block !important;
    transition: background-color 0.2s ease !important;
    margin-top: auto !important;
}

.custom-post-card__btn:hover {
    background-color: #e05a00 !important;
    color: #ffffff !important;
}

/* Адаптивность для мобильных экранов */
@media (max-width: 768px) {
    .custom-related-grid {
        grid-template-columns: 1fr !important; /* На телефонах карточки встанут в 1 колонку */
    }
}
/* --- СТИЛИЗАЦИЯ БЛОКА ПОХОЖИХ ПОСТОВ --- */
.related-posts-container {
    margin-top: 45px !important;
    padding-top: 30px !important;
    border-top: 2px solid #f6f6f6 !important;
    width: 100% !important;
    display: block !important;
    clear: both !important;
}

.related-posts-main-title {
    font-size: 26px !important;
    color: #F59E0B !important; /* Родной оранжевый цвет заголовка */
    margin-bottom: 22px !important;
    font-weight: 700 !important;
}

/* Компактная трехколоночная сетка */
.custom-related-grid {
    display: grid !important;
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 16px !important;
    width: 100% !important;
}

/* Внешний вид карточки */
.custom-post-card {
    background: #ffffff !important;
    border-radius: 14px !important;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.05) !important;
    overflow: hidden !important;
    display: flex !important;
    flex-direction: column !important;
    height: 100% !important;
    border: 1px solid #f0f0f0 !important;
    transition: transform 0.2s ease !important;
}

.custom-post-card:hover {
    transform: translateY(-3px) !important;
}

.custom-post-card__image {
    width: 100% !important;
    height: 140px !important;
    overflow: hidden !important;
}

.custom-post-card__img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
}

.custom-post-card__content {
    padding: 15px !important;
    display: flex !important;
    flex-direction: column !important;
    flex-grow: 1 !important;
}

.custom-post-card__date {
    display: block !important;
    font-size: 11px !important;
    color: #9a9a9a !important;
    margin-bottom: 6px !important;
}

.custom-post-card__content h4 {
    margin: 0 0 8px 0 !important;
    font-size: 16px !important;
    line-height: 1.3 !important;
}

.custom-post-card__content h4 a {
    color: #F59E0B !important;
    text-decoration: none !important;
    font-weight: 700 !important;
}

.custom-post-card__excerpt {
    font-size: 13px !important;
    color: #666666 !important;
    line-height: 1.4 !important;
    margin-bottom: 15px !important;
    flex-grow: 1 !important;
}

.custom-post-card__btn {
    align-self: flex-start !important;
    background-color: #F59E0B !important;
    color: #ffffff !important;
    padding: 7px 16px !important;
    border-radius: 6px !important;
    font-size: 13px !important;
    font-weight: 700 !important;
    text-decoration: none !important;
    display: inline-block !important;
}

/* --- ВОЗВРАЩАЕМ КРАСИВЫЙ ВИД САЙДБАРУ (КАК НА ПРИМЕРЕ) --- */
.single-post__sidebar .sidebar-widget {
    background: #ffffff !important;
    border-radius: 16px !important;
    padding: 24px !important;
    margin-bottom: 25px !important;
    box-shadow: 0 5px 20px rgba(0, 0, 0, 0.04) !important;
    border: 1px solid #f1f1f1 !important;
}

.single-post__sidebar .sidebar-widget__title {
    font-size: 20px !important;
    color: #F59E0B !important; /* Оранжевые заголовки виджетов */
    margin-bottom: 16px !important;
    font-weight: 700 !important;
}

.single-post__sidebar .sidebar-posts__title,
.single-post__sidebar .sidebar-list a {
    color: #F59E0B !important; /* Оранжевые ссылки элементов */
    text-decoration: none !important;
    font-weight: 600 !important;
}

/* Адаптивность для планшетов и телефонов */
@media (max-width: 992px) {
    .custom-related-grid {
        grid-template-columns: repeat(2, 1fr) !important;
    }
}
@media (max-width: 768px) {
    .custom-related-grid {
        grid-template-columns: 1fr !important;
    }
}
/* --- ИСПРАВЛЕНИЕ ОСНОВНОЙ СЕТКИ СТРАНИЦЫ --- */
.single-post__layout {
    display: flex !important;
    flex-wrap: wrap !important;
    justify-content: space-between !important;
    align-items: flex-start !important;
    width: 100% !important;
}

/* Левая колонка занимает 68% ширины */
.single-post__main {
    width: 68% !important;
    flex: 0 0 68% !important;
    box-sizing: border-box !important;
}

/* Сайдбар занимает 28% ширины и стоит справа */
.single-post__sidebar {
    width: 28% !important;
    flex: 0 0 28% !important;
    box-sizing: border-box !important;
    margin-top: 0 !important;
}

/* --- ОФОРМЛЕНИЕ ВИДЖЕТОВ САЙДБАРА (ПЛАШКИ) --- */
.single-post__sidebar .sidebar-widget {
    background: #ffffff !important;
    border-radius: 16px !important;
    padding: 22px !important;
    margin-bottom: 24px !important;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.04) !important;
    border: 1px solid #f2f2f2 !important;
    box-sizing: border-box !important;
}

.single-post__sidebar .sidebar-widget__title {
    font-size: 22px !important;
    color: #F59E0B !important; /* Оранжевый цвет заголовков */
    margin-top: 0 !important;
    margin-bottom: 15px !important;
    font-weight: 700 !important;
}

/* Ссылки и элементы списков в сайдбаре */
.single-post__sidebar ul {
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important;
}

.single-post__sidebar li {
    margin-bottom: 12px !important;
    border: none !important;
    padding: 0 !important;
}

.single-post__sidebar a {
    color: #F59E0B !important;
    text-decoration: none !important;
    font-weight: 600 !important;
}

.single-post__sidebar a:hover {
    text-decoration: underline !important;
}

/* --- ПОЛНОШИРИННЫЙ БЛОК SEOTUD POSTITUSED ПОД КОЛОНКАМИ --- */
.related-posts-fullwidth-row {
    width: 100% !important;
    margin-top: 50px !important;
    padding-top: 35px !important;
    border-top: 2px solid #f5f5f5 !important;
    clear: both !important;
}

.related-posts-main-title {
    font-size: 28px !important;
    color: #F59E0B !important;
    margin-bottom: 25px !important;
    font-weight: 700 !important;
}

/* Сетка карточек */
.custom-related-grid {
    display: grid !important;
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 24px !important;
    width: 100% !important;
}

/* Карточки похожих постов */
.custom-post-card {
    background: #ffffff !important;
    border-radius: 16px !important;
    box-shadow: 0 4px 18px rgba(0, 0, 0, 0.05) !important;
    overflow: hidden !important;
    display: flex !important;
    flex-direction: column !important;
    height: 100% !important;
    border: 1px solid #eef0f2 !important;
    transition: transform 0.25s ease !important;
}

.custom-post-card:hover {
    transform: translateY(-4px) !important;
}

.custom-post-card__image {
    width: 100% !important;
    height: 160px !important;
    overflow: hidden !important;
}

.custom-post-card__img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
}

.custom-post-card__content {
    padding: 18px !important;
    display: flex !important;
    flex-direction: column !important;
    flex-grow: 1 !important;
}

.custom-post-card__date {
    font-size: 12px !important;
    color: #9a9a9a !important;
    margin-bottom: 8px !important;
}

.custom-post-card__content h4 {
    margin: 0 0 10px 0 !important;
    font-size: 18px !important;
    line-height: 1.3 !important;
}

.custom-post-card__content h4 a {
    color: #F59E0B !important;
    text-decoration: none !important;
    font-weight: 700 !important;
}

.custom-post-card__excerpt {
    font-size: 14px !important;
    color: #555555 !important;
    line-height: 1.4 !important;
    margin-bottom: 18px !important;
    flex-grow: 1 !important;
}

.custom-post-card__btn {
    align-self: flex-start !important;
    background-color: #F59E0B !important;
    color: #ffffff !important;
    padding: 8px 18px !important;
    border-radius: 8px !important;
    font-size: 14px !important;
    font-weight: 700 !important;
    text-decoration: none !important;
}

/* АДАПТИВНОСТЬ ДЛЯ ЭКРАНОВ СМАРТФОНОВ И ПЛАНШЕТОВ */
@media (max-width: 992px) {
    .single-post__main, .single-post__sidebar {
        width: 100% !important;
        flex: 0 0 100% !important;
    }
    .custom-related-grid {
        grid-template-columns: repeat(2, 1fr) !important;
    }
}

@media (max-width: 600px) {
    .custom-related-grid {
        grid-template-columns: 1fr !important;
    }
}
/* --- СБРОС ТОЧЕК И ОТСТУПОВ У СПИСКОВ В САЙДБАРЕ --- */
.single-post__sidebar .sidebar-widget ul,
.single-post__sidebar .sidebar-widget li,
.single-post__sidebar .sidebar-list,
.single-post__sidebar .sidebar-posts {
    list-style: none !important;
    list-style-type: none !important;
    padding-left: 0 !important;
    margin-left: 0 !important;
}

/* Убираем синее выделение заголовков, если оно прилетело от глобальных стилей */
.single-post__sidebar .sidebar-widget__title {
    background: transparent !important;
    display: block !important;
    padding: 0 !important;
}

/* --- СТИЛИЗАЦИЯ СИЛДОК (TAGS) КАК НА ПРИМЕРЕ --- */
.single-post__sidebar .sidebar-tags {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 8px !important;
    margin-top: 10px !important;
}

.single-post__sidebar .sidebar-tags a.tag-cloud-link,
.single-post__sidebar .sidebar-tags a {
    font-size: 13px !important; /* Единый аккуратный размер */
    color: #1a1a1a !important; /* Темный текст для тегов */
    background-color: #f5f6f8 !important; /* Легкий серый фон */
    padding: 6px 14px !important;
    border-radius: 20px !important; /* Закругленные овальные плашки */
    text-decoration: none !important;
    font-weight: 600 !important;
    border: 1px solid #eef0f2 !important;
    transition: all 0.2s ease !important;
    display: inline-block !important;
}

/* Эффект при наведении на тег */
.single-post__sidebar .sidebar-tags a:hover {
    background-color: #F59E0B !important; /* Окрашивается в оранжевый */
    color: #ffffff !important;
    border-color: #F59E0B !important;
}

/* Ссылки в обычных виджетах (Категории, Архивы, Новости) */
.single-post__sidebar .sidebar-list a,
.single-post__sidebar .sidebar-posts__link {
    display: block !important;
    padding: 4px 0 !important;
    color: #F59E0B !important;
    text-decoration: none !important;
}

.single-post__sidebar .sidebar-list a:hover {
    text-decoration: underline !important;
}

/* --- СТИЛИЗАЦИЯ ВИДЖЕТОВ САЙДБАРА ПОД ПРИМЕР --- */

/* Общие настройки плашек виджетов */
.single-post__sidebar .sidebar-widget {
    background: #ffffff !important;
    border-radius: 20px !important;
    padding: 30px 25px !important;
    margin-bottom: 24px !important;
    box-shadow: 0 4px 24px rgba(0, 0, 0, 0.04) !important;
    border: 1px solid #f2f4f6 !important;
    box-sizing: border-box !important;
}

/* Заголовки виджетов (Облегченный шрифт без сильного жирнения) */
.single-post__sidebar .sidebar-widget__title {
    font-size: 22px !important;
    color: #F59E0B !important;
    margin-top: 0 !important;
    margin-bottom: 20px !important;
    font-weight: 500 !important; /* Делаем шрифт элегантным, как в примере */
    background: transparent !important;
}

/* Настройка списков */
.single-post__sidebar ul {
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important;
}

.single-post__sidebar li {
    margin-bottom: 14px !important;
    padding: 0 !important;
    border: none !important;
    line-height: 1.4 !important;
}

.single-post__sidebar li:last-child {
    margin-bottom: 0 !important;
}

/* Элементы обычных списков (Категории, Архивы) со стрелочкой перед ними */
.single-post__sidebar .sidebar-list li a,
.single-post__sidebar .cat-item a {
    color: #F59E0B !important;
    text-decoration: none !important;
    font-weight: 500 !important;
    display: inline-flex !important;
    align-items: center !important;
}

.single-post__sidebar .sidebar-list li a::before,
.single-post__sidebar .cat-item a::before {
    content: ">" !important;
    color: #b0b5bc !important; /* Серая стрелочка из примера */
    font-size: 11px !important;
    margin-right: 10px !important;
    font-family: monospace !important;
    font-weight: bold !important;
}

/* --- СТИЛИЗАЦИЯ СПИСКА ПОСЛЕДНИХ НОВОСТЕЙ (Viimased uudised) --- */
.single-post__sidebar .sidebar-posts__item {
    margin-bottom: 18px !important;
}

.single-post__sidebar .sidebar-posts__link {
    display: flex !important;
    flex-direction: column !important; /* Перенос названия под дату */
    text-decoration: none !important;
}

/* Дата над текстом */
.single-post__sidebar .sidebar-posts__date {
    font-size: 13px !important;
    color: #9299a2 !important; /* Серый цвет для даты */
    margin-bottom: 4px !important;
    font-weight: 400 !important;
    display: block !important;
}

/* Заголовок статьи в виджете новостей */
.single-post__sidebar .sidebar-posts__title {
    font-size: 15px !important;
    color: #F59E0B !important;
    font-weight: 500 !important;
    line-height: 1.3 !important;
}
/* Скрываем дублирующуюся миниатюру внутри текста статьи */
.single-post__content .wp-post-image,
.single-post__content .featured-media,
.single-post__content > img:first-of-type {
    display: none !important;
}

/* --- СТИЛИЗАЦИЯ ТЕГОВ ПОД ЗАГОЛОВКОМ СТАТЬИ --- */

/* Контейнер для даты, категории и тегов */
.single-post__header .single-post__meta {
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    gap: 10px !important; /* Расстояние между элементами */
    margin-top: 15px !important;
    font-size: 14px !important;
    color: #9299a2 !important;
}

/* Ссылка на саму категорию (Uudised) - делаем её оранжевой кнопкой */
.single-post__header .single-post__meta a[href*="category"],
.single-post__header .single-post__meta > a:first-of-type {
    background-color: #ffebe0 !important; /* Нежно-оранжевый фон */
    color: #F59E0B !important; /* Яркий оранжевый текст */
    padding: 5px 14px !important;
    border-radius: 20px !important;
    text-decoration: none !important;
    font-weight: 600 !important;
    display: inline-block !important;
}

/* Ссылки на теги (Sildid) - делаем их серыми кнопками, как в примере */
.single-post__header .single-post__meta a[href*="post_tag"],
.single-post__header .single-post__meta a:not([href*="category"]) {
    background-color: #f5f6f8 !important; /* Светло-серый фон плашки */
    color: #1a1a1a !important; /* Темный аккуратный текст */
    padding: 5px 14px !important;
    border-radius: 20px !important; /* Овальная форма */
    text-decoration: none !important;
    font-weight: 500 !important;
    transition: all 0.2s ease !important;
    display: inline-block !important;
}

/* Эффект наведения для кнопок-тегов */
.single-post__header .single-post__meta a:hover {
    background-color: #F59E0B !important;
    color: #ffffff !important;
    opacity: 1 !important;
}
/* Полностью скрываем верхнее изображение в шапке статьи */
.single-post__header .single-post__thumb-link,
.single-post__header--has-image .single-post__thumb-link {
    display: none !important;
}

/* Убираем лишние внутренние отступы у контейнера шапки после удаления картинки */
.single-post__header {
    padding: 0 !important;
    background: transparent !important;
}
/* --- 1. КРАСИВЫЙ ОРАНЖЕВЫЙ ЗАГОЛОВОК СТАТЬИ --- */
.single-post-page .single-post__title {
    color: #F59E0B !important; /* Оранжевый цвет как на примере */
    font-size: 38px !important;
    font-weight: 700 !important;
    letter-spacing: -0.5px !important;
    margin-bottom: 15px !important;
    line-height: 1.2 !important;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif !important;
}

/* --- 2. ОРАНЖЕВАЯ КНОПКА ПЕРЕКЛЮЧЕНИЯ СТАТЕЙ (ВНИЗУ КОНТЕНТА) --- */
.fancy-post-nav .nav-links,
.single-post__navigation .nav-links {
    display: block !important;
    margin-top: 40px !important;
}

.fancy-post-nav .nav-previous a, 
.fancy-post-nav .nav-next a,
.single-post__navigation .nav-links a {
    display: block !important;
    background-color: #F59E0B !important; /* Яркий оранжевый фон */
    color: #ffffff !important; /* Белый текст */
    padding: 18px 24px !important;
    border-radius: 20px !important; /* Закругленные углы как на образце */
    text-decoration: none !important;
    font-weight: 700 !important;
    transition: background 0.2s ease !important;
    box-sizing: border-box !important;
    width: 100% !important;
    box-shadow: 0 4px 15px rgba(255, 107, 0, 0.15) !important;
}

.fancy-post-nav .nav-previous a:hover, 
.fancy-post-nav .nav-next a:hover,
.single-post__navigation .nav-links a:hover {
    background-color: #e05e00 !important;
    color: #ffffff !important;
}

/* Настройка текста внутри оранжевой кнопки навигации */
.post-nav-card {
    display: flex !important;
    flex-direction: column !important;
}

.post-nav-card__label {
    font-size: 11px !important;
    text-transform: uppercase !important;
    opacity: 0.8 !important;
    letter-spacing: 1px !important;
    margin-bottom: 4px !important;
}

.post-nav-card__title {
    font-size: 18px !important;
}

/* --- 3. ДОБАВЛЕНИЕ ЗНАКА # ДЛЯ ТЕГОВ В САЙДБАРЕ --- */
.single-post__sidebar .sidebar-tags a::before {
    content: "#" !important;
    opacity: 0.7 !important;
    margin-right: 1px !important;
}
/* --- СТИЛИЗАЦИЯ БЛОКА ПОХОЖИХ СТАТЕЙ (SEOTUD POSTITUSED) --- */

/* Контейнер для всего блока */
.related-posts, 
.single-post__related {
    margin-top: 50px !important;
    width: 100% !important;
    display: block !important;
}

/* Заголовок "Seotud postitused" */
.related-posts__main-title,
.single-post__related-title {
    font-size: 26px !important;
    color: #ff6b00 !important; /* Наш фирменный оранжевый */
    font-weight: 600 !important;
    margin-bottom: 24px !important;
}

/* Сетка для карточек (делаем её адаптивной на 3 колонки) */
.related-posts__grid,
.single-post__related .related-posts {
    display: grid !important;
    grid-template-columns: repeat(3, 1fr) !important; /* Ровно 3 колонки */
    gap: 20px !important; /* Отступы между карточками */
    width: 100% !important;
    padding: 0 !important;
    margin: 0 !important;
}

/* Сама карточка статьи */
.related-post-card,
.related-posts .post,
.single-post__related .post-card {
    background: #ffffff !important;
    border-radius: 20px !important; /* Скругленные углы */
    overflow: hidden !important;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.04) !important; /* Легкая тень */
    border: 1px solid #f0f2f5 !important;
    display: flex !important;
    flex-direction: column !important;
    height: 100% !important;
    box-sizing: border-box !important;
}

/* Область с картинкой в карточке */
.related-post-card__thumb,
.related-posts .post-thumbnail {
    width: 100% !important;
    height: 180px !important; /* Фиксированная высота для выравнивания */
    overflow: hidden !important;
    margin: 0 !important;
    padding: 0 !important;
}

.related-post-card__thumb img,
.related-posts .post-thumbnail img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important; /* Чтобы картинка не сжималась, а красиво заполняла блок */
    transition: transform 0.3s ease !important;
}

/* Эффект легкого увеличения картинки при наведении на карточку */
.related-post-card:hover .related-post-card__thumb img,
.related-posts .post:hover .post-thumbnail img {
    transform: scale(1.04) !important;
}

/* Контентная часть внутри карточки (текст, дата, ссылка) */
.related-post-card__content,
.related-posts .post-content {
    padding: 20px !important;
    display: flex !important;
    flex-direction: column !important;
    flex-grow: 1 !important;
}

/* Дата в похожих статьях */
.related-post-card__date,
.related-posts .post-date {
    font-size: 13px !important;
    color: #9299a2 !important;
    margin-bottom: 8px !important;
}

/* Заголовок статьи */
.related-post-card__title,
.related-posts .post-title,
.related-posts .post h3 {
    font-size: 18px !important;
    color: #ff6b00 !important;
    font-weight: 600 !important;
    line-height: 1.3 !important;
    margin: 0 0 10px 0 !important;
}

.related-post-card__title a,
.related-posts .post h3 a {
    color: #ff6b00 !important;
    text-decoration: none !important;
}

/* Краткое описание статьи */
.related-post-card__excerpt,
.related-posts .post-excerpt,
.related-posts .post p {
    font-size: 14px !important;
    color: #4a5056 !important;
    line-height: 1.4 !important;
    margin-bottom: 15px !important;
}

/* Ссылка "Loe edasi →" */
.related-post-card__more,
.related-posts .read-more,
.related-posts .post .more-link {
    font-size: 14px !important;
    color: #ff6b00 !important;
    font-weight: 700 !important;
    text-decoration: none !important;
    margin-top: auto !important; /* Прижимает ссылку к самому низу карточки */
    display: inline-block !important;
}

.related-post-card__more:hover,
.related-posts .read-more:hover {
    text-decoration: underline !important;
}
/* --- ПОЛНЫЙ СБРОС И ПЕРЕСТРОЕНИЕ БЛОКА ПОХОЖИХ СТАТЕЙ ПОД ОБРАЗЕЦ --- */

/* Общий контейнер блока */
.related-posts,
.single-post__related,
div[class*="related"] {
    width: 100% !important;
    max-width: 100% !important;
    display: block !important;
    margin-top: 50px !important;
    clear: both !important;
}

/* Сетка для карточек - выстраиваем строго по 3 в ряд */
.related-posts__grid,
.related-posts ul,
.related-posts .posts-wrapper,
.single-post__related > div:not(.single-post__related-title) {
    display: grid !important;
    grid-template-columns: repeat(3, 1fr) !important; /* Ровно 3 колонки */
    gap: 24px !important; /* Отступы между карточками */
    width: 100% !important;
    padding: 0 !important;
    margin: 0 !important;
    list-style: none !important;
}

/* Сброс стилей для старой разметки (чтобы карточки не падали вниз) */
.related-posts__grid::before,
.related-posts__grid::after,
.related-posts ul::before,
.related-posts ul::after {
    display: none !important;
}

/* Сама карточка статьи (Белая плашка) */
.related-post-card,
.related-posts .post,
.related-posts li,
.single-post__related .post-card {
    background: #ffffff !important;
    border-radius: 20px !important; /* Закругление углов плашки */
    overflow: hidden !important;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.04) !important; /* Мягкая тень */
    border: 1px solid #f2f4f6 !important;
    display: flex !important;
    flex-direction: column !important;
    width: 100% !important;
    min-width: 0 !important; /* Защита от вылезания текста */
    margin: 0 !important;
    float: none !important; /* Отменяем старые флоаты */
    box-sizing: border-box !important;
}

/* Область картинки (на всю ширину, вверху карточки) */
.related-post-card__thumb,
.related-posts .post-thumbnail,
.related-posts thumblink,
.related-posts a:has(img) {
    width: 100% !important;
    height: 180px !important; /* Фиксированная высота как в примере */
    display: block !important;
    float: none !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
    position: relative !important;
}

/* Сама картинка внутри блока */
.related-post-card__thumb img,
.related-posts img {
    width: 100% !important;
    height: 100% !important;
    max-width: 100% !important;
    max-height: 100% !important;
    object-fit: cover !important; /* Картинка заполняет область без искажений */
    float: none !important;
    margin: 0 !important;
    border-radius: 0 !important; /* Сброс внутренних закруглений */
}

/* Текстовый блок под картинкой */
.related-post-card__content,
.related-posts .post-content,
.related-posts .entry-header,
.related-posts .entry-content {
    padding: 24px !important; /* Внутренние отступы для контента */
    display: flex !important;
    flex-direction: column !important;
    flex-grow: 1 !important;
    box-sizing: border-box !important;
}

/* Дата публикации */
.related-post-card__date,
.related-posts .post-date,
.related-posts .date {
    font-size: 13px !important;
    color: #9299a2 !important;
    margin-bottom: 8px !important;
    display: block !important;
}

/* Заголовок статьи */
.related-post-card__title,
.related-posts .post-title,
.related-posts h3,
.related-posts h4 {
    font-size: 18px !important;
    color: #ff6b00 !important; /* Оранжевый цвет */
    font-weight: 700 !important;
    line-height: 1.3 !important;
    margin: 0 0 12px 0 !important;
}

.related-posts h3 a,
.related-posts h4 a,
.related-posts a {
    color: #ff6b00 !important;
    text-decoration: none !important;
}

/* Отрывок текста (Описание) */
.related-post-card__excerpt,
.related-posts p,
.related-posts .excerpt {
    font-size: 14px !important;
    color: #4a5056 !important;
    line-height: 1.4 !important;
    margin: 0 0 20px 0 !important;
}

/* Оранжевая кнопка "Loe edasi →" */
.related-post-card__more,
.related-posts .read-more,
.related-posts .more-link,
.related-posts a[class*="more"] {
    background-color: #ff6b00 !important; /* Оранжевый фон */
    color: #ffffff !important; /* Белый текст */
    padding: 10px 20px !important;
    border-radius: 10px !important; /* Скругление кнопки */
    font-size: 14px !important;
    font-weight: 700 !important;
    text-decoration: none !important;
    display: inline-block !important;
    align-self: flex-start !important; /* Кнопка не растягивается во всю ширину */
    margin-top: auto !important; /* Прижимает кнопку к низу карточки */
    transition: background 0.2s ease !important;
}

.related-posts .read-more:hover,
.related-posts .more-link:hover {
    background-color: #e05e00 !important;
}