﻿
/* =========================
   DVSSK — Clean Glass UI (final, no duplicates)
   File: assets/css/site.css
   ========================= */

/* --- reset / base --- */
*{ box-sizing:border-box; }
html,body{ height:100%; }
body{
  margin:0;
  min-height:100vh;
  display:flex;
  flex-direction:column;
  font-family: Arial, sans-serif;
  color:#1d2430;
  background:
    radial-gradient(1200px 800px at 15% 10%, rgba(0,160,180,.18), transparent 60%),
    radial-gradient(900px 600px at 85% 20%, rgba(0,95,140,.14), transparent 55%),
    radial-gradient(1000px 700px at 50% 90%, rgba(0,180,140,.10), transparent 60%),
    linear-gradient(180deg, #f3f7fb 0%, #eef4f8 60%, #edf3f6 100%);
  background-attachment: fixed;
  background-size: cover;
}

a{ color:#0b5aa6; text-decoration:none; }
a:hover{ color:#0a4f91; text-decoration:none; }

/* body layout so footer sticks to bottom */
.container.site{ flex:1 0 auto; }
.site-footer{ flex-shrink:0; }

/* --- page container grid --- */
.container.site{
  max-width: 1480px;   /* было 1200 */
  margin: 30px auto;
  padding: 0 15px;     /* чуть больше воздуха */
  display:flex;
  gap: 26px;
  align-items:flex-start;
}

/* колонки */
.aside.left{ width: 300px; }  /* было 260 */
aside.right{ width: 360px; }  /* было 320 */
.center{ flex:1; min-width:0; }

/* glass panels (left + center) */
.aside.left,
.center{
  background: rgba(255,255,255,.78);
  border: 1px solid rgba(255,255,255,.65);
  border-radius:18px;
  padding:16px;
  box-shadow: 0 10px 28px rgba(0,0,0,.07);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
}

/* right column backplate */
aside.right{
  position:relative;
  border-radius:18px;
  padding:18px;
  background:
    radial-gradient(600px 380px at 20% 20%, rgba(0,160,180,.18), transparent 60%),
    radial-gradient(520px 340px at 80% 75%, rgba(0,95,140,.16), transparent 55%),
    linear-gradient(180deg, rgba(255,255,255,.55), rgba(255,255,255,.35));
  border: 1px solid rgba(255,255,255,.55);
  box-shadow: 0 10px 28px rgba(0,0,0,.07);
}

/* mobile stack */
@media (max-width:1100px){
  .container.site{ flex-direction:column; }
  .aside.left, aside.right{ width:100%; }
}

/* --- content safety --- */
.center img,
.center table,
.center iframe,
.center video{
  max-width:100%;
  height:auto;
}
.center table{ display:block; overflow-x:auto; }
.center *{ overflow-wrap:anywhere; word-break:break-word; }

/* --- page title (InnerLayout h1) --- */
.page-title{
  margin: 6px 0 14px;
  font-size: 36px;
  line-height:1.05;
  letter-spacing:-.5px;
  font-weight: 900;
}

/* =================
   Left menu (pdoMenu)
   ================= */
.aside-title{
  font-weight:900;
  margin:0 0 12px;
  font-size:35px;
}

.nav{ list-style:none; padding:0; margin:0; }
.nav li{ margin:6px 0; }

.nav a{
  display:flex;
  align-items:center;
  gap:12px;
  padding:12px 12px;
  border-radius:14px;
  position:relative;
  border:1px solid rgba(0,0,0,.10);
  background: rgba(255,255,255,.22);
  transition: transform .15s ease, box-shadow .15s ease, background .15s ease, border-color .15s ease;
}

.nav a:hover{
  background: rgba(11,99,206,.08);
  border-color: rgba(11,99,206,.35);
  transform: translateY(-1px);
  box-shadow: 0 6px 18px rgba(11,99,206,.15);
}
.nav li.active > a{
  background: rgba(11,99,206,.12);
  border-color: rgba(11,99,206,.45);
  font-weight:900;
}

/* icon bubble */
.nav .nav-ico{
  width:26px;                 /* было 22 — +10% и чуть комфортнее */
  height:24px;
  border-radius:16px;
  display:inline-block;
  position:relative;
  background: rgba(11,99,206,.14);
  border: 1px solid rgba(11,99,206,.18);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.35);
}

/* PNG icon меню */
.nav .nav-ico::before{
  content:"";
  position:absolute;
  inset:0;
  opacity:.95;
  background: url("/Media/Photo/4_menu/ui/gear.png") center / 16px 16px no-repeat; /* было 14 — стало 16 */
  filter: drop-shadow(0 1px 2px rgba(0,0,0,.15));
  image-rendering: -webkit-optimize-contrast;
  transform: translateZ(0);
}

/* caret (if used) */
.nav li.has-children > a{ padding-right:34px; }
.nav .nav-caret{
  position:absolute;
  right:12px;
  width:18px;
  height:18px;
  border-radius:9px;
  background: rgba(0,0,0,.06);
}
.nav .nav-caret::before{
  content:"›";
  position:absolute;
  inset:0;
  display:grid;
  place-items:center;
  font-size:16px;
  opacity:.65;
}

.submenu{
  list-style:none;
  padding: 6px 0 6px 18px;
  margin: 6px 0 0;
  border-left: 1px solid rgba(0,0,0,.10);
}
.submenu li{ margin:0; position:relative; }
.submenu li::before{
  content:"";
  position:absolute;
  left:-18px;
  top:18px;
  width:10px;
  border-top: 1px solid rgba(0,0,0,.10);
}
.submenu a{ padding:8px 10px; border-radius:12px; }
.submenu li + li a{ border-top: 1px solid rgba(0,0,0,.06); }

/* ==================
   Right glass cards
   ================== */
.right-card{
  background: rgba(255,255,255,.55);
  border: 1px solid rgba(255,255,255,.65);
  border-radius: 16px;
  padding: 16px;
  box-shadow: 0 12px 30px rgba(0,0,0,.08);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  transition: transform .18s ease, box-shadow .18s ease, background .18s ease, border-color .18s ease;
  margin-top: 16px;
}
.right-card:hover{
  transform: translateY(-2px);
  background: rgba(255,255,255,.38);
  border-color: rgba(255,255,255,.80);
  box-shadow: 0 18px 45px rgba(0,0,0,.14);
}

/* ==================
   Event (announcement) — dark + proper hover  Объявления
   ================== */
aside.right .event{
  margin-top: 16px;
  overflow:hidden;
  border-radius: 16px;
  padding: 16px;
  background: linear-gradient(180deg,#0c3f7a 0%,#062c57 100%) !important;
  border:1px solid rgba(255,255,255,.18);
  box-shadow: 0 14px 40px rgba(0,0,0,.25);
  transition: transform .18s ease, box-shadow .18s ease, background .18s ease;
}

aside.right .event,
aside.right .event *{
  color:#ffffff !important;
}

aside.right .event:hover{
  background: linear-gradient(180deg,#0f4b90 0%,#083566 100%) !important; /* чуть светлее */
  transform: translateY(-3px);
  box-shadow: 0 22px 55px rgba(0,0,0,.35);
}

.event-link{ display:block; color:inherit; }
.event-top{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:10px;
  margin-bottom:10px;
}

/* "glass" tag like iOS */
.event-type{
  display:inline-block;
  padding:4px 10px;
  border-radius:999px;
  font-weight:900;
  font-size:12px;

  background: rgba(255,255,255,.14);
  border: 1px solid rgba(255,255,255,.22);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.25);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
}

.event-date{ font-size:16px; opacity:.85; }
.event-title{ font-weight:900; margin:10px 0 6px !important; }
.new-anons hr{ opacity:.25; }

/* ==================
   News (home list)
   ================== */
.section-title{
  margin:0 0 12px;
  font-size:22px;
  font-weight:900;
  letter-spacing:.2px;
}

.new{
  background: rgba(255,255,255,.70);
  border: 1px solid rgba(0,0,0,.12);
  border-radius: 16px;
  padding: 12px 14px;
  margin: 10px 0;
  transition: transform .12s ease, box-shadow .12s ease;
}
.new:hover{
  transform: translateY(-1px);
  box-shadow: 0 12px 26px rgba(0,0,0,.08);
}

.new-date.round.mini{
  display:inline-block;
  padding:4px 10px;
  border-radius:10px;
  background: rgba(11,99,206,.10);
  color:#0b63ce;
  font-weight:900;
  font-size:12px;
}

/* FIX: заголовок/текст не лезет на кнопку */
.new-anons{
  margin-top:10px;
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:12px;
}
.new-body{
  flex:1 1 auto;
  min-width:0;
}
.new-name{
  font-weight:900;
  margin-bottom:6px;
  overflow:hidden;
  display:-webkit-box;
  -webkit-line-clamp:2;
  -webkit-box-orient:vertical;
}
.new-intro{
  color:#2a3242;
  line-height:1.35;
  overflow:hidden;
  display:-webkit-box;
  -webkit-line-clamp:3;
  -webkit-box-orient:vertical;
}

.new-btn{
  flex:0 0 auto;
  margin-left:auto;
  padding:6px 10px;
  border-radius:12px;
  background: rgba(11,99,206,.12);
  border:1px solid rgba(11,99,206,.25);
  font-weight:900;
  white-space:nowrap;
  transition: transform .15s ease, box-shadow .15s ease, background .15s ease;
}
.new-btn:hover{
  background: rgba(11,99,206,.22);
  box-shadow: 0 4px 12px rgba(11,99,206,.18);
}

/* link under list */
.new-link{ margin-top:14px; }
.new-link a{
  display:inline-block;
  padding: 10px 12px;
  border-radius: 14px;
  background: rgba(0,0,0,.04);
  font-weight:900;
}
.new-link a:hover{ background: rgba(0,0,0,.07); }

/* ==================
   News archive cards
   ================== */
.news-grid{
  display:grid;
  grid-template-columns: repeat(3, minmax(0,1fr));
  gap:16px;
  margin-top:14px;
}
@media (max-width:1100px){
  .news-grid{ grid-template-columns: repeat(2, minmax(0,1fr)); }
}
@media (max-width:700px){
  .news-grid{ grid-template-columns: 1fr; }
}

.news-card{
  background: rgba(255,255,255,.70);
  border: 1px solid rgba(255,255,255,.70);
  border-radius: 16px;
  padding: 14px;
  box-shadow: 0 12px 26px rgba(0,0,0,.08);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  display:flex;
  flex-direction:column;
  gap:10px;
  transition: transform .12s ease, box-shadow .12s ease, background .12s ease;
}
.news-card:hover{
  transform: translateY(-2px);
  background: rgba(255,255,255,.45);
  box-shadow: 0 18px 45px rgba(0,0,0,.14);
}
.news-card__date{
  display:inline-block;
  width:fit-content;
  padding:4px 10px;
  border-radius:999px;
  background: rgba(11,99,206,.10);
  color:#0b63ce;
  font-weight:900;
  font-size:12px;
}
.news-card__title{ font-weight:900; font-size:18px; line-height:1.2; }
.news-card__intro{ color:#2a3242; line-height:1.35; flex:1; }
.news-card__btn{
  align-self:flex-start;
  padding:8px 12px;
  border-radius: 12px;
  background: rgba(11,99,206,.10);
  font-weight:900;
}
.news-card__btn:hover{ background: rgba(11,99,206,.18); }

/* pagination (pdoPage) */
.pagination{ margin-top:16px; }
.pagination a, .pagination span{
  display:inline-block;
  padding:8px 12px;
  border-radius:12px;
  margin-right:6px;
  background: rgba(255,255,255,.55);
  border: 1px solid rgba(255,255,255,.65);
}
.pagination .active, .pagination span.current{
  background: rgba(11,99,206,.14);
  font-weight:900;
}

/* ==================
   Entrant (MAX block + banners)
   ================== */
.entrant-max{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:18px;
  padding:16px 18px;
}

.entrant-max__qr{ flex:0 0 auto; display:block; }
.entrant-max__qr img{
  width:160px;
  height:auto;
  object-fit:contain;
  border-radius:12px;
}

.entrant-max__info{
  flex:1 1 auto;
  min-width:240px;
  display:flex;
  flex-direction:column;
  justify-content:center;
  gap:8px;
  align-items:center;
  text-align:center;
}

.entrant-max__title{
  font-weight:800;
  font-size:35px;
  line-height:1.2;
  margin:0 0 10px;
}

.entrant-max__btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;

  background:#055bfa;
  color:#fff !important;

  padding:22px 32px;
  border-radius:22px;
  font-weight:800;
  text-decoration:none !important;

  transition: transform .18s ease, box-shadow .18s ease, background-color .18s ease;
  box-shadow: 0 8px 18px rgba(0,0,0,.14);
  transform: translateY(0) scale(1);
}
.entrant-max__btn:hover{
  background:#58D8FF;
  transform: translateY(-1px) scale(1.03);
  box-shadow: 0 12px 26px rgba(0,0,0,.18);
}
.entrant-max__btn:active{
  transform: translateY(0) scale(0.99);
  box-shadow: 0 6px 22px rgba(0,0,0,.12);
}

.entrant-banner{ display:block; margin-top:10px; }
.entrant-banner img{
  width:100%;
  height:auto;
  display:block;
  border-radius:12px;
  border: 1px solid rgba(0,0,0,0.08);
}

.entrant-links a{ display:block; margin:8px 0; }
.entrant-links__title{ margin-top:14px; font-weight:900; }
.entrant-links ul{ margin:8px 0 0 18px; }

/* ==================
   Footer
   ================== */
.site-footer{
  position: relative;
  margin-top: 30px;
  background: #1f4d69;
  border-top: 1px solid rgba(255,255,255,.08);
}
.site-footer::before{
  content:"";
  position:absolute;
  top:-60px;
  left:0;
  width:100%;
  height:60px;
  pointer-events:none;
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
  background: linear-gradient(
    to bottom,
    rgba(31,77,105,0) 0%,
    rgba(31,77,105,.15) 30%,
    rgba(31,77,105,.5) 70%,
    rgba(31,77,105,.85) 100%
  );
}
.site-footer__inner{
  max-width: 1480px;
  margin: 0 auto;
  padding: 8px 16px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap: 14px;
  color: rgba(255,255,255,.92);
  font-weight: 600;
  font-size: 16px;
}
.site-footer__btn{
  display:inline-block;
  padding: 8px 12px;
  border-radius: 999px;
  background: rgba(255,255,255,.10);
  border: 1px solid rgba(255,255,255,.16);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  transition: transform .15s ease, box-shadow .15s ease, background .15s ease;
}
.site-footer__btn:hover{
  transform: translateY(-1px);
  background: rgba(255,255,255,.16);
  box-shadow: 0 10px 22px rgba(0,0,0,0,.18);
}
.site-footer a, .site-footer a:hover, .site-footer a:visited{
  color: rgba(255,255,255,.92) !important;
  text-decoration:none;
}

/* NEWS: дата + кнопка в одну линию, заголовок ниже */
.new-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
}

.new-title{ margin-top:10px; }

.new-name{
  font-weight:900;
  line-height:1.2;
  /* хочешь ограничение — включи:
  display:-webkit-box;
  -webkit-line-clamp:3;
  -webkit-box-orient:vertical;
  overflow:hidden;
  */
}

.new-btn{
  flex:0 0 auto;
  padding:6px 12px;
  border-radius:12px;
  background: rgba(11,99,206,.12);
  border:1px solid rgba(11,99,206,.25);
  font-weight:900;
  white-space:nowrap;
}

/* ===== MENU: фикс "жёваной" иконки на многострочных пунктах ===== */
.nav a{
  align-items:flex-start;           /* чтобы многострочный текст не ломал вертикаль */
}

.nav .nav-ico{
  flex:0 0 auto;                    /* не сжиматься вообще */
  margin-top:2px;                   /* чуть вниз, чтобы совпадало с первой строкой */
}

.nav .nav-ico::before{
  background-size: 16px 16px;       /* на всякий — фиксируем */
}

/* ===== MENU: стекло iOS (пункты + иконка) ===== */
.nav a{
  background: rgba(255,255,255,.22);
  border: 1px solid rgba(255,255,255,.35);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.55),
    0 10px 24px rgba(0,0,0,.06);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
}

.nav a:hover{
  background: rgba(255,255,255,.32);
  border-color: rgba(255,255,255,.55);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.65),
    0 14px 34px rgba(0,0,0,.10);
}

