/* Flatline RP brand theme — neon magenta / electric cyan / midnight */
:root{
  --bg:#050714;
  --panel:#10132b;
  --lime:#ff39d4;
  --cyan:#26e9ff;
  --muted:#a5aed0;
  --line:#36406a;
  --white:#f6f4ff;
  --pink:#ff39d4;
  --yellow:#ffe32e;
}
body{background:radial-gradient(ellipse at 5% 20%,#3b10533d,transparent 42%),radial-gradient(ellipse at 95% 75%,#06364b4d,transparent 44%),#050714}
::selection{background:#ff39d4;color:#060914}
.stripe{height:4px;background:linear-gradient(90deg,#ff31d5 0%,#a747fa 34%,#1fefff 74%,#ffe32e 100%);box-shadow:0 0 22px #fe35d79c}
header{background:#080b1de8;border-bottom:1px solid #de38de46;backdrop-filter:none}
.brand{letter-spacing:.045em;text-shadow:0 0 18px #ff3ed34d}
.brand-mark{background:linear-gradient(135deg,#ff35d5,#28eaff);color:#070a1b;box-shadow:0 0 20px #ff35d55c}
.brand em{color:#22ecff}
.links a:hover{color:#23ecff}
.navcta,.btn.primary{background:linear-gradient(115deg,#ff3acb,#ef36e5 47%,#24eaff);color:#07091a;border-color:transparent;box-shadow:0 0 25px #e737cc42}
.navcta:hover,.btn.primary:hover{filter:brightness(1.12)}
.hero{min-height:700px;background:radial-gradient(ellipse at 18% 25%,#7d145a69,transparent 52%),radial-gradient(ellipse at 82% 42%,#065d9b6e,transparent 48%),linear-gradient(116deg,#070717 7%,#0b102c 68%,#070b20)}
.hero:before{background-image:linear-gradient(#e855dd12 1px,transparent 1px),linear-gradient(90deg,#36ccff11 1px,transparent 1px);background-size:64px 64px;opacity:1}
.hero:after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(90deg,#070918b8 5%,#080b1594 42%,transparent 85%);}
.hero-content{z-index:1}
.city{opacity:.48;filter:hue-rotate(30deg) saturate(1.6)}
.hero h1{text-shadow:0 0 22px #ed35e96b,0 14px 50px #000b}
.hero h1 span{-webkit-text-stroke:2px #2deaff;text-shadow:0 0 28px #10c7ed7d}
.lead{color:#d6d7f3}
.mono{color:#36eaff}
.btn{border-color:#fe38d2;transition:transform .2s ease,box-shadow .2s ease,background .2s ease}
.btn:hover{transform:translateY(-2px)}
.btn.secondary{background:#11132ec7;color:#63f1ff;border-color:#43dff4;box-shadow:inset 0 0 18px #00dcff11}
.hero-foot{color:#c4c2ec}
.hero-foot b{color:#ff49d8}
.ticker{background:linear-gradient(90deg,#ff40d4,#a835c9 52%,#19cfe9);color:#0b0a23}
.section{position:relative}
.section h2{letter-spacing:.015em}
.cards{gap:18px}
.card{border-color:#61416d;background:linear-gradient(139deg,#221337,#12192c 65%,#0c1429)}
.card:after{border-color:#ff37d53d}
.card:nth-child(2){background:linear-gradient(139deg,#0d2544,#161830 75%)}
.card:nth-child(2) .symbol{color:#2eeaff;border-color:#2eeaff80}
.symbol{color:#ff50dd;border:1px solid #c44ebd;box-shadow:0 0 22px #e739d223}
.card p{color:#bbbdd9}
.band{background:linear-gradient(115deg,#100c25,#0b172b);border-color:#4c2f66}
.status-display{border:1px solid #744a92;background:linear-gradient(147deg,#17102e,#0b1427);box-shadow:0 18px 65px #040617,0 0 32px #dd32ce17}
.status-header{border-bottom-color:#4b365f}
.statrow{border-top-color:#34375d}
.statrow span:last-child{color:#5dedff}
.dot.online{background:#3cf3df;box-shadow:0 0 14px #3cf3df}
.joinarea{background:linear-gradient(115deg,#f83bd3 0%,#c73cd8 45%,#29d8f4 100%);color:#090b20}
.joinarea .mono{color:#12132d!important}
.joinarea .btn{background:#080d23;border-color:#080d23;color:#f7f4ff}
footer{background:#070917;border-color:#3b2c56}
footer b{color:#ff4bd9}
.disclaimer{color:#98a1c2}
@media(max-width:800px){.hero:after{background:#080a18a6}.city{opacity:.25}}

/* Artwork-led homepage: Flatline RP */
.brand-logo{display:block;width:154px;height:auto;aspect-ratio:3/1;object-fit:contain;filter:drop-shadow(0 0 12px #ff35d885)}
.brand{min-width:150px}
.hero{min-height:740px;background:radial-gradient(ellipse at 15% 45%,#91056a75,transparent 46%),radial-gradient(ellipse at 85% 48%,#058bb778,transparent 55%),linear-gradient(150deg,#07071b,#0b1032 52%,#0a0718)}
.hero:before{background-image:linear-gradient(#ff51cd17 1px,transparent 1px),linear-gradient(90deg,#43baff13 1px,transparent 1px);background-size:65px 65px}
.hero:after{background:linear-gradient(90deg,#07081ace 0%,#07091d85 45%,transparent 100%)}
.hero-content{min-height:740px}
.hero-copy{max-width:770px}
.hero-logo{display:block;width:min(650px,90vw);height:auto;margin:22px 0 18px;filter:drop-shadow(0 0 20px #fc38d78a) drop-shadow(0 0 30px #04d9ff44);image-rendering:auto}
.seo-title{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.hero .lead{max-width:620px;font-size:18px;line-height:1.7;text-shadow:0 2px 15px #000}
.hero .actions{margin-top:36px}
.hero-foot{margin-top:45px}
.city{width:66%;height:95%;opacity:.65;filter:drop-shadow(0 0 18px #00c6ff55)}
.card{transition:transform .22s ease,border-color .22s ease,box-shadow .22s ease}
.card:hover{transform:translateY(-5px);border-color:#db43d4;box-shadow:0 14px 34px #0007,0 0 22px #f137df20}
.card:first-child:before,.card:nth-child(2):before,.card:nth-child(3):before{content:"";position:absolute;inset:0 0 auto;height:5px;background:linear-gradient(90deg,#ed25d5,#23eaff)}
.card:nth-child(2):before{background:linear-gradient(90deg,#23eaff,#8e4aff)}
.card:nth-child(3):before{background:linear-gradient(90deg,#ffe42e,#f347ce)}
.status-display{position:relative;overflow:hidden}
.status-display:before{content:"";position:absolute;right:-70px;top:-70px;width:240px;height:240px;border:1px solid #f035dd29;border-radius:50%;box-shadow:0 0 0 28px #24ddff08,0 0 0 56px #f035dd08;pointer-events:none}
.joinarea{position:relative;overflow:hidden}
.joinarea:after{content:"";position:absolute;right:-90px;bottom:-160px;width:540px;height:540px;background:url('/flatline-icon.png') center/contain no-repeat;opacity:.13;pointer-events:none}
.joinarea .container{position:relative;z-index:1}
@media(max-width:800px){.hero,.hero-content{min-height:690px}.hero-logo{width:min(620px,100%)}.city{width:100%;height:80%;opacity:.23}.hero:after{background:#07091ba9}.brand-logo{width:126px}.brand{min-width:126px}.joinarea:after{width:300px;height:300px;right:-95px;bottom:-100px}}
@media(max-width:420px){.hero,.hero-content{min-height:625px}.hero-logo{width:100%;margin:20px 0}.hero .lead{font-size:15px}.brand-logo{width:110px}.brand{min-width:110px}}

/* Cinematic banner: activates automatically when the prepared artwork is installed. */
.hero-art-ready .hero{background-image:linear-gradient(0deg,#07091cf5 0%,#07091b80 26%,#07091b00 64%),url('/flatline-hero.webp');background-position:center center,center top;background-size:cover,cover;background-repeat:no-repeat}
.hero-art-ready .hero:before{display:none}
.hero-art-ready .hero:after{background:none}
.hero-art-ready .city,.hero-art-ready .hero-logo{display:none}
.hero-art-ready .hero-content{min-height:690px;align-items:flex-end;padding-bottom:64px}
.hero-art-ready .hero-copy{max-width:700px}
.hero-art-ready .hero .lead{font-size:18px;max-width:600px}
.hero-art-ready .hero .mono{color:#f6baf2;text-shadow:0 0 12px #000}
.hero-art-ready .hero-foot{margin-top:25px}
.card:nth-child(2){background-image:linear-gradient(135deg,#06152ad9,#160c30e8),url('/flatline-feature.webp');background-size:cover;background-position:center}
@media(max-width:800px){.hero-art-ready .hero{background-size:auto 61%,auto 61%;background-position:center top,center top}.hero-art-ready .hero-content{min-height:720px;padding-bottom:48px}.hero-art-ready .hero:after{background:linear-gradient(0deg,#06091df8,transparent 75%)}}
