/* ==========================================================
   1. ШАПКА САЙТА
   ========================================================== */

.container-header {
  background: #fffaf2 !important;
  background-image: none !important;
  box-shadow: none;
}

.container-header .container-below-top {
  display: block;
  width: 100%;
  max-width: none;
  padding: 0;
}

.container-below-top > *,
.container-below-top .mod-custom {
  width: 100%;
  max-width: none;
}

.school-header {
  position: relative;
  box-sizing: border-box;
  width: 100%;
  min-height: 250px;
  background: #fffaf2 url("/images/school/header.png")
    repeat-x left bottom;
}

.school-header img {
  display: block;
  max-width: 100%;
  height: auto;
}

.school-header__logo {
  position: absolute;
  top: 0;
  left: 1%;
  width: 230px;
}

.school-header__title {
  position: absolute;
  top: 12px;
  left: 17%;
  width: 54%;
  max-width: 800px;
}

.school-header__quote {
  position: absolute;
  right: 2%;
  bottom: 8px;
  width: 36%;
  max-width: 559px;
}

@media (max-width: 767px) {
  .school-header {
    display: grid;
    grid-template-columns: 90px minmax(0, 1fr);
    align-items: center;
    gap: 12px;
    min-height: 0;
    padding: 12px;
  }

  .school-header__logo,
  .school-header__title,
  .school-header__quote {
    position: static;
    width: 100%;
    max-width: none;
  }

  .school-header__quote {
    grid-column: 1 / -1;
    justify-self: end;
    width: 85%;
  }
}


/* ==========================================================
   2. БОКОВЫЕ БЛОКИ И МЕНЮ
   ========================================================== */

.container-sidebar-left .card,
.container-sidebar-right .card {
  overflow: hidden;
  margin-bottom: 12px;
  border: 1px solid #bcb6ae;
  border-radius: 6px;
  box-shadow: none;
}

.container-sidebar-left .card {
  background: #f4eee2;
}

.container-sidebar-right .card {
  background: #f5f5f5;
}

.container-sidebar-left .card-header,
.container-sidebar-right .card-header {
  margin: 0;
  padding: 9px 12px;
  border-bottom: 0;
  color: #fff;
  font-size: 15px;
  font-weight: 700;
}