.nav li.active > a{
  background: rgba(255,255,255,.38);
  border-color: rgba(11,99,206,.35);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.75),
    0 14px 34px rgba(11,99,206,.12);
}

/* стеклянный "пузырь" под иконкой */
.nav .nav-ico{
  background: rgba(255,255,255,.28);
  border: 1px solid rgba(255,255,255,.40);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.70),
    0 6px 14px rgba(0,0,0,.08);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
}
.nav a:hover .nav-ico{
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.75),
    0 10px 22px rgba(11,99,206,.18);
}
/* =========================
   LEVEL UP v1 — micro-interactions + polish
   вставь в самый низ site.css
   ========================= */

/* 1) Общая плавность и “дорогие” анимации */
:root{
  --ease-out: cubic-bezier(.2,.8,.2,1);
  --shadow-soft: 0 10px 26px rgba(0,0,0,.08);
  --shadow-lift: 0 18px 45px rgba(0,0,0,.14);
  --ring: 0 0 0 4px rgba(11,99,206,.18);
}

@media (prefers-reduced-motion: reduce){
  *{ transition:none !important; animation:none !important; }
}

/* 2) Навигация/карточки — чуть более “живые” */
.nav a,
.new,
.right-card,
aside.right .event,
.center,
.aside.left,
aside.right{
  transition:
    transform .22s var(--ease-out),
    box-shadow .22s var(--ease-out),
    background .22s var(--ease-out),
    border-color .22s var(--ease-out),
    filter .22s var(--ease-out);
}

