/* === MASCULINIDADE NEGRA — design system === */
:root{
  --ink:#0a0a08;
  --ink-2:#121210;
  --ink-3:#1b1b17;
  --bone:#e9e3d1;
  --bone-2:#c9c1a9;
  --mute:#6a6555;
  --bronze:#8f7a4a;
  --bronze-2:#b89764;
  --gold-1:#f4d37a;
  --gold-2:#c9a14a;
  --gold-3:#8a6a28;
  --gold-4:#3a2d10;
  --patina:#7a8570;
  --rule:rgba(233,227,209,.12);
  --rule-2:rgba(233,227,209,.06);
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
html,body{background:var(--ink);color:var(--bone);font-family:'Space Grotesk',system-ui,sans-serif;font-weight:400;line-height:1.55;-webkit-font-smoothing:antialiased;overflow-x:hidden}
::selection{background:var(--gold-2);color:var(--ink)}
body:before{content:"";position:fixed;inset:0;pointer-events:none;z-index:1;background:radial-gradient(60% 40% at 80% 0%, rgba(143,122,74,.08), transparent 70%),radial-gradient(40% 40% at 0% 100%, rgba(122,133,112,.06), transparent 70%);mix-blend-mode:screen}
body:after{content:"";position:fixed;inset:0;pointer-events:none;z-index:2;background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='240' height='240'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 .9 0 0 0 0 .86 0 0 0 0 .72 0 0 0 .05 0'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>");opacity:.9;mix-blend-mode:overlay}
main,header,footer{position:relative;z-index:3}
a{color:var(--bone);text-decoration:none}
.container{max-width:1400px;margin:0 auto;padding:0 40px}
@media(max-width:700px){.container{padding:0 24px}}
.container-narrow{max-width:920px;margin:0 auto;padding:0 40px}
@media(max-width:700px){.container-narrow{padding:0 24px}}
.display{font-family:'Instrument Serif',Georgia,serif;font-weight:400;line-height:.92;letter-spacing:-.02em}
.display i{font-style:italic;color:var(--gold-1)}
.mono{font-family:'Space Mono',ui-monospace,monospace;font-size:11px;letter-spacing:.22em;text-transform:uppercase;color:var(--bronze-2)}

/* TOP NAV */
header.top{position:fixed;top:0;left:0;right:0;z-index:40;mix-blend-mode:difference;pointer-events:none}
.top-inner{display:flex;justify-content:space-between;align-items:center;padding:26px 40px;max-width:1400px;margin:0 auto;pointer-events:auto}
.sigil{font-family:'Instrument Serif',serif;font-size:20px;letter-spacing:-.03em;color:var(--bone)}
.sigil i{font-style:italic;color:var(--gold-1)}
.top-right{display:flex;gap:28px;align-items:center}
.top-right a{font-family:'Space Mono',monospace;font-size:11px;letter-spacing:.22em;text-transform:uppercase;color:var(--bone)}
.top-right .enter{border:1px solid var(--bone);padding:10px 18px;transition:all .3s}
.top-right .enter:hover{background:var(--bone);color:var(--ink)}
@media(max-width:820px){.top-right a:not(.enter){display:none}}

/* PAGE HEADER (não-home) */
.page-head{padding:180px 0 100px;border-bottom:1px solid var(--rule);position:relative}
.page-head .eyebrow{font-family:'Space Mono',monospace;font-size:11px;letter-spacing:.3em;color:var(--gold-1);text-transform:uppercase}
.page-head h1{font-family:'Instrument Serif',serif;font-size:clamp(56px,10vw,160px);font-weight:400;letter-spacing:-.035em;line-height:.9;margin-top:24px}
.page-head h1 i{font-style:italic;color:var(--gold-1)}
.page-head .lede{font-family:'Instrument Serif',serif;font-size:clamp(20px,2vw,28px);color:var(--bone-2);font-style:italic;margin-top:40px;max-width:62ch;line-height:1.35}

/* SECTION BASE */
section{padding:140px 0;border-bottom:1px solid var(--rule);position:relative}
.chapter-mark{display:grid;grid-template-columns:auto 1fr auto;gap:32px;align-items:baseline;margin-bottom:90px}
@media(max-width:820px){.chapter-mark{grid-template-columns:1fr;gap:14px;margin-bottom:60px}}
.chapter-mark .num{font-family:'Instrument Serif',serif;font-size:clamp(120px,18vw,280px);line-height:.85;color:transparent;-webkit-text-stroke:1px var(--gold-2);font-weight:400;letter-spacing:-.04em}
.chapter-mark h2{font-family:'Instrument Serif',serif;font-size:clamp(36px,4.8vw,76px);line-height:.95;font-weight:400;letter-spacing:-.02em;max-width:16ch}
.chapter-mark h2 i{font-style:italic;color:var(--gold-1)}
.chapter-mark .meta{text-align:right;color:var(--mute);font-family:'Space Mono',monospace;font-size:11px;letter-spacing:.2em;text-transform:uppercase;padding-bottom:12px}
@media(max-width:820px){.chapter-mark .meta{text-align:left}}

/* PROSE — texto editorial longo */
.prose{max-width:68ch;font-size:18px;line-height:1.7;color:var(--bone)}
.prose p{margin-bottom:1.6em}
.prose p.first:first-letter{font-family:'Instrument Serif',serif;font-size:5.2em;float:left;line-height:.82;padding:6px 14px 0 0;color:var(--gold-1)}
.prose h3{font-family:'Instrument Serif',serif;font-size:36px;margin:2.4em 0 .6em;letter-spacing:-.015em;font-weight:400;line-height:1.1}
.prose h3 i{font-style:italic;color:var(--gold-1)}
.prose blockquote{border-left:2px solid var(--gold-2);padding:10px 0 10px 28px;margin:2.2em 0;font-family:'Instrument Serif',serif;font-style:italic;font-size:24px;line-height:1.35;color:var(--bone-2)}
.prose blockquote cite{display:block;margin-top:14px;font-style:normal;font-family:'Space Mono',monospace;font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--patina)}
.prose em{color:var(--gold-1)}
.prose a{color:var(--gold-1);border-bottom:1px solid rgba(244,211,122,.35)}
.prose a:hover{border-bottom-color:var(--gold-1)}

/* BUTTONS */
.btn{font-family:'Space Mono',monospace;font-size:11px;letter-spacing:.24em;text-transform:uppercase;padding:16px 26px;border:1px solid var(--bone);transition:all .3s;color:var(--bone);display:inline-block;cursor:pointer;background:transparent}
.btn:hover{background:var(--bone);color:var(--ink)}
.btn.gold{background:linear-gradient(135deg,#f4d37a,#c9a14a);border-color:var(--gold-2);color:#2a1f08;font-weight:700}
.btn.gold:hover{background:linear-gradient(135deg,#f9e49b,#e5c069)}

/* FOOTER */
footer{padding:60px 0 40px}
.foot{display:grid;grid-template-columns:1fr 1fr 1fr;gap:32px;align-items:center}
@media(max-width:700px){.foot{grid-template-columns:1fr;gap:16px;text-align:center}}
.foot .center{text-align:center;font-family:'Instrument Serif',serif;font-style:italic;color:var(--bone-2);font-size:18px}
.foot .right{text-align:right;font-family:'Space Mono',monospace;font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--mute)}
@media(max-width:700px){.foot .right{text-align:center}}

/* HAIRLINE divider */
.hairline{display:grid;grid-template-columns:repeat(12,1fr);border-top:1px solid var(--rule);border-bottom:1px solid var(--rule)}
.hairline span{height:40px;border-right:1px solid var(--rule-2)}
.hairline span:last-child{border-right:0}