.container-sidebar-left .card-header {
  background: linear-gradient(#24c4f1, #009de0);
}

.container-sidebar-right .card-header {
  background: linear-gradient(#fa950d, #e87900);
}

.container-sidebar-left .card-body,
.container-sidebar-right .card-body {
  padding: 12px;
}

.container-sidebar-left .mod-menu {
  gap: 0;
}

.container-sidebar-left .mod-menu > li {
  border-bottom: 1px dotted #cfc5b5;
}

.container-sidebar-left .mod-menu a {
  display: block;
  padding: 8px 6px;
  color: #333;
  font-size: 13px;
  text-decoration: none;
}

.container-sidebar-left .mod-menu a:hover,
.container-sidebar-left .mod-menu li.active > a {
  background: #fb8a28;
  color: #fff;
}


/* ==========================================================
   3. ГАЛЕРЕИ SIGPLUS В ПОЛНЫХ МАТЕРИАЛАХ
   ========================================================== */

body.view-article .com-content-article__body .sigplus-gallery {
  box-sizing: border-box;
  width: 100% !important;
  max-width: 100% !important;
  margin: 24px 0 !important;
  padding: 0 !important;
}

body.view-article .com-content-article__body .sigplus-gallery ul {
  display: grid !important;
  grid-template-columns: repeat(auto-fit, minmax(0, 240px));
  justify-content: start;
  gap: 14px;

  box-sizing: border-box;
  width: 100% !important;
  max-width: 100% !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;

  list-style: none !important;
  text-align: left !important;
}

body.view-article .com-content-article__body
.sigplus-gallery ul > li {
  display: block !important;
  float: none !important;
  box-sizing: border-box;

  width: auto !important;
  min-width: 0 !important;
  max-width: none !important;
  height: auto !important;

  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
}

body.view-article .com-content-article__body
.sigplus-gallery a.sigplus-image {
  position: relative;
  display: block !important;
  float: none !important;
  box-sizing: border-box;

  width: 100% !important;
  max-width: none !important;
  height: auto !important;
  aspect-ratio: 4 / 3;

  overflow: hidden;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 6px;
  background: #f2f2f2;
}

body.view-article .com-content-article__body
.sigplus-gallery a.sigplus-image img.sigplus-preview {
  display: block !important;

  width: 100% !important;
  height: 100% !important;
  max-width: none !important;
  max-height: none !important;

  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;

  object-fit: cover;
  object-position: center;
}

body.view-article .com-content-article__body
.sigplus-gallery .sigplus-summary:empty {
  display: none !important;
}

@media (max-width: 767px) {
  body.view-article .com-content-article__body .sigplus-gallery ul {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
  }
}

@media (max-width: 359px) {
  body.view-article .com-content-article__body .sigplus-gallery ul {
    grid-template-columns: minmax(0, 1fr);
  }
}


/* ==========================================================
   4. ИНФОРМАЦИОННЫЕ БЛОКИ SCHOOL-INFO
   ========================================================== */

.school-info {
  --info-accent: #087da0;
  --info-border: #dce5e9;
  --info-background: #f6f9fb;

  width: 100%;
  max-width: 1100px;
  margin: 0;

  color: #28343d;
  font-size: 1rem;
  line-height: 1.65;
  text-align: left;
}

.school-info .school-info__section {
  margin: 0 0 24px;
  padding: 24px;
  border: 1px solid var(--info-border);
  border-radius: 8px;
  background: #fff;
}

.school-info p {
  margin: 0 0 14px;
  text-align: left;
}

.school-info .school-info__section > :last-child {
  margin-bottom: 0;
}

.school-info .school-info__details {
  margin: 0;
  padding: 0;
}

.school-info .school-info__row {
  display: grid;
  grid-template-columns: minmax(180px, 28%) minmax(0, 1fr);
  gap: 12px 24px;

  margin: 0;
  padding: 16px 0;
  border-bottom: 1px solid var(--info-border);
}

.school-info .school-info__row:first-child {
  padding-top: 0;
}

.school-info .school-info__row:last-child {
  padding-bottom: 0;
  border-bottom: 0;
}

.school-info dt,
.school-info dd {
  min-width: 0;
  margin: 0;
  text-align: left;
}

.school-info dt {
  color: #425563;
  font-weight: 600;
}

.school-info dd {
  font-weight: 400;
  overflow-wrap: anywhere;
}

.school-info a {
  color: #08688a;
  text-decoration: underline;
  text-underline-offset: 3px;
}

.school-info a:hover {
  color: #03465e;
}

.school-info a:focus-visible {
  outline: 3px solid var(--info-accent);
  outline-offset: 4px;
  border-radius: 2px;
}

.school-info .school-info__note {
  margin-top: 18px;
  padding: 14px 16px;
  border-left: 3px solid var(--info-accent);
  border-radius: 0 5px 5px 0;
  background: var(--info-background);

  color: #465762;
  font-size: 0.95em;
  line-height: 1.6;
}

/* Редакционные подсказки — заменить перед публикацией */
.school-info .school-info__placeholder {
  background: #fff3df;
  color: #8a3900;
}

@media (max-width: 767px) {
  .school-info .school-info__section {
    margin-bottom: 18px;
    padding: 18px 16px;
  }

  .school-info .school-info__row {
    grid-template-columns: minmax(0, 1fr);
    gap: 6px;
    padding: 14px 0;
  }
}


/* ==========================================================
   5. ЗАГОЛОВКИ ПОЛНЫХ МАТЕРИАЛОВ
   ========================================================== */

/* Название материала, которое выводит Joomla */
body.view-article .com-content-article > .page-header h1 {
  margin: 0 0 22px !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;

  color: #263b46 !important;
  font-family: inherit !important;
  font-size: 28px !important;
  font-weight: 700 !important;
  line-height: 1.3 !important;
  text-align: left !important;
  overflow-wrap: break-word;
}

/* Общие свойства заголовков внутри материала */
body.view-article .com-content-article__body
:is(h1, h2, h3, h4, h5, h6) {
  height: auto !important;
  max-height: none !important;

  font-style: normal !important;
  line-height: 1.4 !important;
  text-align: left !important;
  text-transform: none !important;
  letter-spacing: normal !important;

  white-space: normal !important;
  overflow-wrap: break-word;
}

/* Общий сброс оформления H1 и H3–H6 */
body.view-article .com-content-article__body
:is(h1, h3, h4, h5, h6) {
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
}

/* Общий шрифт H1, H2 и H4–H6 */
body.view-article .com-content-article__body
:is(h1, h2, h4, h5, h6) {
  font-family: inherit !important;
}

body.view-article .com-content-article__body h1 {
  margin: 30px 0 18px !important;
  color: #263b46 !important;
  font-size: 28px !important;
  font-weight: 700 !important;
}

/* H2: кремовая плашка с голубой полосой */
body.view-article .com-content-article__body h2 {
  margin: 26px 0 16px !important;
  padding: 11px 15px !important;

  border: 0 !important;
  border-left: 4px solid #09a4ce !important;
  border-radius: 0 5px 5px 0 !important;
  background: #f5f0e5 !important;

  color: #2f414b !important;
  font-size: 21px !important;
  font-weight: 600 !important;
}

/* H3: оформление по образцу старого сайта */
body.view-article .com-content-article__body h3 {
  margin: 19px 0 !important;
  color: #62cafe !important;
  font-family: "Trebuchet MS", Arial, Helvetica, sans-serif !important;
  font-size: 19px !important;
  font-weight: 600 !important;
}

body.view-article .com-content-article__body h4 {
  margin: 22px 0 12px !important;
  color: #28546a !important;
  font-size: 18px !important;
  font-weight: 600 !important;
}

body.view-article .com-content-article__body h5 {
  margin: 20px 0 10px !important;
  color: #344854 !important;
  font-size: 17px !important;
  font-weight: 700 !important;
}

body.view-article .com-content-article__body h6 {
  margin: 18px 0 10px !important;
  color: #465762 !important;
  font-size: 16px !important;
  font-weight: 600 !important;
}

/* Первый заголовок без верхнего отступа; H3 исключён */
body.view-article .com-content-article__body >
:is(h1, h2, h4, h5, h6):first-child,
body.view-article .com-content-article__body
.school-info__section > :is(h1, h2, h4, h5, h6):first-child {
  margin-top: 0 !important;
}

body.view-article .com-content-article__body
:is(h1, h2, h3, h4, h5, h6) a {
  font-family: inherit !important;
  font-size: inherit !important;
  font-weight: inherit !important;
  line-height: inherit !important;
}

@media (max-width: 767px) {
  body.view-article .com-content-article > .page-header h1,
  body.view-article .com-content-article__body h1 {
    font-size: 25px !important;
  }

  body.view-article .com-content-article__body h2 {
    padding: 10px 12px !important;
    font-size: 19px !important;
  }

  body.view-article .com-content-article__body h4 {
    font-size: 17px !important;
  }

  body.view-article .com-content-article__body :is(h5, h6) {
    font-size: 16px !important;
  }
}


/* ==========================================================
   6. БАННЕРЫ
   ========================================================== */

/* Отдельный баннер */
a.school-banner {
  display: flex;
  align-items: center;
  gap: 12px;

  box-sizing: border-box;
  width: 100%;
  min-width: 0;
  padding: 10px;

  border: 1px solid #c6c0b7;
  border-radius: 6px;
  background: #fff;

  color: #227899;
  text-decoration: none;
}

.school-banner .school-banner__image {
  display: block;
  flex: 0 0 auto;

  width: 40%;
  max-width: 107px;
  height: auto;
  margin: 0;
  border: 0;
}

.school-banner .school-banner__title {
  display: block;
  min-width: 0;

  font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
  font-size: 17px;
  font-weight: 400;
  line-height: 1.3;
  text-align: left;
  overflow-wrap: break-word;
}

a.school-banner:hover {
  border-color: #09a4ce;
  background: #f5fbfe;
  color: #155b78;
}

a.school-banner:focus-visible {
  outline: 3px solid #087da0;
  outline-offset: 3px;
}

/* Группа баннеров */
.school-banner-group {
  display: flex;
  flex-direction: column;
  gap: 0;

  box-sizing: border-box;
  width: 100%;
  padding: 0;
}

.school-banner-group a.school-banner-group__item {
  display: grid;
  grid-template-columns: 80px minmax(0, 1fr);
  align-items: center;
  gap: 10px;

  box-sizing: border-box;
  min-width: 0;
  margin: 0;
  padding: 14px 0;

  color: #227899;
  text-decoration: none;
}

.school-banner-group
.school-banner-group__item + .school-banner-group__item {
  border-top: 1px solid #d8d2c8;
}

.school-banner-group .school-banner-group__item:first-child {
  padding-top: 0;
}

.school-banner-group .school-banner-group__item:last-child {
  padding-bottom: 0;
}

.school-banner-group .school-banner-group__image {
  display: block;
  justify-self: center;

  width: auto;
  max-width: 80px;
  height: auto;
  max-height: 80px;
  margin: 0;
  border: 0;
}

.school-banner-group .school-banner-group__title {
  display: block;
  min-width: 0;

  font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
  font-size: 15px;
  font-weight: 400;
  line-height: 1.3;
  text-align: left;
  overflow-wrap: break-word;
}

.school-banner-group a.school-banner-group__item:hover {
  color: #155b78;
}

.school-banner-group a.school-banner-group__item:hover
.school-banner-group__title {
  text-decoration: underline;
  text-underline-offset: 3px;
}

.school-banner-group a.school-banner-group__item:focus-visible {
  outline: 3px solid #087da0;
  outline-offset: 2px;
  border-radius: 2px;
}


/* ==========================================================
   7. НОРМАТИВНО-ПРАВОВАЯ БАЗА
   ========================================================== */

.legal-documents {
  --legal-accent: #087d91;
  --legal-text: #24465f;
  --legal-border: #dce7ed;

  margin: 20px 0 32px;
  color: var(--legal-text);
}

/*
   В полных материалах оформление H3 задаётся разделом 5.
   Эти правила действуют там, где нет общего переопределения.
*/
.legal-documents h3 {
  margin: 30px 0 14px;
  padding: 15px 18px;

  border: 1px solid var(--legal-border);
  border-left: 4px solid var(--legal-accent);
  border-radius: 0 10px 10px 0;
  background: linear-gradient(100deg, #eaf4f6, #f7fafb);

  color: var(--legal-text);
  font-size: 1.12rem;
  font-weight: 700;
  line-height: 1.5;
}

.legal-documents > h3:first-child {
  margin-top: 0;
}

.legal-documents ul {
  display: grid;
  gap: 9px;
  margin: 0 0 24px;
  padding: 0;
  list-style: none;
}

.legal-documents ul > li {
  min-width: 0;
  margin: 0;
  padding: 0;
}

.legal-documents ul > li::before {
  content: none;
}

.legal-documents li > a {
  position: relative;
  display: block;
  box-sizing: border-box;

  min-height: 54px;
  padding: 15px 50px 15px 18px;

  border: 1px solid var(--legal-border);
  border-radius: 9px;
  background: #fff;

  color: #28558a;
  font-size: 1rem;
  font-weight: 500;
  line-height: 1.55;
  text-decoration: none;
  overflow-wrap: anywhere;

  box-shadow: 0 2px 8px rgba(36, 70, 95, 0.035);

  transition:
    background-color 0.18s ease,
    border-color 0.18s ease,
    box-shadow 0.18s ease;
}

.legal-documents li > a::after {
  content: "";
  position: absolute;
  top: 50%;
  right: 21px;

  width: 8px;
  height: 8px;
  border-top: 2px solid var(--legal-accent);
  border-right: 2px solid var(--legal-accent);

  transform: translateY(-50%) rotate(45deg);
}

.legal-documents li > a:hover {
  border-color: var(--legal-accent);
  background: #f0f8fa;
  color: #18476d;

  text-decoration: underline;
  text-underline-offset: 3px;

  box-shadow: 0 4px 12px rgba(8, 125, 145, 0.09);
}

.legal-documents li > a:focus-visible {
  outline: 3px solid var(--legal-accent);
  outline-offset: 3px;
}

.legal-documents li > a img {
  width: auto;
  max-height: 20px;
  margin-left: 6px;
  vertical-align: middle;
}

.legal-documents > p {
  margin: 14px 0;
  color: #536775;
  line-height: 1.6;
}

/* Пункты без ссылок из подготовленного HTML */
.legal-documents li > .legal-documents__text {
  display: block;
  box-sizing: border-box;

  min-height: 54px;
  padding: 15px 18px;

  border: 1px solid var(--legal-border);
  border-radius: 9px;
  background: #f7f9fb;

  color: #465b6a;
  font-size: 1rem;
  font-weight: 400;
  line-height: 1.55;
  overflow-wrap: anywhere;
}

@media (max-width: 575px) {
  .legal-documents h3 {
    margin-top: 24px;
    padding: 12px 14px;
    font-size: 1.02rem;
  }

  .legal-documents li > a {
    padding: 13px 38px 13px 14px;
    font-size: 0.95rem;
  }

  .legal-documents li > a::after {
    right: 16px;
  }

  .legal-documents li > .legal-documents__text {
    padding: 13px 14px;
    font-size: 0.95rem;
  }
}


/* ==========================================================
   8. КНОПКА «НА ГЛАВНУЮ»
   ========================================================== */

/* Убираем подложку только у этого модуля */
.home-button-module,
.home-button-module .card-body,
.home-button-module .mod-custom,
.home-button-module .custom {
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

.home-button-module p {
  margin: 0;
  padding: 0;
}

/* Цвет совпадает с заголовками левой колонки */
a.school-home-link,
a.school-home-link:visited {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;

  box-sizing: border-box;
  width: 100%;
  min-height: 48px;
  margin: 0;
  padding: 12px 18px;

  border: 0;
  border-radius: 6px;
  background: linear-gradient(#24c4f1, #009de0);

  color: #fff;
  font-family: inherit;
  font-size: 15px;
  font-weight: 700;
  line-height: 1.5;
  text-align: center;
  text-decoration: none;

  box-shadow: none;
}

a.school-home-link .fas {
  font-size: 18px;
}

a.school-home-link:hover {
  background: linear-gradient(#19b6e3, #008bc7);
  color: #fff;
  text-decoration: none;
}

a.school-home-link:focus-visible {
  outline: 3px solid #075b79;
  outline-offset: -3px;
}


/* ==========================================================
   9. УМЕНЬШЕНИЕ АНИМАЦИИ
   ========================================================== */

@media (prefers-reduced-motion: reduce) {
  .legal-documents li > a {
    transition: none;
  }
}