/* 3) Чуть “воздуха” и глубины у стекла */
.aside.left,
.center{
  background: rgba(255,255,255,.74); /* было ~.78, стало чуть “стекляннее” */
  border: 1px solid rgba(255,255,255,.60);
}

.right-card{
  background: rgba(255,255,255,.50);
  border: 1px solid rgba(255,255,255,.60);
}

/* 4) Аккуратный hover-lift (без цирка) */
.nav a:hover{ transform: translateY(-2px); }
.new:hover{ transform: translateY(-2px); box-shadow: var(--shadow-soft); }
.right-card:hover{ transform: translateY(-3px); box-shadow: var(--shadow-lift); }

/* 5) “Читать” — чуть более кнопка, меньше ссылка */
.new-btn{
  box-shadow: inset 0 1px 0 rgba(255,255,255,.55);
}
.new-btn:hover{
  transform: translateY(-1px);
}
.new-btn:active{
  transform: translateY(0px);
}

/* 6) Фокус для клавиатуры (и вообще UX как у нормальных людей) */
a:focus-visible,
button:focus-visible{
  outline: none;
  box-shadow: var(--ring);
  border-radius: 14px;
}

/* 7) Типографика — чуть приятнее читается (особенно центр) */
.center{
  line-height: 1.45;
}
.center h2, .center h3{
  letter-spacing: -.2px;
}
.center p{
  margin: 10px 0;
}

/* 8) Мелкая “магия” — заголовки секций выглядят дороже */
.section-title,
.aside-title{
  text-shadow: 0 10px 30px rgba(0,0,0,.10);
}

/* 9) Лёгкий шум/зерно (делает стекло “не пластиком”)
   Если не нравится — просто удали этот блок. */
.aside.left::before,
.center::before,
aside.right::before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  border-radius:18px;
  opacity:.06;
  mix-blend-mode:multiply;
  background-image:
    radial-gradient(circle at 20% 10%, rgba(0,0,0,.18), transparent 35%),
    radial-gradient(circle at 80% 90%, rgba(0,0,0,.12), transparent 40%);
}

/* чтобы ::before работал (позиционирование) */
.aside.left, .center, aside.right{ position:relative; }

/* 10) Немного “пружины” у меню-иконок при hover */
.nav a:hover .nav-ico{
  transform: scale(1.04);
}

/* 11) Привести тени к единому стилю (чуть мягче) */
.aside.left,
.center{
  box-shadow: 0 12px 30px rgba(0,0,0,.07);
}
/* =========================
   HEADER — COMPACT ROW (single source of truth)
   SPO | LOGO | phone | phone | address
   ========================= */

.site-header{
  position: sticky;
  top: 0;
  z-index: 50;
  padding: 8px 0;
  border-bottom: 1px solid rgba(255,255,255,.35);
  background: rgba(195,245,248,.22);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
}

/* вот ЭТО сразу после неё */
.site-header::before{
  content:"";
  position:absolute;
  inset:0;

  background: linear-gradient(
    to bottom,
    rgba(255,255,255,.55),
    rgba(255,255,255,0)
  );

  pointer-events:none;
}

/* шире, чем основной контент (но без безумия) */
.site-header__inner--wide{
  max-width: 1490px;     /* было “как подвал” — теперь ощутимо шире */
  margin: 0 auto;
  padding: 0 24px;
}

/* РЯД: вместо space-between — нормальная ужимаемая раскладка */
.site-header__inner--row{
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 12px;
  flex-wrap: nowrap;
}

/* КЛЮЧ: разрешаем элементам реально ужиматься */
.site-header__inner--row > *{ min-width: 0; }

/* общая карточка */
.hdr-card{
  height: 90px;
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 8px 12px;
  border-radius: 16px;
  background: rgba(255,255,255,.15);
  border: 1px solid rgba(255,255,255,.45);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.60),
    0 12px 30px rgba(0,0,0,.08);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  color: inherit;
  text-decoration: none;
  transition: transform .22s cubic-bezier(.2,.8,.2,1),
              box-shadow .22s cubic-bezier(.2,.8,.2,1),
              background .22s cubic-bezier(.2,.8,.2,1),
              border-color .22s cubic-bezier(.2,.8,.2,1);
}
.hdr-card:hover{
  transform: translateY(-2px);
  background: rgba(255,255,255,.34);
  border-color: rgba(255,255,255,.62);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.70),
    0 18px 45px rgba(0,0,0,.14);
}

/* логокарточки */
.hdr-card--spo,
.hdr-card--logo,
.hdr-card--logo2{
  flex: 0 0 auto;
  padding: 6px 10px;
}

/* логотипы */
.hdr-logo{
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  background-color: rgba(255,255,255,.55);
  border: 1px solid rgba(255,255,255,.65);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.55);
  flex: 0 0 auto;
}

.hdr-logo--spo{
  width: 118px;
  height: 70px;
  border-radius: 14px;
  background-image: url("/Media/Photo/1_main_нeader/SPO.jpg");
}

.hdr-logo--main{
  width: 70px;
  height: 70px;
  border-radius: 14px;
  background-image: url("/Media/Photo/1_main_нeader/logo2.png");
}

.hdr-logo2--main{
  width: 128px;
  height: 70px;
  border-radius: 14px;
  background-image: url("/Media/Photo/1_main_нeader/logo3.png");
}

/* телефоны */
.hdr-card--phone{
  flex: 0 0 auto;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  min-width: 220px;
}

.hdr-label{
  font-size: 15px;
  font-weight: 900;
  opacity: .78;
  line-height: 1;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 100%;
}

.hdr-btn{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 8px 12px;
  border-radius: 999px;
  background: rgba(11,99,206,.12);
  border: 1px solid rgba(11,99,206,.22);
  font-weight: 900;
  color: #0b63ce;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.55);
  line-height: 1;
  white-space: nowrap;
}
.hdr-btn:hover{
  background: rgba(11,99,206,.20);
  transform: translateY(-1px);
  box-shadow: 0 12px 26px rgba(11,99,206,.16);
}

/* адрес — тянется и “прижимает” к правому краю */
.hdr-card--addr{
  margin-left: space-between;     /* КЛЮЧ вместо space-between */
  flex: 1 1 auto;
  min-width: 150px;
  justify-content: flex-start;
}

.hdr-addr{
  font-size: 16px;
  font-weight: 800;
  line-height: 1.5;
  opacity: .80;
  white-space: normal;
}

/* ===== AUT0HIDE classes ===== */
.site-header--autohide{
  transform: translateY(0);
  transition: transform .22s cubic-bezier(.2,.8,.2,1);
  will-change: transform;
}
.site-header--hidden{
  transform: translateY(-110%);
}

