/* ─────────────────────────────────────────────
   Bar de Copa 26 — shared styles for subpages
   ───────────────────────────────────────────── */

:root {
  --ink: #0a0a0a;
  --cream: #fffcf4;
  --paper: #f6f1e3;
  --mag: #ff1ab1;
  --pur: #9747ff;
  --lim: #c4ff2c;
  --blu: #3b7bff;
  --ora: #ffa726;
  --cor: #ff5859;
  --mnt: #b6f4c0;
  --line: 3px;
}

*{box-sizing:border-box;margin:0;padding:0;}
html,body{background:var(--cream);color:var(--ink);}
body{
  font-family:"Space Grotesk", system-ui, sans-serif;
  font-size:17px;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
}
a{color:var(--ink);text-decoration:none;}
a:hover{color:var(--mag);}
img{max-width:100%;display:block;}

.mono{font-family:"Space Mono", ui-monospace, monospace;letter-spacing:0.02em;}
.display{font-family:"Bowlby One", "Arial Black", sans-serif;font-weight:400;letter-spacing:-0.01em;line-height:0.95;text-transform:uppercase;}
.serif-it{font-family:"Instrument Serif", serif;font-style:italic;font-weight:400;}

/* ───── TOP NAV ───── */
.topnav{
  position:sticky;top:0;z-index:50;
  background:var(--ink);color:var(--cream);
  border-bottom:var(--line) solid var(--ink);
}
.topnav-inner{
  max-width:1100px;margin:0 auto;
  display:flex;align-items:center;gap:24px;
  padding:14px 24px;
}
.topnav .brand{
  font-family:"Bowlby One",sans-serif;font-size:16px;
  letter-spacing:0.04em;text-transform:uppercase;color:var(--cream);
  margin-right:auto;
}
.topnav .brand .num{color:var(--mag);}
.topnav nav{display:flex;gap:18px;flex-wrap:wrap;}
.topnav nav a{
  font-family:"Space Mono",monospace;font-size:12px;
  letter-spacing:0.14em;text-transform:uppercase;color:var(--cream);opacity:0.85;
}
.topnav nav a:hover,.topnav nav a.on{color:var(--lim);opacity:1;}

/* ───── PAGE ───── */
main.page{
  max-width:760px;margin:0 auto;
  padding:48px 24px 64px;
}
.wide{max-width:1100px;}

.kicker{
  font-family:"Space Mono",monospace;font-size:12px;
  letter-spacing:0.2em;text-transform:uppercase;
  color:var(--pur);
  display:flex;align-items:center;gap:10px;margin-bottom:18px;
}
.kicker::before{content:"";width:30px;height:var(--line);background:var(--mag);}

.page h1{
  font-family:"Bowlby One",sans-serif;
  font-size:clamp(40px,7vw,68px);line-height:0.95;text-transform:uppercase;
  margin-bottom:18px;letter-spacing:-0.01em;
}
.page h1 em,.page h1 .it{
  font-family:"Instrument Serif",serif;font-style:italic;color:var(--pur);
  font-weight:400;text-transform:none;
}

.page h2{
  font-family:"Bowlby One",sans-serif;
  font-size:clamp(26px,3.4vw,34px);line-height:1.1;text-transform:uppercase;
  margin:42px 0 14px;
}
.page h2 em{font-family:"Instrument Serif",serif;font-style:italic;color:var(--mag);font-weight:400;text-transform:none;}

.page h3{
  font-family:"Bowlby One",sans-serif;
  font-size:21px;line-height:1.2;text-transform:uppercase;
  margin:24px 0 8px;
}

.page .lead{
  font-family:"Instrument Serif",serif;font-style:italic;
  font-size:clamp(20px,2.4vw,24px);line-height:1.4;color:var(--ink);
  margin-bottom:24px;opacity:0.92;
}

