/* Nonconformist Ducks — shared styles for inner pages (/whitepaper, /lore) */

:root{
  --black:#0A0A0A;
  --panel:#151312;
  --bone:#EDE6D8;
  --grey:#7A7269;
  --fire:#FF5A1F;
  --ember:#FFC533;
  --hell:#C4271E;
  --pond:#2E8B7A;
}

*{margin:0;padding:0;box-sizing:border-box}

body{
  background:var(--black);
  color:var(--bone);
  font-family:'Space Grotesk',sans-serif;
  -webkit-font-smoothing:antialiased;
  line-height:1.6;
}

a{color:var(--ember)}
a:hover{color:var(--fire)}

/* ---- top bar ---- */
.bar{
  position:fixed;top:0;left:0;right:0;z-index:50;
  background:var(--black);border-bottom:2px solid var(--panel);
  display:flex;align-items:center;justify-content:space-between;
  gap:16px;padding:12px 5vw;
}
.bar-left{display:flex;align-items:center;gap:12px;min-width:0}
.bar-left img{width:32px;height:32px;object-fit:cover;display:block;flex:0 0 auto}
.bar-name{
  font-family:'Anton',sans-serif;font-size:15px;letter-spacing:1px;
  text-transform:uppercase;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
.bar-cta{
  font-family:'Anton',sans-serif;font-size:15px;letter-spacing:1px;
  background:var(--fire);color:var(--black);
  border:2px solid var(--black);box-shadow:3px 3px 0 var(--panel);
  padding:8px 18px;text-decoration:none;flex:0 0 auto;
}
.bar-cta:hover{transform:translate(3px,3px);box-shadow:0 0 0 var(--panel);color:var(--black)}

/* ---- layout ---- */
.wrap{max-width:820px;margin:0 auto;padding:120px 6vw 90px}

.eyebrow{
  font-family:'Space Mono',monospace;font-size:12px;letter-spacing:3px;
  color:var(--ember);text-transform:uppercase;margin-bottom:14px;
}

h1{
  font-family:'Anton',sans-serif;font-weight:400;
  font-size:clamp(40px,7vw,80px);line-height:.95;
  text-transform:uppercase;margin-bottom:18px;
}
h2{
  font-family:'Anton',sans-serif;font-weight:400;
  font-size:clamp(26px,3.6vw,42px);line-height:1.05;
  text-transform:uppercase;margin:56px 0 16px;
  padding-top:28px;border-top:2px solid var(--panel);
}
h3{
  font-family:'Anton',sans-serif;font-weight:400;
  font-size:clamp(18px,2.2vw,24px);line-height:1.15;
  text-transform:uppercase;letter-spacing:.5px;margin:34px 0 10px;
  color:var(--ember);
}
h2:first-of-type{border-top:none;padding-top:0}

p{margin:0 0 16px;font-size:clamp(15px,1.7vw,18px)}
.lead{font-size:clamp(17px,2vw,21px);color:var(--bone)}
.muted{color:var(--grey)}

strong{color:var(--bone);font-weight:700}

ul{margin:0 0 18px 20px}
li{margin-bottom:8px;font-size:clamp(15px,1.7vw,18px)}

/* ---- tables ---- */
table{width:100%;border-collapse:collapse;margin:18px 0 26px;font-size:15px}
th,td{border-bottom:1px solid var(--panel);padding:10px 8px;text-align:left;vertical-align:top}
th{
  font-family:'Space Mono',monospace;font-size:11px;letter-spacing:2px;
  text-transform:uppercase;color:var(--ember);border-bottom:2px solid var(--panel);
}
td:first-child{font-weight:700}
tbody tr:hover{background:var(--panel)}

/* ---- callout ---- */
.callout{
  border:2px solid var(--fire);background:var(--panel);
  padding:22px 24px;margin:26px 0;
}
.callout p:last-child{margin-bottom:0}

/* ---- code / addresses ---- */
code{
  font-family:'Space Mono',monospace;font-size:13px;
  background:var(--panel);padding:2px 6px;word-break:break-all;
}

/* ---- lore prose ---- */
.story p{
  font-size:clamp(16px,1.9vw,20px);line-height:1.75;
  margin-bottom:22px;
}
.story p:first-child::first-letter{
  font-family:'Anton',sans-serif;font-size:64px;line-height:.8;
  float:left;margin:6px 12px 0 0;color:var(--fire);
}

/* ---- footer ---- */
.foot{
  border-top:2px solid var(--panel);padding:40px 6vw 60px;
  text-align:center;
}
.foot .slogan{
  font-family:'Anton',sans-serif;font-size:clamp(28px,5vw,48px);
  line-height:1;text-transform:uppercase;margin-bottom:22px;
}
.foot .slogan span{color:var(--ember)}
.foot nav{
  display:flex;flex-wrap:wrap;gap:22px;justify-content:center;
  font-family:'Space Mono',monospace;font-size:13px;font-weight:700;
}
.foot nav a{color:var(--bone);text-decoration:none}
.foot nav a:hover{color:var(--fire)}
.disclaimer{
  color:var(--grey);font-size:12px;max-width:640px;margin:28px auto 0;
}

/* ---- marquee ---- */
.marquee{
  overflow:hidden;white-space:nowrap;border-top:2px solid var(--panel);
  border-bottom:2px solid var(--panel);background:var(--fire);color:var(--black);
  font-family:'Space Mono',monospace;font-weight:700;font-size:13px;
  letter-spacing:2px;padding:10px 0;
}
.marquee span{display:inline-block;animation:marquee 26s linear infinite}
@keyframes marquee{from{transform:translateX(0)}to{transform:translateX(-50%)}}

@media (max-width:640px){
  .wrap{padding-top:104px}
  table{font-size:13px}
  th,td{padding:8px 5px}
}