@media (max-width: 1200px){
  .site-header__inner--row{
    flex-wrap: wrap;
    justify-content: flex-start;
  }
  .hdr-card--addr{
    margin-left: 0;
    flex: 1 1 100%;
    height: auto;
    align-items: flex-start;
  }
}
/* Центровой контент: ссылки как лёгкие стекло-карточки */
.center p a,
.center li a{
  display:inline-flex;
  align-items:center;
  gap:8px;

  padding: 8px 12px;
  border-radius: 14px;

  font-weight: 900;                 /* пожирнее */
  background: rgba(210,242,242,.55);
  border: 1px solid rgba(255,255,255,.45);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.60),
    0 10px 24px rgba(0,0,0,.06);

  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);

  color:#004c8f;
  text-decoration:none;
  transition: transform .18s ease, box-shadow .18s ease, background .18s ease;
}

.center p a:hover,
.center li a:hover{
  transform: translateY(-2px);
  background: rgba(255,255,255,.36);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.70),
    0 16px 36px rgba(0,0,0,.10);
}
/* Главная: ссылки-важняки как карточки */
.entrant-links a{
  display:block;
  padding:10px 12px;
  margin:8px 0;
  border-radius:14px;
  background: rgba(210,242,242,.55);
  border: 1px solid rgba(255,255,255,.70);
  box-shadow: 0 8px 18px rgba(0,0,0,.06);
  font-weight: 800;
  color:#004c8f;
  text-decoration:none;
}

.entrant-links a:hover{
  background: rgba(255,255,255,.70);
  border-color: rgba(11,99,206,.25);
  transform: translateY(-1px);
}

.entrant-links ul{
  list-style:none;
  padding:0;
  margin:10px 0 0;
}

.entrant-links li{
  margin:0;
}
/* ==================
   SOCIAL QR PANEL (MAX + VK + VK Video)
   ================== */
.entrant-qrpanel{
  margin-top: 20px;
  padding: 14px 14px 16px;
  border-radius: 18px;
  background: rgba(255,255,255,.24);
  border: 1px solid rgba(255,255,255,.65);
  box-shadow: 0 12px 30px rgba(0,0,0,.07);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
}

.entrant-qrpanel__title{
  font-weight: 900;
  font-size: 16px;
  margin: 0 0 12px;
  opacity: .85;
}

.entrant-qrpanel__grid{
  display: flex;
  gap: 16px;
  align-items: stretch;
  justify-content: center;
  flex-wrap: wrap; /* на узком экране аккуратно переедет */
}

.entrant-qrpanel__item{
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
  padding: 12px 12px 10px;
  border-radius: 16px;
  background: rgba(255,255,255,.40);
  border: 1px solid rgba(0,0,0,.08);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.55);
  text-decoration: none;
  transition: transform .18s ease, box-shadow .18s ease, background .18s ease, border-color .18s ease;
}

.entrant-qrpanel__item:hover{
  transform: translateY(-2px);
  background: rgba(198,245,245,.26);
  border-color: rgba(11,99,206,.22);
  box-shadow: 0 16px 40px rgba(0,0,0,.10);
}

.entrant-qrpanel__item img{
  width: 180px;
  height: auto;
  object-fit: contain;
  border-radius: 12px;
  display:block;
  border: 1px solid rgba(0,0,0,.06);
  background: rgba(255,255,255,.55);
}

.entrant-qrpanel__cap{
  font-weight: 900;
  font-size: 13px;
  color: #0b63ce;
  letter-spacing: .2px;
}

/* на совсем узких — по 2 в ряд / 1 в ряд */
@media (max-width: 520px){
  .entrant-qrpanel__item img{ width: 148px; }
}
.new-title,
.new-name{
  border-radius: 8px;
}
/* ===== Архив новостей ===== */
.news-archive-wrap .section-title{
  margin: 0 0 18px;
}

.news-archive{
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
  align-items: stretch;
}

.news-card{
  background: rgba(255,255,255,.72);
  border: 1px solid rgba(0,0,0,.12);
  border-radius: 16px;
  padding: 18px;
  min-height: 260px;
  display: flex;
  flex-direction: column;
  box-sizing: border-box;
  overflow: hidden;
}