.page p,.page li{font-size:17px;line-height:1.65;margin-bottom:14px;}
.page p .it{font-family:"Instrument Serif",serif;font-style:italic;color:var(--pur);}
.page p strong{font-weight:700;color:var(--ink);}
.page ul,.page ol{padding-left:22px;margin-bottom:20px;}
.page ul li{list-style:disc;}
.page ol li{list-style:decimal;}

.page a.link{color:var(--mag);text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:3px;}
.page a.link:hover{color:var(--pur);}

/* ───── CARDS / META ───── */
.meta-card{
  border:var(--line) solid var(--ink);
  background:var(--paper);
  padding:18px 20px;margin:24px 0;
}
.meta-card .row{
  display:flex;justify-content:space-between;align-items:flex-start;gap:18px;
  padding:8px 0;border-bottom:1px dashed rgba(10,10,10,0.18);
}
.meta-card .row:last-child{border-bottom:none;}
.meta-card .k{font-family:"Space Mono",monospace;font-size:11px;letter-spacing:0.14em;text-transform:uppercase;opacity:0.7;}
.meta-card .v{font-family:"Bowlby One",sans-serif;font-size:15px;text-transform:uppercase;text-align:right;}

/* ───── CTA BLOCK ───── */
.cta-block{
  display:flex;flex-wrap:wrap;gap:0;
  border:var(--line) solid var(--ink);margin:28px 0;
}
.cta-block a{
  flex:1 1 200px;padding:16px 18px;
  font-family:"Bowlby One",sans-serif;font-size:14px;text-transform:uppercase;letter-spacing:0.04em;
  display:flex;align-items:center;justify-content:center;gap:8px;
  background:var(--lim);color:var(--ink);
}
.cta-block a + a{border-left:var(--line) solid var(--ink);background:var(--ink);color:var(--cream);}
.cta-block a:hover{filter:brightness(0.95);}

/* ───── BLOG CARDS ───── */
.blog-list{display:grid;grid-template-columns:1fr;gap:0;margin:24px 0;}
.blog-list article{
  border-top:var(--line) solid var(--ink);
  padding:24px 0;
}
.blog-list article:last-child{border-bottom:var(--line) solid var(--ink);}
.blog-list .tag{
  font-family:"Space Mono",monospace;font-size:11px;letter-spacing:0.14em;
  text-transform:uppercase;color:var(--mag);margin-bottom:6px;
}
.blog-list h2{
  font-family:"Bowlby One",sans-serif;font-size:24px;line-height:1.1;
  text-transform:uppercase;margin:6px 0 8px;
}
.blog-list h2 a:hover{color:var(--mag);}
.blog-list p{font-size:16px;opacity:0.85;margin-bottom:6px;}
.blog-list .read{
  font-family:"Space Mono",monospace;font-size:12px;letter-spacing:0.14em;text-transform:uppercase;
  color:var(--mag);
}
.blog-list .read::after{content:" →";}

@media (min-width:760px){
  .blog-list{grid-template-columns:1fr 1fr;gap:32px;}
  .blog-list article{padding:28px 0;}
}

/* ───── FOOTER ───── */
.footer{
  background:var(--ink);color:var(--cream);
  padding:40px 24px;border-top:var(--line) solid var(--ink);
}
.footer-inner{
  max-width:1100px;margin:0 auto;
  display:grid;grid-template-columns:1fr;gap:24px;
}
.footer .brand{
  font-family:"Bowlby One",sans-serif;font-size:18px;
  letter-spacing:0.04em;text-transform:uppercase;
}
.footer .brand .num{color:var(--mag);}
.footer .row{display:flex;flex-wrap:wrap;gap:18px;}
.footer .row a{color:var(--cream);opacity:0.8;font-family:"Space Mono",monospace;
  font-size:12px;letter-spacing:0.14em;text-transform:uppercase;}
.footer .row a:hover{color:var(--lim);opacity:1;}
.footer .small{font-family:"Space Mono",monospace;font-size:11px;letter-spacing:0.1em;
  text-transform:uppercase;opacity:0.55;}

@media (min-width:760px){
  .footer-inner{grid-template-columns:1fr auto;align-items:center;}
}