/* ══════════════════════════════════════════════════════════
   UNITY POWER TEAM — BRAND IDENTITY LAYER
   Palette: deep institutional blue, royal blue, light blue, premium gold,
   champagne, pearl white, light silver, professional graphite.
   Fonts: Manrope / Montserrat / Inter / Cinzel / Cormorant Garamond.
   ══════════════════════════════════════════════════════════ */
:root {
  --font: 'Inter', 'Manrope', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --font-heading: 'Manrope', 'Montserrat', var(--font);
  --font-display: 'Montserrat', 'Manrope', var(--font);
  --font-premium: 'Cinzel', 'Cormorant Garamond', Georgia, serif;

  --unity-blue-deep: #061A33;
  --unity-blue-royal: #005B9F;
  --unity-blue-light: #00A7E8;
  --unity-gold: #D5A33A;
  --unity-champagne: #F5E6B5;
  --unity-pearl: #F7FAFC;
  --unity-silver: #D9E2EC;
  --unity-graphite: #1E293B;

  --blue: var(--unity-blue-deep);
  --blue-hover: var(--unity-blue-royal);
  --blue-soft: #EAF3FA;
  --sage: #0F766E;
  --sage-soft: #E7F4F1;
  --amber: var(--unity-gold);
  --amber-soft: #FFF6DA;
  --red: #B42318;
  --red-soft: #FFF0EC;

  --bg: var(--unity-pearl);
  --bg2: #EEF4F8;
  --text: var(--unity-graphite);
  --hint: #5D6D80;
  --link: var(--unity-blue-royal);
  --btn-bg: var(--unity-blue-deep);
  --btn-text: #FFFFFF;
  --border: rgba(6, 26, 51, .12);
  --section-bg: rgba(255, 255, 255, .86);
  --header-bg: rgba(247, 250, 252, .88);
  --subtitle: #738295;
  --accent: var(--unity-gold);
  --destructive: #B42318;

  --brand-surface: linear-gradient(180deg, #F7FAFC 0%, #FFFFFF 46%, #EEF5FB 100%);
  --brand-card: rgba(255,255,255,.88);
  --brand-card-strong: rgba(255,255,255,.96);
  --brand-line: rgba(213, 163, 58, .34);
  --brand-control-line: rgba(6, 26, 51, .26);
  --brand-shadow: 0 18px 48px rgba(6, 26, 51, .10);
  --brand-shadow-soft: 0 10px 26px rgba(6, 26, 51, .08);
}

body {
  background:
    linear-gradient(135deg, rgba(6,26,51,.08) 0%, rgba(247,250,252,.96) 28%, #F7FAFC 66%, rgba(0,91,159,.12) 100%);
  color: var(--text);
}

#app,
.page {
  background:
    linear-gradient(132deg, transparent 0 74%, rgba(213,163,58,.16) 74.25%, transparent 75%),
    linear-gradient(32deg, transparent 0 78%, rgba(0,91,159,.12) 78.25%, transparent 79%),
    var(--brand-surface);
}

#app {
  border-left: 1px solid rgba(255,255,255,.7);
  border-right: 1px solid rgba(255,255,255,.7);
}

h1, h2, h3,
.home-greeting,
.page-header h1,
.target-copy strong,
.tool-card > span:last-child,
.path-hero h2,
.path-section h3,
.meeting-calendar-head strong,
.profile-head h1,
.chat-profile-gate-card h2 {
  font-family: var(--font-heading);
  color: var(--unity-blue-deep);
  letter-spacing: 0;
}

.section-label,
.path-kicker,
.profile-kicker,
.meeting-calendar-head span {
  color: var(--unity-gold);
  font-family: var(--font-display);
  letter-spacing: .08em;
}

.card,
.feature-card,
.home-link,
.target-card,
.tool-card,
.path-hero,
.path-section,
.video-card,
.profile-head,
.profile-completion,
.profile-action-card,
.meeting-calendar-widget,
.chat-profile-gate-card,
.document-card,
.news-card,
.language-card,
.social-item,
.contact-card {
  background: var(--brand-card);
  border-color: var(--brand-line);
  box-shadow: var(--brand-shadow-soft);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
}

.btn-primary,
.send-btn,
.tour-next {
  background: linear-gradient(135deg, var(--unity-blue-deep), var(--unity-blue-royal));
  color: #FFFFFF;
  box-shadow: 0 10px 22px rgba(6, 26, 51, .18);
}

.btn-secondary,
.btn-outline,
.quick-action {
  background: rgba(255,255,255,.88);
  border: 1.5px solid var(--brand-control-line);
  color: var(--unity-blue-deep);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.82), 0 8px 18px rgba(6,26,51,.06);
}