.news-card__date{
  display: inline-block;
  max-width: 100%;
  margin-bottom: 14px;
  padding: 8px 10px;
  border-radius: 10px;
  background: rgba(11,99,206,.10);
  color: #0b63ce;
  font-weight: 900;
  font-size: 14px;
  line-height: 1.1;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.news-card__title{
  font-size: 20px;
  font-weight: 900;
  line-height: 1.2;
  margin-bottom: 12px;
  overflow: hidden;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  min-height: 48px;
}

.news-card__intro{
  color: #3e4857;
  line-height: 1.45;
  margin-bottom: 16px;
  flex: 1 1 auto;
  overflow: hidden;
  display: -webkit-box;
  -webkit-line-clamp: 4;
  -webkit-box-orient: vertical;
  min-height: 84px;
}

.news-card__btn{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  align-self: flex-start;
  margin-top: auto;
  padding: 8px 16px;
  border-radius: 10px;
  background: rgba(11,99,206,.12);
  border: 1px solid rgba(11,99,206,.25);
  color: #0b63ce;
  font-weight: 900;
  text-decoration: none;
  white-space: nowrap;
}

.news-card__btn:hover{
  transform: translateY(-1px);
}

/* Пагинация */
.pagination{
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  flex-wrap: wrap;
  margin: 22px 0 6px;
}

.page-link{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 40px;
  height: 40px;
  padding: 0 12px;
  border-radius: 12px;
  background: rgba(255,255,255,.72);
  border: 1px solid rgba(11,99,206,.18);
  color: #0b63ce;
  font-weight: 900;
  text-decoration: none;
  box-shadow: 0 6px 16px rgba(0,0,0,.06);
}

.page-link:hover{
  background: rgba(11,99,206,.10);
}

.page-link.active{
  background: rgba(11,99,206,.16);
  border-color: rgba(11,99,206,.35);
}

.page-link--disabled{
  opacity: .45;
  pointer-events: none;
}

/* Планшет */
@media (max-width: 1100px){
  .news-archive{
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

/* Телефон */
@media (max-width: 760px){
  .news-archive{
    grid-template-columns: 1fr;
  }

  .news-card{
    min-height: auto;
  }

  .news-card__title,
  .news-card__intro{
    min-height: 0;
  }
}

/* =========================
   NEWS ARTICLE + SLIDER
   ========================= */

.news-article{
  display:flex;
  flex-direction:column;
  gap:24px;
}

.news-article__text{
  background: rgba(255,255,255,.78);
  border: 1px solid rgba(255,255,255,.65);
  border-radius: 18px;
  padding: 20px 22px;
  box-shadow: 0 10px 28px rgba(0,0,0,.07);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
}

.news-article__text p{
  margin: 0 0 16px;
  line-height: 1.7;
  font-size: 18px;
  color: #1d2430;
}

.news-article__text p:last-child{
  margin-bottom: 0;
}

.news-gallery{
  background: rgba(255,255,255,.78);
  border: 1px solid rgba(255,255,255,.65);
  border-radius: 18px;
  padding: 18px;
  box-shadow: 0 10px 28px rgba(0,0,0,.07);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
}

.news-slider{
  position: relative;
  overflow: hidden;
  border-radius: 14px;
  background: rgba(255,255,255,.45);
}

.news-slider__track{
  position: relative;
  min-height: 300px;
}

.news-slider__slide{
  display: none;
  text-align: center;
}

.news-slider__slide.active{
  display: block;
}

.news-slider__slide img{
  width: 100%;
  height: auto;
  max-height: 820px;
  object-fit: contain;
  display: block;
  margin: 0 auto;
  border-radius: 12px;
  background: #eef4f8;
}

.news-slider__btn{
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 48px;
  height: 48px;
  border: none;
  border-radius: 50%;
  background: rgba(0,0,0,.55);
  color: #fff;
  font-size: 28px;
  cursor: pointer;
  z-index: 5;
  transition: background .2s ease, transform .2s ease;
}

.news-slider__btn:hover{
  background: rgba(0,0,0,.75);
}

.news-slider__btn--prev{
  left: 14px;
}

.news-slider__btn--next{
  right: 14px;
}

.news-slider__dots{
  display: flex;
  justify-content: center;
  gap: 8px;
  padding: 14px 10px 6px;
}

.news-slider__dot{
  width: 11px;
  height: 11px;
  border-radius: 50%;
  background: rgba(11,99,206,.25);
  cursor: pointer;
  transition: transform .18s ease, background .18s ease;
}

.news-slider__dot.active{
  background: #0b63ce;
  transform: scale(1.15);
}

/* safety */
.news-gallery,
.news-slider,
.news-slider__track,
.news-slider__slide{
  height: auto !important;
  min-height: 0 !important;
}

@media (max-width: 900px){
  .news-article__text{
    padding: 16px 18px;
  }

  .news-article__text p{
    font-size: 16px;
    line-height: 1.65;
  }

  .news-gallery{
    padding: 14px;
  }

  .news-slider__btn{
    width: 40px;
    height: 40px;
    font-size: 22px;
  }

  .news-slider__track{
    min-height: 220px;
  }
}

/* =========================
   Tabl Redactor
   ========================= */

table {
    width: 100%;
    border-collapse: collapse;
    margin-bottom: 40px;
}

th {
    border: 1px solid #ddd;
    padding: 10px;
    background-color: #f5f5f5;
    text-align: center;
}

td {
    border: 1px solid #ddd;
    padding: 8px;
}

td:last-child {
    text-align: right;
}

.mobile-top-panels{
  display:none;
}

/* =========================
   MOBILE UI: drawer menu + compact header
   БАЗА: на ПК мобильные элементы скрыты
   ========================= */

.hdr-mobile-btn,
.hdr-mobile-map-wrap,
.hdr-mobile-phones-wrap,
.mobile-top-panels{
  display:none;
}


@media (max-width: 900px){

  /* =========================================
     1. ОБЩИЙ КАРКАС МОБИЛКИ
     - сайт идёт одной колонкой
     - левая/центральная/правая колонки = 100%
     ========================================= */
  .container.site{
    display:block;
    margin:16px auto;
    padding:0 10px;
  }

  .aside.left,
  .center,
  aside.right{
    width:100%;
  }

  /* =========================================
     2. МОБИЛЬНАЯ ШАПКА
     - одна линия
     - слева меню
     - дальше: СПО → логотип колледжа → карта
     - справа телефон
     ========================================= */
  .site-header{
    padding:8px 0;
  }

  .site-header__inner--wide{
    padding:0 10px;
  }

  .site-header__inner--row{
    display:grid;
    grid-template-columns: 42px 50px 52px 42px 42px;
    align-items:center;
    justify-content:space-between;
    column-gap:8px;
    min-height:60px;
    padding-right:10;
  }

  /* На телефоне прячем десктопные элементы шапки */
  .hdr-card--phone-desktop,
  .hdr-card--addr-desktop,
  .hdr-card--logo2{
    display:none !important;
  }

  /* =========================================
     3. КНОПКА МЕНЮ (слева)
     ========================================= */
  .hdr-mobile-btn{
    display:flex;
    align-items:center;
    justify-content:center;
    width:42px;
    height:42px;
    border:none;
    border-radius:12px;
    background: rgba(255,255,255,.28);
    border: 1px solid rgba(255,255,255,.45);
    box-shadow:
      inset 0 1px 0 rgba(255,255,255,.60),
      0 10px 24px rgba(0,0,0,.08);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    font-size:28px;
    font-weight:900;
    color:#0b63ce;
    cursor:pointer;
    line-height:1;
    text-decoration:none;
  }

  /* =========================================
     4. КАРТОЧКА СПО
     - сделали крупнее и заметнее
     ========================================= */
  .hdr-card--spo{
    display:flex !important;
    align-items:center;
    justify-content:center;
    width:70px;
    height:60px;
    padding:2px;
    border-radius:14px;
    background: rgba(255,255,255,.24);
    box-shadow:
      inset 0 1px 0 rgba(255,255,255,.70),
      0 12px 24px rgba(0,0,0,.10);
  }

  .hdr-logo--spo{
    width:68px;
    height:52px;
    border-radius:10px;
    background-size: contain;
    background-color: transparent;
    border:none;
    box-shadow:none;
  }

  /* =========================================
     5. ЛОГО КОЛЛЕДЖА
     ========================================= */
  .hdr-card--logo{
    display:flex !important;
    align-items:center;
    justify-content:center;
    width:52px;
    height:50px;
    padding:4px;
    border-radius:14px;
    background: rgba(255,255,255,.24);
    box-shadow:
      inset 0 1px 0 rgba(255,255,255,.70),
      0 12px 24px rgba(0,0,0,.10);
  }

  .hdr-logo--main{
    width:62px;
    height:62px;
  }

  /* =========================================
     6. КНОПКА КАРТЫ
     - размер как у логотипа
     - иконка берётся из файла map-pin.png
     ========================================= */
  .hdr-mobile-map-wrap{
    display:block;
    position:static;
  }

  .hdr-mobile-btn--map{
    font-size:0;
    padding:0;
    box-shadow:
      inset 0 1px 0 rgba(255,255,255,.70),
      0 12px 24px rgba(0,0,0,.10);
  }

  .hdr-mobile-btn--map::before{
    content:"";
    width:52px;
    height:50px;
    display:block;
    background: url("/Media/Photo/4_menu/ui/map-pin.png") center / contain no-repeat;
  }

  /* =========================================
     7. КНОПКА ТЕЛЕФОНА + ВЫПАДАШКА
     - кнопка справа
     - выпадашка привязана к ней
     ========================================= */
  .hdr-mobile-phones-wrap{
    display:block;
    position:relative;
    justify-self:end;
  }

  .hdr-mobile-btn--phone{
    top:0;
  }

  .hdr-mobile-phones{
    display:none;
    position:absolute;
    top:48px;
    right:0;
    width:250px;
    padding:10px;
    border-radius:16px;
    background: rgba(255,255,255,.96);
    border:1px solid rgba(11,99,206,.18);
    box-shadow: 0 18px 40px rgba(0,0,0,.16);
    z-index:1003;
  }

  .hdr-mobile-phones.open{
    display:block;
  }

  .hdr-mobile-phones a{
    display:block;
    padding:10px 12px;
    margin:6px 0;
    border-radius:12px;
    background: rgba(11,99,206,.08);
    color:#0b63ce;
    font-weight:800;
    text-decoration:none;
  }

  /* =========================================
     8. ВЫЕЗЖАЮЩЕЕ МЕНЮ СЛЕВА
     ========================================= */
  .aside.left{
    position:fixed;
    top:76px;
    left:0;
    width:86%;
    max-width:340px;
    height:calc(100vh - 88px);
    margin:0;
    z-index:1000;
    overflow:auto;
    transform:translateX(-110%);
    transition:transform .24s cubic-bezier(.2,.8,.2,1);
    box-shadow: 0 18px 45px rgba(0,0,0,.18);
  }

  body.mobile-menu-open .aside.left{
    transform:translateX(0);
  }

  /* затемнение фона при открытом меню */
  body.mobile-menu-open::before{
    content:"";
    position:fixed;
    inset:0;
    background: rgba(0,0,0,.40);
    z-index:999;
  }

  /* =========================================
     9. МОБИЛЬНЫЕ ПАНЕЛИ "ОБЪЯВЛЕНИЯ / НОВОСТИ"
     - на ПК скрыты
     - на мобиле показываются
     ========================================= */
  .mobile-top-panels{
    display:block;
    margin:12px 0 14px;
  }

  .m-acc{
    margin:10px 0;
    border-radius:16px;
    overflow:hidden;
    background: rgba(255,255,255,.72);
    border:1px solid rgba(255,255,255,.60);
    box-shadow: 0 10px 26px rgba(0,0,0,.08);
  }

  .m-acc summary{
    list-style:none;
    cursor:pointer;
    position:relative;
    padding:14px 16px;
    padding-right:44px;
    font-size:20px;
    font-weight:900;
    color:#1d2430;
    background: rgba(255,255,255,.40);
  }

  .m-acc summary::-webkit-details-marker{
    display:none;
  }

  .m-acc summary::after{
    content:"+";
    position:absolute;
    right:16px;
    top:50%;
    transform:translateY(-50%);
    font-size:26px;
    font-weight:700;
    color:#0b63ce;
  }

  .m-acc[open] summary::after{
    content:"−";
  }

  .m-acc__body{
    padding:12px;
  }

  /* На мобиле правая колонка не нужна —
     её заменяют эти раскрывашки */
  aside.right{
    display:none !important;
  }

  /* =========================================
     10. ТИПОГРАФИКА И ВНУТРЕННИЕ БЛОКИ
     ========================================= */
  .page-title{
    font-size:24px;
    line-height:1.1;
  }

  .aside-title{
    font-size:24px;
  }

  .news-article__text{
    padding:14px 14px;
  }

  .news-article__text p{
    font-size:15px;
    line-height:1.6;
  }

  .entrant-qrpanel__grid{
    gap:10px;
  }

  .entrant-qrpanel__item img{
    width:95px;
  }

  .news-card,
  .news-archive{
    width:auto;
  }
}

/* ===== Госуслуги ===== */

.gosuslugi-card{
  padding:0 !important;
  overflow:hidden;
}

.gosuslugi-wrap{
  border-radius:18px;
  overflow:hidden;
}

#js-show-iframe-wrapper{
  position:relative;
  display:flex;
  align-items:center;
  justify-content:center;
  width:100%;
  min-width:293px;
  max-width:100%;
  background:linear-gradient(138.4deg,#38bafe 26.49%,#2d73bc 79.45%);
  color:#fff;
  cursor:pointer;
  border-radius:18px;
  overflow:hidden;
}

#js-show-iframe-wrapper .pos-banner-fluid *{
  box-sizing:border-box;
}

#js-show-iframe-wrapper .pos-banner-fluid .pos-banner-btn_2{
  display:block;
  width:100%;
  min-height:52px;
  font-size:16px;
  line-height:1.2;
  cursor:pointer;
  background:#fff;
  color:#0b1f33;
  border:none;
  border-radius:10px;
  outline:0;
  font-family:LatoWeb,sans-serif;
  font-weight:400;
  padding:0;
}

#js-show-iframe-wrapper .pos-banner-fluid .pos-banner-btn_2:hover{
  background:#e4ecfd;
}

