@font-face{font-family:ArchivoX;src:url('/static/fonts/Archivo_Expanded-Bold.woff2') format('woff2'),url('/static/fonts/Archivo_Expanded-Bold.ttf') format('truetype');font-weight:700;font-display:swap}
@font-face{font-family:ArchivoX;src:url('/static/fonts/Archivo_Expanded-SemiBold.woff2') format('woff2'),url('/static/fonts/Archivo_Expanded-SemiBold.ttf') format('truetype');font-weight:600;font-display:swap}
@font-face{font-family:Geist;src:url('/static/fonts/Geist-Variable.woff2') format('woff2');font-weight:100 900;font-display:swap}
:root{--ink:#101311;--ink-2:#171c18;--paper:#f1f0e9;--muted:#a5aaa0;--line:rgba(241,240,233,.16);--orange:#f4441c;--orange-hi:#ff6844;--max:1040px;--display:ArchivoX,Georgia,sans-serif;--sans:Geist,ui-sans-serif,system-ui,sans-serif;--mono:'SFMono-Regular',Consolas,monospace}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--ink);color:var(--paper);font-family:var(--sans);font-size:16px;line-height:1.62;-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}
a:hover{color:var(--orange)}
a:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible{outline:3px solid var(--orange-hi);outline-offset:4px}
.wrap{width:min(100% - 48px,var(--max));margin:auto}
.skip{position:absolute;left:16px;top:-80px;background:var(--orange);color:var(--ink);padding:12px 16px;z-index:20}
.skip:focus{top:16px}
nav{height:78px;border-bottom:1px solid var(--line)}
.nav-in{height:100%;display:flex;align-items:center;justify-content:space-between;gap:28px}
/* The same composition the home page uses: the bird inline so it can take the
   accent colour, the word as live text beside it. These pages used to load the
   all-paper lockup instead — a white bird where the home has an orange one,
   at 50px where the home is 35px. Two different logos, not one. */
.brand{display:flex;align-items:center;gap:7px;font-family:var(--display);font-size:18px;letter-spacing:-.03em;color:var(--paper)}
.brand svg{width:36px;height:35px;flex:none;color:var(--orange)}
.nav-links{display:flex;align-items:center;gap:22px;color:var(--muted);font-size:14px}
main{background:radial-gradient(ellipse 60% 58% at 88% 0%,rgba(244,68,28,.22),transparent 64%),linear-gradient(180deg,#171c18 0%,#101311 48%)}
.legal-hero{padding:clamp(58px,9vw,118px) 0 clamp(32px,6vw,68px);border-bottom:1px solid var(--line)}
.legal-kicker{font:11px var(--mono);letter-spacing:.04em;text-transform:uppercase;color:var(--orange);margin:0 0 18px}
h1{font:700 clamp(42px,7vw,86px)/.98 var(--display);letter-spacing:-.045em;margin:0;max-width:10ch}
.legal-intro{max-width:66ch;color:var(--muted);font-size:19px;margin:28px 0 0}
.legal-grid{display:grid;grid-template-columns:minmax(190px,.34fr) minmax(0,1fr);gap:clamp(34px,7vw,86px);padding:clamp(44px,7vw,86px) 0}
.legal-toc{position:sticky;top:24px;align-self:start;border-top:1px solid var(--line);padding-top:18px;color:var(--muted);font-size:14px}
.legal-toc a{display:block;padding:7px 0;text-decoration:underline;text-underline-offset:3px}
.legal-copy{max-width:72ch}
.legal-copy section{padding:0 0 36px}
.legal-copy h2{font:600 clamp(24px,3vw,34px)/1.08 var(--display);letter-spacing:-.035em;margin:0 0 14px}
.legal-copy h3{font:700 16px/1.35 var(--sans);margin:22px 0 8px;color:var(--paper)}
.legal-copy p,.legal-copy li{color:var(--muted);margin:0 0 12px}
.legal-copy ul{margin:0 0 14px;padding-left:20px}
.legal-copy strong{color:var(--paper);font-weight:700}
.contact-list{display:grid;gap:12px;margin-top:20px}
.contact-item{border-top:1px solid var(--line);padding-top:16px}
.contact-item b{display:block;color:var(--paper);font:600 18px/1.2 var(--display);letter-spacing:-.025em;margin-bottom:4px}
.contact-item a{text-decoration:underline;text-underline-offset:3px}
.notice{border:1px solid var(--line);background:rgba(241,240,233,.05);padding:18px;color:var(--muted)}
.legal-footer{border-top:1px solid var(--line);padding:28px 0;color:var(--muted);font-size:13px}
.footer-in{display:flex;align-items:center;justify-content:space-between;gap:18px;flex-wrap:wrap}
.footer-brand{font-family:var(--display);color:var(--paper)}
.footer-links{display:flex;align-items:center;gap:18px;flex-wrap:wrap}
.footer-links a{text-decoration:underline;text-underline-offset:3px}
.cookie-banner{position:fixed;left:50%;bottom:18px;z-index:30;width:min(calc(100% - 32px),720px);transform:translateX(-50%);display:none;grid-template-columns:1fr auto;gap:18px;align-items:center;padding:16px;background:rgba(16,19,17,.96);border:1px solid var(--line);box-shadow:0 18px 60px rgba(0,0,0,.34);color:var(--muted);font-size:13px}
.cookie-banner.show{display:grid}
.cookie-banner p{margin:0}
.cookie-banner a{text-decoration:underline;text-underline-offset:3px}
.cookie-actions{display:flex;gap:8px}
.cookie-banner button{border:1px solid rgba(244,68,28,.68);background:transparent;color:var(--paper);padding:10px 12px;font:700 13px var(--sans);cursor:pointer}
.cookie-banner button[data-cookie="accept"]{background:var(--orange);color:var(--ink);border-color:var(--orange)}
@media(max-width:720px){.wrap{width:min(100% - 32px,var(--max))}nav{height:auto;padding:22px 0}.nav-in{justify-content:center;flex-wrap:wrap;text-align:center}.nav-links{width:100%;justify-content:center;gap:14px;font-size:13px;flex-wrap:wrap}.legal-grid{grid-template-columns:1fr}.legal-toc{position:static}.legal-hero{padding-top:52px}h1{font-size:clamp(38px,12vw,58px)}.legal-intro{font-size:17px}.legal-copy{min-width:0}.legal-copy p,.legal-copy li{overflow-wrap:anywhere}.cookie-banner{grid-template-columns:1fr;bottom:12px}.cookie-actions{display:grid;grid-template-columns:1fr 1fr}.footer-in{display:block}.footer-links{margin-top:10px;gap:14px}}

/* Link hub em /links — alvo do link da bio do Instagram. Prefixo proprio
   para nao colidir com as classes das paginas legais. */
.linkhub{min-height:100vh;display:flex;flex-direction:column;justify-content:center;padding:clamp(44px,8vw,92px) 0}
.linkhub-head{text-align:center;margin-bottom:clamp(30px,5vw,46px)}
/* The hub used the paper lockup at 230px here, which made it a third size
   for the same mark. It is now the nav composition, centred: same bird,
   same colour, same 35px. text-align cannot centre a flex row. */
.linkhub-head .brand{width:fit-content;margin:0 auto 26px}
.linkhub-head h1{font-size:clamp(28px,4.6vw,44px);max-width:18ch;margin:0 auto 14px;text-align:center}
.linkhub-head p{color:var(--muted);max-width:46ch;margin:0 auto;font-size:17px}
.linkhub-list{display:grid;gap:12px;max-width:520px;margin:0 auto;width:100%;height:auto;border-bottom:0}
.linkhub-item{display:flex;align-items:center;gap:16px;border:1px solid var(--line);background:rgba(241,240,233,.05);padding:18px 20px;transition:border-color .18s,background .18s,transform .18s}
.linkhub-item:hover{border-color:var(--orange);background:rgba(244,68,28,.09);transform:translateY(-1px);color:var(--paper)}
.linkhub-item b{display:block;font:600 17px/1.25 var(--display);letter-spacing:-.02em;color:var(--paper)}
.linkhub-item span{display:block;color:var(--muted);font-size:13px;margin-top:3px}
.linkhub-item i{margin-left:auto;font-style:normal;color:var(--orange);font-size:18px}
.linkhub-item.primary{border-color:var(--orange);background:rgba(244,68,28,.14)}
.linkhub-foot{text-align:center;color:var(--muted);font:11px var(--mono);text-transform:uppercase;letter-spacing:.08em;margin-top:clamp(28px,5vw,44px)}
@media(max-width:520px){.linkhub-item{padding:16px}.linkhub-item b{font-size:16px}}

/* The home page shrinks its mark at 560px, not at the 720px this file uses
   for layout. Matching the breakpoint keeps the two the same size at every
   width, instead of only at the extremes. */
@media(max-width:560px){.brand{font-size:15px}.brand svg{width:31px;height:30px}}
