@font-face { font-family: Teko; src: url('assets/teko-bold.ttf') format('truetype'); font-weight: 700; font-style: normal; font-display: swap; }
:root { color-scheme: dark; --accent: #c4e52b; --text: #f4f5f6; }
* { box-sizing: border-box; }
html, body { margin: 0; min-height: 100%; background: #101519; }
body { min-height: 100svh; color: var(--text); font-family: Arial, Helvetica, sans-serif; isolation: isolate; }
.landscape { position: fixed; inset: 0; z-index: -3; background: #101519 url('assets/background.webp') center center / cover no-repeat; }
.landscape::after { content: ''; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(7,11,14,.08), transparent 65%, rgba(5,9,12,.10)); }
#c, .linework { position: fixed; inset: 0; width: 100%; height: 100%; pointer-events: none; }
#c { z-index: -2; }
.linework { z-index: -1; overflow: hidden; }
main { min-height: 100svh; display: grid; place-items: center; padding: 3rem 1.25rem; }
.message { text-align: center; width: 100%; transform: translateY(-8vh); }
p { margin: 0 0 1.25rem; text-transform: uppercase; font-size: clamp(.8rem, 1.3vw, 1.25rem); letter-spacing: .32em; line-height: 1.6; color: #d2d7da; }
h1 { margin: 0; font-family: Teko, 'Arial Narrow', Arial, sans-serif; font-size: clamp(4.8rem, 9vw, 9rem); font-weight: 700; line-height: 1.05; letter-spacing: .01em; text-shadow: 0 2px 20px rgba(0,0,0,.2); }
.accent { display: block; width: 5.25rem; height: 2px; background: var(--accent); margin: 1.65rem auto 0; box-shadow: 0 0 12px #c4e52228; }
.cross { position: absolute; width: 22px; height: 22px; opacity: .4; }
.cross::before, .cross::after { content: ''; position: absolute; background: currentColor; }
.cross::before { width: 100%; height: 1px; top: 50%; }
.cross::after { height: 100%; width: 1px; left: 50%; }
.cross-one { left: 25%; top: 48%; color: var(--accent); }
.cross-two { left: 77%; top: 26%; color: #b8c1c8; width: 26px; height: 26px; }
.cross-three { left: 73%; top: 53%; color: var(--accent); }
.cross-four { left: 25%; top: 94%; color: #87939d; width: 28px; height: 28px; }
.line { position: absolute; width: 1px; background: linear-gradient(transparent, #acb8c136, transparent); }
.line-one { left: 22.7%; top: 36%; height: 36%; }
.line-two { left: 80.5%; top: 20%; height: 53%; }
.line-three { left: 73.7%; top: 53%; height: 37%; }
@media (max-width: 600px) {
  .landscape { background-position: 50% center; }
  .landscape::after { background: linear-gradient(180deg, #10151940, #10151928 65%, #10151955); }
  .message { transform: translateY(-7vh); }
  p { max-width: 20rem; margin: 0 auto 1.2rem; letter-spacing: .24em; font-size: .8rem; }
  h1 { font-size: clamp(3.8rem, 17vw, 6rem); }
  .accent { margin-top: 1rem; width: 4rem; }
  .cross-one { left: 12%; top: 58%; } .cross-three { left: 86%; top: 62%; }
}