#js-show-iframe-wrapper .pos-banner-fluid .pos-banner-btn_2:focus,
#js-show-iframe-wrapper .pos-banner-fluid .pos-banner-btn_2:active{
  background:#dbe7ff;
}

#js-show-iframe-wrapper{
  background:var(--pos-banner-fluid-18__background);
}

#js-show-iframe-wrapper .bf-18{
  position:relative;
  display:grid;
  grid-template-columns:var(--pos-banner-fluid-18__grid-template-columns);
  grid-template-rows:var(--pos-banner-fluid-18__grid-template-rows);
  width:100%;
  max-width:var(--pos-banner-fluid-18__max-width);
  box-sizing:border-box;
  grid-auto-flow:row dense;
}

#js-show-iframe-wrapper .bf-18__decor{
  background:var(--pos-banner-fluid-18__bg-url) var(--pos-banner-fluid-18__bg-url-position) no-repeat;
  background-size:cover;
  background-color:#f8efec;
  position:relative;
}

#js-show-iframe-wrapper .bf-18__content{
  display:flex;
  flex-direction:column;
  padding:var(--pos-banner-fluid-18__content-padding);
  grid-row:var(--pos-banner-fluid-18__content-grid-row);
  justify-content:center;
}

#js-show-iframe-wrapper .bf-18__text{
  margin:var(--pos-banner-fluid-18__text-margin);
  font-size:var(--pos-banner-fluid-18__text-font-size);
  line-height:1.4;
  font-family:LatoWeb,sans-serif;
  font-weight:700;
  color:#0b1f33;
}

#js-show-iframe-wrapper .bf-18__bottom-wrap{
  display:flex;
  flex-direction:row;
  align-items:center;
}

#js-show-iframe-wrapper .bf-18__logo-wrap{
  position:absolute;
  top:var(--pos-banner-fluid-18__logo-wrap-top);
  left:var(--pos-banner-fluid-18__logo-wrap-left);
  padding:var(--pos-banner-fluid-18__logo-wrap-padding);
  background:#fff;
  border-radius:0 0 10px 0;
}

#js-show-iframe-wrapper .bf-18__logo{
  width:var(--pos-banner-fluid-18__logo-width);
  margin-left:1px;
}

#js-show-iframe-wrapper .bf-18__slogan{
  font-family:LatoWeb,sans-serif;
  font-weight:700;
  font-size:var(--pos-banner-fluid-18__slogan-font-size);
  line-height:1.2;
  color:#005ca9;
}

#js-show-iframe-wrapper .bf-18__btn-wrap{
  width:100%;
  max-width:var(--pos-banner-fluid-18__button-wrap-max-width);
}

.right .gosuslugi-card{
  margin-bottom:18px;
}

@media (max-width:900px){
  .gosuslugi-card{
    margin:10px 0 16px;
  }
}

/* ===== ГОСУСЛУГИ БЛОК 2 ===== */

.right .gosuslugi-card{
  margin: 16px 0 20px;
}

.gosuslugi-card{
  border-radius:18px;
  overflow:hidden;
  box-shadow: 0 12px 30px rgba(0,0,0,.12);
}

@media (max-width: 900px){
  #js-show-iframe-wrapper .bf-18__text{
    font-size:18px;
  }
}

/* ===== Галерея новости: кнопка под слайдером ===== */

.news-gallery-block{
  margin-top:18px;
}

.news-gallery-actions{
  display:flex;
  justify-content:center;
  margin:16px 0 0;
}

.news-gallery-open-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  text-decoration:none;
  border:none;
  border-radius:14px;
  padding:12px 22px;
  font-size:16px;
  font-weight:800;
  cursor:pointer;
  background:#0095FF;
  color:#fff;
  box-shadow:0 10px 24px rgba(0,0,0,.10);
  transition:transform .15s ease, background .15s ease;
}

.news-gallery-open-btn:hover{
  background:#58D8FF;
  transform:translateY(-1px);
}

@media (max-width:900px){
  .news-gallery-open-btn{
    width:100%;
    max-width:320px;
  }
}

/* ===== Страница галереи новости ===== */

.news-gallery-page{
  margin-top:18px;
}

.news-gallery-page__top{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  flex-wrap:wrap;
  margin-bottom:18px;
}

.news-gallery-page__back{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  text-decoration:none;
  border-radius:14px;
  padding:12px 18px;
  font-size:15px;
  font-weight:800;
  background:#eaf3ff;
  color:#0b63ce;
  border:1px solid rgba(11,99,206,.16);
}

.news-gallery-page__count{
  font-size:15px;
  font-weight:800;
  color:#445063;
}

.news-gallery-page__grid{
  display:grid;
  grid-template-columns:repeat(3, minmax(0, 1fr));
  gap:18px;
}

.news-gallery-page__card{
  background:#fff;
  border:1px solid rgba(0,0,0,.08);
  border-radius:18px;
  overflow:hidden;
  box-shadow:0 10px 24px rgba(0,0,0,.06);
}

.news-gallery-page__image{
  display:block;
  aspect-ratio:4 / 3;
  background:#eef3f9;
}

.news-gallery-page__image img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}

.news-gallery-page__actions{
  display:flex;
  gap:10px;
  padding:14px;
}

.news-gallery-page__btn{
  flex:1 1 auto;
  text-align:center;
  text-decoration:none;
  font-weight:800;
  font-size:15px;
  padding:10px 12px;
  border-radius:12px;
  background:#eaf3ff;
  color:#0b63ce;
  border:1px solid rgba(11,99,206,.16);
}

.news-gallery-empty{
  margin-top:18px;
  padding:18px;
  border-radius:18px;
  background:#fff;
  border:1px solid rgba(0,0,0,.08);
  color:#445063;
  font-weight:700;
}

@media (max-width:900px){
  .news-gallery-page__grid{
    grid-template-columns:repeat(2, minmax(0, 1fr));
    gap:12px;
  }

  .news-gallery-page__actions{
    flex-direction:column;
  }
}

@media (max-width:560px){
  .news-gallery-page__grid{
    grid-template-columns:1fr;
  }
}

/* ===== Кнопка галереи под новостью ===== */

.news-gallery-block{
  margin-top:18px;
}

.news-gallery-actions{
  display:flex;
  justify-content:center;
  margin:16px 0 0;
}

.news-gallery-open-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  text-decoration:none;
  border:none;
  border-radius:14px;
  padding:12px 22px;
  font-size:16px;
  font-weight:800;
  cursor:pointer;
  background:#0095FF;
  color:#fff;
  box-shadow:0 10px 24px rgba(0,0,0,.10);
  transition:transform .15s ease, background .15s ease;
}

.news-gallery-open-btn:hover{
  background:#58D8FF;
  transform:translateY(-1px);
}

/* ===== Страница галереи ===== */

.news-gallery-page{
  margin-top:18px;
}

.news-gallery-page__top{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  flex-wrap:wrap;
  margin-bottom:18px;
}

