:root {
  --ink: #edf2f5;
  --muted: #9ba8b1;
  --dim: #687985;
  --bg: #02070b;
  --panel: #06111a;
  --panel-2: #091721;
  --panel-3: #0d1c28;
  --line: rgba(155, 179, 194, .22);
  --line-strong: rgba(211, 38, 30, .66);
  --red: #db2119;
  --red-bright: #fa392f;
  --green: #9cc216;
  --gold: #cf9f4e;
  --max: 1680px;
  --shadow: 0 18px 55px rgba(0, 0, 0, .48);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 128px; }
body {
  margin: 0;
  color: var(--ink);
  background:
    radial-gradient(circle at 15% 20%, rgba(21, 62, 89, .14), transparent 28rem),
    linear-gradient(180deg, #07111a 0, var(--bg) 34rem);
  font-family: "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  font-size: 1rem;
  line-height: 1.45;
}
body.dialog-open { overflow: hidden; }
a { color: inherit; }
button, input, select, textarea { font: inherit; }
button { color: inherit; }
img { max-width: 100%; }
[hidden] { display: none !important; }

.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}
.skip-link {
  position: fixed;
  top: .5rem;
  left: .5rem;
  z-index: 999;
  padding: .65rem 1rem;
  color: #fff;
  background: var(--red);
  transform: translateY(-150%);
}
.skip-link:focus { transform: none; }
:focus-visible { outline: 2px solid var(--red-bright); outline-offset: 3px; }

