/* Connected Community — тёмная тема, фирменный слой оформления, просмотр фото.
   Часть оформления портала. Файлы подключаются в templates/index.html по порядку номеров: поздние правила перебивают ранние. */
/* =========================================================
   ТЁМНАЯ ТЕМА — в фирменных тонах
   ========================================================= */
html[data-theme="dark"]{
  --bg:#121417;--bg-soft:#191C20;--surface:#1E2227;
  --ink:#ECEEF0;--ink-soft:#A0A6AD;
  --orange-soft:#4A2814;--orange-tint:#2A1E17;
  --border:#2E343A;--danger:#FF7A62;
  color-scheme:dark;
}
html[data-theme="dark"] .masthead{background:var(--surface);}
html[data-theme="dark"] .nav-item:hover{background:var(--bg-soft);}
html[data-theme="dark"] .modal,html[data-theme="dark"] .overlay{color:var(--ink);}
html[data-theme="dark"] .overlay{background:rgba(0,0,0,0.6);}
html[data-theme="dark"] .toast{background:var(--orange);color:#fff;}
html[data-theme="dark"] .bubble.bot.error{background:#3A1F1A;}
html[data-theme="dark"] .person-tag.online{background:#1C2A3D;color:#8DB7F0;}
html[data-theme="dark"] .project-status.done{background:#183324;color:#8FD9A4;}
html[data-theme="dark"] .project-status.planned{background:var(--bg-soft);}
html[data-theme="dark"] .org-ceo,
html[data-theme="dark"] .org-head-card,
html[data-theme="dark"] .ov-card{background:linear-gradient(180deg,var(--orange-tint) 0%,var(--surface) 60%);}
html[data-theme="dark"] .org-links path{stroke:#8A4A22;}
html[data-theme="dark"] .og-band-head{background:linear-gradient(90deg,var(--orange-tint) 0%,var(--surface) 55%);}
html[data-theme="dark"] .ai-teaser,
html[data-theme="dark"] .ask-box{background:linear-gradient(180deg,var(--orange-tint) 0%,var(--surface) 70%);}
html[data-theme="dark"] .switch i{background:#ECEEF0;}
html[data-theme="dark"] .lightbox-overlay{background:rgba(0,0,0,0.92);}
html[data-theme="dark"] .empty,html[data-theme="dark"] .soon-card{background:var(--bg-soft);}
html[data-theme="dark"] img.person-photo,html[data-theme="dark"] .gal-photo img{filter:brightness(0.92);}
/* схемы офиса нарисованы на светлом фоне: в тёмной теме переворачиваем цвета, сохраняя оттенки (07.10.2026, замечание пользователя «карта офиса почему-то белая») */
html[data-theme="dark"] .office-plan-wrap img{filter:invert(1) hue-rotate(180deg) brightness(3) contrast(0.8);}   /* 09.10.2026: с brightness(0.9) план был почти чёрным, столов не видно */
.thinking-note{font-size:12.5px;color:var(--ink-soft);margin-left:10px;}
.bubble.bot.thinking{display:flex;align-items:center;flex-wrap:wrap;gap:4px;}

/* =========================================================
   ЖИВЕЕ: фон, баннер, цветные аватарки, ховеры, появление
   ========================================================= */
body{
  background:
    radial-gradient(900px 420px at 8% -10%, rgba(255,102,0,0.10), transparent 60%),
    radial-gradient(700px 380px at 100% 0%, rgba(255,102,0,0.07), transparent 60%),
    var(--bg);
  background-attachment:fixed;
}
html[data-theme="dark"] body{
  background:
    radial-gradient(900px 420px at 8% -10%, rgba(255,102,0,0.14), transparent 60%),
    radial-gradient(700px 380px at 100% 0%, rgba(255,102,0,0.09), transparent 60%),
    var(--bg);
}

/* появление раздела */
@keyframes fadeUp{from{opacity:0;transform:translateY(6px);}to{opacity:1;transform:none;}}
.main.fade-in{animation:fadeUp .25s ease-out;}

/* приветственный баннер */
.hero{
  position:relative;overflow:hidden;
  display:flex;align-items:center;justify-content:space-between;gap:24px;flex-wrap:wrap;
  padding:26px 30px;margin-bottom:28px;border-radius:18px;
  background:linear-gradient(120deg,#FF7A1F 0%,#FF6600 55%,#E85C00 100%);
  color:#fff;box-shadow:0 14px 34px rgba(255,102,0,0.28);
}
.hero-blob{position:absolute;border-radius:50%;filter:blur(40px);opacity:0.5;pointer-events:none;}
.hero-blob.a{width:260px;height:260px;right:-60px;top:-120px;background:#FFC08A;}
.hero-blob.b{width:200px;height:200px;left:40%;bottom:-140px;background:#FFE0C2;}
.hero-text{position:relative;min-width:0;flex:1 1 320px;}
.hero-date{font-size:12.5px;font-weight:700;letter-spacing:0.08em;text-transform:uppercase;opacity:0.85;}
.hero-title{font-family:'Samsung Sans','Golos Text',sans-serif;font-weight:700;font-size:28px;margin-top:4px;letter-spacing:-0.01em;}
.hero-sub{font-size:14px;margin-top:6px;opacity:0.92;max-width:60ch;line-height:1.5;}
.hero-stats{position:relative;display:flex;gap:10px;flex-shrink:0;}
.hero-stat{
  min-width:104px;padding:12px 14px;border-radius:12px;text-align:center;
  background:rgba(255,255,255,0.16);border:1px solid rgba(255,255,255,0.28);
  backdrop-filter:blur(4px);
}
.hero-stat b{display:block;font-family:'Samsung Sans','Golos Text',sans-serif;font-size:24px;line-height:1.1;}
.hero-stat span{display:block;font-size:11.5px;margin-top:3px;opacity:0.9;}
@media (max-width:860px){.hero-stats{width:100%;}.hero-stat{flex:1;}}

/* цветные аватарки: у каждого свой оттенок */
.org-ava:not(.orange):not(.big):not(.vacant){
  background:hsl(var(--h,25) 70% 91%);color:hsl(var(--h,25) 45% 32%);
}
html[data-theme="dark"] .org-ava:not(.orange):not(.big):not(.vacant){
  background:hsl(var(--h,25) 35% 24%);color:hsl(var(--h,25) 70% 80%);
}
.person-photo-fallback{background:hsl(var(--h,25) 70% 91%);color:hsl(var(--h,25) 45% 32%);}

/* карточки чуть «оживают» при наведении */
.news-card,.project-card,.person-card,.gal-card,.ov-card,.set-group,.widget-card{
  transition:transform .15s ease, box-shadow .15s ease, border-color .15s ease;
}
.news-card:hover,.project-card:hover,.person-card:hover,.gal-card:hover,.widget-card:hover{
  transform:translateY(-2px);box-shadow:0 10px 26px rgba(21,24,27,0.08);border-color:var(--orange-soft);
}
html[data-theme="dark"] .news-card:hover,html[data-theme="dark"] .project-card:hover,
html[data-theme="dark"] .person-card:hover,html[data-theme="dark"] .gal-card:hover{box-shadow:0 10px 26px rgba(0,0,0,0.4);}
.btn{transition:transform .1s ease, background .15s ease;}
.btn:active{transform:scale(0.97);}

/* искра бота слегка пульсирует */
@keyframes sparkle{0%,100%{transform:scale(1);}50%{transform:scale(1.08);}}
.ai-teaser .ask-spark,.chat-topbar .ask-spark{animation:sparkle 2.4s ease-in-out infinite;}

/* =========================================================
   ФИРМЕННЫЙ ДИЗАЙН-СЛОЙ: тёплый фон, акценты, тени, футер
   ========================================================= */
:root{
  --bg:#FFF8F3;            /* тёплый кремовый вместо белого */
  --bg-soft:#FFF1E8;
  --border:#F2DED2;        /* тёплая рамка */
  --shadow:0 6px 20px rgba(255,102,0,0.08);
}
html[data-theme="dark"]{--shadow:0 6px 20px rgba(0,0,0,0.35);}
body{
  background:
    radial-gradient(1000px 480px at 5% -10%, rgba(255,102,0,0.16), transparent 60%),
    radial-gradient(800px 420px at 100% 5%, rgba(255,102,0,0.10), transparent 60%),
    linear-gradient(180deg,#FFF3EA 0%,var(--bg) 40%);
  background-attachment:fixed;
}
html[data-theme="dark"] body{
  background:
    radial-gradient(1000px 480px at 5% -10%, rgba(255,102,0,0.18), transparent 60%),
    radial-gradient(800px 420px at 100% 5%, rgba(255,102,0,0.10), transparent 60%),
    var(--bg);
}

/* шапка: белая, с оранжевой линией снизу */
.masthead{
  background:rgba(255,255,255,0.92);backdrop-filter:blur(8px);
  border-bottom:none;
  box-shadow:0 1px 0 var(--border), 0 3px 0 0 var(--orange) inset;
  border-top:3px solid var(--orange);
}
html[data-theme="dark"] .masthead{background:rgba(30,34,39,0.92);}
.nav-item.active{background:linear-gradient(135deg,#FF7A1F,#E85C00);box-shadow:0 4px 12px rgba(255,102,0,0.3);}

/* заголовки разделов с оранжевой меткой */
.section-title{position:relative;padding-left:16px;}
.section-title::before{
  content:"";position:absolute;left:0;top:0.22em;width:6px;height:0.78em;border-radius:3px;
  background:linear-gradient(180deg,#FF7A1F,#E85C00);
}
.doc-group-title{border-bottom-color:var(--orange);}

/* кнопки — градиент и тень */
.btn:not(.secondary):not(.text){
  background:linear-gradient(135deg,#FF7A1F,#E85C00);
  box-shadow:0 4px 12px rgba(255,102,0,0.28);
}
.btn:not(.secondary):not(.text):hover{background:linear-gradient(135deg,#FF6600,#D95700);}
.btn.secondary{background:var(--surface);}

/* карточки: белые на кремовом, тёплая рамка, лёгкая тень */
.news-card,.person-card,.project-card,.gal-card,.widget-card,.set-group,.og-band,.ov-card,
.org-head-card,.faq-item,.news-feature,.onboard-step,.ai-teaser,.faq-link,.chat-shell,.ask-box{
  box-shadow:var(--shadow);
}
.news-card{border-left:4px solid var(--orange);}
.faq-item{background:var(--surface);}

/* виджеты справа: оранжевый заголовок с подчёркиванием */
.widget-title{
  color:var(--ink);padding-bottom:8px;margin-bottom:10px;
  border-bottom:2px solid var(--orange-soft);
}
.widget-row-date{color:var(--orange-dark);font-weight:600;}

/* пустые состояния — в тон */
.empty,.soon-card{border-color:var(--orange-soft);background:var(--surface);}
.empty strong,.soon-title{color:var(--orange-dark);}

/* аккордеон вопросов */
.faq-q:hover{color:var(--orange-dark);}
.faq-arrow{color:var(--orange);}

/* футер */
/* футер: только подпись справа внизу (решение пользователя 22.09.2026) */
.site-footer{margin-top:auto;padding:14px 40px 18px;}
.site-footer-inner{max-width:1320px;margin:0 auto;display:flex;justify-content:flex-end;}
/* ссылки на компанию в сети — в шапке слева от смены языка (25.09.2026; до этого пробовали в подвале и в строке вкладок) */
.nav-social{display:flex;align-items:center;gap:6px;flex-shrink:0;}
@media (max-width:600px){.nav-social{display:none;}}   /* на телефоне в шапке нет места — значки вылезали за экран (проверка 25.09.2026) */
.nav-social::after{content:"";width:1px;height:22px;background:var(--border);margin:0 6px 0 4px;}
.nav-social-link{width:32px;height:32px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;
  background:var(--orange-tint);color:var(--orange);text-decoration:none;transition:background .15s,color .15s,transform .15s;}
.nav-social-link i{font-style:normal;display:inline-flex;}
.nav-social-link .ico,.nav-social-link svg{width:16px;height:16px;}
.nav-social-link:hover{background:var(--orange);color:#fff;transform:translateY(-1px);}
.site-footer-credit{font-family:'Samsung Sans','Golos Text',sans-serif;font-size:12px;font-weight:700;letter-spacing:.3px;color:var(--orange);}
.body-row.chat-mode ~ .site-footer{display:none;}
.masthead{box-shadow:0 1px 0 var(--border);}

/* ---- просмотр фото: больше воздуха вокруг, подсказка, курсор ---- */
.lightbox-overlay{padding:56px 72px 64px;cursor:zoom-out;}
.lightbox-overlay img{max-width:min(86vw,1100px);max-height:78vh;cursor:default;box-shadow:0 20px 60px rgba(0,0,0,0.5);}
.lightbox-close{cursor:pointer;width:44px;height:44px;border-radius:50%;background:rgba(255,255,255,0.12);font-size:26px;}
.lightbox-close:hover{background:var(--orange);}
.lightbox-hint{position:absolute;bottom:22px;left:0;right:0;text-align:center;color:rgba(255,255,255,0.6);font-size:12.5px;}

/* ---- листание в просмотре фото ---- */
.lightbox-nav{
  position:absolute;top:50%;transform:translateY(-50%);
  width:52px;height:52px;border-radius:50%;border:none;cursor:pointer;
  background:rgba(255,255,255,0.12);color:#fff;font-size:34px;line-height:1;
  display:flex;align-items:center;justify-content:center;
  transition:background .15s;
}
.lightbox-nav:hover{background:var(--orange);}
.lightbox-nav.prev{left:18px;}
.lightbox-nav.next{right:18px;}
.lightbox-overlay img{user-select:none;-webkit-user-drag:none;cursor:grab;}
.lightbox-overlay img:active{cursor:grabbing;}
.lightbox-counter{color:#fff;font-weight:700;}
@media (max-width:860px){.lightbox-nav{width:42px;height:42px;font-size:28px;}.lightbox-nav.prev{left:8px;}.lightbox-nav.next{right:8px;}.lightbox-overlay{padding:40px 12px 56px;}}
