/* Основные настройки дизайна — меняйте этот блок. */
#hackctf-home {
  --hc-purple: #b34cff;
  --hc-lilac: #ddb4ff;
  --hc-white: #faf7ff;
  --hc-muted: #d0c0e0;
  --hc-base: #190827;
  --hc-card: linear-gradient(135deg, rgba(64, 27, 88, .97), rgba(30, 11, 46, .97));
  --hc-background: url("../images/hackctf-background.png");
  color: var(--hc-white);
  font-family: HackArimo, Arial, Helvetica, sans-serif;
  font-size: 16px;
  line-height: 1.4;
  position: relative;
  isolation: isolate;
  background:
    radial-gradient(ellipse at 8% 25%, rgba(84, 27, 129, .67), transparent 53%),
    radial-gradient(ellipse at 94% 48%, rgba(67, 23, 105, .55), transparent 52%),
    linear-gradient(180deg, #200c32 0%, var(--hc-base) 70%, #15071f 100%);
  width: 100%;
  min-height: calc(100vh - 58px);
  padding: 0;
}
@font-face {
  font-family: HackArimo;
  src: url("../fonts/HackBoardBody.ttf") format("truetype");
  font-weight: 400 700;
  font-display: swap;
}
@font-face {
  font-family: HackOrbitron;
  src: url("../fonts/Orbitron.ttf") format("truetype");
  font-weight: 400 900;
  font-display: swap;
}
#hackctf-home *, #hackctf-home *::before, #hackctf-home *::after { box-sizing: border-box; }
#hackctf-home h1, #hackctf-home h2, #hackctf-home p { margin: 0; color: inherit; }
#hackctf-home a { color: inherit; text-decoration: none; }
#hackctf-home a:focus-visible { outline: 3px solid #e4beff; outline-offset: 6px; }
#hackctf-home .hc-background {
  position: absolute;
  inset: -58px 0 0;
  z-index: -1;
  pointer-events: none;
  background-image: var(--hc-background);
  background-repeat: no-repeat;
  background-position: center top;
  background-size: max(1585px, 100vw) auto;
  mix-blend-mode: screen;
  opacity: .86;
}
#hackctf-home .hc-shell {
  width: min(1442px, calc(100% - 144px));
  margin: 0 auto;
  padding: 22px 0 19px;
}
#hackctf-home .hc-intro { text-align: center; }
#hackctf-home .hc-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 11px;
  min-height: 33px;
  padding: 5px 14px;
  border: 1px solid var(--hc-purple);
  border-radius: 30px;
  background: rgba(53, 18, 78, .85);
  font-size: 14px;
  letter-spacing: 0;
  line-height: 1.2;
  box-shadow: inset 0 0 14px rgba(150, 0, 255, .1);
}
#hackctf-home .hc-badge::before {
  content: "";
  width: 9px;
  height: 9px;
  border-radius: 50%;
  background: #b331ff;
  box-shadow: 0 0 9px #a41dff;
}
#hackctf-home .hc-title { margin-top: 11px; font-weight: 700; }
#hackctf-home .hc-welcome {
  display: block;
  position: relative;
  top: -4px;
  font-size: 44px;
  line-height: 1.15;
  letter-spacing: 0;
  text-shadow: 0 0 22px rgba(157, 60, 255, .6);
}
#hackctf-home .hc-wordmark {
  display: block;
  width: max-content;
  max-width: 100%;
  margin-left: auto;
  margin-right: auto;
  margin-top: 3px;
  font-family: HackOrbitron, Arial, sans-serif;
  font-weight: 900;
  font-size: 91px;
  line-height: 1;
  letter-spacing: 0;
  color: #fff;
  transform: translateY(-8px) scaleX(1.1);
  text-shadow: 0 0 6px #df9dff, 0 0 18px #ad29ff, 0 0 35px rgba(159, 26, 255, .6);
}
#hackctf-home .hc-description {
  max-width: 600px;
  margin: 4px auto 0;
  font-size: 20px;
  line-height: 1.25;
  color: #ddd4f3;
}
#hackctf-home .hc-feature-grid {
  display: grid;
  grid-template-columns: 430px minmax(80px, 1fr) 380px;
  align-items: start;
  margin-top: 36px;
  min-height: 292px;
  padding: 0 7px;
  gap: 24px;
}
#hackctf-home .hc-panel {
  position: relative;
  border: 1px solid #67407f;
  border-radius: 21px;
  background: var(--hc-card);
  box-shadow: inset 0 1px 20px rgba(160, 90, 213, .08), 0 10px 30px rgba(17, 4, 30, .22);
}
#hackctf-home .hc-panel::before, #hackctf-home .hc-panel::after {
  content: "";
  position: absolute;
  pointer-events: none;
  width: 22px;
  height: 22px;
  border-color: #c164ff;
  border-style: solid;
}
#hackctf-home .hc-panel::before {
  inset: -1px auto auto -1px;
  border-width: 2px 0 0 2px;
  border-radius: 21px 0 0 0;
}
#hackctf-home .hc-panel::after {
  inset: auto -1px -1px auto;
  border-width: 0 2px 2px 0;
  border-radius: 0 0 21px 0;
}
#hackctf-home .hc-callout { padding: 27px 42px 21px; min-height: 290px; }
#hackctf-home .hc-stage { grid-column: 3; padding: 30px 46px; min-height: 290px; }
#hackctf-home .hc-icon {
  width: 32px;
  height: 32px;
  display: inline-block;
  fill: none;
  stroke: #c166ff;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
  vertical-align: middle;
  filter: drop-shadow(0 0 4px rgba(158, 17, 255, .3));
}
#hackctf-home .hc-callout > .hc-icon, #hackctf-home .hc-stage > .hc-icon { display: block; }
#hackctf-home .hc-callout h2, #hackctf-home .hc-stage h2 {
  font-size: 29px;
  line-height: 1.2;
  font-weight: 700;
  margin-top: 16px;
  letter-spacing: 0;
}
#hackctf-home .hc-callout h2 { font-size: 27px; }
#hackctf-home .hc-callout p {
  margin-top: 12px;
  font-size: 20px;
  line-height: 1.22;
  color: var(--hc-muted);
}
#hackctf-home .hc-button {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 22px;
  width: 100%;
  min-height: 51px;
  padding: 11px 14px;
  border: 1px solid #c575ff;
  border-radius: 13px;
  font-size: 18px;
  line-height: 1.2;
  transition: background-color .15s ease, border-color .15s ease;
}
#hackctf-home .hc-button-primary {
  margin-top: 21px;
  background: linear-gradient(110deg, #9130e2, #a52be9);
  box-shadow: 0 4px 20px rgba(139, 34, 220, .3);
}
#hackctf-home .hc-button-primary:hover { background: linear-gradient(110deg, #a045ed, #b341f4); }
#hackctf-home .hc-arrow { font-size: 25px; line-height: 1; }
#hackctf-home .hc-dates {
  font-size: 36px;
  font-weight: 700;
  line-height: 1.15;
  color: var(--hc-lilac);
  text-shadow: 0 0 12px rgba(162, 31, 255, .2);
  margin-top: 9px;
}
#hackctf-home .hc-stage hr { border: 0; border-top: 1px solid #674080; margin: 23px 0 19px; }
#hackctf-home .hc-button-secondary { border-color: #be88e7; background: #321549; }
#hackctf-home .hc-button-secondary:hover { background: #472063; }
#hackctf-home .hc-stats {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  align-items: center;
  max-width: 866px;
  min-height: 67px;
  margin: 43px auto 0;
  border-color: #9757c2;
  border-radius: 18px;
}
#hackctf-home .hc-stat {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 13px;
  font-size: 19px;
  line-height: 1.2;
  padding: 5px 15px;
}
#hackctf-home .hc-stat + .hc-stat { border-left: 1px solid #9270ae; }
#hackctf-home .hc-stat strong { font-size: 25px; margin-right: 5px; }
#hackctf-home .hc-categories-title {
  text-align: center;
  font-size: 29px;
  font-weight: 700;
  line-height: 1.1;
  margin-top: 16px;
}
#hackctf-home .hc-categories {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 16px;
  margin-top: 10px;
}
#hackctf-home .hc-category {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  min-height: 117px;
  padding: 14px 8px;
  border-radius: 16px;
  text-align: center;
  transition: border-color .15s ease, background-color .15s ease;
}
#hackctf-home .hc-category:hover { border-color: var(--hc-purple); background: linear-gradient(135deg, #512371, #301245); }
#hackctf-home .hc-category strong { font-size: 18px; line-height: 1.2; margin-top: 8px; }
#hackctf-home .hc-category span { font-size: 15px; line-height: 1.2; color: var(--hc-muted); margin-top: 4px; }
#hackctf-home .hc-steps {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 14px;
  margin-top: 18px;
  color: #c1aed2;
  font-size: 15px;
}
#hackctf-home .hc-steps i { color: #b475ef; font-style: normal; }
/* Планшет: сохраняем иллюстрацию между заголовком и карточками. */
@media (max-width: 1300px) and (min-width: 901px) {
  #hackctf-home .hc-shell { width: calc(100% - 80px); }
  #hackctf-home .hc-feature-grid { grid-template-columns: 350px minmax(40px, 1fr) 320px; }
  #hackctf-home .hc-callout, #hackctf-home .hc-stage { padding-left: 28px; padding-right: 28px; }
  #hackctf-home .hc-callout h2 { font-size: 25px; }
  #hackctf-home .hc-welcome { font-size: 38px; }
  #hackctf-home .hc-wordmark { font-size: 78px; }
  #hackctf-home .hc-category span { font-size: 13px; }
}
/* Мобильная версия — обычный поток, без анимаций и тяжёлых blur-фильтров. */
@media (max-width: 900px) {
  #hackctf-home .hc-background {
    background-size: 1040px auto;
    background-position: center 96px;
    mask-image: linear-gradient(#000 0%, #000 68%, transparent 100%);
    height: 1100px;
  }
  #hackctf-home .hc-shell { width: calc(100% - 36px); padding-top: 25px; padding-bottom: 32px; }
  #hackctf-home .hc-badge { font-size: 11px; min-height: 28px; padding: 5px 11px; }
  #hackctf-home .hc-welcome { font-size: 30px; letter-spacing: 0; }
  #hackctf-home .hc-wordmark { font-size: 56px; margin-top: 10px; letter-spacing: 0; }
  #hackctf-home .hc-description { font-size: 16px; line-height: 1.4; margin-top: 14px; max-width: 540px; }
  #hackctf-home .hc-feature-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 16px;
    padding: 0;
    margin-top: 235px;
    min-height: 0;
  }
  #hackctf-home .hc-callout, #hackctf-home .hc-stage { grid-column: 1; min-height: 0; padding: 24px; }
  #hackctf-home .hc-callout h2, #hackctf-home .hc-stage h2 { font-size: 25px; }
  #hackctf-home .hc-callout p { font-size: 17px; line-height: 1.4; }
  #hackctf-home .hc-button { font-size: 17px; }
  #hackctf-home .hc-dates { font-size: 31px; }
  #hackctf-home .hc-stats { margin-top: 22px; min-height: 79px; }
  #hackctf-home .hc-stat { flex-direction: column; gap: 6px; padding: 13px 5px; font-size: 12px; }
  #hackctf-home .hc-stat .hc-icon { width: 24px; height: 24px; }
  #hackctf-home .hc-stat strong { display: block; font-size: 20px; margin: 0 0 4px; }
  #hackctf-home .hc-categories-title { font-size: 25px; margin-top: 24px; }
  #hackctf-home .hc-categories { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; margin-top: 14px; }
  #hackctf-home .hc-category { min-height: 124px; padding: 14px 9px; }
  #hackctf-home .hc-category span { font-size: 13px; }
  #hackctf-home .hc-steps { gap: 8px; font-size: 12px; margin-top: 22px; }
}
@media (max-width: 480px) {
  #hackctf-home .hc-shell { width: calc(100% - 24px); }
  #hackctf-home .hc-welcome { font-size: 20px; }
  #hackctf-home .hc-wordmark { font-size: 36px; }
  #hackctf-home .hc-description { font-size: 15px; }
  #hackctf-home .hc-feature-grid { margin-top: 205px; }
  #hackctf-home .hc-callout,
  #hackctf-home .hc-stage { padding: 20px; }
  #hackctf-home .hc-callout h2,
  #hackctf-home .hc-stage h2 { font-size: 22px; }
  #hackctf-home .hc-dates { font-size: 27px; }
  #hackctf-home .hc-stat { padding-left: 3px; padding-right: 3px; }
  #hackctf-home .hc-stat span { overflow-wrap: anywhere; text-align: center; }
}
@media (prefers-reduced-motion: reduce) {
  #hackctf-home * { transition: none !important; }
}

/* Integrate the full-bleed landing page with the fixed purple-shadow navbar. */
body:has(#hackctf-home) {
  background: #190827 !important;
  overflow-x: hidden;
}

body:has(#hackctf-home) .ps-main {
  margin: 0;
  padding: 0;
}

body:has(#hackctf-home) .ps-backdrop {
  display: none;
}

/* Keep the logo and account actions at the edges while the main links stay
   centered in the viewport. Medium widths retain Bootstrap's compact layout. */
@media (min-width: 1200px) {
  body:has(#hackctf-home) .navbar-purple .container:not(.ps-admin-toolbar) {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
  }

  body:has(#hackctf-home) .navbar-purple .container:not(.ps-admin-toolbar) > .navbar-brand {
    grid-column: 1;
    justify-self: start;
  }

  body:has(#hackctf-home) .navbar-purple .container:not(.ps-admin-toolbar) > #base-navbars {
    display: contents !important;
  }

  body:has(#hackctf-home) #base-navbars > .navbar-nav:first-of-type {
    grid-column: 2;
    justify-self: center;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }

  body:has(#hackctf-home) #base-navbars > .navbar-nav:last-of-type {
    grid-column: 3;
    justify-self: end;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }
}