.site-header {
  position: sticky;
  top: 0;
  z-index: 100;
  border-bottom: 1px solid rgba(155, 179, 194, .13);
  background: rgba(2, 7, 11, .96);
  box-shadow: 0 8px 26px rgba(0, 0, 0, .28);
  backdrop-filter: blur(16px);
}
.header-top {
  width: min(var(--max), 100%);
  min-height: 80px;
  margin: auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: .55rem 2.25rem .55rem 13rem;
}
.brand {
  display: flex;
  align-items: center;
  gap: 1rem;
  color: #fff;
  text-decoration: none;
  letter-spacing: .04em;
}
.brand img {
  position: absolute;
  top: .4rem;
  left: 1rem;
  z-index: 4;
  width: 175px;
  height: 175px;
  object-fit: contain;
  filter: drop-shadow(0 12px 22px #000);
}
.brand strong {
  display: block;
  font-family: "Arial Narrow", "Roboto Condensed", "Segoe UI", sans-serif;
  font-size: clamp(1.45rem, 2vw, 2rem);
  font-weight: 650;
  line-height: 1;
  letter-spacing: .045em;

  background: linear-gradient(
    180deg,
    #ffffff 0%,
    #dfe5ea 25%,
    #9da8b2 55%,
    #f4f7f9 85%,
    #b8c2ca 100%
  );

  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}
.brand small { display: block; margin-top: .35rem; color: #aeb8bf; font-size: .82rem; letter-spacing: .015em; }
.header-actions { display: flex; align-items: center; gap: 1.7rem; }
.status-badge {
  min-width: 210px;
  min-height: 52px;
  display: flex;
  align-items: center;
  gap: .75rem;
  padding: .55rem .95rem;
  border: 1px solid rgba(207, 159, 78, .36);
  background: rgba(5, 12, 17, .85);
  text-decoration: none;
  text-transform: uppercase;
}
.status-badge:hover { border-color: rgba(207, 159, 78, .75); }
.status-light {
  width: 20px;
  height: 20px;
  flex: 0 0 auto;
  border: 1px solid #bed43c;
  border-radius: 50%;
  background: radial-gradient(circle at 35% 35%, #b7dc33, #5e7a03 70%);
  box-shadow: 0 0 12px rgba(156, 194, 22, .42);
}
.status-badge strong, .status-badge small { display: block; }
.status-badge strong { font-size: .76rem; }
.status-badge small { color: var(--green); font-size: .7rem; }
.social-links { display: flex; align-items: center; }
.social-links a {
  width: 55px;
  height: 36px;
  display: grid;
  place-items: center;
  border-left: 1px solid var(--line);
  color: #c2c9cf;
  font-size: 1.15rem;
  font-weight: 800;
  text-decoration: none;
}
.social-links a:hover { color: #fff; }
.menu-toggle { display: none; }

.site-nav {
  min-height: 47px;
  display: flex;
  justify-content: center;
  align-items: stretch;
  gap: clamp(.65rem, 2vw, 2.65rem);
  padding: 0 1.25rem 0 13rem;
  border-top: 1px solid rgba(155, 179, 194, .13);
  background: rgba(4, 10, 15, .98);
}
.site-nav a, .site-nav button {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: .5rem;
  padding: .25rem 0;
  border: 0;
  color: #b7c0c7;
  background: transparent;
  font-size: clamp(.7rem, .85vw, .86rem);
  font-weight: 650;
  letter-spacing: .02em;
  text-decoration: none;
  text-transform: uppercase;
  white-space: nowrap;
  cursor: pointer;
}
.site-nav a span, .site-nav button span { color: #c0c8ce; font-size: 1.05rem; }
.site-nav a::after, .site-nav button::after {
  content: "";
  position: absolute;
  inset: auto 0 0;
  height: 3px;
  background: var(--red);
  transform: scaleX(0);
  transition: transform .2s ease;
}
.site-nav a:hover, .site-nav button:hover, .site-nav .is-active { color: #fff; }
.site-nav a:hover::after, .site-nav button:hover::after, .site-nav .is-active::after { transform: scaleX(1); }
.site-nav .is-active, .site-nav .is-active span { color: var(--red-bright); }

.hero {
  position: relative;
  isolation: isolate;
  min-height: 330px;
  overflow: hidden;
  border-bottom: 1px solid var(--line);
  background: #07111a;
}
.hero-scene {
  position: absolute;
  inset-block: 0;
  width: 56%;
  background-repeat: no-repeat;
  background-size: cover;
}
.hero-wows { left: 0; background-image: url("assets/hero-wows.png"); background-position: 26% 52%; }
.hero-overlay {
  position: absolute;
  inset: 0;
  z-index: 1;
  background:
    linear-gradient(90deg, rgba(1, 5, 8, .03), rgba(2, 7, 11, .88) 45%, rgba(2, 7, 11, .88) 55%, rgba(1, 5, 8, .03)),
    linear-gradient(180deg, rgba(0, 0, 0, .02) 45%, rgba(2, 7, 11, .46) 84%, rgba(2, 7, 11, .88));
}
.hero-center {
  position: relative;
  z-index: 2;
  width: min(760px, calc(100% - 2rem));
  min-height: 330px;
  margin: auto;
  display: grid;
  grid-template-columns: 180px 330px;
  align-items: center;
  justify-content: center;
  gap: 1rem;
  padding-bottom: 2.8rem;
}
.hero-logo {
  width: 330px;
  height: 330px;
  object-fit: contain;
  filter: drop-shadow(0 20px 32px rgba(0, 0, 0, .85));
}
.hero-claim {
  display: grid;
  gap: .45rem;
  color: #e0e5e8;
  font-family: "Arial Narrow", "Roboto Condensed", "Segoe UI", sans-serif;
  font-size: .93rem;
  font-weight: 650;
  line-height: 1.13;
  letter-spacing: .045em;
  text-align: right;
  text-transform: uppercase;
  text-shadow: 0 3px 12px #000;
}
.hero-claim strong { color: var(--red-bright); font-size: 1.2rem; letter-spacing: .12em; }
.hero-copy {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
}
.hero-actions {
  position: absolute;
  left: 50%;
  bottom: .6rem;
  transform: translateX(-8%);
  display: flex;
  gap: .65rem;
}
.button {
  min-height: 42px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: .66rem 1.3rem;
  border: 1px solid transparent;
  border-radius: 1px;
  font-size: .78rem;
  font-weight: 800;
  letter-spacing: .055em;
  text-decoration: none;
  text-transform: uppercase;
  cursor: pointer;
  transition: transform .18s ease, border-color .18s ease, background .18s ease;
}
.button:hover { transform: translateY(-2px); }
.button-primary { border-color: #f0473f; color: #fff; background: linear-gradient(180deg, #e43a31, #9f110d); }
.button-primary:hover { background: linear-gradient(180deg, #f14940, #bb1711); }
.button-ghost { border-color: rgba(220, 230, 236, .32); color: #edf2f5; background: rgba(3, 9, 14, .78); }
.button-ghost:hover { border-color: #d2dbe1; background: #11222e; }
.button-quiet { border-color: var(--line); color: #b8c3ca; background: transparent; }
.button-quiet:hover { color: #fff; border-color: #6b808e; }

.feature-strip {
  width: min(var(--max), calc(100% - 2rem));
  min-height: 92px;
  margin: -1px auto 0;
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  border: 1px solid var(--line);
  background: rgba(5, 14, 21, .98);
  box-shadow: var(--shadow);
}
.feature-strip a, .feature-strip button {
  min-width: 0;
  display: flex;
  align-items: center;
  gap: .9rem;
  padding: .9rem 1.1rem;
  border: 0;
  border-right: 1px solid var(--line);
  color: #d7dfe4;
  background: transparent;
  text-align: left;
  text-decoration: none;
  cursor: pointer;
}
.feature-strip > :last-child { border-right: 0; }
.feature-strip a:hover, .feature-strip button:hover { background: #0d1e2a; }
.feature-icon {
  min-width: 46px;
  color: var(--red-bright);
  font-size: 2.35rem;
  line-height: 1;
  text-align: center;
}
.feature-icon-muted { color: #beb2a5; }
.feature-strip strong, .feature-strip small { display: block; }
.feature-strip strong { font-size: .92rem; letter-spacing: .035em; text-transform: uppercase; }
.feature-strip small { margin-top: .18rem; color: var(--muted); font-size: .77rem; line-height: 1.25; }

.command-grid {
  width: min(var(--max), calc(100% - 2rem));
  margin: .8rem auto 0;
  display: grid;
  grid-template-columns: 1.13fr .72fr 1.66fr 1.2fr;
  gap: .75rem;
  align-items: stretch;
}
.dashboard-card, .game-card {
  min-width: 0;
  border: 1px solid var(--line);
  background: rgba(5, 15, 22, .96);
  box-shadow: 0 12px 28px rgba(0, 0, 0, .24);
}
.dashboard-card { padding: .8rem; }
.card-heading {
  min-height: 28px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .7rem;
  margin-bottom: .55rem;
  padding: 0 .15rem .45rem .65rem;
  border-bottom: 1px solid var(--line);
}
.card-heading h2 {
  position: relative;
  margin: 0;
  font-family: "Arial Narrow", "Roboto Condensed", "Segoe UI", sans-serif;
  font-size: .9rem;
  letter-spacing: .065em;
  text-transform: uppercase;
}
.card-heading h2::before {
  content: "";
  position: absolute;
  top: .05rem;
  bottom: .05rem;
  left: -.65rem;
  width: 3px;
  background: var(--red);
}
.card-heading a { color: #b2bec6; font-size: .68rem; text-decoration: none; white-space: nowrap; }
.card-heading a:hover, .card-heading a span { color: var(--red-bright); }

.news-list { display: grid; }
.news-item {
  min-height: 77px;
  display: grid;
  grid-template-columns: 80px 1fr;
  gap: .7rem;
  align-items: center;
  padding: .5rem 0;
  border-bottom: 1px solid rgba(155, 179, 194, .14);
}
.news-item img { width: 80px; height: 60px; object-fit: cover; border: 1px solid rgba(155, 179, 194, .18); }
.news-item:nth-child(3) img { object-fit: contain; background: #02070b; }
.news-item h3 { margin: 0; font-size: .78rem; line-height: 1.15; }
.news-item time { display: block; margin: .1rem 0; color: var(--red-bright); font-size: .67rem; font-weight: 750; }
.news-item p { margin: 0; color: var(--muted); font-size: .67rem; line-height: 1.25; }
.card-action {
  width: 100%;
  min-height: 30px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: .5rem;
  margin-top: .55rem;
  border: 1px solid rgba(155, 179, 194, .25);
  color: #cbd4da;
  background: rgba(4, 11, 17, .9);
  font-size: .69rem;
  letter-spacing: .045em;
  text-transform: uppercase;
  cursor: pointer;
}
.card-action:hover { color: #fff; border-color: var(--red); }
.card-action span { color: var(--red-bright); font-size: 1rem; }

.service-list { display: grid; }
.service-list > div {
  min-height: 59px;
  display: grid;
  grid-template-columns: 34px 1fr;
  align-items: center;
  gap: .45rem;
  padding: .35rem 0;
  border-bottom: 1px solid rgba(155, 179, 194, .13);
}
.service-symbol { grid-row: 1 / 3; color: #c4cbd0; font-size: 1.45rem; text-align: center; }
.service-list p { margin: 0; line-height: 1.13; }
.service-list strong, .service-list small { display: block; }
.service-list strong { font-size: .72rem; text-transform: uppercase; }
.service-list small { color: var(--muted); font-size: .65rem; }
.service-list b { grid-column: 2; color: var(--green); font-size: .64rem; font-weight: 750; text-transform: uppercase; }
.verification-note { margin: .45rem 0 0; color: var(--dim); font-size: .62rem; line-height: 1.25; }

.game-card {
  min-height: 355px;
  position: relative;
  isolation: isolate;
  display: flex;
  align-items: flex-end;
  justify-content: center;
  overflow: hidden;
  padding: 1rem;
  background-position: center;
  background-size: cover;
  text-align: center;
}
.wows-card { background-image: url("assets/hero-wows.png"); background-position: 28% center; }
.game-card::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background: linear-gradient(180deg, rgba(1, 6, 10, .12), rgba(2, 7, 11, .18) 32%, rgba(2, 7, 11, .94) 86%);
}
.game-emblem {
  position: absolute;
  top: .7rem;
  left: 50%;
  transform: translateX(-50%);
  color: #d7dce0;
  font-size: 2.6rem;
  text-shadow: 0 3px 12px #000;
}
.game-card h2 {
  margin: 0;
  font-family: Impact, "Arial Narrow", "Roboto Condensed", sans-serif;
  font-size: clamp(1.6rem, 2.1vw, 2.35rem);
  font-weight: 500;
  line-height: .95;
  letter-spacing: .01em;
  text-transform: uppercase;
  text-shadow: 0 3px 10px #000;
}
.game-card p { margin: .65rem 0; color: #e0e6e9; font-size: .77rem; text-shadow: 0 2px 7px #000; }
.game-card button {
  width: 100%;
  min-height: 31px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: .5rem;
  border: 1px solid rgba(213, 225, 233, .35);
  color: #fff;
  background: rgba(5, 18, 29, .86);
  font-size: .7rem;
  font-weight: 750;
  text-transform: uppercase;
  cursor: pointer;
}
.game-card button:hover { border-color: var(--red-bright); }
.wows-card button { background: rgba(4, 36, 68, .86); }

.right-stack { min-width: 0; display: grid; grid-template-rows: 1.45fr .78fr; gap: .65rem; }
.events-card, .quick-card { min-width: 0; }
.event-list { display: grid; }
.event-list > div {
  min-height: 58px;
  display: grid;
  grid-template-columns: 54px 1fr;
  gap: .7rem;
  align-items: center;
  padding: .35rem 0;
  border-bottom: 1px solid rgba(155, 179, 194, .13);
}
.event-list > div > span {
  width: 48px;
  height: 48px;
  display: grid;
  place-items: center;
  border: 1px solid var(--red);
}
.event-list b { font-size: 1.3rem; line-height: .75; }
.event-list span small { color: var(--muted); font-size: .55rem; text-transform: uppercase; }
.event-list p { margin: 0; }
.event-list strong, .event-list p small { display: block; }
.event-list strong { font-size: .72rem; }
.event-list p small { color: var(--muted); font-size: .65rem; }

.quick-grid { display: grid; grid-template-columns: repeat(4, 1fr); border: 1px solid rgba(155, 179, 194, .16); }
.quick-grid button {
  min-width: 0;
  min-height: 47px;
  display: grid;
  place-items: center;
  gap: .1rem;
  padding: .25rem;
  border: 0;
  border-right: 1px solid rgba(155, 179, 194, .14);
  border-bottom: 1px solid rgba(155, 179, 194, .14);
  color: #aeb9c1;
  background: rgba(3, 10, 15, .72);
  font-size: .58rem;
  cursor: pointer;
}
.quick-grid button:nth-child(4n) { border-right: 0; }
.quick-grid button:nth-last-child(-n+4) { border-bottom: 0; }
.quick-grid button:hover { color: #fff; background: #10222f; }
.quick-grid button span { font-size: 1rem; }
.quick-message { min-height: 1.2em; margin: .35rem 0 0; color: var(--gold); font-size: .6rem; }

.knowledge-band {
  width: min(var(--max), calc(100% - 2rem));
  margin: .8rem auto 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 2rem;
  padding: 1.25rem 1.5rem;
  border: 1px solid var(--line);
  background: linear-gradient(90deg, rgba(9, 24, 35, .96), rgba(4, 12, 18, .96));
}
.eyebrow { margin: 0 0 .35rem; color: var(--gold); font-size: .68rem; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; }
.knowledge-band h2 { margin: 0; font-family: "Arial Narrow", "Roboto Condensed", sans-serif; font-size: 1.35rem; text-transform: uppercase; }
.knowledge-band p:not(.eyebrow) { margin: .25rem 0 0; color: var(--muted); font-size: .82rem; }
.knowledge-actions { display: flex; gap: .7rem; flex: 0 0 auto; }

.site-footer {
  width: min(var(--max), calc(100% - 2rem));
  min-height: 72px;
  margin: .8rem auto 0;
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  gap: 1rem;
  padding: .6rem 0;
  border-top: 1px solid var(--line);
  color: #8f9ca5;
}
.footer-brand { display: flex; align-items: center; gap: .75rem; }
.footer-brand img { width: 58px; height: 58px; object-fit: contain; }
.footer-brand strong, .footer-brand small { display: block; }
.footer-brand strong { color: #d4dce1; font-size: .76rem; }
.footer-brand small { font-size: .6rem; }
.footer-claim { margin: 0; color: #c6cfd5; font-size: .76rem; font-weight: 750; letter-spacing: .055em; text-align: center; text-transform: uppercase; }
.footer-claim span { color: #8b99a3; }
.footer-claim em { color: var(--red-bright); font-style: normal; }
.footer-links { display: flex; justify-content: flex-end; align-items: center; gap: 1rem; font-size: .6rem; }
.footer-links button { border: 0; color: #aeb9c1; background: none; cursor: pointer; }
.footer-links button:hover { color: #fff; }

.join-dialog {
  width: min(980px, calc(100% - 1.25rem));
  max-height: calc(100vh - 2rem);
  padding: 0;
  border: 1px solid #425766;
  color: var(--ink);
  background: #06111a;
  box-shadow: 0 35px 100px #000;
}
.join-dialog::backdrop { background: rgba(0, 3, 6, .82); backdrop-filter: blur(7px); }
.dialog-shell { position: relative; max-height: calc(100vh - 2rem); overflow-y: auto; padding: clamp(1rem, 4vw, 2.6rem); }
.dialog-close {
  position: sticky;
  top: .25rem;
  z-index: 3;
  float: right;
  width: 42px;
  height: 42px;
  border: 1px solid var(--line);
  color: #fff;
  background: #0b1b26;
  font-size: 1.6rem;
  line-height: 1;
  cursor: pointer;
}
.dialog-close:hover { border-color: var(--red); }
.dialog-header { max-width: 720px; margin: 0 auto 1.6rem; text-align: center; }
.dialog-header h2 { margin: 0; font-family: "Arial Narrow", "Roboto Condensed", sans-serif; font-size: clamp(1.8rem, 4vw, 3rem); text-transform: uppercase; }
.dialog-header > p:last-child { color: var(--muted); }
.orientation-progress { display: flex; align-items: center; justify-content: center; margin-bottom: 1.6rem; }
.progress-item { display: flex; align-items: center; gap: .45rem; color: var(--dim); font-size: .7rem; font-weight: 800; text-transform: uppercase; }
.progress-item b { width: 29px; height: 29px; display: grid; place-items: center; border: 1px solid #425766; border-radius: 50%; }
.progress-item.is-active, .progress-item.is-complete { color: #fff; }
.progress-item.is-active b { border-color: var(--red-bright); background: var(--red); }
.progress-item.is-complete b { background: #213848; }
.progress-line { width: clamp(24px, 7vw, 85px); height: 1px; margin: 0 .7rem; background: #304654; }
.wizard-step { display: none; margin: 0; padding: 0; border: 0; }
.wizard-step.is-active { display: block; animation: fade-in .25s ease; }
.wizard-step legend { width: 100%; margin-bottom: 1rem; text-align: center; font-size: 1.15rem; font-weight: 750; }
.choice-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: .8rem; }
.choice {
  min-height: 130px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: .3rem;
  padding: .85rem;
  border: 1px solid #29404f;
  color: #e7edf1;
  background: #030b11;
  text-align: center;
  cursor: pointer;
}
.choice:hover, .choice:focus-visible { border-color: #7d939f; background: #0e2130; }
.choice.is-selected { border-color: var(--red-bright); background: linear-gradient(145deg, rgba(94, 19, 15, .5), #0a1822); }
.choice > span { color: var(--red-bright); font-size: 1.5rem; }
.choice strong { font-size: .92rem; text-transform: uppercase; }
.choice small { color: var(--muted); font-size: .76rem; }
.wizard-actions, .recommendation-actions, .contact-actions { display: flex; flex-wrap: wrap; align-items: center; gap: .7rem; margin-top: 1rem; }
.wizard-actions p { margin: 0; color: var(--muted); }
.recommendation { padding: 1.4rem; border-left: 3px solid var(--red); background: #030b11; }
.recommendation h3 { margin: 0 0 .4rem; font-size: 1.35rem; text-transform: uppercase; }
.recommendation > p:not(.eyebrow) { color: #c2cdd4; }
.summary-box { display: grid; gap: .35rem; margin: 1rem 0; color: #b9c5cc; font-size: .88rem; }
.summary-box span { display: flex; gap: .7rem; }
.summary-box b { min-width: 90px; color: #fff; }
.contact-form { margin-top: 1.2rem; padding: 1.4rem; border: 1px solid var(--line); background: #081721; }
.contact-heading h3 { margin: 0; font-size: 1.3rem; text-transform: uppercase; }
.contact-heading > p:last-child { color: var(--muted); }
.contact-form label { display: block; margin: .85rem 0 .3rem; font-size: .86rem; font-weight: 750; }
.contact-form label span { color: var(--muted); font-weight: 400; }
.contact-form input, .contact-form select, .contact-form textarea {
  width: 100%;
  min-height: 46px;
  padding: .7rem .85rem;
  border: 1px solid #344b5a;
  border-radius: 1px;
  color: #fff;
  background: #02080c;
}
.contact-form textarea { resize: vertical; }
.contact-form input:focus, .contact-form select:focus, .contact-form textarea:focus { outline: 2px solid rgba(250, 57, 47, .45); border-color: var(--red-bright); }
.contact-result { margin-top: 1.2rem; padding-top: 1rem; border-top: 1px solid var(--line); }
.contact-result pre { max-height: 260px; overflow: auto; padding: .9rem; border: 1px solid #2d4453; color: #d5dfe5; background: #02070b; white-space: pre-wrap; word-break: break-word; font-family: Consolas, "Courier New", monospace; font-size: .8rem; }
#copy-status { min-height: 1.2em; color: var(--green); font-size: .8rem; }

@keyframes fade-in { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }

@media (max-width: 1320px) {
  .header-top { padding-left: 10.5rem; }
  .brand img { width: 145px; height: 145px; }
  .site-nav { padding-left: 10rem; gap: 1.15rem; }
  .site-nav a, .site-nav button { font-size: .68rem; }
  .feature-strip { grid-template-columns: repeat(3, 1fr); }
  .feature-strip a, .feature-strip button { min-height: 80px; border-bottom: 1px solid var(--line); }
  .feature-strip > :nth-child(3), .feature-strip > :nth-child(6) { border-right: 0; }
  .feature-strip > :nth-child(n+4) { border-bottom: 0; }
  .command-grid { grid-template-columns: 1.1fr .72fr 1.8fr; }
  .right-stack { grid-column: 1 / -1; grid-template-columns: 1.4fr 1fr; grid-template-rows: auto; }
}

@media (max-width: 980px) {
  html { scroll-padding-top: 76px; }
  .site-header { position: sticky; }
  .header-top { min-height: 72px; padding: .45rem 1rem .45rem 5.3rem; }
  .brand img { top: .25rem; left: .55rem; width: 76px; height: 76px; }
  .brand strong { font-size: 1.15rem; }
  .brand small { display: none; }
  .status-badge, .social-links { display: none; }
  .menu-toggle { width: 46px; height: 42px; display: grid; place-content: center; gap: 5px; border: 1px solid var(--line); background: #07141e; cursor: pointer; }
  .menu-toggle > span:not(.sr-only) { width: 23px; height: 2px; display: block; background: #fff; }
  .site-nav { position: fixed; inset: 72px 0 auto; display: none; max-height: calc(100vh - 72px); overflow-y: auto; padding: 1rem; background: rgba(2, 7, 11, .99); }
  .site-nav.is-open { display: grid; grid-template-columns: repeat(2, 1fr); gap: 0; }
  .site-nav a, .site-nav button { min-height: 45px; padding: .5rem .8rem; border-bottom: 1px solid var(--line); font-size: .78rem; }
  .hero { min-height: 380px; }
  .hero-center { min-height: 380px; grid-template-columns: 135px 255px; }
  .hero-logo { width: 255px; height: 255px; }
  .hero-actions { bottom: 1rem; transform: translateX(-6%); }
  .command-grid { grid-template-columns: 1fr 1fr; }
  .news-card, .status-card { min-height: 350px; }
  .right-stack { grid-column: 1 / -1; }
  .site-footer { grid-template-columns: 1fr; text-align: center; }
  .footer-brand { justify-content: center; }
  .footer-links { justify-content: center; }
}

@media (max-width: 660px) {
  .site-nav.is-open { grid-template-columns: 1fr; }
  .hero { min-height: 530px; }
  .hero-scene { width: 100%; height: 54%; }
  .hero-wows { inset: 0 0 auto; background-position: 27% center; }
  .hero-overlay { background: linear-gradient(180deg, rgba(2,7,11,.12), rgba(2,7,11,.89) 40%, rgba(2,7,11,.89) 61%, rgba(2,7,11,.15)); }
  .hero-center { min-height: 530px; grid-template-columns: 105px 210px; padding-bottom: 4.3rem; }
  .hero-logo { width: 210px; height: 210px; }
  .hero-claim { font-size: .72rem; }
  .hero-claim strong { font-size: .96rem; }
  .hero-actions { width: min(360px, calc(100% - 1rem)); left: 50%; bottom: .75rem; transform: translateX(-50%); }
  .hero-actions .button { flex: 1; padding-inline: .5rem; }
  .feature-strip { width: 100%; grid-template-columns: repeat(2, 1fr); border-inline: 0; }
  .feature-strip a, .feature-strip button { min-height: 80px; padding: .7rem; }
  .feature-strip > :nth-child(odd) { border-right: 1px solid var(--line); }
  .feature-strip > :nth-child(even) { border-right: 0; }
  .feature-strip > :nth-child(n+4) { border-bottom: 1px solid var(--line); }
  .feature-strip > :nth-last-child(-n+2) { border-bottom: 0; }
  .feature-icon { min-width: 34px; font-size: 1.65rem; }
  .feature-strip strong { font-size: .76rem; }
  .feature-strip small { font-size: .65rem; }
  .command-grid { width: calc(100% - 1rem); grid-template-columns: 1fr; }
  .right-stack { grid-column: auto; grid-template-columns: 1fr; }
  .game-card { min-height: 410px; }
  .knowledge-band { width: calc(100% - 1rem); align-items: stretch; flex-direction: column; }
  .knowledge-actions { flex-direction: column; }
  .site-footer { width: calc(100% - 1rem); }
  .footer-claim { font-size: .7rem; }
  .footer-links { flex-wrap: wrap; }
  .choice-grid { grid-template-columns: 1fr; }
  .choice { min-height: 100px; }
  .progress-item { flex-direction: column; gap: .2rem; text-align: center; font-size: .58rem; }
  .progress-line { margin-top: 14px; }
  .summary-box span { flex-direction: column; gap: 0; }
}

@media (max-width: 390px) {
  .brand strong { font-size: .98rem; }
  .header-top { padding-left: 4.8rem; }
  .brand img { width: 68px; height: 68px; }
  .hero-center { grid-template-columns: 92px 185px; }
  .hero-logo { width: 185px; height: 185px; }
  .hero-claim { font-size: .64rem; }
  .quick-grid { grid-template-columns: repeat(2, 1fr); }
  .quick-grid button:nth-child(2n) { border-right: 0; }
  .quick-grid button:nth-child(odd) { border-right: 1px solid rgba(155,179,194,.14); }
  .quick-grid button:nth-last-child(-n+4) { border-bottom: 1px solid rgba(155,179,194,.14); }
  .quick-grid button:nth-last-child(-n+2) { border-bottom: 0; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
}

/* Community page */
.community-page {
  background:
    radial-gradient(circle at 50% 18%, rgba(30, 69, 93, .2), transparent 36rem),
    linear-gradient(180deg, #07121b 0, #02070b 46rem, #03090e 100%);
}
.community-page main small { font-size: .75rem; }

.community-hero {
  position: relative;
  isolation: isolate;
  min-height: 330px;
  overflow: hidden;
  border-bottom: 1px solid rgba(155, 179, 194, .24);
  background: #06111a;
}
.community-hero-scene {
  position: absolute;
  inset-block: 0;
  width: 57%;
  background-repeat: no-repeat;
  background-size: cover;
}
.community-scene-wows {
  left: 0;
  background-image: url("assets/hero-wows.png");
  background-position: 25% 52%;
}
.community-hero-shade {
  position: absolute;
  inset: 0;
  z-index: 1;
  background:
    linear-gradient(90deg, rgba(2, 7, 11, .1), rgba(3, 10, 15, .92) 37%, rgba(3, 10, 15, .94) 63%, rgba(2, 7, 11, .12)),
    linear-gradient(180deg, rgba(2, 7, 11, .02), rgba(2, 7, 11, .18) 58%, rgba(2, 7, 11, .86));
}
.community-hero-content {
  position: relative;
  z-index: 2;
  width: min(900px, calc(100% - 2rem));
  min-height: 330px;
  margin: auto;
  display: grid;
  grid-template-columns: 145px 1fr;
  align-items: center;
  gap: 1.2rem;
  padding: 1.1rem 0 1.4rem;
}
.community-hero-logo {
  width: 145px;
  height: 145px;
  object-fit: contain;
  filter: drop-shadow(0 14px 28px #000);
}
.community-hero-copy { text-align: center; text-shadow: 0 3px 14px #000; }
.community-kicker {
  margin: 0;
  color: #d9e0e4;
  font-family: "Arial Narrow", "Roboto Condensed", "Segoe UI", sans-serif;
  font-size: 1.15rem;
  font-weight: 700;
  letter-spacing: .12em;
  text-transform: uppercase;
}
.community-hero h1 {
  margin: .1rem 0;
  color: #eef2f4;
  font-family: Impact, "Arial Narrow", "Roboto Condensed", sans-serif;
  font-size: clamp(3.25rem, 6.2vw, 5.8rem);
  font-weight: 500;
  line-height: .98;
  letter-spacing: .06em;
  text-transform: uppercase;
  text-shadow: 0 4px 0 #45515a, 0 8px 18px #000;
}
.community-motto {
  margin: .45rem 0 .55rem;
  color: var(--red-bright);
  font-family: "Arial Narrow", "Roboto Condensed", "Segoe UI", sans-serif;
  font-size: 1.02rem;
  font-weight: 800;
  letter-spacing: .12em;
  text-transform: uppercase;
}
.community-hero-copy > p:last-of-type {
  margin: 0 auto;
  color: #d2dbe0;
  font-size: .95rem;
  line-height: 1.55;
}
.community-hero-actions {
  display: flex;
  justify-content: center;
  gap: .75rem;
  margin-top: 1rem;
}

.community-value-strip {
  width: min(var(--max), calc(100% - 2rem));
  min-height: 78px;
  margin: -1px auto 0;
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  border: 1px solid var(--line);
  background: rgba(5, 14, 21, .98);
  box-shadow: var(--shadow);
}
.community-value-strip > div {
  min-width: 0;
  display: flex;
  align-items: center;
  gap: .75rem;
  padding: .7rem .85rem;
  border-right: 1px solid var(--line);
}
.community-value-strip > div:last-child { border-right: 0; }
.community-value-strip > div > span {
  flex: 0 0 auto;
  color: #c6d0d6;
  font-size: 1.65rem;
  text-shadow: 0 2px 8px #000;
}
.community-value-strip p { min-width: 0; margin: 0; }
.community-value-strip strong,
.community-value-strip small { display: block; }
.community-value-strip strong {
  color: #e3e9ec;
  font-size: .76rem;
  letter-spacing: .035em;
  line-height: 1.2;
  text-transform: uppercase;
}
.community-value-strip small {
  margin-top: .2rem;
  color: var(--muted);
  font-size: .7rem;
  line-height: 1.25;
}

.community-board {
  width: min(var(--max), calc(100% - 2rem));
  margin: .8rem auto 0;
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  gap: .75rem;
  align-items: stretch;
}
.community-card {
  min-width: 0;
  display: flex;
  flex-direction: column;
  padding: .9rem;
  border: 1px solid var(--line);
  background: linear-gradient(145deg, rgba(7, 20, 29, .98), rgba(3, 10, 15, .98));
  box-shadow: 0 12px 28px rgba(0, 0, 0, .24);
}
.community-card > header {
  min-height: 32px;
  display: flex;
  align-items: center;
  gap: .55rem;
  margin-bottom: .7rem;
  padding-bottom: .55rem;
  border-bottom: 1px solid var(--line);
}
.community-card > header > span { color: var(--red-bright); font-size: 1.15rem; }
.community-card > header h2 {
  margin: 0;
  font-family: "Arial Narrow", "Roboto Condensed", "Segoe UI", sans-serif;
  font-size: .9rem;
  letter-spacing: .045em;
  line-height: 1.15;
  text-transform: uppercase;
}
.community-card > p {
  margin: 0;
  color: #c2cdd3;
  font-size: .86rem;
  line-height: 1.55;
}
.community-card-action {
  width: 100%;
  min-height: 36px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: .5rem;
  margin-top: auto;
  padding: .45rem .6rem;
  border: 1px solid rgba(155, 179, 194, .28);
  color: #d2dbe0;
  background: rgba(3, 10, 15, .88);
  font-size: .8rem;
  font-weight: 750;
  letter-spacing: .035em;
  text-transform: uppercase;
  cursor: pointer;
}
.community-card-action:hover { border-color: var(--red); color: #fff; background: #0c1c27; }
.community-card-action span { color: var(--red-bright); font-size: 1rem; }

.community-welcome { grid-column: 1 / 3; min-height: 348px; }
.community-onboarding { grid-column: 3 / 5; min-height: 348px; }
.community-rules { grid-column: 5 / 8; min-height: 348px; }
.community-team { grid-column: 8 / 11; min-height: 348px; }
.community-rail { grid-column: 11 / 13; grid-row: 1 / 3; min-width: 0; display: grid; grid-template-rows: auto 1fr; gap: .75rem; }
.community-members { grid-column: 1 / 5; min-height: 270px; }
.community-games { grid-column: 5 / 9; min-height: 270px; }
.community-announcements { grid-column: 9 / 11; min-height: 270px; }

.community-steps { display: grid; gap: .2rem; margin: 0 0 .8rem; padding: 0; list-style: none; }
.community-steps li {
  display: grid;
  grid-template-columns: 32px 1fr;
  align-items: center;
  gap: .55rem;
  padding: .55rem 0;
  border-bottom: 1px solid rgba(155, 179, 194, .14);
}
.community-steps li > b {
  width: 30px;
  height: 30px;
  display: grid;
  place-items: center;
  border: 1px solid var(--red);
  color: #fff;
  font-size: .8rem;
}
.community-steps strong,
.community-steps small { display: block; }
.community-steps strong { font-size: .78rem; }
.community-steps small { color: var(--muted); font-size: .7rem; line-height: 1.25; }

.community-link-list { margin: 0; padding: 0; list-style: none; }
.community-link-list li {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .7rem;
  min-height: 39px;
  padding: .4rem .15rem;
  border-bottom: 1px solid rgba(155, 179, 194, .14);
  color: #cbd4da;
  font-size: .8rem;
}
.community-link-list b { color: #aebbc3; font-size: 1.1rem; }
.community-note { margin-top: .65rem !important; color: var(--dim) !important; font-size: .72rem !important; line-height: 1.35 !important; }

.role-list { display: grid; margin-bottom: .8rem; }
.role-list > div {
  min-height: 52px;
  display: grid;
  grid-template-columns: 34px 1fr;
  align-items: center;
  gap: .55rem;
  padding: .3rem 0;
  border-bottom: 1px solid rgba(155, 179, 194, .14);
}
.role-list > div > span {
  width: 30px;
  height: 30px;
  display: grid;
  place-items: center;
  border: 1px solid rgba(155, 179, 194, .3);
  border-radius: 50%;
  color: #d6dde1;
  background: #081722;
}
.role-list p { margin: 0; }
.role-list strong,
.role-list small { display: block; }
.role-list strong { color: var(--red-bright); font-size: .76rem; text-transform: uppercase; }
.role-list small { color: var(--muted); font-size: .7rem; }

.community-service-list { display: grid; }
.community-service-list > div {
  display: grid;
  grid-template-columns: 30px 1fr auto;
  align-items: center;
  gap: .5rem;
  padding: .65rem 0;
  border-bottom: 1px solid rgba(155, 179, 194, .14);
}
.community-service-list > div > span { color: #c8d1d7; font-size: 1.25rem; }
.community-service-list p { margin: 0; }
.community-service-list strong,
.community-service-list small { display: block; }
.community-service-list strong { font-size: .75rem; text-transform: uppercase; }
.community-service-list small { color: var(--muted); font-size: .68rem; }
.community-service-list b { color: var(--green); font-size: .67rem; text-transform: uppercase; }

.community-event-list { display: grid; }
.community-event-list > div {
  display: grid;
  grid-template-columns: 48px 1fr;
  align-items: center;
  gap: .6rem;
  padding: .6rem 0;
  border-bottom: 1px solid rgba(155, 179, 194, .14);
}
.community-event-list > div > span {
  width: 44px;
  height: 44px;
  display: grid;
  place-items: center;
  border: 1px solid var(--red);
}
.community-event-list > div > span b { font-size: 1rem; line-height: .8; }
.community-event-list > div > span small { color: var(--muted); font-size: .58rem; text-transform: uppercase; }
.community-event-list p { margin: 0; }
.community-event-list strong,
.community-event-list p small { display: block; }
.community-event-list strong { font-size: .75rem; }
.community-event-list p small { color: var(--muted); font-size: .68rem; line-height: 1.3; }

.community-tool-grid {
  flex: 1;
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  border: 1px solid rgba(155, 179, 194, .17);
}
.community-tool-grid a,
.community-tool-grid button {
  min-width: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: .25rem;
  padding: .7rem .45rem;
  border: 0;
  border-right: 1px solid rgba(155, 179, 194, .16);
  color: #d5dde2;
  background: rgba(3, 10, 15, .74);
  text-align: center;
  text-decoration: none;
  cursor: pointer;
}
.community-tool-grid > :last-child { border-right: 0; }
.community-tool-grid a:hover,
.community-tool-grid button:hover { background: #10222f; }
.community-tool-grid a > span,
.community-tool-grid button > span { color: #c6d0d6; font-size: 1.45rem; }
.community-tool-grid strong { font-size: .72rem; text-transform: uppercase; }
.community-tool-grid small { color: var(--muted); font-size: .65rem; line-height: 1.25; }

.community-game-grid { flex: 1; display: grid; grid-template-columns: 1fr 1fr; gap: .65rem; }
.community-game-tile {
  position: relative;
  isolation: isolate;
  min-height: 210px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  overflow: hidden;
  padding: .75rem;
  border: 1px solid rgba(155, 179, 194, .25);
  color: #fff;
  background-position: center;
  background-size: cover;
  text-decoration: none;
}
.community-game-tile::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background: linear-gradient(180deg, rgba(2, 7, 11, .1), rgba(2, 7, 11, .88));
}
.community-game-tile:hover { border-color: var(--red-bright); }
.game-tile-wows { background-image: url("assets/hero-wows.png"); background-position: 27% center; }
.community-game-tile > span { align-self: center; color: #e1e6e9; font-size: 2rem; text-shadow: 0 3px 10px #000; }
.community-game-tile div { text-align: center; text-shadow: 0 2px 8px #000; }
.community-game-tile strong,
.community-game-tile small,
.community-game-tile em { display: block; }
.community-game-tile strong { font-size: .78rem; text-transform: uppercase; }
.community-game-tile small { margin-top: .2rem; color: #e0e5e8; font-size: .72rem; }
.community-game-tile em { margin-top: .55rem; padding-top: .4rem; border-top: 1px solid rgba(255, 255, 255, .3); color: #eaf0f3; font-size: .68rem; font-style: normal; text-transform: uppercase; }

.announcement-list { display: grid; }
.announcement-list > div {
  display: grid;
  grid-template-columns: 34px 1fr;
  gap: .55rem;
  padding: .55rem 0;
  border-bottom: 1px solid rgba(155, 179, 194, .14);
}
.announcement-list > div > span {
  width: 30px;
  height: 30px;
  display: grid;
  place-items: center;
  border: 1px solid rgba(155, 179, 194, .26);
  color: #cbd4da;
}
.announcement-list p { margin: 0; }
.announcement-list strong,
.announcement-list small { display: block; }
.announcement-list strong { font-size: .74rem; }
.announcement-list small { margin-top: .15rem; color: var(--muted); font-size: .67rem; line-height: 1.35; }
.community-footer { margin-top: .9rem; }

@media (max-width: 1320px) {
  .community-value-strip { grid-template-columns: repeat(3, 1fr); }
  .community-value-strip > div { min-height: 72px; border-bottom: 1px solid var(--line); }
  .community-value-strip > div:nth-child(3n) { border-right: 0; }
  .community-value-strip > div:nth-child(n+4) { border-bottom: 0; }
  .community-board { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .community-welcome,
  .community-onboarding,
  .community-rules,
  .community-team,
  .community-members,
  .community-games,
  .community-announcements,
  .community-rail { grid-column: auto; grid-row: auto; }
  .community-rail { grid-template-rows: auto auto; }
  .community-members,
  .community-games { grid-column: 1 / -1; }
}

@media (max-width: 760px) {
  .community-hero { min-height: 500px; }
  .community-hero-scene { width: 100%; height: 55%; }
  .community-scene-wows { inset: 0 0 auto; }
  .community-hero-shade {
    background: linear-gradient(180deg, rgba(2,7,11,.1), rgba(2,7,11,.93) 35%, rgba(2,7,11,.94) 68%, rgba(2,7,11,.12));
  }
  .community-hero-content {
    min-height: 500px;
    grid-template-columns: 95px 1fr;
    gap: .5rem;
    padding: 1rem 0 1.2rem;
  }
  .community-hero-logo { width: 95px; height: 95px; }
  .community-hero h1 { font-size: clamp(2.8rem, 14vw, 4.8rem); }
  .community-kicker { font-size: .85rem; }
  .community-motto { font-size: .78rem; letter-spacing: .08em; }
  .community-hero-copy > p:last-of-type { font-size: .82rem; }
  .community-hero-actions { flex-direction: column; }
  .community-value-strip { width: 100%; grid-template-columns: 1fr 1fr; border-inline: 0; }
  .community-value-strip > div,
  .community-value-strip > div:nth-child(3n) { border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); }
  .community-value-strip > div:nth-child(even) { border-right: 0; }
  .community-value-strip > div:nth-last-child(-n+2) { border-bottom: 0; }
  .community-board { width: calc(100% - 1rem); grid-template-columns: 1fr; }
  .community-welcome,
  .community-onboarding,
  .community-rules,
  .community-team,
  .community-members,
  .community-games,
  .community-announcements,
  .community-rail { grid-column: 1; min-height: auto; }
  .community-tool-grid { grid-template-columns: repeat(2, 1fr); }
  .community-tool-grid > :nth-child(2n) { border-right: 0; }
  .community-tool-grid > :nth-child(-n+4) { border-bottom: 1px solid rgba(155, 179, 194, .16); }
  .community-game-grid { grid-template-columns: 1fr; }
}

@media (max-width: 430px) {
  .community-hero-content { width: calc(100% - 1rem); grid-template-columns: 1fr; align-content: center; }
  .community-hero-logo { width: 88px; height: 88px; margin: 0 auto -.4rem; }
  .community-hero-copy > p:last-of-type br { display: none; }
  .community-value-strip { grid-template-columns: 1fr; }
  .community-value-strip > div,
  .community-value-strip > div:nth-child(even),
  .community-value-strip > div:nth-child(3n),
  .community-value-strip > div:nth-last-child(-n+2) { border-right: 0; border-bottom: 1px solid var(--line); }
  .community-value-strip > div:last-child { border-bottom: 0; }
  .community-tool-grid { grid-template-columns: 1fr; }
  .community-tool-grid > * { border-right: 0 !important; border-bottom: 1px solid rgba(155, 179, 194, .16); }
  .community-tool-grid > :last-child { border-bottom: 0; }
}

/* World of Warships page */
.game-card .game-page-link {
  width: 100%;
  min-height: 31px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: .5rem;
  border: 1px solid rgba(213, 225, 233, .35);
  color: #fff;
  background: rgba(4, 36, 68, .86);
  font-size: .7rem;
  font-weight: 750;
  text-decoration: none;
  text-transform: uppercase;
}
.game-card .game-page-link:hover { border-color: var(--red-bright); }

.wows-page {
  background:
    radial-gradient(circle at 40% 16%, rgba(21, 67, 99, .22), transparent 35rem),
    linear-gradient(180deg, #07131d 0, #02070b 44rem, #030a0f 100%);
}
.wows-page main small { font-size: .75rem; }

.wows-hero {
  position: relative;
  isolation: isolate;
  min-height: 360px;
  overflow: hidden;
  border-bottom: 1px solid rgba(155, 179, 194, .23);
  background: #07131d url("assets/imre-hero-bismarck-hood-prinz-eugen.png") center / cover no-repeat;
}
.wows-hero-shade {
  position: absolute;
  inset: 0;
  z-index: 1;
  background:
    linear-gradient(90deg, rgba(1, 7, 12, .12), rgba(3, 10, 15, .72) 38%, rgba(3, 10, 15, .8) 70%, rgba(1, 7, 12, .5)),
    linear-gradient(180deg, rgba(2, 7, 11, .02), rgba(2, 7, 11, .12) 52%, rgba(2, 7, 11, .88));
}
.wows-hero-layout {
  position: relative;
  z-index: 2;
  width: min(var(--max), calc(100% - 2rem));
  min-height: 360px;
  margin: auto;
  display: grid;
  grid-template-columns: minmax(0, 1fr) 285px;
  align-items: center;
  gap: 1rem;
  padding: 1rem 0;
}
.wows-hero-center {
  min-width: 0;
  display: grid;
  grid-template-columns: 120px minmax(0, 770px);
  align-items: center;
  justify-content: center;
  gap: 1rem;
  padding-left: 7rem;
}
.wows-hero-logo {
  width: 120px;
  height: 120px;
  object-fit: contain;
  filter: drop-shadow(0 16px 28px #000);
}
.wows-hero-copy { text-align: center; text-shadow: 0 3px 14px #000; }
.wows-kicker {
  margin: 0;
  color: #dce4e8;
  font-family: "Arial Narrow", "Roboto Condensed", "Segoe UI", sans-serif;
  font-size: 1rem;
  font-weight: 800;
  letter-spacing: .16em;
  text-transform: uppercase;
}
.wows-hero h1 {
  margin: .15rem 0;
  color: #eff3f5;
  font-family: Impact, "Arial Narrow", "Roboto Condensed", sans-serif;
  font-size: clamp(3rem, 5.3vw, 5.5rem);
  font-weight: 500;
  line-height: 1;
  letter-spacing: .035em;
  text-transform: uppercase;
  text-shadow: 0 4px 0 #495761, 0 9px 22px #000;
}
.wows-subtitle {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 1rem;
  margin: .3rem 0;
  color: #c9d2d8;
  font-family: "Arial Narrow", "Roboto Condensed", sans-serif;
  font-size: 1rem;
  font-weight: 800;
  letter-spacing: .18em;
  text-transform: uppercase;
}
.wows-subtitle::before,
.wows-subtitle::after { content: ""; width: 72px; height: 2px; background: var(--red); }
.wows-subtitle span { color: #e3e9ec; font-size: .7rem; }
.wows-hero-copy > strong { display: block; margin-top: .3rem; color: #e4eaed; font-size: .93rem; }
.wows-hero-copy > p:last-of-type { max-width: 720px; margin: .35rem auto 0; color: #c2ced5; font-size: .86rem; line-height: 1.5; }
.wows-hero-actions { display: flex; justify-content: center; gap: .7rem; margin-top: .9rem; }

.wows-voice-panel {
  align-self: stretch;
  display: flex;
  flex-direction: column;
  padding: .85rem;
  border: 1px solid rgba(155, 179, 194, .28);
  background: rgba(3, 12, 18, .9);
  box-shadow: 0 16px 30px rgba(0, 0, 0, .34);
}
.wows-voice-panel > header {
  display: flex;
  align-items: center;
  gap: .55rem;
  padding-bottom: .55rem;
  border-bottom: 1px solid var(--line);
}
.wows-voice-panel > header > span { color: #cbd4d9; font-size: 1.4rem; }
.wows-voice-panel h2 { margin: 0; font-size: .82rem; letter-spacing: .045em; text-transform: uppercase; }
.wows-voice-service {
  display: grid;
  grid-template-columns: 30px 1fr;
  align-items: center;
  gap: .5rem;
  padding: .7rem 0;
}
.wows-voice-service > span { color: #c7d1d7; font-size: 1.3rem; text-align: center; }
.wows-voice-service p { margin: 0; }
.wows-voice-service strong,
.wows-voice-service small { display: block; }
.wows-voice-service strong { font-size: .76rem; text-transform: uppercase; }
.wows-voice-service small { color: var(--muted); }
.wows-voice-panel > button {
  min-height: 36px;
  border: 1px solid #d93a30;
  color: #fff;
  background: linear-gradient(180deg, #ad271f, #66110d);
  font-size: .7rem;
  font-weight: 750;
  text-transform: uppercase;
  cursor: pointer;
}
.wows-voice-panel > button.is-secondary { border-color: rgba(155, 179, 194, .4); background: #0a1b27; }
.wows-voice-panel > button:hover { border-color: #fff; }
.wows-voice-panel > p { margin: auto 0 0; padding-top: .55rem; color: var(--dim); font-size: .72rem; }

.wows-feature-grid {
  width: min(var(--max), calc(100% - 2rem));
  margin: .75rem auto 0;
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: .65rem;
}
.wows-feature-grid > article {
  min-width: 0;
  min-height: 132px;
  display: grid;
  grid-template-columns: 54px 1fr;
  grid-template-rows: 1fr auto;
  align-items: center;
  gap: .55rem .75rem;
  padding: .8rem;
  border: 1px solid var(--line);
  background: linear-gradient(145deg, rgba(8, 22, 32, .98), rgba(3, 10, 15, .98));
  box-shadow: 0 12px 25px rgba(0, 0, 0, .22);
}
.wows-feature-grid > article > span { color: #cbd4da; font-size: 2.35rem; text-align: center; }
.wows-feature-grid h2 { margin: 0 0 .2rem; font-size: .84rem; letter-spacing: .035em; text-transform: uppercase; }
.wows-feature-grid p { margin: 0; color: var(--muted); font-size: .75rem; line-height: 1.35; }
.wows-feature-grid article > a,
.wows-feature-grid article > button {
  grid-column: 1 / -1;
  min-height: 31px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: .5rem;
  padding: .35rem .5rem;
  border: 1px solid rgba(155, 179, 194, .28);
  color: #ccd6dc;
  background: rgba(3, 10, 15, .88);
  font-size: .7rem;
  font-weight: 750;
  text-decoration: none;
  text-transform: uppercase;
  cursor: pointer;
}
.wows-feature-grid article > a:hover,
.wows-feature-grid article > button:hover { border-color: var(--red); color: #fff; }
.wows-feature-grid article > a b,
.wows-feature-grid article > button b { color: var(--red-bright); }
.wows-feature-grid .wows-class-summary { grid-template-columns: 1fr; text-align: center; }
.wows-class-summary h2 { margin: 0; }
.wows-class-summary > div { display: grid; grid-template-columns: repeat(4, 1fr); gap: .3rem; }
.wows-class-summary > div > span { display: grid; place-items: center; color: #d2dbe0; font-size: 1.25rem; }
.wows-class-summary small { display: block; margin-top: .15rem; color: var(--muted); font-size: .6rem; text-transform: uppercase; }

.wows-dashboard {
  width: min(var(--max), calc(100% - 2rem));
  margin: .75rem auto 0;
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  gap: .7rem;
  align-items: stretch;
}
.wows-panel {
  min-width: 0;
  display: flex;
  flex-direction: column;
  padding: .8rem;
  border: 1px solid var(--line);
  background: linear-gradient(145deg, rgba(7, 19, 28, .98), rgba(3, 10, 15, .98));
  box-shadow: 0 12px 26px rgba(0, 0, 0, .22);
}
.wows-panel > header {
  display: flex;
  align-items: center;
  gap: .5rem;
  min-height: 30px;
  margin-bottom: .65rem;
  padding-bottom: .5rem;
  border-bottom: 1px solid var(--line);
}
.wows-panel > header > span { color: var(--red-bright); font-size: 1rem; }
.wows-panel > header h2 { margin: 0; font-size: .85rem; letter-spacing: .04em; text-transform: uppercase; }
.wows-panel-action {
  width: 100%;
  min-height: 34px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: .5rem;
  margin-top: auto;
  padding: .4rem .55rem;
  border: 1px solid rgba(155, 179, 194, .28);
  color: #ced8dd;
  background: rgba(3, 10, 15, .88);
  font-size: .76rem;
  font-weight: 750;
  text-decoration: none;
  text-transform: uppercase;
  cursor: pointer;
}
.wows-panel-action:hover { border-color: var(--red); color: #fff; }
.wows-panel-action span { color: var(--red-bright); }

.wows-news { grid-column: 1 / 4; min-height: 440px; }
.wows-strategy { grid-column: 4 / 9; min-height: 440px; }
.wows-events { grid-column: 9 / 11; min-height: 440px; }
.wows-side-stack { grid-column: 11 / 13; min-width: 0; display: grid; grid-template-rows: 1fr 1fr; gap: .7rem; }

.wows-news-list { display: grid; }
.wows-news-list > div {
  min-height: 96px;
  display: grid;
  grid-template-columns: 90px 1fr;
  align-items: center;
  gap: .65rem;
  padding: .55rem 0;
  border-bottom: 1px solid rgba(155, 179, 194, .14);
}
.wows-news-list img { width: 90px; height: 66px; object-fit: cover; border: 1px solid rgba(155, 179, 194, .2); }
.wows-news-list > div:nth-child(2) img { object-position: 72% center; }
.wows-news-list > div:nth-child(3) img { object-fit: contain; background: #02080c; }
.wows-news-list p { margin: 0; }
.wows-news-list strong,
.wows-news-list small { display: block; }
.wows-news-list strong { color: #e1e7ea; font-size: .78rem; line-height: 1.25; }
.wows-news-list small { margin-top: .22rem; color: var(--muted); line-height: 1.35; }

.wows-guide-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: .55rem; }
.wows-guide {
  position: relative;
  isolation: isolate;
  min-height: 220px;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  overflow: hidden;
  padding: .65rem;
  border: 1px solid rgba(155, 179, 194, .24);
  background-image: url("assets/hero-wows.png");
  background-repeat: no-repeat;
  background-size: 245% auto;
  text-align: center;
}
.wows-guide::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background: linear-gradient(180deg, rgba(2, 7, 11, .06), rgba(2, 7, 11, .9) 72%);
}
.guide-position { background-position: 18% center; }
.guide-vision { background-position: 38% center; }
.guide-maneuver { background-position: 62% center; }
.guide-map { background-position: 84% center; }
.wows-guide h3 { margin: 0; font-size: .78rem; text-transform: uppercase; text-shadow: 0 2px 8px #000; }
.wows-guide p { margin: .25rem 0 .55rem; color: #d0d9de; font-size: .72rem; line-height: 1.3; text-shadow: 0 2px 7px #000; }
.wows-guide button {
  min-height: 29px;
  border: 1px solid rgba(218, 228, 234, .28);
  color: #dbe3e7;
  background: rgba(3, 12, 18, .86);
  font-size: .66rem;
  text-transform: uppercase;
  cursor: pointer;
}
.wows-guide button:hover { border-color: var(--red); }
.wows-ship-classes { margin-top: .65rem; padding-top: .55rem; border-top: 1px solid var(--line); }
.wows-ship-classes > h3 { margin: 0 0 .5rem; font-size: .8rem; letter-spacing: .04em; text-transform: uppercase; }
.wows-ship-classes > div { display: grid; grid-template-columns: repeat(4, 1fr); gap: .45rem; }
.wows-ship-classes article {
  display: grid;
  grid-template-columns: 26px 1fr;
  align-items: center;
  gap: .25rem .4rem;
  padding: .45rem;
  border: 1px solid rgba(155, 179, 194, .16);
  background: rgba(2, 9, 14, .72);
}
.wows-ship-classes article > span { grid-row: 1 / 3; color: #cbd4da; font-size: 1.15rem; }
.wows-ship-classes strong,
.wows-ship-classes small { display: block; }
.wows-ship-classes strong { font-size: .69rem; text-transform: uppercase; }
.wows-ship-classes small { color: var(--muted); font-size: .63rem; line-height: 1.25; }

.wows-event-list { display: grid; }
.wows-event-list > div {
  display: grid;
  grid-template-columns: 47px 1fr;
  align-items: center;
  gap: .5rem;
  min-height: 80px;
  padding: .45rem 0;
  border-bottom: 1px solid rgba(155, 179, 194, .14);
}
.wows-event-list > div > span { width: 43px; height: 52px; display: grid; place-items: center; border: 1px solid var(--red); }
.wows-event-list > div > span b { font-size: 1rem; line-height: .8; }
.wows-event-list > div > span small { color: var(--muted); font-size: .58rem; text-transform: uppercase; }
.wows-event-list p { margin: 0; }
.wows-event-list strong,
.wows-event-list p small { display: block; }
.wows-event-list strong { font-size: .73rem; }
.wows-event-list p small { margin-top: .15rem; color: var(--muted); line-height: 1.3; }

.wows-quick-grid { display: grid; grid-template-columns: repeat(3, 1fr); border: 1px solid rgba(155, 179, 194, .16); }
.wows-quick-grid a,
.wows-quick-grid button {
  min-width: 0;
  min-height: 58px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: .15rem;
  padding: .35rem;
  border: 0;
  border-right: 1px solid rgba(155, 179, 194, .14);
  border-bottom: 1px solid rgba(155, 179, 194, .14);
  color: #b6c1c8;
  background: rgba(3, 10, 15, .72);
  font-size: .66rem;
  text-align: center;
  text-decoration: none;
  cursor: pointer;
}
.wows-quick-grid > :nth-child(3n) { border-right: 0; }
.wows-quick-grid > :nth-last-child(-n+3) { border-bottom: 0; }
.wows-quick-grid a:hover,
.wows-quick-grid button:hover { color: #fff; background: #10222f; }
.wows-quick-grid span { font-size: 1.15rem; }
.wows-your-area ul { margin: 0 0 .7rem; padding: 0; list-style: none; }
.wows-your-area li {
  display: grid;
  grid-template-columns: 28px 1fr 12px;
  align-items: center;
  gap: .4rem;
  padding: .55rem 0;
  border-bottom: 1px solid rgba(155, 179, 194, .14);
}
.wows-your-area li > span { color: #c3cdd3; }
.wows-your-area li > p { margin: 0; }
.wows-your-area strong,
.wows-your-area small { display: block; }
.wows-your-area strong { font-size: .72rem; }
.wows-your-area small { color: var(--muted); line-height: 1.25; }
.wows-your-area li > b { color: #9eacb5; }
.wows-footer { margin-top: .8rem; }
.wows-voice-panel > button,
.wows-feature-grid article > a,
.wows-feature-grid article > button,
.wows-guide button,
.wows-quick-grid a,
.wows-quick-grid button { font-size: .75rem; }
.wows-guide p,
.wows-ship-classes strong,
.wows-news-list strong,
.wows-event-list strong,
.wows-your-area strong { font-size: .75rem; }

@media (max-width: 1440px) {
  .wows-hero-center { padding-left: 2rem; }
  .wows-feature-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .wows-class-summary { grid-column: 1 / -1; }
  .wows-dashboard { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .wows-news,
  .wows-events { grid-column: auto; }
  .wows-strategy { grid-column: 1 / -1; grid-row: 1; }
  .wows-side-stack { grid-column: 1 / -1; display: grid; grid-template-columns: 1fr 1fr; grid-template-rows: auto; }
}

@media (max-width: 1040px) {
  .wows-hero { min-height: 620px; }
  .wows-hero-layout { min-height: 620px; grid-template-columns: 1fr; align-content: center; }
  .wows-hero-center { padding-left: 0; }
  .wows-voice-panel { width: min(720px, 100%); justify-self: center; align-self: auto; }
  .wows-voice-panel > p { margin-top: .55rem; }
}

@media (max-width: 760px) {
  .wows-hero { min-height: 710px; background-position: 35% center; }
  .wows-hero-layout { min-height: 710px; width: calc(100% - 1rem); }
  .wows-hero-center { grid-template-columns: 1fr; gap: .3rem; }
  .wows-hero-logo { width: 94px; height: 94px; margin: auto; }
  .wows-hero h1 { font-size: clamp(2.7rem, 14vw, 4.5rem); }
  .wows-subtitle { gap: .45rem; font-size: .78rem; }
  .wows-subtitle::before,
  .wows-subtitle::after { width: 32px; }
  .wows-hero-actions { flex-direction: column; }
  .wows-feature-grid { width: calc(100% - 1rem); grid-template-columns: 1fr; }
  .wows-class-summary { grid-column: auto; }
  .wows-dashboard { width: calc(100% - 1rem); grid-template-columns: 1fr; }
  .wows-news,
  .wows-strategy,
  .wows-events,
  .wows-side-stack { grid-column: 1; grid-row: auto; }
  .wows-side-stack { grid-template-columns: 1fr; }
  .wows-guide-grid { grid-template-columns: 1fr 1fr; }
  .wows-ship-classes > div { grid-template-columns: 1fr 1fr; }
}

@media (max-width: 430px) {
  .wows-hero { min-height: 760px; }
  .wows-hero-layout { min-height: 760px; }
  .wows-hero-copy > p:last-of-type { font-size: .78rem; }
  .wows-feature-grid > article { grid-template-columns: 42px 1fr; }
  .wows-feature-grid > article > span { font-size: 1.8rem; }
  .wows-guide-grid,
  .wows-ship-classes > div { grid-template-columns: 1fr; }
  .wows-quick-grid { grid-template-columns: repeat(2, 1fr); }
  .wows-quick-grid > :nth-child(3n) { border-right: 1px solid rgba(155, 179, 194, .14); }
  .wows-quick-grid > :nth-child(2n) { border-right: 0; }
  .wows-quick-grid > :nth-last-child(-n+3) { border-bottom: 1px solid rgba(155, 179, 194, .14); }
  .wows-quick-grid > :last-child { border-bottom: 0; }
}

/* TeamSpeak / Voice Command Center */
.voice-page {
  background:
    radial-gradient(circle at 50% 12%, rgba(20, 55, 79, .2), transparent 36rem),
    linear-gradient(180deg, #06111a 0, #02070b 36rem, #03090e 100%);
}

.voice-hero {
  position: relative;
  isolation: isolate;
  min-height: 230px;
  overflow: hidden;
  border-bottom: 1px solid rgba(155, 179, 194, .22);
  background: #06111a;
}
.voice-hero-scene {
  position: absolute;
  inset-block: 0;
  width: 58%;
  background-repeat: no-repeat;
  background-size: cover;
}
.voice-scene-wows { left: 0; background-image: url("assets/hero-wows.png"); background-position: 30% 54%; }
.voice-hero-shade {
  position: absolute;
  inset: 0;
  z-index: 1;
  background:
    linear-gradient(90deg, rgba(2, 7, 11, .08), rgba(2, 7, 11, .9) 38%, rgba(2, 7, 11, .9) 62%, rgba(2, 7, 11, .08)),
    linear-gradient(180deg, rgba(2, 7, 11, .04), rgba(2, 7, 11, .16) 55%, rgba(2, 7, 11, .76));
}
.voice-hero-content {
  position: relative;
  z-index: 2;
  min-height: 230px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: .6rem 1rem;
  text-align: center;
  text-shadow: 0 4px 15px #000;
}
.voice-hero-content img {
  width: 82px;
  height: 82px;
  margin-bottom: -.3rem;
  object-fit: contain;
  filter: drop-shadow(0 10px 20px #000);
}
.voice-hero h1 {
  margin: 0;
  color: #eceff1;
  font-family: Impact, "Arial Narrow", "Roboto Condensed", sans-serif;
  font-size: clamp(3rem, 4.2vw, 4.25rem);
  font-weight: 500;
  line-height: 1;
  letter-spacing: .035em;
  text-transform: uppercase;
  text-shadow: 0 4px 0 #46525a, 0 9px 22px #000;
}
.voice-hero-content strong {
  margin-top: .55rem;
  color: #eef2f4;
  font-size: .9rem;
  letter-spacing: .1em;
  text-transform: uppercase;
}
.voice-hero-content p {
  margin: .35rem 0 0;
  color: #c1ccd3;
  font-size: .8rem;
  letter-spacing: .15em;
  text-transform: uppercase;
}
.voice-hero-content em { color: var(--red-bright); font-style: normal; }

.voice-intro {
  width: min(1470px, calc(100% - 2rem));
  min-height: 54px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 245px minmax(0, 1fr) auto;
  align-items: center;
  gap: 1rem;
  padding: .45rem .75rem;
  border: 1px solid var(--line);
  border-top: 0;
  background: linear-gradient(90deg, rgba(6, 20, 30, .98), rgba(4, 14, 21, .98));
}
.voice-intro-title { display: flex; align-items: center; gap: .7rem; }
.voice-intro-title > span { color: var(--red-bright); font-size: 1.35rem; }
.voice-intro h2 { margin: 0; font-size: .9rem; letter-spacing: .035em; text-transform: uppercase; }
.voice-intro > p { margin: 0; color: #bdc8cf; font-size: .76rem; line-height: 1.3; }
.voice-intro nav { display: flex; gap: .6rem; }
.voice-intro nav a,
.voice-intro nav button {
  min-width: 138px;
  min-height: 32px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .5rem;
  padding: .35rem .65rem;
  border: 1px solid rgba(155, 179, 194, .3);
  color: #e2e8eb;
  background: rgba(3, 10, 15, .82);
  font-size: .7rem;
  font-weight: 700;
  text-decoration: none;
  text-transform: uppercase;
  cursor: pointer;
}
.voice-intro nav a:hover,
.voice-intro nav button:hover { border-color: var(--red); color: #fff; }
.voice-intro nav b { color: var(--red-bright); }

.voice-dashboard {
  width: min(1470px, calc(100% - 2rem));
  margin: .65rem auto 0;
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  gap: .75rem;
}
.voice-panel {
  min-width: 0;
  display: flex;
  flex-direction: column;
  padding: .7rem;
  border: 1px solid rgba(155, 179, 194, .28);
  background: linear-gradient(145deg, rgba(7, 22, 32, .98), rgba(3, 10, 15, .98));
  box-shadow: 0 14px 28px rgba(0, 0, 0, .25);
}
.voice-panel > header {
  min-height: 32px;
  display: flex;
  align-items: center;
  gap: .55rem;
  margin-bottom: .55rem;
  padding-bottom: .45rem;
  border-bottom: 1px solid var(--line);
}
.voice-panel > header > span { color: #cbd5db; font-size: 1.25rem; }
.voice-panel > header h2 {
  margin: 0;
  font-family: "Arial Narrow", "Roboto Condensed", "Segoe UI", sans-serif;
  font-size: .88rem;
  letter-spacing: .045em;
  text-transform: uppercase;
}
.voice-panel > header > b {
  margin-left: auto;
  color: var(--green);
  font-size: .64rem;
  text-transform: uppercase;
}
.voice-panel i {
  width: 9px;
  height: 9px;
  display: inline-block;
  border: 1px solid #b6d438;
  border-radius: 50%;
  background: #789d08;
  box-shadow: 0 0 8px rgba(156, 194, 22, .4);
}

.voice-server-card { grid-column: span 3; min-height: 272px; }
.voice-server-body {
  flex: 1;
  min-height: 158px;
  display: grid;
  grid-template-columns: minmax(0, 1fr) 138px;
  align-items: center;
  gap: .7rem;
}
.voice-server-body dl { margin: 0; padding-right: .7rem; border-right: 1px solid var(--line); }
.voice-server-body dl > div { padding: .33rem 0; border-bottom: 1px solid rgba(155, 179, 194, .1); }
.voice-server-body dl > div:last-child { border-bottom: 0; }
.voice-server-body dt { color: #cbd3d8; font-size: .66rem; }
.voice-server-body dd { margin: .05rem 0 0; color: #fff; font-size: .72rem; line-height: 1.25; }
.voice-dial {
  width: 110px;
  height: 110px;
  display: grid;
  place-items: center;
  justify-self: center;
  border: 8px solid #23313a;
  border-top-color: #9bc51c;
  border-left-color: #70930b;
  border-radius: 50%;
  background: radial-gradient(circle, #0a1821 0 56%, #03090e 57%);
  box-shadow: inset 0 0 0 2px rgba(155, 179, 194, .18), 0 0 18px rgba(0, 0, 0, .45);
}
.voice-dial span { color: #a9d42a; font-size: .82rem; font-weight: 800; text-transform: uppercase; }
.voice-card-actions { display: grid; grid-template-columns: 1fr 1fr; gap: .65rem; margin-top: .55rem; }
.voice-card-actions a,
.voice-card-actions button,
.voice-wide-action {
  min-height: 34px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: .5rem;
  padding: .35rem .55rem;
  border: 1px solid rgba(170, 191, 204, .42);
  color: #e1e7ea;
  background: #081925;
  font-size: .66rem;
  font-weight: 700;
  text-align: center;
  text-decoration: none;
  text-transform: uppercase;
  cursor: pointer;
}
.voice-card-actions a:hover,
.voice-card-actions button:hover,
.voice-wide-action:hover { border-color: var(--red); color: #fff; }
.voice-card-actions span,
.voice-wide-action span { color: #dce4e8; }

.voice-overview { grid-column: span 3; min-height: 272px; }
.voice-service-list { display: grid; flex: 1; }
.voice-service-list > div {
  min-height: 35px;
  display: grid;
  grid-template-columns: 28px 1fr auto;
  align-items: center;
  gap: .45rem;
  border-bottom: 1px solid rgba(155, 179, 194, .12);
}
.voice-service-list > div > span { color: #a8c4d6; font-size: 1.05rem; text-align: center; }
.voice-service-list strong { font-size: .7rem; }
.voice-service-list b { color: var(--green); font-size: .6rem; font-weight: 700; text-transform: uppercase; }
.voice-service-list i { width: 8px; height: 8px; margin-left: .25rem; }
.voice-overview > p { margin: .55rem 0 0; color: var(--dim); font-size: .62rem; }

.voice-audiobots { grid-column: 1 / 5; min-height: 228px; }
.voice-welcome { grid-column: 5 / 9; min-height: 228px; }
.voice-quick { grid-column: 9 / 13; min-height: 228px; }
.voice-bot-grid { display: grid; grid-template-columns: 1fr 1fr; gap: .75rem; flex: 1; }
.voice-bot-grid section {
  min-width: 0;
  display: grid;
  grid-template-columns: 48px 1fr;
  grid-template-rows: auto 1fr auto;
  gap: .45rem .55rem;
  padding-right: .7rem;
  border-right: 1px solid var(--line);
}
.voice-bot-grid section:last-child { padding-right: 0; border-right: 0; }
.voice-bot-grid img { width: 48px; height: 48px; grid-row: 1 / 3; object-fit: contain; }
.voice-bot-grid h3 { margin: 0; font-size: .72rem; }
.voice-bot-grid b { color: var(--green); font-size: .58rem; font-weight: 700; text-transform: uppercase; }
.voice-bot-grid b i { width: 7px; height: 7px; margin-left: .2rem; }
.voice-bot-grid p { grid-column: 1 / -1; margin: 0; color: #bcc7ce; font-size: .66rem; line-height: 1.35; }
.voice-bot-grid button {
  grid-column: 1 / -1;
  min-height: 31px;
  border: 1px solid rgba(155, 179, 194, .34);
  color: #e3e9ec;
  background: #071721;
  font-size: .62rem;
  text-transform: uppercase;
  cursor: pointer;
}
.voice-bot-grid button:hover { border-color: var(--red); }

.voice-welcome > p { margin: 0 0 .65rem; color: #bdc8cf; font-size: .7rem; line-height: 1.35; }
.voice-welcome-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: .45rem; flex: 1; }
.voice-welcome-grid > div { display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; }
.voice-welcome-grid > div > span { color: #d1d9de; font-size: 1.25rem; }
.voice-welcome-grid strong { margin-top: .25rem; font-size: .64rem; }
.voice-welcome-grid small { margin-top: .12rem; color: var(--muted); font-size: .58rem; line-height: 1.25; }
.voice-wide-action { width: 100%; margin-top: .55rem; }

.voice-quick-grid { display: grid; grid-template-columns: repeat(3, 1fr); flex: 1; border: 1px solid rgba(155, 179, 194, .16); }
.voice-quick-grid a,
.voice-quick-grid button {
  min-width: 0;
  min-height: 61px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: .25rem;
  padding: .35rem;
  border: 0;
  border-right: 1px solid rgba(155, 179, 194, .14);
  border-bottom: 1px solid rgba(155, 179, 194, .14);
  color: #c0cbd1;
  background: rgba(3, 10, 15, .72);
  font-size: .61rem;
  text-align: center;
  text-decoration: none;
  cursor: pointer;
}
.voice-quick-grid > :nth-child(3n) { border-right: 0; }
.voice-quick-grid > :nth-last-child(-n+3) { border-bottom: 0; }
.voice-quick-grid a:hover,
.voice-quick-grid button:hover { color: #fff; background: #10222f; }
.voice-quick-grid span { color: #d6dde1; font-size: 1.2rem; }
.voice-footer { margin-top: .75rem; }

@media (min-width: 1181px) {
  .voice-page .header-top { min-height: 69px; padding: .4rem 2.25rem .4rem 9.4rem; }
  .voice-page .brand img { top: .2rem; left: 1rem; width: 145px; height: 145px; }
  .voice-page .brand strong { font-size: 1.45rem; }
  .voice-page .brand small { margin-top: .2rem; font-size: .7rem; }
  .voice-page .site-nav { min-height: 45px; padding-left: 9.4rem; gap: clamp(.75rem, 2vw, 2.4rem); }
  .voice-page .site-nav a,
  .voice-page .site-nav button { font-size: clamp(.65rem, .72vw, .76rem); }
  .voice-page .site-footer { width: min(1470px, calc(100% - 2rem)); min-height: 76px; margin-top: .75rem; }
}

@media (max-width: 1180px) {
  .voice-intro { grid-template-columns: 1fr; padding: .8rem; }
  .voice-intro nav { flex-wrap: wrap; }
  .voice-intro nav > * { flex: 1 1 180px; }
  .voice-dashboard { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .voice-server-card,
  .voice-overview,
  .voice-audiobots,
  .voice-welcome,
  .voice-quick { grid-column: auto; min-height: auto; }
  .voice-welcome { grid-column: 1 / -1; }
  .voice-quick { grid-column: 1 / -1; }
}

@media (max-width: 760px) {
  .voice-hero { min-height: 300px; }
  .voice-hero-scene { width: 100%; height: 58%; }
  .voice-scene-wows { inset: 0 0 auto; }
  .voice-hero-shade { background: linear-gradient(180deg, rgba(2,7,11,.18), rgba(2,7,11,.93) 40%, rgba(2,7,11,.93) 62%, rgba(2,7,11,.18)); }
  .voice-hero-content { min-height: 300px; }
  .voice-hero-content img { width: 74px; height: 74px; }
  .voice-hero h1 { font-size: clamp(2.5rem, 11vw, 3.6rem); }
  .voice-hero-content strong { font-size: .76rem; }
  .voice-hero-content p { font-size: .68rem; }
  .voice-intro,
  .voice-dashboard { width: calc(100% - 1rem); }
  .voice-dashboard { grid-template-columns: 1fr; }
  .voice-server-card,
  .voice-overview,
  .voice-audiobots,
  .voice-welcome,
  .voice-quick { grid-column: 1; }
  .voice-server-body { grid-template-columns: 1fr 120px; }
  .voice-dial { width: 96px; height: 96px; }
  .voice-bot-grid,
  .voice-welcome-grid { grid-template-columns: 1fr 1fr; }
  .voice-welcome-grid > div { min-height: 88px; }
}

@media (max-width: 430px) {
  .voice-server-body { grid-template-columns: 1fr; }
  .voice-server-body dl { padding-right: 0; border-right: 0; }
  .voice-dial { margin: .5rem auto; }
  .voice-card-actions,
  .voice-bot-grid,
  .voice-welcome-grid,
  .voice-quick-grid { grid-template-columns: 1fr; }
  .voice-bot-grid section { padding: .6rem 0; border-right: 0; border-bottom: 1px solid var(--line); }
  .voice-bot-grid section:last-child { border-bottom: 0; }
  .voice-quick-grid > * { border-right: 0 !important; border-bottom: 1px solid rgba(155, 179, 194, .14) !important; }
  .voice-quick-grid > :last-child { border-bottom: 0 !important; }
}

/* IMRE Wissensbereich */
.knowledge-page {
  background:
    radial-gradient(circle at 50% 13%, rgba(25, 64, 90, .19), transparent 38rem),
    linear-gradient(180deg, #06111a 0, #02070b 38rem, #03090e 100%);
}
.knowledge-hero { min-height: 230px; }
.knowledge-hero .voice-hero-content { min-height: 230px; }
.knowledge-hero-content img { width: 82px; height: 82px; }
.knowledge-hero-content strong { color: var(--red-bright); letter-spacing: .16em; }
.knowledge-hero-content p { max-width: 620px; color: #d2dbe0; letter-spacing: normal; line-height: 1.4; text-transform: none; }

.knowledge-categories {
  width: min(1470px, calc(100% - 2rem));
  margin: 0 auto;
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: .7rem;
  padding-top: .65rem;
}
.knowledge-categories > a,
.knowledge-categories > button {
  min-width: 0;
  min-height: 86px;
  display: grid;
  grid-template-columns: 54px 1fr 16px;
  align-items: center;
  gap: .55rem;
  padding: .65rem .75rem;
  border: 1px solid rgba(155, 179, 194, .28);
  color: #e6ebee;
  background: linear-gradient(145deg, rgba(8, 24, 35, .98), rgba(3, 10, 15, .98));
  text-align: left;
  text-decoration: none;
  cursor: pointer;
}
.knowledge-categories > a:hover,
.knowledge-categories > button:hover { border-color: var(--red); background: #0d2230; }
.knowledge-categories > a > span,
.knowledge-categories > button > span { color: #d4dce1; font-size: 2rem; text-align: center; }
.knowledge-categories h2 { margin: 0 0 .15rem; font-size: .76rem; letter-spacing: .035em; text-transform: uppercase; }
.knowledge-categories p { margin: 0; color: var(--muted); font-size: .64rem; line-height: 1.25; }
.knowledge-categories b { color: #d7e0e5; font-size: 1rem; }

.knowledge-dashboard {
  width: min(1470px, calc(100% - 2rem));
  margin: .65rem auto 0;
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  gap: .75rem;
  align-items: stretch;
}
.knowledge-panel {
  min-width: 0;
  display: flex;
  flex-direction: column;
  padding: .75rem;
  border: 1px solid rgba(155, 179, 194, .28);
  background: linear-gradient(145deg, rgba(7, 21, 31, .98), rgba(3, 10, 15, .98));
  box-shadow: 0 14px 28px rgba(0, 0, 0, .23);
}
.knowledge-panel > header {
  min-height: 29px;
  display: flex;
  align-items: center;
  gap: .55rem;
  margin-bottom: .45rem;
  padding-bottom: .4rem;
  border-bottom: 1px solid var(--line);
}
.knowledge-panel > header > span { color: var(--red-bright); font-size: 1rem; }
.knowledge-panel > header h2 { margin: 0; font-size: .8rem; letter-spacing: .04em; text-transform: uppercase; }
.knowledge-guides { grid-column: 1 / 4; min-height: 410px; }
.knowledge-articles { grid-column: 4 / 9; min-height: 410px; }
.knowledge-side-stack { grid-column: 9 / 13; min-width: 0; display: grid; grid-template-rows: 1fr 1.05fr; gap: .75rem; }

.knowledge-guide-list { display: grid; flex: 1; }
.knowledge-guide-list > a,
.knowledge-guide-list > button {
  min-width: 0;
  min-height: 76px;
  display: grid;
  grid-template-columns: 92px 1fr 12px;
  align-items: center;
  gap: .6rem;
  padding: .35rem 0;
  border: 0;
  border-bottom: 1px solid rgba(155, 179, 194, .13);
  color: #edf1f3;
  background: transparent;
  text-align: left;
  text-decoration: none;
  cursor: pointer;
}
.knowledge-guide-list > a:hover,
.knowledge-guide-list > button:hover { background: rgba(16, 42, 58, .42); }
.knowledge-guide-list img { width: 92px; height: 62px; object-fit: cover; border: 1px solid rgba(155, 179, 194, .2); }
.knowledge-guide-list > :nth-child(3) img,
.knowledge-guide-list > :nth-child(4) img { object-fit: contain; background: #02080c; }
.knowledge-guide-list strong,
.knowledge-guide-list small { display: block; }
.knowledge-guide-list strong { font-size: .72rem; line-height: 1.25; }
.knowledge-guide-list small { margin-top: .16rem; color: var(--muted); font-size: .64rem; line-height: 1.25; }
.knowledge-guide-list b { color: #d9e0e4; font-size: 1rem; }

.knowledge-wide-action {
  width: 100%;
  min-height: 32px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: .5rem;
  margin-top: .55rem;
  padding: .35rem .55rem;
  border: 1px solid rgba(155, 179, 194, .32);
  color: #dce4e8;
  background: rgba(3, 12, 18, .88);
  font-size: .65rem;
  font-weight: 700;
  text-decoration: none;
  text-transform: uppercase;
  cursor: pointer;
}
.knowledge-wide-action:hover { border-color: var(--red); color: #fff; }
.knowledge-wide-action span { color: var(--red-bright); }

.knowledge-article-list { display: grid; flex: 1; }
.knowledge-article-list article {
  min-width: 0;
  min-height: 79px;
  display: grid;
  grid-template-columns: 120px 1fr auto;
  align-items: center;
  gap: .75rem;
  padding: .35rem 0;
  border-bottom: 1px solid rgba(155, 179, 194, .13);
}
.knowledge-article-list img { width: 120px; height: 70px; object-fit: cover; border: 1px solid rgba(155, 179, 194, .2); }
.knowledge-article-list article:first-child img,
.knowledge-article-list article:last-child img { object-fit: contain; background: #02080c; }
.knowledge-article-list h3 { margin: .08rem 0 .12rem; font-size: .72rem; line-height: 1.25; }
.knowledge-article-list p { margin: 0; color: var(--muted); font-size: .62rem; line-height: 1.3; }
.knowledge-article-list article > b { align-self: start; margin-top: .25rem; color: #98a8b2; font-size: .6rem; font-weight: 650; white-space: nowrap; }
.knowledge-article-list .tag { font-size: .55rem; font-weight: 800; text-transform: uppercase; }
.tag-tech { color: var(--red-bright); }
.tag-wows { color: #50a9e0; }
.tag-voice { color: #c38fd0; }

.knowledge-quick,
.knowledge-projects { min-height: 0; }
.knowledge-quick-grid { display: grid; grid-template-columns: repeat(3, 1fr); flex: 1; border: 1px solid rgba(155, 179, 194, .16); }
.knowledge-quick-grid a,
.knowledge-quick-grid button {
  min-width: 0;
  min-height: 48px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: .15rem;
  padding: .25rem;
  border: 0;
  border-right: 1px solid rgba(155, 179, 194, .14);
  border-bottom: 1px solid rgba(155, 179, 194, .14);
  color: #bec9cf;
  background: rgba(3, 10, 15, .72);
  font-size: .58rem;
  text-align: center;
  text-decoration: none;
  cursor: pointer;
}
.knowledge-quick-grid > :nth-child(3n) { border-right: 0; }
.knowledge-quick-grid > :nth-last-child(-n+3) { border-bottom: 0; }
.knowledge-quick-grid a:hover,
.knowledge-quick-grid button:hover { color: #fff; background: #10222f; }
.knowledge-quick-grid span { color: #d4dde2; font-size: 1rem; }

.knowledge-project-list { display: grid; flex: 1; }
.knowledge-project-list > div {
  min-height: 49px;
  display: grid;
  grid-template-columns: 48px 1fr auto;
  align-items: center;
  gap: .55rem;
  padding: .25rem 0;
  border-bottom: 1px solid rgba(155, 179, 194, .13);
}
.knowledge-project-list > div > span { width: 48px; height: 40px; display: grid; place-items: center; color: #c9d3d9; background: rgba(10, 28, 40, .82); font-size: 1.25rem; }
.knowledge-project-list p { margin: 0; }
.knowledge-project-list strong,
.knowledge-project-list small { display: block; }
.knowledge-project-list strong { font-size: .67rem; }
.knowledge-project-list small { color: var(--muted); font-size: .58rem; line-height: 1.2; }
.knowledge-project-list > div > b { color: var(--green); font-size: .58rem; font-weight: 700; text-transform: uppercase; }

.knowledge-values {
  width: min(1470px, calc(100% - 2rem));
  min-height: 66px;
  margin: .65rem auto 0;
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  border: 1px solid var(--line);
  background: linear-gradient(90deg, rgba(7, 21, 31, .98), rgba(3, 10, 15, .98));
}
.knowledge-values > div { min-width: 0; display: grid; grid-template-columns: 52px 1fr; align-items: center; gap: .55rem; padding: .55rem .75rem; border-right: 1px solid var(--line); }
.knowledge-values > div:last-child { border-right: 0; }
.knowledge-values > div > span { color: #d2dbe0; font-size: 1.65rem; text-align: center; }
.knowledge-values p { margin: 0; }
.knowledge-values strong,
.knowledge-values small { display: block; }
.knowledge-values strong { font-size: .7rem; text-transform: uppercase; }
.knowledge-values small { color: var(--muted); font-size: .61rem; line-height: 1.2; }
.knowledge-footer { margin-top: .65rem; }

@media (min-width: 1181px) {
  .knowledge-page .header-top { min-height: 69px; padding: .4rem 2.25rem .4rem 9.4rem; }
  .knowledge-page .brand img { top: .2rem; left: 1rem; width: 145px; height: 145px; }
  .knowledge-page .brand strong { font-size: 1.45rem; }
  .knowledge-page .brand small { margin-top: .2rem; font-size: .7rem; }
  .knowledge-page .site-nav { min-height: 45px; padding-left: 9.4rem; gap: clamp(.75rem, 2vw, 2.4rem); }
  .knowledge-page .site-nav a,
  .knowledge-page .site-nav button { font-size: clamp(.65rem, .72vw, .76rem); }
  .knowledge-page .site-footer { width: min(1470px, calc(100% - 2rem)); min-height: 76px; }
}

@media (max-width: 1180px) {
  .knowledge-categories { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .knowledge-categories > :last-child { grid-column: 1 / -1; }
  .knowledge-dashboard { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .knowledge-guides { grid-column: 1; }
  .knowledge-articles { grid-column: 2; }
  .knowledge-side-stack { grid-column: 1 / -1; grid-template-columns: 1fr 1fr; grid-template-rows: auto; }
  .knowledge-values { grid-template-columns: repeat(2, 1fr); }
  .knowledge-values > div { border-bottom: 1px solid var(--line); }
  .knowledge-values > div:nth-child(2n) { border-right: 0; }
  .knowledge-values > :last-child { grid-column: 1 / -1; border-bottom: 0; }
}

@media (max-width: 760px) {
  .knowledge-hero,
  .knowledge-hero .voice-hero-content { min-height: 300px; }
  .knowledge-categories,
  .knowledge-dashboard,
  .knowledge-values { width: calc(100% - 1rem); }
  .knowledge-categories,
  .knowledge-dashboard,
  .knowledge-side-stack,
  .knowledge-values { grid-template-columns: 1fr; }
  .knowledge-categories > :last-child,
  .knowledge-guides,
  .knowledge-articles,
  .knowledge-side-stack,
  .knowledge-values > :last-child { grid-column: 1; }
  .knowledge-values > div { border-right: 0; border-bottom: 1px solid var(--line); }
  .knowledge-article-list article { grid-template-columns: 92px 1fr; }
  .knowledge-article-list img { width: 92px; height: 65px; }
  .knowledge-article-list article > b { grid-column: 2; margin: 0; }
}

@media (max-width: 430px) {
  .knowledge-categories > a,
  .knowledge-categories > button { grid-template-columns: 46px 1fr 12px; }
  .knowledge-guide-list > a,
  .knowledge-guide-list > button { grid-template-columns: 74px 1fr 10px; }
  .knowledge-guide-list img { width: 74px; height: 54px; }
  .knowledge-article-list article { grid-template-columns: 1fr; }
  .knowledge-article-list img { width: 100%; height: 120px; }
  .knowledge-article-list article > b { grid-column: 1; }
  .knowledge-quick-grid { grid-template-columns: repeat(2, 1fr); }
  .knowledge-quick-grid > :nth-child(3n) { border-right: 1px solid rgba(155, 179, 194, .14); }
  .knowledge-quick-grid > :nth-child(2n) { border-right: 0; }
  .knowledge-quick-grid > :nth-last-child(-n+3) { border-bottom: 1px solid rgba(155, 179, 194, .14); }
  .knowledge-quick-grid > :last-child { border-bottom: 0; }
}

/* IMRE News & Termine */
.news-page {
  background:
    radial-gradient(circle at 50% 12%, rgba(25, 64, 90, .19), transparent 38rem),
    linear-gradient(180deg, #06111a 0, #02070b 38rem, #03090e 100%);
}
.news-hero { min-height: 215px; }
.news-hero .voice-hero-content { min-height: 215px; }
.news-hero-content img { width: 78px; height: 78px; }
.news-hero-content h1 { font-size: clamp(2.8rem, 5.2vw, 5.4rem); }
.news-hero-content strong { color: var(--red-bright); letter-spacing: .16em; }
.news-hero-content p { max-width: 650px; color: #d2dbe0; letter-spacing: normal; line-height: 1.4; text-transform: none; }

.news-ticker {
  width: min(1470px, calc(100% - 2rem));
  min-height: 40px;
  margin: .55rem auto 0;
  display: grid;
  grid-template-columns: 145px 1fr 155px;
  align-items: center;
  border: 1px solid var(--line);
  background: linear-gradient(90deg, rgba(7, 21, 31, .98), rgba(3, 10, 15, .98));
}
.news-ticker h2 {
  margin: 0;
  padding: .55rem .8rem;
  border-right: 1px solid var(--line);
  font-size: .72rem;
  letter-spacing: .035em;
  text-transform: uppercase;
}
.news-ticker h2 span { margin-right: .45rem; color: var(--red-bright); }
.news-ticker-items { min-width: 0; display: flex; align-items: center; justify-content: space-around; gap: .7rem; padding: 0 .8rem; }
.news-ticker-items a { min-width: 0; overflow: hidden; color: #c6d0d6; font-size: .62rem; text-decoration: none; text-overflow: ellipsis; white-space: nowrap; }
.news-ticker-items a:hover { color: #fff; }
.news-ticker-items i { color: var(--red-bright); font-style: normal; }
.news-ticker-action {
  min-height: 28px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: .45rem;
  margin-right: .6rem;
  border: 1px solid rgba(155, 179, 194, .32);
  color: #dce4e8;
  background: rgba(3, 12, 18, .88);
  font-size: .61rem;
  text-decoration: none;
  text-transform: uppercase;
}
.news-ticker-action:hover { border-color: var(--red); }
.news-ticker-action span { color: var(--red-bright); }

.news-dashboard,
.news-bottom {
  width: min(1470px, calc(100% - 2rem));
  margin: .65rem auto 0;
  display: grid;
  gap: .65rem;
  align-items: stretch;
}
.news-dashboard { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.news-bottom { grid-template-columns: 1.25fr 1.1fr 1.1fr .92fr 1.35fr; }
.news-panel {
  min-width: 0;
  display: flex;
  flex-direction: column;
  padding: .7rem;
  border: 1px solid rgba(155, 179, 194, .28);
  background: linear-gradient(145deg, rgba(7, 21, 31, .98), rgba(3, 10, 15, .98));
  box-shadow: 0 12px 26px rgba(0, 0, 0, .22);
}
.news-panel > header {
  min-height: 30px;
  display: flex;
  align-items: center;
  gap: .5rem;
  margin-bottom: .35rem;
  padding-bottom: .35rem;
  border-bottom: 1px solid var(--line);
}
.news-panel > header > span { color: var(--red-bright); font-size: 1rem; }
.news-panel > header h2 { margin: 0; font-size: .73rem; letter-spacing: .035em; text-transform: uppercase; }
.news-panel > header button {
  min-height: 25px;
  margin-left: auto;
  padding: .25rem .45rem;
  border: 1px solid var(--line);
  color: #cbd4d9;
  background: transparent;
  font-size: .54rem;
  text-transform: uppercase;
  cursor: pointer;
}
.news-panel > header button:hover { border-color: var(--red); color: #fff; }
.news-column { min-height: 348px; }
.news-story-list { display: grid; flex: 1; }
.news-story-list > a {
  min-width: 0;
  min-height: 67px;
  display: grid;
  grid-template-columns: 76px 1fr;
  align-items: center;
  gap: .55rem;
  padding: .3rem 0;
  border-bottom: 1px solid rgba(155, 179, 194, .13);
  color: #e9eef0;
  text-decoration: none;
}
.news-story-list > a:hover { background: rgba(16, 42, 58, .4); }
.news-story-list img { width: 76px; height: 56px; object-fit: cover; border: 1px solid rgba(155, 179, 194, .2); }
.news-community .news-story-list > a:nth-child(-n+2) img { object-fit: contain; background: #02080c; }
.news-story-list strong,
.news-story-list small,
.news-story-list b { display: block; }
.news-story-list strong { font-size: .66rem; line-height: 1.22; }
.news-story-list small { margin-top: .12rem; color: var(--muted); font-size: .57rem; line-height: 1.24; }
.news-story-list b { margin-top: .12rem; color: var(--red-bright); font-size: .51rem; font-weight: 750; text-transform: uppercase; }
.news-wows .news-story-list b { color: #55aee6; }
.news-story-compact > a { min-height: 82px; }
.news-story-compact img { height: 64px; }
.news-wide-action {
  width: 100%;
  min-height: 30px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: .5rem;
  margin-top: .45rem;
  padding: .3rem .5rem;
  border: 1px solid rgba(155, 179, 194, .3);
  color: #dbe3e7;
  background: rgba(3, 12, 18, .9);
  font-size: .59rem;
  text-decoration: none;
  text-transform: uppercase;
  cursor: pointer;
}
.news-wide-action:hover { border-color: var(--red); color: #fff; }
.news-wide-action span { color: var(--red-bright); }
.news-wide-action.is-blue { border-color: rgba(54, 119, 161, .5); background: rgba(5, 35, 57, .85); }
.news-wide-action.is-green { border-color: rgba(131, 157, 30, .52); background: rgba(32, 46, 3, .88); }

.calendar-heading { margin: .05rem 0 .2rem; color: #dce3e7; font-size: .65rem; text-align: center; text-transform: uppercase; }
.calendar-list { display: grid; flex: 1; }
.calendar-list > button {
  min-width: 0;
  min-height: 54px;
  display: grid;
  grid-template-columns: 46px 1fr auto;
  align-items: center;
  gap: .55rem;
  padding: .25rem 0;
  border: 0;
  border-bottom: 1px solid rgba(155, 179, 194, .13);
  color: #e8edef;
  background: transparent;
  text-align: left;
  cursor: pointer;
}
.calendar-list > button:hover { background: rgba(16, 42, 58, .4); }
.calendar-list > button > span { width: 44px; height: 44px; display: grid; place-items: center; border: 1px solid var(--red); }
.calendar-list b { font-size: 1rem; line-height: .65; }
.calendar-list span small { color: var(--muted); font-size: .48rem; text-transform: uppercase; }
.calendar-list p { margin: 0; }
.calendar-list p strong,
.calendar-list p small { display: block; }
.calendar-list p strong { font-size: .64rem; }
.calendar-list p small { color: var(--muted); font-size: .56rem; }
.calendar-list em { padding: .13rem .25rem; color: #fff; background: #5b3082; font-size: .43rem; font-style: normal; text-transform: uppercase; }
.calendar-list > button:nth-child(2) em { background: #1b559a; }
.calendar-list > button:nth-child(4) em { background: #a85114; }

.news-bottom .news-panel { min-height: 178px; }
.announcement-feature { display: grid; grid-template-columns: 88px 1fr; align-items: center; gap: .65rem; flex: 1; }
.announcement-feature img { width: 88px; height: 74px; object-fit: contain; background: #02080c; border: 1px solid var(--line); }
.announcement-feature p { margin: 0; }
.announcement-feature strong,
.announcement-feature small { display: block; }
.announcement-feature strong { font-size: .67rem; }
.announcement-feature small { margin-top: .2rem; color: var(--muted); font-size: .57rem; line-height: 1.3; }
.news-mini-list > div {
  min-height: 30px;
  display: grid;
  grid-template-columns: 1fr auto;
  align-items: center;
  gap: .4rem;
  border-bottom: 1px solid rgba(155, 179, 194, .13);
}
.news-mini-list p { margin: 0; }
.news-mini-list strong,
.news-mini-list small { display: block; }
.news-mini-list strong { font-size: .59rem; }
.news-mini-list small { color: var(--muted); font-size: .51rem; }
.news-mini-list > div > span { color: #b7c2c9; font-size: .49rem; text-align: right; }
.news-links > a:not(.news-wide-action) {
  min-height: 25px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  border-bottom: 1px solid rgba(155, 179, 194, .13);
  color: #cbd4d9;
  font-size: .57rem;
  text-decoration: none;
}
.news-links > a:not(.news-wide-action):hover { color: #fff; }
.news-links > a span { color: #dc771d; }
.news-subscribe p { margin: .1rem 0 .6rem; color: var(--muted); font-size: .59rem; line-height: 1.35; }
.news-subscribe > button {
  min-height: 36px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: .55rem;
  margin-top: .4rem;
  border: 1px solid rgba(155, 179, 194, .32);
  color: #fff;
  font-size: .61rem;
  text-transform: uppercase;
  cursor: pointer;
}
.news-subscribe-primary { background: linear-gradient(180deg, #3158b7, #14285f); }
.news-subscribe-secondary { background: linear-gradient(180deg, #29333a, #0b1115); }
.news-subscribe > button:hover { border-color: var(--red); }
.news-subscribe > button span { font-size: .9rem; }
.news-footer { margin-top: .65rem; }

@media (min-width: 1181px) {
  .news-page .header-top { min-height: 69px; padding: .4rem 2.25rem .4rem 9.4rem; }
  .news-page .brand img { top: .2rem; left: 1rem; width: 145px; height: 145px; }
  .news-page .brand strong { font-size: 1.45rem; }
  .news-page .brand small { margin-top: .2rem; font-size: .7rem; }
  .news-page .site-nav { min-height: 45px; padding-left: 9.4rem; gap: clamp(.75rem, 2vw, 2.4rem); }
  .news-page .site-nav a,
  .news-page .site-nav button { font-size: clamp(.65rem, .72vw, .76rem); }
  .news-page .site-footer { width: min(1470px, calc(100% - 2rem)); min-height: 76px; }
}

@media (max-width: 1180px) {
  .news-ticker { grid-template-columns: 130px 1fr; }
  .news-ticker-action { display: none; }
  .news-dashboard { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .news-bottom { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .news-subscribe { grid-column: 1 / -1; }
}

@media (max-width: 760px) {
  .news-hero,
  .news-hero .voice-hero-content { min-height: 300px; }
  .news-ticker,
  .news-dashboard,
  .news-bottom { width: calc(100% - 1rem); }
  .news-ticker { grid-template-columns: 1fr; }
  .news-ticker h2 { border-right: 0; border-bottom: 1px solid var(--line); }
  .news-ticker-items { flex-wrap: wrap; justify-content: flex-start; padding: .65rem .8rem; }
  .news-dashboard,
  .news-bottom { grid-template-columns: 1fr; }
  .news-subscribe { grid-column: 1; }
  .news-column,
  .news-bottom .news-panel { min-height: auto; }
}

@media (max-width: 430px) {
  .news-ticker-items i { display: none; }
  .news-ticker-items a { width: 100%; white-space: normal; }
  .news-story-list > a { grid-template-columns: 68px 1fr; }
  .news-story-list img { width: 68px; height: 54px; }
  .calendar-list > button { grid-template-columns: 44px 1fr; }
  .calendar-list em { grid-column: 2; justify-self: start; }
}

/* IMRE Downloads */
.downloads-page {
  background:
    radial-gradient(circle at 50% 12%, rgba(25, 64, 90, .18), transparent 38rem),
    linear-gradient(180deg, #06111a 0, #02070b 38rem, #03090e 100%);
}
.downloads-hero { min-height: 215px; }
.downloads-hero .voice-hero-content { min-height: 215px; }
.downloads-hero-content img { width: 78px; height: 78px; }
.downloads-hero-content h1 { font-size: clamp(3rem, 5.5vw, 5.7rem); }
.downloads-hero-content strong { color: var(--red-bright); letter-spacing: .15em; }
.downloads-hero-content p { max-width: 680px; color: #d4dde2; letter-spacing: normal; line-height: 1.4; text-transform: none; }

.download-benefits {
  width: min(1470px, calc(100% - 2rem));
  min-height: 60px;
  margin: .55rem auto 0;
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr)) 245px;
  border: 1px solid var(--line);
  background: linear-gradient(90deg, rgba(7, 21, 31, .98), rgba(3, 10, 15, .98));
}
.download-benefits > div {
  min-width: 0;
  display: grid;
  grid-template-columns: 52px 1fr;
  align-items: center;
  gap: .45rem;
  padding: .5rem .7rem;
  border-right: 1px solid var(--line);
}
.download-benefits > div > span { color: #d4dde2; font-size: 1.65rem; text-align: center; }
.download-benefits > div:nth-child(2) > span,
.download-benefits > div:nth-child(4) > span { color: var(--red-bright); }
.download-benefits p { margin: 0; }
.download-benefits strong,
.download-benefits small { display: block; }
.download-benefits strong { font-size: .7rem; text-transform: uppercase; }
.download-benefits small { color: var(--muted); font-size: .62rem; line-height: 1.25; }
.download-search { min-width: 0; display: flex; align-items: center; gap: .45rem; margin: .55rem; padding: 0 .65rem; border: 1px solid rgba(155, 179, 194, .3); background: #06131c; }
.download-search input { min-width: 0; width: 100%; border: 0; outline: 0; color: #eaf0f3; background: transparent; font-size: .68rem; }
.download-search input::placeholder { color: #758793; }
.download-search b { color: #d4dde2; font-size: 1rem; }
.download-search-message { width: min(1470px, calc(100% - 2rem)); margin: .45rem auto 0; padding: .45rem .75rem; border: 1px solid rgba(211, 38, 30, .38); color: #d7e0e5; background: rgba(34, 9, 9, .62); font-size: .7rem; }

.downloads-layout {
  width: min(1470px, calc(100% - 2rem));
  margin: .65rem auto 0;
  display: grid;
  grid-template-columns: minmax(0, 1fr) 268px;
  gap: .65rem;
  align-items: stretch;
}
.downloads-main { min-width: 0; display: grid; gap: .65rem; }
.download-grid { min-width: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: .65rem; }
.download-panel {
  min-width: 0;
  display: flex;
  flex-direction: column;
  padding: .7rem;
  border: 1px solid rgba(155, 179, 194, .28);
  background: linear-gradient(145deg, rgba(7, 21, 31, .98), rgba(3, 10, 15, .98));
  box-shadow: 0 12px 26px rgba(0, 0, 0, .22);
}
.download-panel > header {
  min-height: 29px;
  display: flex;
  align-items: center;
  gap: .5rem;
  margin-bottom: .35rem;
  padding-bottom: .35rem;
  border-bottom: 1px solid var(--line);
}
.download-panel > header > span { color: #d4dde2; font-size: 1rem; }
.download-panel > header h2 { margin: 0; font-size: .73rem; letter-spacing: .04em; text-transform: uppercase; }
.download-grid-primary .download-panel { min-height: 286px; }
.download-grid-secondary .download-panel { min-height: 205px; }
.download-items { display: grid; flex: 1; }
.download-items > button {
  min-width: 0;
  min-height: 54px;
  display: grid;
  grid-template-columns: 54px 1fr auto;
  align-items: center;
  gap: .5rem;
  padding: .28rem 0;
  border: 0;
  border-bottom: 1px solid rgba(155, 179, 194, .13);
  color: #e9eef1;
  background: transparent;
  text-align: left;
  cursor: pointer;
}
.download-items > button:hover { background: rgba(16, 42, 58, .42); }
.download-items img { width: 54px; height: 44px; object-fit: cover; border: 1px solid rgba(155, 179, 194, .2); }
.download-items img[src$="imre-adler-logo.png"] { object-fit: contain; background: #02080c; }
.download-items p { margin: 0; }
.download-items strong,
.download-items small { display: block; }
.download-items strong { font-size: .65rem; line-height: 1.2; }
.download-items small { margin-top: .1rem; color: var(--muted); font-size: .56rem; line-height: 1.2; }
.download-items > button > b { min-width: 34px; padding: .18rem .25rem; color: #dce4e8; background: rgba(10, 27, 38, .82); font-size: .5rem; font-weight: 700; text-align: center; text-transform: uppercase; }
.download-panel-action {
  width: 100%;
  min-height: 29px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: .5rem;
  margin-top: .45rem;
  padding: .3rem .5rem;
  border: 1px solid rgba(155, 179, 194, .3);
  color: #dbe3e7;
  background: rgba(3, 12, 18, .9);
  font-size: .58rem;
  text-decoration: none;
  text-transform: uppercase;
  cursor: pointer;
}
.download-panel-action:hover { border-color: var(--red); color: #fff; }
.download-panel-action span { color: var(--red-bright); }

.download-simple-list { display: grid; flex: 1; }
.download-simple-list > button {
  min-width: 0;
  min-height: 34px;
  display: grid;
  grid-template-columns: 32px 1fr auto;
  align-items: center;
  gap: .45rem;
  padding: .25rem 0;
  border: 0;
  border-bottom: 1px solid rgba(155, 179, 194, .13);
  color: #dce4e8;
  background: transparent;
  text-align: left;
  cursor: pointer;
}
.download-simple-list > button:hover { background: rgba(16, 42, 58, .42); }
.download-simple-list > button > span { color: var(--red-bright); font-size: .58rem; font-weight: 800; text-align: center; }
.download-simple-list strong { overflow: hidden; font-size: .59rem; font-weight: 650; text-overflow: ellipsis; white-space: nowrap; }
.download-simple-list b { color: #aab7bf; font-size: .5rem; font-weight: 500; white-space: nowrap; }
.download-security ul { flex: 1; display: grid; align-content: start; gap: .38rem; margin: .1rem 0 .5rem; padding: 0; list-style: none; }
.download-security li { position: relative; padding-left: 1.25rem; color: #c5cfd5; font-size: .58rem; }
.download-security li::before { content: "✓"; position: absolute; left: .15rem; color: #a6bcc9; }
.download-warning { display: grid; grid-template-columns: 42px 1fr; align-items: center; gap: .5rem; padding: .45rem; border: 1px solid rgba(211, 38, 30, .38); background: rgba(38, 8, 8, .58); }
.download-warning > span { color: var(--red-bright); font-size: 1.65rem; text-align: center; }
.download-warning p { margin: 0; }
.download-warning strong,
.download-warning small { display: block; }
.download-warning strong { color: var(--red-bright); font-size: .58rem; text-transform: uppercase; }
.download-warning small { color: #d2d9dd; font-size: .52rem; line-height: 1.25; }

.downloads-sidebar { min-width: 0; display: grid; grid-template-rows: auto auto 1fr; gap: .65rem; }
.downloads-sidebar .download-panel { min-height: 0; }
.download-quick > a {
  min-height: 31px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  border-bottom: 1px solid rgba(155, 179, 194, .13);
  color: #cbd4d9;
  font-size: .62rem;
  text-decoration: none;
}
.download-quick > a:hover { color: #fff; background: rgba(16, 42, 58, .42); }
.download-quick > a span { color: var(--red-bright); }
.download-popular > button {
  min-width: 0;
  min-height: 32px;
  display: grid;
  grid-template-columns: 22px 1fr 20px;
  align-items: center;
  gap: .3rem;
  padding: .25rem 0;
  border: 0;
  border-bottom: 1px solid rgba(155, 179, 194, .13);
  color: #dce4e8;
  background: transparent;
  font-size: .59rem;
  text-align: left;
  cursor: pointer;
}
.download-popular > button:hover { background: rgba(16, 42, 58, .42); }
.download-popular > button > b { color: #aab7bf; font-size: .57rem; }
.download-popular > button > em { color: var(--red-bright); font-size: .72rem; font-style: normal; text-align: center; }
.download-updates > div { min-height: 35px; display: grid; grid-template-columns: 1fr auto; align-items: center; gap: .5rem; border-bottom: 1px solid rgba(155, 179, 194, .13); }
.download-updates strong { font-size: .59rem; }
.download-updates div span { color: var(--green); font-size: .52rem; text-transform: uppercase; }
.downloads-footer { margin-top: .65rem; }

@media (min-width: 1181px) {
  .downloads-page .header-top { min-height: 69px; padding: .4rem 2.25rem .4rem 9.4rem; }
  .downloads-page .brand img { top: .2rem; left: 1rem; width: 145px; height: 145px; }
  .downloads-page .brand strong { font-size: 1.45rem; }
  .downloads-page .brand small { margin-top: .2rem; font-size: .7rem; }
  .downloads-page .site-nav { min-height: 45px; padding-left: 9.4rem; gap: clamp(.75rem, 2vw, 2.4rem); }
  .downloads-page .site-nav a,
  .downloads-page .site-nav button { font-size: clamp(.65rem, .72vw, .76rem); }
  .downloads-page .site-footer { width: min(1470px, calc(100% - 2rem)); min-height: 76px; }
}

@media (max-width: 1180px) {
  .download-benefits { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .download-search { min-height: 46px; grid-column: 1 / -1; }
  .downloads-layout { grid-template-columns: 1fr; }
  .download-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .downloads-sidebar { grid-template-columns: repeat(3, minmax(0, 1fr)); grid-template-rows: auto; }
}

@media (max-width: 760px) {
  .downloads-hero,
  .downloads-hero .voice-hero-content { min-height: 300px; }
  .download-benefits,
  .downloads-layout,
  .download-search-message { width: calc(100% - 1rem); }
  .download-benefits,
  .download-grid,
  .downloads-sidebar { grid-template-columns: 1fr; }
  .download-search { grid-column: 1; }
  .download-grid-primary .download-panel,
  .download-grid-secondary .download-panel { min-height: auto; }
}

@media (max-width: 430px) {
  .download-benefits > div { grid-template-columns: 44px 1fr; }
  .download-items > button { grid-template-columns: 48px 1fr; }
  .download-items img { width: 48px; height: 42px; }
  .download-items > button > b { grid-column: 2; justify-self: start; }
  .download-simple-list > button { grid-template-columns: 28px 1fr; }
  .download-simple-list b { grid-column: 2; }
}

/* IMRE Kontakt */
.contact-page {
  background:
    radial-gradient(circle at 50% 12%, rgba(25, 64, 90, .18), transparent 38rem),
    linear-gradient(180deg, #06111a 0, #02070b 38rem, #03090e 100%);
}
.contact-hero { min-height: 215px; }
.contact-hero .voice-hero-content { min-height: 215px; }
.contact-hero-content img { width: 78px; height: 78px; }
.contact-hero-content h1 { font-size: clamp(3rem, 5.5vw, 5.7rem); }
.contact-hero-content strong { color: var(--red-bright); letter-spacing: .16em; }
.contact-hero-content p { max-width: 700px; color: #d4dde2; letter-spacing: normal; line-height: 1.4; text-transform: none; }

.contact-benefits {
  width: min(1470px, calc(100% - 2rem));
  min-height: 70px;
  margin: .55rem auto 0;
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  border: 1px solid var(--line);
  background: linear-gradient(90deg, rgba(7, 21, 31, .98), rgba(3, 10, 15, .98));
}
.contact-benefits > div {
  min-width: 0;
  display: grid;
  grid-template-columns: 58px 1fr;
  align-items: center;
  gap: .5rem;
  padding: .55rem .8rem;
  border-right: 1px solid var(--line);
}
.contact-benefits > div:last-child { border-right: 0; }
.contact-benefits > div > span { color: #d4dde2; font-size: 1.8rem; text-align: center; }
.contact-benefits > div:nth-child(4) > span { color: var(--red-bright); }
.contact-benefits p { margin: 0; }
.contact-benefits strong,
.contact-benefits small { display: block; }
.contact-benefits strong { font-size: .72rem; text-transform: uppercase; }
.contact-benefits small { margin-top: .1rem; color: var(--muted); font-size: .62rem; line-height: 1.25; }

.contact-layout {
  width: min(1470px, calc(100% - 2rem));
  margin: .65rem auto 0;
  display: grid;
  grid-template-columns: 1.02fr 1.7fr 1.48fr;
  gap: .65rem;
  align-items: stretch;
}
.contact-panel {
  min-width: 0;
  display: flex;
  flex-direction: column;
  padding: .75rem;
  border: 1px solid rgba(155, 179, 194, .28);
  background: linear-gradient(145deg, rgba(7, 21, 31, .98), rgba(3, 10, 15, .98));
  box-shadow: 0 12px 26px rgba(0, 0, 0, .22);
}
.contact-panel > header {
  min-height: 30px;
  display: flex;
  align-items: center;
  gap: .5rem;
  margin-bottom: .45rem;
  padding-bottom: .4rem;
  border-bottom: 1px solid var(--line);
}
.contact-panel > header > span { color: var(--red-bright); font-size: 1rem; }
.contact-panel > header h2 { margin: 0; font-size: .75rem; letter-spacing: .04em; text-transform: uppercase; }
.contact-information,
.contact-message-panel { min-height: 370px; }
.contact-info-list { display: grid; flex: 1; }
.contact-info-list > div {
  min-height: 60px;
  display: grid;
  grid-template-columns: 40px 1fr;
  align-items: center;
  gap: .5rem;
}
.contact-info-list > div > span { color: #d4dde2; font-size: 1.35rem; text-align: center; }
.contact-info-list p { margin: 0; }
.contact-info-list strong,
.contact-info-list small { display: block; }
.contact-info-list strong { font-size: .67rem; text-transform: uppercase; }
.contact-info-list small { margin-top: .1rem; color: var(--muted); font-size: .58rem; line-height: 1.25; }
.contact-warning { display: grid; grid-template-columns: 46px 1fr; align-items: center; gap: .55rem; padding: .5rem; border: 1px solid rgba(211, 38, 30, .42); background: rgba(40, 8, 8, .58); }
.contact-warning > span { color: var(--red-bright); font-size: 1.8rem; text-align: center; }
.contact-warning p { margin: 0; }
.contact-warning strong,
.contact-warning small { display: block; }
.contact-warning strong { color: var(--red-bright); font-size: .6rem; text-transform: uppercase; }
.contact-warning small { color: #d2d9dd; font-size: .54rem; line-height: 1.25; }
.contact-wide-action {
  min-height: 31px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: .45rem;
  margin-top: .5rem;
  border: 1px solid rgba(155, 179, 194, .3);
  color: #dce4e8;
  background: rgba(3, 12, 18, .9);
  font-size: .59rem;
  text-decoration: none;
  text-transform: uppercase;
}
.contact-wide-action:hover { border-color: var(--red); }
.contact-wide-action span { color: var(--red-bright); }
.contact-wide-action b { margin-left: auto; padding-right: .3rem; }

.page-contact-form { display: grid; gap: .48rem; flex: 1; }
.page-contact-grid { display: grid; grid-template-columns: 1fr 1fr; gap: .65rem; }
.page-contact-form label { display: grid; gap: .18rem; color: #dbe3e7; font-size: .62rem; }
.page-contact-form label span { color: #8797a1; }
.page-contact-form label b { color: var(--red-bright); }
.page-contact-form input,
.page-contact-form select,
.page-contact-form textarea {
  width: 100%;
  min-width: 0;
  border: 1px solid rgba(155, 179, 194, .32);
  border-radius: 0;
  color: #e8eef1;
  background: rgba(4, 14, 21, .9);
  font-size: .68rem;
}
.page-contact-form input,
.page-contact-form select { min-height: 34px; padding: .45rem .55rem; }
.page-contact-form textarea { min-height: 83px; padding: .55rem; resize: vertical; }
.page-contact-form input:focus,
.page-contact-form select:focus,
.page-contact-form textarea:focus { border-color: var(--red-bright); outline: 0; box-shadow: 0 0 0 2px rgba(219, 33, 25, .14); }
.page-contact-submit {
  min-height: 38px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: .6rem;
  border: 1px solid #ef3d34;
  color: #fff;
  background: linear-gradient(180deg, #d91d15, #8c0c08);
  font-size: .7rem;
  font-weight: 750;
  letter-spacing: .04em;
  text-transform: uppercase;
  cursor: pointer;
}
.page-contact-submit:hover { background: linear-gradient(180deg, #ef3027, #a9110b); }
.page-contact-note { margin: 0; color: #9eabb3; font-size: .57rem; }
.page-contact-note span { margin-right: .35rem; color: #c9d2d7; }
.page-contact-result { margin-top: .65rem; padding: .65rem; border: 1px solid rgba(155, 179, 194, .28); background: rgba(2, 9, 14, .92); }
.page-contact-result h3 { margin: 0 0 .4rem; font-size: .72rem; text-transform: uppercase; }
.page-contact-result pre { max-height: 150px; margin: 0; padding: .55rem; overflow: auto; border: 1px solid rgba(155, 179, 194, .2); color: #cbd5da; background: #02080c; font: .63rem/1.4 Consolas, monospace; white-space: pre-wrap; }
.page-contact-result > div { display: grid; grid-template-columns: 1fr 1fr; gap: .55rem; margin-top: .5rem; }
.page-contact-result button { min-height: 31px; border: 1px solid rgba(155, 179, 194, .32); color: #e1e7ea; background: #081925; font-size: .59rem; text-transform: uppercase; cursor: pointer; }
.page-contact-result button:hover { border-color: var(--red); }
.page-contact-result > p { margin: .35rem 0 0; color: var(--green); font-size: .56rem; }

.contact-side-stack { min-width: 0; display: grid; grid-template-rows: 1fr auto; gap: .65rem; }
.contact-access > a {
  min-width: 0;
  min-height: 65px;
  display: grid;
  grid-template-columns: 54px 1fr 72px;
  align-items: center;
  gap: .55rem;
  padding: .3rem 0;
  border-bottom: 1px solid rgba(155, 179, 194, .13);
  color: #e8edef;
  text-decoration: none;
}
.contact-access > a:hover { background: rgba(16, 42, 58, .42); }
.contact-access img { width: 54px; height: 48px; object-fit: contain; border: 1px solid rgba(155, 179, 194, .2); background: #02080c; }
.contact-access p { margin: 0; }
.contact-access strong,
.contact-access small { display: block; }
.contact-access strong { font-size: .66rem; text-transform: uppercase; }
.contact-access small { margin-top: .1rem; color: var(--muted); font-size: .57rem; line-height: 1.25; }
.contact-access b { padding: .4rem .3rem; border: 1px solid rgba(155, 179, 194, .28); color: #dce4e8; font-size: .54rem; font-weight: 500; text-align: center; text-transform: uppercase; }
.contact-membership > div { display: grid; grid-template-columns: 68px 1fr; align-items: center; gap: .65rem; }
.contact-membership img { width: 68px; height: 68px; object-fit: contain; }
.contact-membership p { margin: 0; }
.contact-membership strong,
.contact-membership small { display: block; }
.contact-membership strong { font-size: .7rem; text-transform: uppercase; }
.contact-membership small { margin-top: .12rem; color: var(--muted); font-size: .59rem; line-height: 1.3; }
.contact-membership > a { min-height: 32px; display: flex; align-items: center; justify-content: center; gap: .5rem; margin-top: .45rem; border: 1px solid rgba(155, 179, 194, .3); color: #e0e7ea; background: #081925; font-size: .61rem; text-decoration: none; text-transform: uppercase; }
.contact-membership > a:hover { border-color: var(--red); }

.contact-bottom {
  width: min(1470px, calc(100% - 2rem));
  margin: .65rem auto 0;
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: .65rem;
}
.contact-bottom article { min-width: 0; min-height: 126px; display: grid; grid-template-columns: 58px 1fr; grid-template-rows: 1fr auto; gap: .45rem .65rem; padding: .7rem; border: 1px solid rgba(155, 179, 194, .28); background: linear-gradient(145deg, rgba(7, 21, 31, .96), rgba(3, 10, 15, .98)); }
.contact-bottom article > span { grid-row: 1; align-self: center; color: #d5dde1; font-size: 2rem; text-align: center; }
.contact-bottom h2 { margin: 0 0 .15rem; font-size: .71rem; text-transform: uppercase; }
.contact-bottom p { margin: 0; color: var(--muted); font-size: .59rem; line-height: 1.3; }
.contact-bottom a { grid-column: 1 / -1; min-height: 29px; display: flex; align-items: center; justify-content: center; gap: .5rem; border: 1px solid rgba(155, 179, 194, .3); color: #dce4e8; background: rgba(3, 12, 18, .9); font-size: .58rem; text-decoration: none; text-transform: uppercase; }
.contact-bottom a:hover { border-color: var(--red); }
.contact-bottom a b { color: var(--red-bright); }
.contact-footer { margin-top: .65rem; }
.contact-footer .footer-links a { color: #b2bec5; text-decoration: none; }
.contact-footer .footer-links a:hover { color: #fff; }

@media (min-width: 1181px) {
  .contact-page .header-top { min-height: 69px; padding: .4rem 2.25rem .4rem 9.4rem; }
  .contact-page .brand img { top: .2rem; left: 1rem; width: 145px; height: 145px; }
  .contact-page .brand strong { font-size: 1.45rem; }
  .contact-page .brand small { margin-top: .2rem; font-size: .7rem; }
  .contact-page .site-nav { min-height: 45px; padding-left: 9.4rem; gap: clamp(.75rem, 2vw, 2.4rem); }
  .contact-page .site-nav a,
  .contact-page .site-nav button { font-size: clamp(.65rem, .72vw, .76rem); }
  .contact-page .site-footer { width: min(1470px, calc(100% - 2rem)); min-height: 76px; }
}

@media (max-width: 1180px) {
  .contact-benefits { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .contact-benefits > div { border-bottom: 1px solid var(--line); }
  .contact-benefits > div:nth-child(2n) { border-right: 0; }
  .contact-benefits > div:last-child { grid-column: 1 / -1; border-bottom: 0; }
  .contact-layout { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .contact-message-panel { grid-column: 2; grid-row: 1 / 3; }
  .contact-side-stack { grid-column: 1; }
  .contact-bottom { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 760px) {
  .contact-hero,
  .contact-hero .voice-hero-content { min-height: 300px; }
  .contact-benefits,
  .contact-layout,
  .contact-bottom { width: calc(100% - 1rem); }
  .contact-benefits,
  .contact-layout,
  .contact-bottom { grid-template-columns: 1fr; }
  .contact-benefits > div,
  .contact-benefits > div:last-child { grid-column: 1; border-right: 0; }
  .contact-message-panel,
  .contact-side-stack { grid-column: 1; grid-row: auto; }
  .page-contact-grid { grid-template-columns: 1fr; }
  .contact-information,
  .contact-message-panel { min-height: auto; }
}

@media (max-width: 430px) {
  .contact-benefits > div { grid-template-columns: 48px 1fr; }
  .contact-access > a { grid-template-columns: 48px 1fr; }
  .contact-access img { width: 48px; height: 44px; }
  .contact-access b { grid-column: 2; justify-self: start; }
  .page-contact-result > div { grid-template-columns: 1fr; }
  .contact-bottom article { grid-template-columns: 48px 1fr; }
}

/* =========================================================
   IMRE HEADER-LOGO – EINHEITLICH AUF ALLEN SEITEN
   ========================================================= */

@media (min-width: 981px) {
    .header-top {
        min-height: 80px !important;
        padding-left: 13rem !important;
    }

    .brand img {
        top: .4rem !important;
        left: 1rem !important;
        width: 175px !important;
        height: 175px !important;
    }

    .site-nav {
        padding-left: 13rem !important;
    }
}

/* Community Hero nach Entfernung des zweiten Adlerlogos */
.community-hero-content {
    grid-template-columns: 1fr;
}

.community-hero-copy {
    width: 100%;
    max-width: 760px;
    margin: 0 auto;
}

/* Startseiten-Claim typografisch an Community-Seite angleichen */
.hero-claim {
    font-family: "Arial Narrow", "Roboto Condensed", "Segoe UI", sans-serif;
    font-size: 1.02rem;
    font-weight: 800;
    line-height: 1.2;
    letter-spacing: .12em;
}

.hero-claim strong {
    font-size: 1.2rem;
    font-weight: 800;
    letter-spacing: .12em;
}

/* Startseiten-Claim zentral im Hero ausrichten */
@media (min-width: 981px) {
    .hero-center {
        grid-template-columns: 1fr;
        justify-items: center;
    }

    .hero-claim {
        width: min(430px, 90%);
        justify-self: center;
        text-align: center;
    }
}

/* Startseiten-Hero-Buttons exakt mittig */
@media (min-width: 981px) {
    .hero-actions {
        left: 50%;
        transform: translateX(-50%);
    }
}

/* WoWs-Hero nach Entfernung des zweiten Adlerlogos */
.wows-page .wows-hero-center {
    grid-template-columns: 1fr;
    justify-items: center;
    padding-left: 0;
}

.wows-page .wows-hero-copy {
    width: 100%;
    max-width: 770px;
    margin: 0 auto;
}

/* =========================================================
   IMRE HAUPTNAVIGATION – EINHEITLICHE OUTLINE-ICONS
   ========================================================= */

.site-nav .nav-icon {
    width: 1.15rem;
    height: 1.15rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 1.15rem;
}

.site-nav .nav-icon svg {
    width: 100%;
    height: 100%;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
}

/* IMRE Navigationsicons als PNG */
.site-nav .nav-icon img {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: contain;
}

/* TEST – kompaktes Startseiten-Navigationsicon */
.site-nav a[href="index.html"] .nav-icon {
    width: 48px;
    height: 48px;
    flex: 0 0 48px;
}

/* IMRE NAVIGATION – finale kompakte PNG-Icons */
.site-nav .nav-icon {
    width: 48px;
    height: 48px;
    flex: 0 0 48px;
}

.site-nav .nav-icon img {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: contain;
}

/* IMRE NAVIGATION – Abstände für 48px PNG-Icons optimiert */
@media (min-width: 981px) {
    .site-nav {
        gap: .55rem !important;
    }

    .site-nav a,
    .site-nav button {
        gap: .35rem !important;
    }
}

/* IMRE NAVIGATION – Feinanpassung links/rechts */
@media (min-width: 981px) {
    .site-nav {
        gap: .35rem !important;
    }

    .site-nav a,
    .site-nav button {
        gap: .25rem !important;
    }
}

/* =========================================================
   TEAMSPEAK – HEADER 1:1 AN STARTSEITEN-REFERENZ ANGLEICHEN
   ========================================================= */
@media (min-width: 1181px) {

    .voice-page .header-top {
        width: min(var(--max), 100%) !important;
        min-height: 80px !important;
        margin: auto !important;
        padding: .55rem 2.25rem .55rem 13rem !important;
    }

    .voice-page .brand img {
        top: .4rem !important;
        left: 1rem !important;
        width: 175px !important;
        height: 175px !important;
    }

    .voice-page .brand strong {
        font-size: clamp(1.45rem, 2vw, 2rem) !important;
    }

    .voice-page .brand small {
        margin-top: .35rem !important;
        font-size: .82rem !important;
    }

    .voice-page .site-nav {
        min-height: 47px !important;
        padding: 0 1.25rem 0 13rem !important;
        gap: .35rem !important;
    }

    .voice-page .site-nav a,
    .voice-page .site-nav button {
        gap: .25rem !important;
        padding: .25rem 0 !important;
        font-size: clamp(.7rem, .85vw, .86rem) !important;
    }
}

/* =========================================================
   WISSENSBEREICH – HEADER 1:1 AN STARTSEITEN-REFERENZ
   ========================================================= */
@media (min-width: 1181px) {

    .knowledge-page .header-top {
        width: min(var(--max), 100%) !important;
        min-height: 80px !important;
        margin: auto !important;
        padding: .55rem 2.25rem .55rem 13rem !important;
    }

    .knowledge-page .brand img {
        top: .4rem !important;
        left: 1rem !important;
        width: 175px !important;
        height: 175px !important;
    }

    .knowledge-page .brand strong {
        font-size: clamp(1.45rem, 2vw, 2rem) !important;
    }

    .knowledge-page .brand small {
        margin-top: .35rem !important;
        font-size: .82rem !important;
    }

    .knowledge-page .site-nav {
        min-height: 47px !important;
        padding: 0 1.25rem 0 13rem !important;
        gap: .35rem !important;
    }

    .knowledge-page .site-nav a,
    .knowledge-page .site-nav button {
        gap: .25rem !important;
        padding: .25rem 0 !important;
        font-size: clamp(.7rem, .85vw, .86rem) !important;
    }
}

/* =========================================================
   NEWS & TERMINE – HEADER 1:1 AN STARTSEITEN-REFERENZ
   ========================================================= */
@media (min-width: 1181px) {

    .news-page .header-top {
        width: min(var(--max), 100%) !important;
        min-height: 80px !important;
        margin: auto !important;
        padding: .55rem 2.25rem .55rem 13rem !important;
    }

    .news-page .brand img {
        top: .4rem !important;
        left: 1rem !important;
        width: 175px !important;
        height: 175px !important;
    }

    .news-page .brand strong {
        font-size: clamp(1.45rem, 2vw, 2rem) !important;
    }

    .news-page .brand small {
        margin-top: .35rem !important;
        font-size: .82rem !important;
    }

    .news-page .site-nav {
        min-height: 47px !important;
        padding: 0 1.25rem 0 13rem !important;
        gap: .35rem !important;
    }

    .news-page .site-nav a,
    .news-page .site-nav button {
        gap: .25rem !important;
        padding: .25rem 0 !important;
        font-size: clamp(.7rem, .85vw, .86rem) !important;
    }
}

/* =========================================================
   DOWNLOADS – HEADER AN STARTSEITEN-REFERENZ ANGLEICHEN
   ========================================================= */
@media (min-width: 1181px) {

    .downloads-page .header-top {
        width: min(var(--max), 100%) !important;
        min-height: 80px !important;
        margin: auto !important;
        padding: .55rem 2.25rem .55rem 13rem !important;
    }

    .downloads-page .brand img {
        top: .4rem !important;
        left: 1rem !important;
        width: 175px !important;
        height: 175px !important;
    }

    .downloads-page .brand strong {
        font-size: clamp(1.45rem, 2vw, 2rem) !important;
    }

    .downloads-page .brand small {
        margin-top: .35rem !important;
        font-size: .82rem !important;
    }

    .downloads-page .site-nav {
        min-height: 47px !important;
        padding: 0 1.25rem 0 13rem !important;
        gap: .35rem !important;
    }

    .downloads-page .site-nav a,
    .downloads-page .site-nav button {
        gap: .25rem !important;
        padding: .25rem 0 !important;
        font-size: clamp(.7rem, .85vw, .86rem) !important;
    }
}

/* =========================================================
   KONTAKT – HEADER AN STARTSEITEN-REFERENZ ANGLEICHEN
   ========================================================= */
@media (min-width: 1181px) {

    .contact-page .header-top {
        width: min(var(--max), 100%) !important;
        min-height: 80px !important;
        margin: auto !important;
        padding: .55rem 2.25rem .55rem 13rem !important;
    }

    .contact-page .brand img {
        top: .4rem !important;
        left: 1rem !important;
        width: 175px !important;
        height: 175px !important;
    }

    .contact-page .brand strong {
        font-size: clamp(1.45rem, 2vw, 2rem) !important;
    }

    .contact-page .brand small {
        margin-top: .35rem !important;
        font-size: .82rem !important;
    }

    .contact-page .site-nav {
        min-height: 47px !important;
        padding: 0 1.25rem 0 13rem !important;
        gap: .35rem !important;
    }

    .contact-page .site-nav a,
    .contact-page .site-nav button {
        gap: .25rem !important;
        padding: .25rem 0 !important;
        font-size: clamp(.7rem, .85vw, .86rem) !important;
    }
}

/* =========================================================
   IMRE BRANDING – METALLFARBEN
   ========================================================= */

.brand-imre {
  color: transparent;
  background: linear-gradient(
    180deg,
    #ffffff 0%,
    #dfe5ea 25%,
    #9da8b2 55%,
    #f4f7f9 85%,
    #b8c2ca 100%
  );
  -webkit-background-clip: text;
  background-clip: text;
}

.brand-community {
  color: transparent;
  background: linear-gradient(
    180deg,
    #f5d98a 0%,
    #d4a63a 40%,
    #a87416 70%,
    #f1c75b 100%
  );
  -webkit-background-clip: text;
  background-clip: text;
}

/* TEST – Navigation weiter links, mehr Abstand */
@media (min-width: 1181px) {
    .site-nav {
        padding-left: 11.5rem !important;
        gap: .55rem !important;
    }
}

/* TEST 2 – Navigation stärker links ausrichten */
@media (min-width: 1181px) {
    .site-nav {
        padding-left: 9.5rem !important;
        gap: .8rem !important;
    }
}

/* TEST – Startseiten-Unterbereich volle verfügbare Breite */
@media (min-width: 1181px) {
    .feature-strip,
    .command-grid {
        width: calc(100% - 2rem);
    }
}

/* =========================================================
   IMRE UNTERSEITEN – INHALTSBREITE AN STARTSEITE ANGLEICHEN
   ========================================================= */
@media (min-width: 1181px) {

    /* Community */
    .community-value-strip,
    .community-board,

    /* World of Warships */
    .wows-feature-grid,
    .wows-dashboard,

    /* TeamSpeak */
    .voice-intro,
    .voice-dashboard,

    /* Wissensbereich */
    .knowledge-categories,
    .knowledge-dashboard,
    .knowledge-values,

    /* News & Termine */
    .news-ticker,
    .news-dashboard,
    .news-bottom,

    /* Downloads */
    .download-benefits,
    .download-search-message,
    .downloads-layout,

    /* Kontakt */
    .contact-benefits,
    .contact-layout,
    .contact-bottom {
        width: calc(100% - 2rem) !important;
        max-width: none !important;
    }
}


@media (min-width: 1181px) {
    .voice-page .site-nav,
    .knowledge-page .site-nav,
    .news-page .site-nav,
    .downloads-page .site-nav,
    .contact-page .site-nav {
        padding-left: 9.5rem !important;
        gap: .8rem !important;
    }
}

/* IMRE – neues Marinepanorama */
.hero .hero-naval {
  inset: 0;
  width: 100%;
  height: 100%;
  background-image: url("assets/imre-hero-bismarck-hood-prinz-eugen.png");
  background-position: center;
  background-size: cover;
}
@media (min-width: 981px) {
  .hero:has(.hero-naval),
  .hero:has(.hero-naval) .hero-center {
    min-height: clamp(330px, 33.333vw, 640px);
  }
}

.community-game-grid.community-game-grid-single { grid-template-columns: 1fr; }

/* IMRE – Community-Marinepanorama */
.community-hero .community-scene-naval {
  inset: 0;
  width: 100%;
  height: 100%;
  background: url("assets/imre-hero-bismarck-hood-prinz-eugen.png") center / cover no-repeat;
}
@media (min-width: 981px) {
  .community-hero:has(.community-scene-naval),
  .community-hero:has(.community-scene-naval) .community-hero-content {
    min-height: clamp(380px, 33.333vw, 640px);
  }
}

/* IMRE – Unterseiten-Marinepanorama */
.voice-hero .voice-scene-naval {
  inset: 0;
  width: 100%;
  height: 100%;
  background: url("assets/imre-hero-bismarck-hood-prinz-eugen.png") center / cover no-repeat;
}
@media (min-width: 981px) {
  .voice-hero:has(.voice-scene-naval),
  .voice-hero:has(.voice-scene-naval) .voice-hero-content {
    min-height: clamp(330px, 33.333vw, 640px);
  }
}

.voice-bot-grid > section:only-child { grid-column: 1 / -1; }

@media (min-width: 761px) and (max-width: 1180px) {
  .news-dashboard .news-calendar { grid-column: 1 / -1; }
}

/* Spielauswahl: zwei gleichwertige Bereiche */
.wizard-step[data-step="1"] .choice-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
@media (max-width: 660px) {
  .wizard-step[data-step="1"] .choice-grid { grid-template-columns: 1fr; }
}

/* IMRE – WoWs-Untermenü gleichmäßig ausrichten */
.wows-page .wows-feature-grid {
  gap: 1rem;
  margin-top: 1rem;
  align-items: stretch;
}
.wows-page .wows-feature-grid > article {
  min-height: 180px;
  grid-template-columns: 48px minmax(0, 1fr);
  grid-template-rows: 1fr 40px;
  gap: .75rem;
  padding: 1rem;
}
.wows-page .wows-feature-grid > article.wows-class-summary {
  grid-template-columns: 1fr;
  grid-template-rows: auto 1fr 40px;
}
.wows-page .wows-feature-grid article > a,
.wows-page .wows-feature-grid article > button {
  width: 100%;
  min-height: 40px;
  align-self: end;
  margin: 0;
  padding: .5rem .65rem;
  line-height: 1.25;
  text-align: center;
}
.wows-page .wows-class-summary small {
  white-space: normal;
  overflow-wrap: anywhere;
}

/* IMRE – größere Menüabstände */
@media (min-width: 1600px) {
  .site-header .site-nav {
    gap: 1.8rem !important;
  }
}

/* IMRE – Aufbau-Sprachslider */
.construction-slider {
  position: relative;
  padding: .9rem 5rem;
  border-bottom: 1px solid #a87416;
  background: linear-gradient(135deg, #101c27, #050b11);
}
.construction-slides { display: grid; }
.construction-slides p {
  grid-area: 1 / 1;
  margin: 0;
  text-align: center;
  font-family: "Arial Narrow", "Roboto Condensed", "Segoe UI", sans-serif;
  font-size: clamp(1.45rem, 2vw, 2rem);
  font-weight: 800;
  line-height: 1.35;
  opacity: 0;
  visibility: hidden;
  animation: imre-construction-language 24s linear infinite;
}
.construction-slides p:nth-child(2) { animation-delay: 6s; }
.construction-slides p:nth-child(3) { animation-delay: 12s; }
.construction-slides p:nth-child(4) { animation-delay: 18s; }
@keyframes imre-construction-language {
  0%, 22% { opacity: 1; visibility: visible; }
  25%, 100% { opacity: 0; visibility: hidden; }
}
.construction-slider > input {
  position: absolute;
  right: 3.4rem;
  top: calc(50% - .45rem);
  margin: 0;
  accent-color: #d4a63a;
}
.construction-slider > label {
  position: absolute;
  right: .65rem;
  top: 50%;
  transform: translateY(-50%);
  color: #d4a63a;
  font-size: .75rem;
  cursor: pointer;
}
.construction-slider:has(input:checked) .construction-slides p {
  animation-play-state: paused;
}
@media (max-width: 660px) {
  .construction-slider { padding: .8rem 4.8rem .8rem .8rem; }
}
@media (prefers-reduced-motion: reduce) {
  .construction-slides p { animation: none; }
  .construction-slides p:first-child { opacity: 1; visibility: visible; }
  .construction-slider > input,
  .construction-slider > label { display: none; }
}

/* IMRE – Sprachwechsel per JavaScript */
.construction-slider .construction-slides p {
  animation: none !important;
  opacity: 0;
  visibility: hidden;
}
.construction-slider .construction-slides p.is-current {
  opacity: 1;
  visibility: visible;
}
.construction-slider > input,
.construction-slider > label {
  display: block;
}