.path-actions .btn-secondary,
.path-actions .btn-outline,
.resource-cta {
  border: 1.5px solid var(--brand-control-line);
  background: rgba(255,255,255,.92);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.82), 0 8px 18px rgba(6,26,51,.06);
}

.btn-secondary:active,
.btn-outline:active,
.quick-action:active,
.resource-cta:active {
  border-color: var(--unity-blue-royal);
  background: #F7FAFC;
}

.home-hero {
  position: relative;
  padding-top: calc(var(--sp-10) + env(safe-area-inset-top, 0px));
}
.home-hero::after {
  content: "TOGETHER • STRONGER • LIMITLESS";
  display: block;
  margin-top: var(--sp-3);
  color: var(--unity-gold);
  font-family: var(--font-premium);
  font-size: 11px;
  font-weight: 600;
  letter-spacing: .18em;
}
.home-hero .brand-mark {
  width: 108px;
  height: 102px;
  position: relative;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto var(--sp-4);
  overflow: visible;
}
.home-hero .brand-mark img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: contain;
  filter: drop-shadow(0 12px 18px rgba(6,26,51,.14));
}
.home-hero .brand-mark svg { display: none; }
.home-hero .brand-mark::before,
.home-hero .brand-mark::after {
  display: none;
}
.home-greeting {
  font-size: clamp(25px, 7vw, 34px);
  font-weight: 800;
}
.home-subtitle {
  max-width: 360px;
  margin: 0 auto;
  color: var(--hint);
}
.cta-chat,
.top-cta,
.ai-chat-cta,
.top-cta-ai,
.top-cta-promo {
  background:
    linear-gradient(135deg, rgba(213,163,58,.24), transparent 42%),
    linear-gradient(135deg, var(--unity-blue-deep), var(--unity-blue-royal));
  border: 1px solid rgba(245,230,181,.36);
  color: #FFFFFF;
  box-shadow: 0 18px 42px rgba(6, 26, 51, .20);
}
.top-cta-icon,
.cta-chat .cta-icon,
.ai-chat-cta-icon {
  background: rgba(245,230,181,.18);
  color: #FFFFFF;
  border: 1px solid rgba(245,230,181,.32);
}
.top-cta-copy strong,
.ai-chat-cta span:last-child,
.cta-chat .cta-text h3 {
  font-family: var(--font-heading);
  font-weight: 800;
}

.target-card {
  min-height: 98px;
}
.target-primary {
  border-color: rgba(213,163,58,.5);
  background:
    linear-gradient(180deg, rgba(245,230,181,.32), rgba(255,255,255,.88));
}
.target-icon,
.tool-card-icon,
.path-item-icon,
.profile-action-icon,
.document-icon {
  background: rgba(245,230,181,.24);
  color: var(--unity-gold);
  border: 1px solid rgba(213,163,58,.26);
}
.target-sage,
.tool-card:nth-child(2) .tool-card-icon {
  background: rgba(0,91,159,.10);
  color: var(--unity-blue-royal);
}
.target-amber,
.tool-card:nth-child(3) .tool-card-icon,
.tool-card:nth-child(4) .tool-card-icon {
  background: rgba(0,167,232,.10);
  color: var(--unity-blue-light);
}
.target-copy span,
.feature-card .fc-desc,
.path-hero p,
.path-item-desc,
.video-meta span,
.profile-head p,
.profile-completion p,
.meeting-agenda-copy p {
  color: var(--hint);
}

