body {
      background-color: #f6f6f6; /* мягко-серый фон подложки */
      font-family: 'Montserrat', sans-serif;
    }
    a {color: #808080;}
blockquote {
  padding: 1rem 1.5rem;
  
  /* background: #f8f9fa; */
  margin: 1rem 0;
  border:#808080 1px solid;
  border-left: 4px solid #b5483b;
}

.navbar {
      background-image: url("/files/cards/bg1.png");

  /* background-size: cover; */


  background-repeat: no-repeat;
  background-size: 140% auto;   /* увеличиваем фон, чтобы он перекрывал весь navbar */
  background-position: -40px -20px; /* смещение относительно 0,0 */
/* степень выбеливания */
  /* background-color: rgba(255, 255, 255, 0.15);  */
  /* background-blend-mode: lighten;    */
    /* мягкое выбеливание без исчезновения */
  /* background-color: rgba(255, 255, 255, 0.75); */
  /* background-blend-mode: screen; */
 /* 1.0 — норм, 1.2 — светлее */
/* filter: brightness(1.2); */


}
.navbar-toggler-icon {
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 30 30' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='%23b5483b' stroke-width='2' stroke-linecap='round' d='M4 7h22M4 15h22M4 23h22'/%3E%3C/svg%3E");
}
.navbar-toggler {
    border-color: #808080;background-color: #ffffff; 

margin:5px;
}


/* регулируй степень выбеливания */
/* .navbar::after {
  content: "";
  position: absolute;
  inset: 0;
  background: rgba(255,255,255,0.75); 
  pointer-events: none;
} */

    .site-wrapper {
      max-width: 1024px; /* приблизительно A4 в px */
      margin: 0 auto;
      background-color: #fff;
      padding: 0;  /* 2rem; */
      border-left: 1px #f0f0f0 solid;
    }
    .super-small {font-size: 0.7rem;}

    /* Заголовки моноширные */
    h1, h2, h3 {
      font-family: 'IBM Plex Mono', monospace;
      letter-spacing: 0.1em;
    }
    h1 a, h2 a, h3 a {
      text-decoration:none;
    }
.navbar {
  /* #e74c3c */
border-bottom: 1px #c0c0c0 solid;
}
    /* Навигация */
    .navbar-nav .nav-link {
      /* font-family: Georgia, Arial, Tahoma, Verdana; */
      font-family: 'IBM Plex Mono', monospace;
      letter-spacing: 0.1em;
      text-transform: uppercase;
      position: relative;
      color: #000;
      /* font-weight: 600; */
      transition: color 0.2s;
    }
    
.navbar-nav .nav-link::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 0%;
  height: 2px;
  background-color: transparent;
  transition: width 0.25s ease, background-color 0.25s ease;
}

/* Hover — жёлтая линия */
.navbar-nav .nav-link:hover::after {
  width: 100%;
  background-color: #b5483b;/* #f1c40f; жёлтый */
}

/* Активный пункт — красная линия */
.navbar-nav .nav-link.active::after {
  width: 100%;
  background-color: #b5483b; /* красный */
}

.hero-section {
  position: relative;
  background: url('/files/bg1.png') center/cover no-repeat;
  /* color: #fff; */
  padding: 0px 20px;
}

.heroimg {
  background: url('/files/bg1.png') center/cover no-repeat;
}

.heroimg2{
  background: url('/files/bg2.png') center/cover no-repeat;
}

.hero-section ul li{
  margin-bottom: 10px; /* выбери любое значение */
}



/* Осветляющий оверлей */
.hero-section::before {
  content: "";
  position: absolute;
  inset: 0;
  background: rgba(255, 255, 255, 0.60); /* степень осветления */
  backdrop-filter: brightness(1.2);
  z-index: 1;
}

/* Контент поверх */
.hero-section > * {
  position: relative;
  z-index: 2;
}



    /* Секция-разделитель */
    .section-divider {
      border-top: 1px solid #b5483b;
      margin: 3rem 0;
    }

    /* Кнопки стилизованные */
    .btn-custom {
      display: inline-block;
      padding: 0.6rem 1.5rem;
      font-weight: 600;
      text-transform: uppercase;
      color: #d32f2f;
      border: 2px solid #d32f2f;
      background-color: #fff;
      border-radius: 4px;
      transition: all 0.3s ease;
    }
    .btn-custom:hover {
      background-color: #d32f2f;
      color: #fff;
    }

.underline-red {
  position: relative;
  display: inline-block;
}

.underline-red::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: -4px; /* расстояние до текста */
  width: 100%;
  height: 3px; /* толщина линии */
  background-color: #b5483b; /* красный */
}
    /* Иконки ролей */
    /* .role-icon {
      font-size: 2rem;
      margin-bottom: 0.5rem;
    } */

/* ROLES */

.card-image-wrapper {
  position: relative;
  text-align: center;
}

.image-single {
  border-top: 3px solid #b5483b;
  width: 80%;
  margin: 0 auto;
  height: 10px;
  margin-top: .5rem;
	margin-bottom: 1.5rem;
}

.image-indicators {
  width: 90%;
  margin: 0 auto;
  display: flex;
  justify-content: center;
  gap: 8px;
  margin-top: 6px;
}

.image-indicators__item {
  width: 90%; /* каждая линия занимает 80% ширины картинки */
  max-width: 90%;
  display: flex;
  justify-content: center;
}

.image-indicators__line {
  width: 80%;
  height: 10px;
  border-top: 3px solid #999; /* серый */
  opacity: 0.6;
  cursor: pointer;
  transition: opacity 0.2s, border-color 0.2s;
}

.image-indicators__line--active {

  border-top-color: #b5483b;
  opacity: 1;
}