.news-gallery-page__back{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  text-decoration:none;
  border-radius:14px;
  padding:12px 18px;
  font-size:15px;
  font-weight:800;
  background:#eaf3ff;
  color:#0b63ce;
  border:1px solid rgba(11,99,206,.16);
}

.news-gallery-page__count{
  font-size:15px;
  font-weight:800;
  color:#445063;
}

.news-gallery-page__grid{
  display:grid;
  grid-template-columns:repeat(3, minmax(0, 1fr));
  gap:18px;
}

.news-gallery-page__card{
  background:#fff;
  border:1px solid rgba(0,0,0,.08);
  border-radius:18px;
  overflow:hidden;
  box-shadow:0 10px 24px rgba(0,0,0,.06);
}

.news-gallery-page__image{
  display:block;
  aspect-ratio:4 / 3;
  background:#eef3f9;
}

.news-gallery-page__image img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}

.news-gallery-page__actions{
  display:flex;
  gap:10px;
  padding:14px;
}

.news-gallery-page__btn{
  flex:1 1 auto;
  text-align:center;
  text-decoration:none;
  font-weight:800;
  font-size:15px;
  padding:10px 12px;
  border-radius:12px;
  background:#eaf3ff;
  color:#0b63ce;
  border:1px solid rgba(11,99,206,.16);
}

.news-gallery-empty{
  margin-top:18px;
  padding:18px;
  border-radius:18px;
  background:#fff;
  border:1px solid rgba(0,0,0,.08);
  color:#445063;
  font-weight:700;
}

@media (max-width:900px){
  .news-gallery-open-btn{
    width:100%;
    max-width:320px;
  }

  .news-gallery-page__grid{
    grid-template-columns:repeat(2, minmax(0, 1fr));
    gap:12px;
  }

  .news-gallery-page__actions{
    flex-direction:column;
  }
}

@media (max-width:560px){
  .news-gallery-page__grid{
    grid-template-columns:1fr;
  }
}

/* =========================================================
   MOBILE HOTFIX v1
   ЧИСТЫЙ ВАРИАНТ:
   - не ломает ПК
   - не раздувает маленькие иконки в ссылках
   - сохраняет нормальную мобилку
========================================================= */
@media (max-width: 900px){

  /* 1. Страница не вылезает по ширине */
  html,
  body{
    overflow-x: hidden;
  }

  .container.site,
  .center,
  .center > *{
    min-width: 0;
    max-width: 100%;
  }

  /* 2. Обычные картинки в контенте адаптивные
     НО только если это реально отдельная картинка,
     а не иконка внутри ссылки */
  .center > p > img,
  .center > div > img,
  .center p[style*="text-align: center"] > img,
  .center p[style*="text-align:center"] > img{
    display: block;
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
    margin-left: auto;
    margin-right: auto;
  }

  /* 3. Любые картинки внутри ссылок НЕ растягиваем */
  .center p > a > img,
  .center li > a > img{
    display: inline-block !important;
    width: 40px !important;
    min-width: 40px !important;
    max-width: 40px !important;
    height: 40px !important;
    object-fit: contain;
    vertical-align: middle;
    margin: 0 !important;
  }

  /* 4. Ссылки в центре на мобилке */
  .center p a,
  .center li a{
    display: inline-block !important;
    max-width: 100%;
    white-space: normal !important;
    overflow-wrap: anywhere;
    word-break: break-word;
    vertical-align: top;
  }

  /* Если ссылка с иконкой — ставим иконку и текст рядом */
  .center p > a,
  .center li > a{
    line-height: 1.35;
  }

  /* Если ссылка одна в абзаце — делаем её блочной,
     но без растягивания иконки */
  .center p > a:only-child{
    display: block !important;
    width: 100%;
  }

  /* 5. Таблицы не ломают страницу */
  .center table{
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch;
  }

  .center td,
  .center th{
    white-space: normal !important;
    word-break: break-word;
    font-size: 14px;
    line-height: 1.35;
  }

  /* 6. QR на главной — три в ряд */
  .entrant-qrpanel__grid{
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 8px !important;
    align-items: start;
    justify-items: center;
  }

  .entrant-qrpanel__item{
    width: 100%;
    min-width: 0;
    padding: 8px 6px 8px !important;
    border-radius: 12px;
  }

  .entrant-qrpanel__item img{
    width: 100% !important;
    max-width: 82px !important;
    height: auto !important;
  }

  .entrant-qrpanel__cap{
    font-size: 12px !important;
    line-height: 1.15;
    text-align: center;
  }

}

/* ===== Поиск в архиве новостей ===== */
.news-search{
  margin: 0 0 18px;
}

.news-search__row{
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
  align-items: center;
}

.news-search__input{
  flex: 1 1 320px;
  min-width: 220px;
  height: 44px;
  padding: 0 14px;
  border-radius: 12px;
  border: 1px solid rgba(11,99,206,.18);
  background: rgba(255,255,255,.82);
  color: #1d2430;
  font-size: 15px;
  outline: none;
  box-shadow: 0 6px 16px rgba(0,0,0,.04);
}

.news-search__input:focus{
  border-color: rgba(11,99,206,.35);
  box-shadow: 0 0 0 4px rgba(11,99,206,.12);
}

.news-search__btn,
.news-search__reset{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 44px;
  padding: 0 16px;
  border-radius: 12px;
  border: 1px solid rgba(11,99,206,.22);
  background: rgba(11,99,206,.12);
  color: #0b63ce;
  font-weight: 900;
  text-decoration: none;
  white-space: nowrap;
  cursor: pointer;
}

.news-search__btn:hover,
.news-search__reset:hover{
  background: rgba(11,99,206,.20);
}

.news-search__hint{
  margin-top: 8px;
  color: #5a6678;
  font-size: 13px;
  line-height: 1.35;
}

/* ===== Кнопки "все новости за день / месяц" ===== */
.news-date-links{
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin: 18px 0 6px;
}

.news-date-links__btn{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  padding: 10px 16px;
  border-radius: 12px;
  background: rgba(11,99,206,.12);
  border: 1px solid rgba(11,99,206,.22);
  color: #0b63ce;
  font-weight: 900;
  text-decoration: none;
  box-shadow: 0 6px 16px rgba(0,0,0,.05);
  transition: transform .15s ease, background .15s ease, box-shadow .15s ease;
}

.news-date-links__btn:hover{
  background: rgba(11,99,206,.20);
  transform: translateY(-1px);
  box-shadow: 0 10px 24px rgba(0,0,0,.08);
}

@media (max-width: 760px){
  .news-date-links{
    flex-direction: column;
    align-items: stretch;
  }

  .news-date-links__btn{
    width: 100%;
  }
}

/* ===== ВАУ ВИДЕО-ГАЛЕРЕЯ ===== */

.video-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 24px;
  margin: 28px 0 10px;
}

.video-card {
  position: relative;
  overflow: hidden;
  border-radius: 24px;
  padding: 12px;
  background:
    linear-gradient(135deg, rgba(255,255,255,.92), rgba(235,248,255,.78));
  border: 1px solid rgba(0,149,255,.28);
  box-shadow:
    0 18px 45px rgba(20, 60, 100, .14),
    inset 0 1px 0 rgba(255,255,255,.85);
  transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}

.video-card::before {
  content: "";
  position: absolute;
  inset: -80px;
  background:
    radial-gradient(circle at 20% 15%, rgba(88,216,255,.28), transparent 35%),
    radial-gradient(circle at 85% 85%, rgba(0,149,255,.18), transparent 38%);
  opacity: .75;
  pointer-events: none;
}

.video-card:hover {
  transform: translateY(-6px);
  border-color: rgba(0,149,255,.55);
  box-shadow:
    0 28px 70px rgba(20, 60, 100, .22),
    inset 0 1px 0 rgba(255,255,255,.95);
}

.video-card video {
  position: relative;
  z-index: 1;
  width: 100%;
  display: block;
  aspect-ratio: 16 / 9;
  object-fit: cover;
  border-radius: 18px;
  background: #07111f;
  box-shadow: 0 12px 28px rgba(0,0,0,.18);
}

.video-title {
  position: relative;
  z-index: 1;
  margin-top: 13px;
  padding: 0 4px 2px;
  font-size: 17px;
  font-weight: 900;
  line-height: 1.25;
  color: #162033;
  text-shadow: 0 1px 0 rgba(255,255,255,.7);
}