.meeting-calendar-widget {
  background:
    linear-gradient(180deg, rgba(255,255,255,.96), rgba(247,250,252,.9)),
    linear-gradient(135deg, rgba(213,163,58,.12), rgba(0,91,159,.08));
}
.meeting-calendar-head span,
.meeting-agenda-time,
.meeting-day.has-event {
  color: var(--unity-gold);
}
.meeting-day.has-event::after,
.meeting-day.is-selected,
.meeting-day.is-selected::after {
  background: var(--unity-gold);
}
.meeting-day.is-selected {
  color: var(--unity-blue-deep);
}
.meeting-telegram-btn {
  background: #EAF3FA;
  color: var(--unity-blue-royal);
}
.meeting-open-btn {
  background: #FFF6DA;
  color: #8B5F00;
}

.bottom-nav {
  background: linear-gradient(135deg, #061A33, #0A2A4C);
  color: rgba(217,226,236,.66);
  border: 1px solid rgba(245,230,181,.2);
  box-shadow: 0 20px 48px rgba(6,26,51,.32), inset 0 1px 0 rgba(255,255,255,.08);
}
.bottom-nav-item.is-active,
.bottom-nav-ai.is-active {
  color: var(--unity-champagne);
  background: rgba(245,230,181,.10);
}

.page-header {
  background: rgba(247,250,252,.82);
  border-bottom: 1px solid var(--brand-line);
}
.back-btn {
  color: var(--unity-blue-deep);
}

.chat-msg.user {
  background: linear-gradient(135deg, var(--unity-blue-deep), var(--unity-blue-royal));
  color: #FFFFFF;
}
.chat-msg.assistant,
.typing-dots {
  background: rgba(255,255,255,.86);
  border: 1px solid rgba(213,163,58,.22);
}
.chat-input-bar {
  background: rgba(247,250,252,.9);
  border-top-color: var(--brand-line);
}
.chat-input {
  background: rgba(255,255,255,.92);
  border-color: rgba(6,26,51,.14);
}
.chat-input:focus {
  border-color: var(--unity-gold);
}

.profile-avatar {
  border-color: rgba(213,163,58,.55);
  background: #FFF6DA;
  color: var(--unity-blue-deep);
  box-shadow: 0 0 0 0 rgba(213,163,58,.26);
}
.profile-avatar:focus-visible {
  outline-color: rgba(213,163,58,.28);
}
@keyframes profileAvatarPulse {
  0%, 100% { box-shadow: 0 0 0 0 rgba(213,163,58,.24); }
  50% { box-shadow: 0 0 0 8px rgba(213,163,58,0); }
}
.profile-completion {
  background: linear-gradient(180deg, rgba(245,230,181,.26), rgba(255,255,255,.88));
}
.profile-completion-row span {
  color: var(--unity-blue-royal);
}
.profile-completion-track span {
  background: linear-gradient(90deg, var(--unity-blue-royal), var(--unity-gold));
}

.career-entry-card {
  background:
    linear-gradient(135deg, rgba(213,163,58,.16), transparent 42%),
    linear-gradient(135deg, #061A33, #0A2A4C);
  border-color: rgba(245,230,181,.26);
}
.career-entry-icon {
  background: #FFF6DA;
  color: var(--unity-gold);
}

.news-card .news-source.ust,
.news-card .news-source.mg {
  color: var(--unity-blue-royal);
}

.browser-gate {
  font-family: var(--font);
}
.browser-game-shell {
  border-color: var(--unity-blue-deep);
  background: #FFFDF8;
  box-shadow: 8px 8px 0 var(--unity-blue-deep);
}
.browser-game-header h1,
.browser-game-stats strong {
  color: var(--unity-blue-deep);
  font-family: var(--font-display);
}
.browser-game-header span,
.browser-game-stats span {
  color: var(--unity-gold);
}
.browser-game-start {
  background: var(--unity-blue-deep);
  color: #FFFFFF;
}