.video-title::before {
  content: "▶";
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 26px;
  height: 26px;
  margin-right: 8px;
  border-radius: 999px;
  color: #fff;
  background: linear-gradient(135deg, #0095FF, #58D8FF);
  font-size: 12px;
  box-shadow: 0 8px 18px rgba(0,149,255,.32);
}

/* Если видео одно — пусть не растягивается как простыня */
.video-grid:has(.video-card:only-child) {
  grid-template-columns: minmax(0, 860px);
}

/* 2 видео */
.video-grid:has(.video-card:nth-child(2):last-child) {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

/* Адаптив */
@media (max-width: 1100px) {
  .video-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 700px) {
  .video-grid,
  .video-grid:has(.video-card:only-child),
  .video-grid:has(.video-card:nth-child(2):last-child) {
    grid-template-columns: 1fr;
  }

  .video-card {
    border-radius: 20px;
    padding: 10px;
  }

  .video-card video {
    border-radius: 15px;
  }

  .video-title {
    font-size: 15px;
  }
}

/* =====================================================
   ОБЪЯВЛЕНИЕ СПРАВА / МОБИЛКА
   Структура:
   .event            — вся карточка объявления
   .event-top        — верхняя строка: "Объявление" + дата
   .event-title      — зона с картинкой/логотипом
   .new-anons        — нижний текстовый блок
   ===================================================== */

/* Вся карточка */
aside.right .event,
.mobile-top-panels .event {
  transition:
    transform .28s cubic-bezier(.2,.8,.2,1),
    box-shadow .28s cubic-bezier(.2,.8,.2,1),
    background .28s cubic-bezier(.2,.8,.2,1),
    border-color .28s cubic-bezier(.2,.8,.2,1);
  background:
    radial-gradient(circle at 20% 10%, rgba(88,216,255,.36), transparent 34%),
    radial-gradient(circle at 85% 90%, rgba(0,149,255,.20), transparent 42%),
    linear-gradient(135deg, rgba(255,255,255,.94), rgba(218,244,255,.90)) !important;

  border: 1px solid rgba(0,149,255,.34) !important;
  border-radius: 22px !important;
  padding: 16px !important;

  box-shadow:
    0 18px 45px rgba(20,60,100,.16),
    inset 0 1px 0 rgba(255,255,255,.90) !important;

  color: #123456 !important;
}

/* Hover карточки */
/* Наведение: светлее, мягче, без ухода в тёмноту */
aside.right .event:hover,
.mobile-top-panels .event:hover {
  background:
    radial-gradient(circle at 20% 10%, rgba(120,225,255,.48), transparent 36%),
    radial-gradient(circle at 85% 90%, rgba(0,149,255,.24), transparent 44%),
    linear-gradient(135deg, rgba(255,255,255,.98), rgba(205,242,255,.96)) !important;

  transform: translateY(-4px) scale(1.01);
  border-color: rgba(0,149,255,.55) !important;

  box-shadow:
    0 26px 62px rgba(20,60,100,.20),
    inset 0 1px 0 rgba(255,255,255,.98) !important;
}

/* Все элементы внутри по умолчанию тёмно-синие */
aside.right .event *,
.mobile-top-panels .event * {
  color: #123456 !important;
}

/* Верхняя строка */
aside.right .event-top,
.mobile-top-panels .event-top {
  margin-bottom: 12px;
}

/* Плашка "Объявление" */
aside.right .event-type,
.mobile-top-panels .event-type {
  background: rgba(0,149,255,.14) !important;
  color: #075a9b !important;
  border: 1px solid rgba(0,149,255,.32) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.70),
    0 8px 18px rgba(0,149,255,.10);
}

/* Дата */
aside.right .event-date,
.mobile-top-panels .event-date {
  color: #1d5f91 !important;
  font-weight: 900 !important;
}

/* Верхний блок с картинкой */
aside.right .event-title,
.mobile-top-panels .event-title {
  margin: 0 0 14px !important;
  padding: 14px 12px !important;

  background: rgba(255,255,255,.42);
  border: 1px solid rgba(255,255,255,.72);
  border-radius: 18px;

  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.80),
    0 10px 24px rgba(20,60,100,.08);
}

/* Сама картинка СПО */
aside.right .event-title--image img,
.mobile-top-panels .event-title--image img {
  display: block;
  width: 100%;
  max-width: 250px;
  height: auto;
  margin: 0 auto;
  border-radius: 14px;
  filter: drop-shadow(0 8px 18px rgba(20,60,100,.14));
}

/* Нижний текстовый блок */
aside.right .new-anons,
.mobile-top-panels .new-anons {
  padding: 14px 14px 15px;
  margin-top: 12px;

  background: rgba(255,255,255,.50);
  border: 1px solid rgba(0,149,255,.18);
  border-radius: 18px;

  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.80),
    0 10px 26px rgba(20,60,100,.09);

  color: #173153 !important;
}

/* Текст внутри нижнего блока */
aside.right .new-anons p,
.mobile-top-panels .new-anons p {
  margin: 0 !important;
  font-size: 15px !important;
  line-height: 1.35 !important;
  font-weight: 800 !important;
  text-align: center !important;
  color: #173153 !important;
}

/* Мобилка */
@media (max-width: 700px) {
  aside.right .event,
  .mobile-top-panels .event {
    padding: 14px !important;
    border-radius: 20px !important;
  }

  aside.right .event-top,
  .mobile-top-panels .event-top {
    gap: 8px;
  }

  aside.right .event-title,
  .mobile-top-panels .event-title {
    padding: 12px 10px !important;
    border-radius: 16px;
  }

  aside.right .event-title--image img,
  .mobile-top-panels .event-title--image img {
    max-width: 220px;
  }

  aside.right .new-anons,
  .mobile-top-panels .new-anons {
    padding: 12px !important;
    border-radius: 16px;
  }

  aside.right .new-anons p,
  .mobile-top-panels .new-anons p {
    font-size: 14px !important;
  }
}

/* ===== Поиск по сайту ===== */
.search-card{
  width: 100%;
  box-sizing: border-box;
  background: rgba(255,255,255,.78);
  border: 1px solid rgba(255,255,255,.65);
  border-radius: 18px;
  padding: 12px;
  box-shadow: 0 10px 28px rgba(0,0,0,.07);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
  margin-bottom: 16px;
}

.search-card__title{
  margin: 0 0 10px;
  font-size: 20px;
  font-weight: 900;
  color: #1d2430;
}

.site-search__row{
  display: flex;
  align-items: center;
  gap: 8px;
}

.site-search__input{
  flex: 1 1 auto;
  min-width: 0;
  height: 42px;
  box-sizing: border-box;
  padding: 0 12px;
  border-radius: 12px;
  border: 1px solid rgba(11,99,206,.18);
  background: rgba(255,255,255,.82);
  color: #1d2430;
  font-size: 14px;
  outline: none;
  box-shadow: 0 6px 16px rgba(0,0,0,.04);
}

.site-search__input::placeholder{
  color: #6a7687;
  opacity: 1;
}

.site-search__input:focus{
  border-color: rgba(11,99,206,.35);
  box-shadow: 0 0 0 4px rgba(11,99,206,.12);
}

.site-search__btn{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 78px;
  width: 78px;
  height: 42px;
  padding: 0;
  border-radius: 12px;
  border: 1px solid rgba(11,99,206,.22);
  background: rgba(11,99,206,.12);
  color: #0b63ce;
  font-size: 14px;
  font-weight: 900;
  cursor: pointer;
  white-space: nowrap;
  transition: background .15s ease, transform .15s ease, box-shadow .15s ease;
}

.site-search__btn:hover{
  background: rgba(11,99,206,.20);
  transform: translateY(-1px);
  box-shadow: 0 8px 18px rgba(0,0,0,.06);
}

/* ===== Поиск: телефон ===== */
@media (max-width: 900px){
  .search-card{
    padding: 12px;
    margin-bottom: 14px;
  }

  .search-card__title{
    font-size: 20px;
    margin-bottom: 10px;
  }

  .site-search__row{
    gap: 8px;
  }

  .site-search__input{
    height: 42px;
    padding: 0 10px;
    font-size: 13px;
  }

  .site-search__input::placeholder{
    font-size: 13px;
  }

  .site-search__btn{
    flex: 0 0 42px;
    width: 42px;
    min-width: 42px;
    height: 42px;
    font-size: 0;
  }

  .site-search__btn::before{
    content: "🔎";
    font-size: 18px;
  }
}