@import url('https://fonts.googleapis.com/css2?family=Marcellus&family=Source+Serif+4:ital,opsz,wght@0,8..60,400;0,8..60,600;1,8..60,400&family=DM+Mono:wght@400;500&display=swap');
/* Insanum site — identidade v1 (docs/brand-identity-v1.md), composição da referência do dono (set/2026).
   Uma única aparência (escura, dourado fosco); sem modo claro. */
:root {
  --ground: #0B0D10; --ground-deep: #07090B; --surface: #12161A; --surface-2: #171C21;
  --ink: #EAE4D4; --ink-soft: #C4BDAE; --ink-mute: #8B939A;
  --line: #262C31; --line-strong: #3B444B; --line-gold: rgba(212, 178, 94, .38);
  --gold: #D4B25E; --gold-bright: #E9CD7E; --gold-deep: #A67C2E; --gold-soft: #2A2314; --gold-ink: #14110A;
  --green: #5FA893; --ember: #D07A4A;
  --shadow: 0 24px 48px -30px rgba(0, 0, 0, .85);
  --max: 1240px;
  color-scheme: dark;
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; background: var(--ground); color: var(--ink); font-family: "Source Serif 4", Georgia, serif; font-size: 16px; line-height: 1.55; padding-block: 0 40px; padding-inline: 0; }
a { color: inherit; text-decoration: none; }
a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible { outline: 2px solid var(--gold); outline-offset: 2px; }
[hidden] { display: none !important; }
img { max-width: 100%; }
h1, h2, h3, h4 { margin: 0; text-wrap: balance; }
p { margin: 0; }
.wrap { width: min(var(--max), calc(100% - 2 * clamp(16px, 3vw, 32px))); margin: 0 auto; }
.display { font-family: Cinzel, Marcellus, "Trajan Pro", Georgia, serif; }
.mono { font-family: "DM Mono", Consolas, monospace; font-variant-numeric: tabular-nums; }
.eyebrow { font-family: "DM Mono", Consolas, monospace; font-size: 11.5px; letter-spacing: .2em; text-transform: uppercase; color: var(--gold); }
code { font-family: "DM Mono", Consolas, monospace; font-size: 13px; background: var(--surface-2); padding: 1px 6px; border-radius: 3px; }

/* buttons */
.btn { display: inline-flex; align-items: center; justify-content: center; gap: 10px; min-height: 44px; padding: 11px 20px; border: 1px solid var(--line-strong); border-radius: 3px; font-family: "DM Mono", Consolas, monospace; font-size: 12.5px; letter-spacing: .12em; text-transform: uppercase; color: var(--ink); background: linear-gradient(180deg, #171B1F, #0E1114); cursor: pointer; transition: transform .12s ease, filter .12s ease, border-color .12s ease; }
.btn:hover { border-color: var(--gold); transform: translateY(-1px); }
.btn.gold { background: linear-gradient(180deg, var(--gold-bright), var(--gold-deep)); border-color: #F0D58A; color: var(--gold-ink); box-shadow: inset 0 1px 0 #FFE9A6, 0 8px 24px rgba(0, 0, 0, .35); }
.btn.gold:hover { filter: brightness(1.06); }
.btn.ghost { background: transparent; }
.btn[disabled], .btn[aria-disabled="true"] { opacity: .55; cursor: not-allowed; transform: none; }

/* header */
.top { position: sticky; top: 0; z-index: 50; background: rgba(7, 9, 11, .92); backdrop-filter: blur(12px); border-bottom: 1px solid var(--line-gold); }
.top .bar { display: flex; align-items: center; justify-content: space-between; gap: 18px; min-height: 74px; flex-wrap: wrap; padding-block: 8px; }
.brand { display: flex; align-items: center; gap: 12px; }
.brand img { width: 40px; height: 40px; display: block; }
.brand .name { font-family: Cinzel, Marcellus, "Trajan Pro", Georgia, serif; font-weight: 700; letter-spacing: .14em; font-size: 22px; color: var(--gold); line-height: 1; }
.brand small { display: block; font-family: "DM Mono", Consolas, monospace; font-size: 8.5px; letter-spacing: .3em; color: var(--ink-mute); margin-top: 5px; }
.top nav { display: flex; gap: 6px 22px; flex-wrap: wrap; font-family: "DM Mono", Consolas, monospace; font-size: 12px; letter-spacing: .12em; text-transform: uppercase; color: var(--ink-soft); }
.top nav a { position: relative; padding: 8px 0; }
.top nav a:hover, .top nav a[aria-current] { color: var(--gold); }
.top nav a[aria-current]::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 2px; background: var(--gold); box-shadow: 0 0 8px var(--gold); }
.top .actions { display: flex; gap: 10px; align-items: center; }
.lang { font-family: "DM Mono", Consolas, monospace; font-size: 11px; letter-spacing: .1em; color: var(--ink-mute); border: 1px solid var(--line); padding: 5px 8px; border-radius: 3px; }

/* hero */
.hero { position: relative; min-height: 640px; border-bottom: 1px solid var(--line-gold); background: linear-gradient(90deg, rgba(7, 9, 11, .92) 0%, rgba(7, 9, 11, .55) 45%, rgba(7, 9, 11, .18) 70%, rgba(7, 9, 11, .6) 100%), url("img/client-portal.jpg") center 55% / cover no-repeat; }
.hero::after { content: ""; position: absolute; inset: auto 0 0 0; height: 120px; background: linear-gradient(180deg, transparent, var(--ground)); pointer-events: none; }
.hero-grid { position: relative; z-index: 1; display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(300px, .6fr); gap: 48px; align-items: center; min-height: 640px; padding: 56px 0; }
.hero-copy { display: grid; gap: 14px; max-width: 760px; }
.wordmark { font-family: Cinzel, Marcellus, "Trajan Pro", Georgia, serif; font-weight: 700; font-size: clamp(56px, 9vw, 124px); letter-spacing: -.02em; line-height: .9; color: var(--gold); text-shadow: 0 3px 0 #5c4218, 0 12px 30px rgba(0, 0, 0, .8); }
.wordmark small { display: block; font-family: Cinzel, Marcellus, Georgia, serif; font-size: clamp(13px, 1.9vw, 24px); letter-spacing: .24em; font-weight: 600; color: #E2D1A7; margin-top: 16px; text-shadow: 0 2px 12px rgba(0, 0, 0, .8); }
.hero h2 { font-family: Cinzel, Marcellus, "Trajan Pro", Georgia, serif; font-weight: 600; font-size: clamp(20px, 2.4vw, 32px); letter-spacing: .02em; color: #F0E1BE; text-shadow: 0 2px 10px rgba(0, 0, 0, .8); }
.hero p.lead { max-width: 60ch; color: #D8D0BE; font-size: 17px; text-shadow: 0 1px 8px rgba(0, 0, 0, .9); }
.cta { display: flex; gap: 12px; flex-wrap: wrap; margin-top: 8px; }
.cta .btn { min-width: 200px; }
.pillars { display: flex; gap: 22px 28px; flex-wrap: wrap; margin-top: 14px; }
.pillar { display: flex; align-items: center; gap: 8px; font-family: "DM Mono", Consolas, monospace; font-size: 11px; letter-spacing: .12em; text-transform: uppercase; color: #D6CEBC; text-shadow: 0 1px 6px rgba(0, 0, 0, .9); }
.pillar svg { width: 22px; height: 22px; flex: none; }
.status { background: linear-gradient(180deg, rgba(13, 16, 19, .94), rgba(7, 9, 11, .97)); border: 1px solid var(--gold-deep); border-radius: 4px; padding: 22px; display: grid; gap: 12px; box-shadow: 0 28px 70px rgba(0, 0, 0, .62); }
.status .head { display: flex; justify-content: space-between; align-items: center; gap: 12px; border-bottom: 1px solid #463821; padding-bottom: 12px; }
.status .head .t { font-family: Cinzel, Marcellus, Georgia, serif; font-weight: 700; letter-spacing: .1em; font-size: 18px; }
.online { display: inline-flex; align-items: center; gap: 7px; font-family: "DM Mono", Consolas, monospace; font-size: 10.5px; letter-spacing: .14em; text-transform: uppercase; color: var(--gold-bright); }
.online::before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: var(--gold); box-shadow: 0 0 10px var(--gold); }
.online.live { color: var(--green); }
.online.live::before { background: var(--green); box-shadow: 0 0 10px var(--green); }
.rows { display: grid; gap: 0; }
.rows div { display: flex; justify-content: space-between; gap: 12px; padding: 9px 0; border-bottom: 1px solid #28261F; font-size: 14px; }
.rows span:first-child { color: var(--ink-mute); font-family: "DM Mono", Consolas, monospace; font-size: 11.5px; letter-spacing: .08em; text-transform: uppercase; }
.rows span:last-child { font-family: "DM Mono", Consolas, monospace; font-weight: 500; text-align: right; }
.rows span.dim { color: var(--ink-mute); font-weight: 400; }
.status .btn { width: 100%; margin-top: 6px; }
.status .note { font-size: 12.5px; color: var(--ink-mute); font-style: italic; }
@media (max-width: 1050px) { .hero-grid { grid-template-columns: 1fr; } .status { max-width: 520px; } }

/* feature cards */
.section { padding-top: 26px; }
.cards { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; }
.card { position: relative; min-height: 265px; border: 1px solid #5E4A26; border-radius: 4px; overflow: hidden; background: var(--surface); display: block; }
.card img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform .4s ease; }
.card:hover img { transform: scale(1.04); }
.card::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, transparent 30%, rgba(7, 9, 11, .94) 82%); }
.card .body { position: absolute; z-index: 2; left: 18px; right: 18px; bottom: 16px; display: grid; gap: 6px; }
.card h3 { font-family: Cinzel, Marcellus, "Trajan Pro", Georgia, serif; font-weight: 700; font-size: 18px; letter-spacing: .04em; text-transform: uppercase; color: #EAD89C; line-height: 1.1; }
.card p { color: #C4BBAA; font-size: 13px; }
.card .more { font-family: "DM Mono", Consolas, monospace; font-size: 10.5px; letter-spacing: .12em; text-transform: uppercase; color: var(--gold); }
@media (max-width: 1050px) { .cards { grid-template-columns: 1fr 1fr; } }
@media (max-width: 560px) { .cards { grid-template-columns: 1fr; } .card { min-height: 220px; } }

/* dashboard columns */
.cols { display: grid; grid-template-columns: 1.15fr .9fr .95fr; gap: 14px; margin-top: 16px; }
.panel { border: 1px solid #4A3C20; border-radius: 4px; background: linear-gradient(180deg, #0E1115, #090B0E); padding: 18px 20px; display: grid; gap: 14px; align-content: start; }
.panel .head { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; border-bottom: 1px solid #39321F; padding-bottom: 10px; }
.panel h3 { font-family: Cinzel, Marcellus, "Trajan Pro", Georgia, serif; font-weight: 700; font-size: 17px; letter-spacing: .06em; color: #DDBF77; }
.panel .link { font-family: "DM Mono", Consolas, monospace; font-size: 10.5px; letter-spacing: .12em; text-transform: uppercase; color: var(--gold); }
.news { display: grid; gap: 0; }
.news article { display: grid; grid-template-columns: 110px 1fr; gap: 14px; padding: 11px 0; border-bottom: 1px solid #24231E; align-items: start; }
.news article img { width: 110px; height: 70px; object-fit: cover; border: 1px solid #5F4A27; border-radius: 3px; }
.news small { display: block; font-family: "DM Mono", Consolas, monospace; font-size: 10px; letter-spacing: .1em; text-transform: uppercase; color: var(--ink-mute); margin-bottom: 3px; }
.news h4 { margin: 0 0 3px; font-family: Cinzel, Marcellus, Georgia, serif; font-size: 14.5px; font-weight: 700; color: #E7DFCD; }
.news p { color: var(--ink-soft); font-size: 13.5px; }
.steps { margin: 0; padding: 0; list-style: none; counter-reset: s; display: grid; gap: 14px; }
.steps li { display: grid; grid-template-columns: 36px minmax(0, 1fr); gap: 12px; counter-increment: s; align-items: start; }
.steps li::before { content: counter(s); font-family: Cinzel, Marcellus, "Trajan Pro", Georgia, serif; font-size: 24px; color: var(--gold); line-height: 1; }
.steps b { display: block; font-weight: 600; margin-bottom: 3px; }
.steps p { color: var(--ink-soft); font-size: 14.5px; }
.steps a { color: var(--gold); }
.journey { display: grid; gap: 12px; }
.journey .dl { position: relative; min-height: 190px; border: 1px solid #6B542A; border-radius: 4px; overflow: hidden; display: flex; align-items: flex-end; justify-content: center; text-align: center; background: linear-gradient(180deg, rgba(0, 0, 0, .15), rgba(0, 0, 0, .78)), url("img/client-portal.jpg") center / cover; }
.journey .dl .inside { padding: 18px; display: grid; gap: 6px; justify-items: center; }
.journey .dl h4 { margin: 0; font-family: Cinzel, Marcellus, Georgia, serif; font-size: 19px; color: #E7D4A0; }
.journey .dl p { color: #C0B7A5; font-size: 13px; }
.journey .two { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.journey .mini { border: 1px solid #4F4024; border-radius: 4px; padding: 16px 12px; display: grid; gap: 4px; text-align: center; background: #0D0F0D; }
.journey .mini h4 { margin: 0; font-family: Cinzel, Marcellus, Georgia, serif; font-size: 14px; color: #E7BD5E; }
.journey .mini p { color: var(--ink-mute); font-size: 12.5px; }
.demo { font-family: "DM Mono", Consolas, monospace; font-size: 11px; letter-spacing: .08em; color: var(--ink-mute); }
@media (max-width: 1050px) { .cols { grid-template-columns: 1fr; } }

/* vows, founders, constitution, callout */
.band { margin-top: 28px; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); display: grid; grid-template-columns: repeat(4, 1fr); }
.vow { padding: 20px 20px 20px 0; border-right: 1px solid var(--line); }
.vow + .vow { padding-left: 20px; } .vow:last-child { border-right: 0; }
.vow .k { font-family: Cinzel, Marcellus, "Trajan Pro", Georgia, serif; font-weight: 700; font-size: 13.5px; letter-spacing: .08em; text-transform: uppercase; color: var(--gold); }
.vow .v { color: var(--ink-soft); font-size: 14.5px; margin-top: 6px; }
@media (max-width: 820px) { .band { grid-template-columns: 1fr 1fr; } .vow:nth-child(2) { border-right: 0; } .vow:nth-child(3), .vow:nth-child(4) { border-top: 1px solid var(--line); } .vow:nth-child(3) { padding-left: 0; } }
@media (max-width: 460px) { .band { grid-template-columns: 1fr; } .vow { border-right: 0; padding-left: 0 !important; } .vow + .vow { border-top: 1px solid var(--line); } }
.duo { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; margin-top: 16px; }
.duo .panel h3 { font-size: 20px; }
.duo p { color: var(--ink-soft); font-size: 15px; }
.rules { margin: 0; padding: 0; list-style: none; display: grid; gap: 8px; }
.rules li { display: grid; grid-template-columns: 18px 1fr; gap: 10px; font-size: 14.5px; color: var(--ink-soft); }
.rules li::before { content: ""; width: 9px; height: 9px; margin-top: 7px; border: 1.5px solid var(--green); transform: rotate(45deg); }
.rules.never li::before { border-color: var(--ember); background: var(--ember); }
@media (max-width: 820px) { .duo { grid-template-columns: 1fr; } }
.callout { margin-top: 28px; border: 1px solid #5E4A26; border-radius: 4px; background: linear-gradient(180deg, rgba(0, 0, 0, .55), rgba(7, 9, 11, .92)), url("img/client-portal.jpg") center / cover; padding: clamp(32px, 6vw, 72px) 24px; display: grid; gap: 14px; justify-items: center; text-align: center; }
.callout h2 { font-family: Cinzel, Marcellus, Georgia, serif; font-size: clamp(26px, 4vw, 44px); letter-spacing: .02em; color: var(--gold); text-shadow: 0 2px 12px rgba(0, 0, 0, .9); }
.callout p { max-width: 56ch; color: #D8D0BE; font-size: 16px; text-shadow: 0 1px 8px rgba(0, 0, 0, .9); }

/* generic subpages (download, conta, legal) */
.page-head { padding: 40px 0 8px; display: grid; gap: 10px; }
.page-head h1 { font-family: Cinzel, Marcellus, "Trajan Pro", Georgia, serif; font-size: clamp(30px, 4.5vw, 52px); letter-spacing: .04em; color: var(--gold); }
.page-head .lead { color: var(--ink-soft); font-size: 17px; max-width: 64ch; }
.page { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(300px, .9fr); gap: 18px; margin-top: 18px; align-items: start; }
@media (max-width: 900px) { .page { grid-template-columns: 1fr; } }
.acct { border: 1px solid #5E4A26; border-radius: 4px; background: linear-gradient(180deg, #0E1115, #090B0E); padding: 22px; display: grid; gap: 14px; box-shadow: var(--shadow); }
.acct .t { font-family: Cinzel, Marcellus, "Trajan Pro", Georgia, serif; font-size: 16px; letter-spacing: .06em; color: #DDBF77; }
.acct h4 { font-family: "DM Mono", Consolas, monospace; font-size: 11px; letter-spacing: .14em; text-transform: uppercase; color: var(--gold); margin: 6px 0 0; }
.field { display: grid; gap: 6px; }
.field label { font-family: "DM Mono", Consolas, monospace; font-size: 11px; letter-spacing: .12em; text-transform: uppercase; color: var(--ink-mute); }
.field input, .field select { font: inherit; font-size: 15px; padding: 11px 12px; border: 1px solid var(--line-strong); border-radius: 3px; background: #090A09; color: var(--ink); width: 100%; }
.field input:focus-visible, .field select:focus-visible { outline: 2px solid var(--gold); outline-offset: 1px; border-color: var(--gold); }
.field small { color: var(--ink-mute); font-size: 12.5px; }
.row2 { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.row3 { display: grid; grid-template-columns: 2fr 1fr 1fr; gap: 12px; }
@media (max-width: 560px) { .row2, .row3 { grid-template-columns: 1fr; } }
.check { display: flex; gap: 10px; align-items: flex-start; font-size: 14px; color: var(--ink-soft); }
.check input { margin-top: 4px; }
.check a, .acct a.inline { color: var(--gold); }
.msg { font-size: 14px; padding: 10px 12px; border-radius: 3px; border: 1px solid var(--line); color: var(--ink-soft); background: rgba(255, 255, 255, .02); }
.msg.ok { border-color: var(--green); color: var(--green); }
.msg.err { border-color: var(--ember); color: var(--ember); }
.actions-row { display: flex; gap: 10px; flex-wrap: wrap; }
.kv { display: grid; gap: 0; border-top: 1px solid var(--line); }
.kv div { display: flex; justify-content: space-between; gap: 12px; padding: 8px 0; border-bottom: 1px solid var(--line); font-size: 14px; }
.kv span:first-child { color: var(--ink-mute); font-family: "DM Mono", Consolas, monospace; font-size: 11.5px; letter-spacing: .08em; text-transform: uppercase; }
.kv span:last-child { font-family: "DM Mono", Consolas, monospace; text-align: right; word-break: break-word; }
.faq { display: grid; gap: 0; margin-top: 18px; }
.faq details { border-top: 1px solid var(--line); padding: 12px 0; }
.faq details:last-child { border-bottom: 1px solid var(--line); }
.faq summary { cursor: pointer; font-weight: 600; font-size: 15.5px; }
.faq summary::marker { color: var(--gold); }
.faq p { margin-top: 8px; color: var(--ink-soft); font-size: 14.5px; }
.faq a { color: var(--gold); }
.subnav { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 18px; }
.subnav a { font-family: "DM Mono", Consolas, monospace; font-size: 11.5px; letter-spacing: .12em; text-transform: uppercase; padding: 9px 14px; border: 1px solid var(--line-strong); border-radius: 3px; color: var(--ink-soft); }
.subnav a[aria-current] { border-color: var(--gold); color: var(--gold); background: var(--gold-soft); }

/* footer */
footer { margin-top: 32px; border-top: 1px solid var(--line-gold); padding-top: 22px; display: grid; gap: 14px; color: var(--ink-mute); font-size: 13px; }
footer .foot { display: grid; grid-template-columns: 260px 1fr 250px; gap: 20px; align-items: center; }
footer nav { display: flex; justify-content: center; gap: 8px 14px; flex-wrap: wrap; font-family: "DM Mono", Consolas, monospace; font-size: 10.5px; letter-spacing: .1em; text-transform: uppercase; }
footer nav a:hover { color: var(--gold); }
footer .motto { text-align: right; font-family: "DM Mono", Consolas, monospace; font-size: 10.5px; letter-spacing: .12em; text-transform: uppercase; line-height: 1.7; }
footer .motto b { color: var(--gold-deep); }
footer .legal { text-align: center; font-size: 12px; color: #6E7680; }
@media (max-width: 900px) { footer .foot { grid-template-columns: 1fr; text-align: center; } footer .motto { text-align: center; } footer .brand { justify-content: center; } }
@media (max-width: 680px) { .top { position: static; } .top .bar { min-height: 64px; } .brand small { display: none; } .brand .name { font-size: 18px; } .top .actions .lang { display: none; } .hero { min-height: auto; background-position: 60% center; } .hero-grid { min-height: auto; padding: 56px 0 40px; } .wordmark { font-size: 58px; } }

/* Shared editorial layer. Keep the existing account components and their states. */
:root {
  --ground:#0c1012;
  --ground-deep:#080b0d;
  --surface:#141a1e;
  --surface-2:#1b2328;
  --ink:#f0eadb;
  --ink-soft:#c7c8bf;
  --ink-mute:#a0aaa9;
  --line:#2a3438;
  --line-strong:#435052;
  --line-gold:#605338;
  --gold:#d4b25e;
  --gold-bright:#e6cb89;
  --gold-deep:#a68b4a;
  --green:#83c5ad;
  --ember:#f1a07d;
  --max:1280px;
  --display:Marcellus,Georgia,serif;
  --ui:system-ui,-apple-system,"Segoe UI",sans-serif
}

html {
  scroll-padding-top:110px
}

body {
  padding:0;
  line-height:1.65
}

h1,h2,h3,h4 {
  font-weight:400
}

img {
  display:block
}

button,input,select {
  font:inherit
}

main {
  min-width:0
}

::selection {
  background:var(--gold);
  color:var(--ground)
}

.wrap {
  width:min(var(--max),calc(100% - 2 * clamp(20px,4vw,64px)))
}

:focus-visible {
  outline:2px solid var(--gold-bright);
  outline-offset:5px
}

.skip-link {
  position:fixed;
  top:12px;
  left:20px;
  transform:translateY(-160%);
  z-index:100;
  padding:12px 20px;
  background:var(--gold);
  color:var(--gold-ink);
  font-family:var(--ui)
}

.skip-link:focus {
  transform:none
}

.eyebrow {
  display:block;
  font-family:var(--ui);
  font-size:.75rem;
  font-weight:600;
  letter-spacing:.18em
}

.btn {
  min-height:48px;
  padding:12px 22px;
  font-family:var(--ui);
  font-size:.875rem;
  line-height:1.45;
  font-weight:600;
  letter-spacing:0;
  text-transform:none;
  background:#16171ae6;
  box-shadow:none;
  transition:background .18s,border-color .18s,color .18s;
  text-align:center;
  border-radius:4px
}

.btn:hover {
  transform:none;
  background:var(--surface-2)
}

.btn.gold {
  background:var(--gold);
  border-color:var(--gold);
  box-shadow:none
}

.btn.gold:hover {
  background:var(--gold-bright);
  filter:none
}

.btn.ghost {
  border-color:transparent
}

.btn.ghost:hover {
  background:var(--surface-2)
}

.text-link {
  display:inline-flex;
  align-items:center;
  gap:12px;
  min-height:44px;
  font-family:var(--ui);
  font-size:.875rem;
  color:var(--gold)
}

.text-link:hover {
  text-decoration:underline;
  text-underline-offset:5px
}

.top {
  background:#0f1012f5;
  border-bottom-color:var(--line)
}

.top .bar {
  min-height:80px;
  gap:24px;
  padding-block:16px;
  align-items:center;
  flex-wrap:nowrap
}

.brand {
  flex-shrink:0
}

.brand img {
  width:44px;
  height:44px;
  object-fit:contain
}

.brand .name {
  font-family:var(--display);
  font-size:1.5rem;
  font-weight:400;
  letter-spacing:.16em
}

.brand small {
  font-family:var(--ui);
  font-size:.625rem;
  letter-spacing:.14em;
  margin-top:7px
}

.top nav {
  font-family:var(--ui);
  font-size:.875rem;
  letter-spacing:0;
  text-transform:none;
  gap:24px;
  flex-wrap:nowrap
}

.top nav a {
  padding:12px 0
}

.top nav a[aria-current]::after {
  height:1px;
  box-shadow:none;
  bottom:3px
}

.top .actions {
  gap:8px;
  margin-inline-start:auto;
  flex-shrink:0;
  justify-content:flex-end
}

.hero-test-note { max-width: 580px; margin: 20px 0 0; color: var(--ink-soft); font-size: .9375rem; line-height: 1.65; }
.hero-test-note a, .start-help a { color: var(--gold); text-decoration: underline; text-underline-offset: 4px; }
.start-help { display: flex; flex-wrap: wrap; gap: 12px 24px; margin-top: 24px; font-family: var(--ui); font-size: .875rem; line-height: 1.6; }

.top .actions .btn {
  min-height:44px;
  padding:10px 18px
}

.lang {
  font-family:var(--ui);
  font-size:.75rem;
  border:0
}

.menu-toggle {
  display:none;
  width:44px;
  height:44px;
  flex-shrink:0;
  align-items:center;
  justify-content:center
}

.hub-page { padding-bottom:64px }
#painel .panelgrid { grid-template-columns:minmax(0,1fr); max-width:900px; margin-inline:auto }
.account-nav { display:flex; flex-wrap:wrap; gap:8px; max-width:900px; margin:0 auto 24px; font-family:var(--ui) }
.account-nav button { min-height:44px; padding:12px 16px; border:1px solid var(--line); border-radius:3px; background:#16171a; color:var(--ink-soft); font:inherit; cursor:pointer }
.account-nav button[aria-pressed="true"] { color:var(--gold); border-color:var(--gold-deep); background:#292416 }
@media(max-width:640px) { .account-nav { display:grid; grid-template-columns:1fr 1fr } .account-nav button { padding:12px 8px; font-size:.8125rem } }
.account-operation { border-top:1px solid var(--line); padding-top:12px }
.account-operation summary { cursor:pointer; min-height:44px; padding:10px 0; color:var(--gold); font-family:var(--ui) }
.account-operation form,#form-email { display:grid; gap:16px; margin-top:16px }
.account-operation p,#form-email p { color:var(--ink-soft); line-height:1.6 }
.hub-index { display:flex; flex-wrap:wrap; gap:12px; margin:0 0 36px; font-family:var(--ui) }
.hub-index a { padding:12px 18px; border:1px solid var(--line); border-radius:3px; color:var(--gold) }
.hub-index a:hover { background:var(--surface) }
.hub-section { margin-top:64px; scroll-margin-top:110px }
.hub-section>h2 { margin:12px 0 28px; font-size:clamp(1.8rem,3vw,2.5rem) }
.hub-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:22px }
.hub-grid-two { grid-template-columns:repeat(2,minmax(0,1fr)) }
.hub-card { padding:28px; border:1px solid var(--line); border-top:2px solid var(--gold-deep); border-radius:3px; background:#16171a; min-width:0; overflow-wrap:anywhere }
.hub-card h2,.hub-card h3 { font-family:var(--display); font-weight:400; line-height:1.3; margin:0 0 16px; font-size:1.5rem }
.hub-card .eyebrow+h2,.hub-card .eyebrow+h3 { margin-top:16px }
.hub-card p { color:var(--ink-soft); line-height:1.7; margin:0 0 20px }
.hub-card .btn { margin-top:8px }
.hub-action { display:block; color:var(--ink) }
.hub-action:hover { border-color:var(--gold) }
.hub-facts { margin:0 0 20px; font-family:var(--ui); font-size:.875rem }
.hub-facts div { display:flex; justify-content:space-between; gap:16px; padding:10px 0; border-bottom:1px solid var(--line) }
.hub-facts dd { margin:0; text-align:right }
.hub-faq { max-width:900px }
.hub-faq summary { min-height:48px; padding-block:14px }
.hub-faq a { color:var(--gold); text-decoration:underline }
.hub-contact { display:grid; grid-template-columns:1fr 1fr; gap:40px; padding:32px; background:#16171a; border:1px solid var(--line); overflow-wrap:anywhere }
.hub-contact h2 { margin:12px 0 20px }
.hub-contact p,.hub-contact li { color:var(--ink-soft); line-height:1.7 }
.hub-contact ul { padding-left:20px }
@media(max-width:960px) {
  .hub-grid { grid-template-columns:1fr 1fr }
  .hub-contact { grid-template-columns:1fr; gap:24px }
}
@media(max-width:640px) {
  .hub-grid { grid-template-columns:1fr }
  .hub-section { margin-top:40px }
  .hub-card,.hub-contact { padding:22px }
  .hub-index { display:grid; grid-template-columns:1fr; gap:8px }
}

.menu-icon {
  position:relative;
  display:block;
  width:20px;
  height:16px
}

.menu-icon span {
  position:absolute;
  left:0;
  width:20px;
  height:2px;
  border-radius:2px;
  background:currentColor
}

.menu-icon span:nth-child(1) { top:0 }
.menu-icon span:nth-child(2) { top:7px }
.menu-icon span:nth-child(3) { top:14px }
.menu-toggle[aria-expanded="true"] .menu-icon span:nth-child(1) { top:7px; transform:rotate(45deg) }
.menu-toggle[aria-expanded="true"] .menu-icon span:nth-child(2) { opacity:0 }
.menu-toggle[aria-expanded="true"] .menu-icon span:nth-child(3) { top:7px; transform:rotate(-45deg) }

.top .bar .menu-toggle {
  padding:0
}

.hero {
  isolation:isolate;
  border-bottom-color:var(--line);
  background:var(--ground-deep);
  min-height:0
}

.hero-art {
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:60% 54%;
  z-index:-2
}

.hero::before {
  content:"";
  position:absolute;
  inset:0;
  z-index:-1;
  background:linear-gradient(90deg,#080b0df2 0%,#080b0ddb 32%,#080b0d45 72%,#080b0d36),linear-gradient(0deg,#0c1012 0%,transparent 42%)
}

.hero::after {
  display:none
}

.hero-grid {
  grid-template-columns:minmax(0,1fr) 380px;
  gap:48px;
  align-items:center;
  min-height:660px;
  padding:76px 0 58px
}

.hero-copy {
  gap:22px;
  max-width:670px
}

.hero-copy>.eyebrow {
  display:flex;
  align-items:center;
  gap:14px
}

.hero-copy>.eyebrow::before {
  content:"";
  height:1px;
  width:32px;
  background:var(--gold)
}

.wordmark {
  font-family:var(--display);
  font-size:clamp(3.6rem,7.5vw,7rem);
  font-weight:400;
  letter-spacing:.09em;
  line-height:1;
  color:var(--ink);
  text-shadow:none
}

.wordmark small {
  font-family:var(--ui);
  font-size:.75rem;
  letter-spacing:.3em;
  color:var(--gold-bright);
  margin-top:18px;
  line-height:1.6;
  font-weight:400;
  text-shadow:none
}

.hero h2 {
  font-family:var(--display);
  font-weight:400;
  font-size:clamp(1.7rem,2.8vw,2.6rem);
  line-height:1.18;
  max-width:22ch;
  text-shadow:none;
  letter-spacing:0;
  color:var(--ink)
}

.hero p.lead {
  max-width:48ch;
  color:#d2d5cb;
  font-size:1.125rem;
  text-shadow:none
}

.hero .cta {
  margin-top:0
}

.hero-caption {
  display:flex;
  align-items:center;
  gap:12px;
  font-family:var(--ui);
  font-size:.8125rem;
  color:var(--ink-soft)
}

.hero-caption span+span::before {
  content:"/";
  margin-right:12px;
  color:var(--gold-deep)
}

.status {
  align-self:start;
  margin-top:44px;
  background:#0e1519ed;
  border:1px solid #5b513b;
  border-top:2px solid var(--gold);
  padding:24px;
  gap:14px;
  box-shadow:none
}

.status .rows div {
  padding-block:8px
}

@media(min-width:961px) {
  .status {
    grid-template-columns:1fr auto
  }
  .status .head,.status .rows,.status .note {
    grid-column:1 / -1
  }
  .status .status-refresh {
    grid-column:2;
    grid-row:2;
    text-align:right;
    min-height:44px
  }
}

.status .head {
  border:0;
  padding:0
}

.status .head .t {
  font-family:var(--display);
  font-size:1.25rem;
  font-weight:400;
  letter-spacing:0
}

.online {
  font-family:var(--ui);
  font-size:.75rem;
  letter-spacing:0;
  color:var(--ink-mute)
}

.online::before {
  width:6px;
  height:6px;
  box-shadow:none;
  background:currentColor
}

.online.live::before {
  box-shadow:none
}

.world-population {
  display:flex;
  align-items:center;
  gap:10px
}

.world-population strong {
  font-family:var(--ui);
  font-weight:600;
  font-size:1rem;
  line-height:1.5
}

.world-population span {
  font-family:var(--ui);
  font-size:1rem;
  color:var(--ink-mute)
}

.rows div,.kv div {
  gap:16px;
  padding:10px 0;
  border-color:var(--line);
  font-family:var(--ui);
  font-size:.875rem
}

.rows span:first-child,.kv span:first-child {
  font-family:var(--ui);
  font-size:.875rem;
  letter-spacing:0;
  text-transform:none
}

.rows span:last-child,.kv span:last-child {
  font-family:var(--ui);
  font-weight:400;
  min-width:0;
  overflow-wrap:anywhere
}

.status .note {
  font-family:var(--ui);
  font-size:.75rem;
  line-height:1.5;
  font-style:normal
}

.status-refresh {
  border:0;
  padding:4px 0;
  min-height:32px;
  background:transparent;
  color:var(--gold);
  cursor:pointer;
  text-align:left;
  font-family:var(--ui);
  font-size:.8125rem
}

.section {
  padding-top:80px
}

.section-heading {
  display:flex;
  align-items:end;
  justify-content:space-between;
  gap:24px;
  margin-bottom:28px
}

.section-heading .eyebrow {
  margin-bottom:12px
}

.section-heading h2 {
  font-family:var(--display);
  font-size:clamp(1.8rem,3vw,2.5rem)
}

.section-heading>p {
  color:var(--ink-mute);
  max-width:34ch;
  font-size:1rem
}

.cards {
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:20px
}

.card {
  display:flex;
  flex-direction:column;
  min-width:0;
  min-height:0;
  border-color:var(--line);
  background:var(--surface)
}

.card img {
  position:static;
  width:100%;
  height:auto;
  aspect-ratio:1.4;
  object-fit:cover;
  border-bottom:1px solid var(--line);
  transition:none
}

.card:hover img {
  transform:none
}

.card::after {
  display:none
}

.card .body {
  position:static;
  display:grid;
  gap:12px;
  padding:22px
}

.card h3 {
  font-family:var(--display);
  font-size:1.375rem;
  letter-spacing:0;
  text-transform:none;
  font-weight:400;
  line-height:1.25;
  color:var(--ink)
}

.card p {
  font-size:1rem;
  color:var(--ink-soft)
}

.card .number {
  font-family:var(--ui);
  font-size:.75rem;
  color:var(--gold);
  letter-spacing:.12em
}

.card .more {
  font-family:var(--ui);
  font-size:.875rem;
  text-transform:none;
  letter-spacing:0
}

a.card:hover {
  border-color:var(--gold-deep)
}

.cols {
  grid-template-columns:minmax(0,1.65fr) minmax(0,1fr);
  gap:40px;
  margin-top:72px;
  align-items:start
}

.panel {
  min-width:0;
  border-color:var(--line);
  background:var(--surface);
  padding:28px;
  gap:20px
}

.panel .head {
  gap:16px;
  padding-bottom:16px;
  border-color:var(--line)
}

.panel h3 {
  font-family:var(--display);
  font-size:1.5rem;
  font-weight:400;
  letter-spacing:0;
  color:var(--ink)
}

.panel .link {
  font-family:var(--ui);
  font-size:.75rem;
  letter-spacing:0;
  text-transform:none;
  color:var(--ink-mute)
}

.news-panel {
  border:0;
  padding:0;
  background:transparent
}

.news article {
  grid-template-columns:120px minmax(0,1fr);
  gap:24px;
  padding:22px 0;
  border-color:var(--line)
}

.news article:first-child {
  padding-top:0
}

.news article img {
  width:120px;
  height:100px;
  border:0
}

.news small {
  font-family:var(--ui);
  font-size:.75rem;
  letter-spacing:0;
  color:var(--gold);
  margin-bottom:8px
}

.news h4 {
  font-family:var(--display);
  font-size:1.3rem;
  font-weight:400;
  margin-bottom:8px
}

.news p {
  font-size:1rem
}

.news-archive {
  margin-top:16px
}

.news-archive summary {
  color:var(--gold);
  font-family:var(--ui);
  font-size:.875rem;
  cursor:pointer;
  padding-block:12px
}

.news-archive .news {
  margin-top:20px
}

.steps {
  gap:26px
}

.steps li {
  gap:16px
}

.steps li::before {
  font-family:var(--display);
  font-size:1.5rem;
  line-height:1.3
}

.steps b {
  margin-bottom:6px
}

.steps p {
  font-size:1rem
}

.steps p b {
  display:inline
}

.steps a,.faq a {
  text-decoration:underline;
  text-underline-offset:3px
}

.start-section {
  margin-top:64px;
  padding:36px;
  border:1px solid var(--line);
  border-top-color:var(--gold-deep);
  background:var(--surface);
  border-radius:4px
}

.start-section .steps {
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:36px
}

.journey {
  gap:24px
}

.journey .dl {
  min-height:240px;
  border:0;
  text-align:left;
  justify-content:start;
  background:linear-gradient(0deg,#080b0df5,#080b0d22),url("img/client-portal.jpg") center/cover
}

.journey .dl .inside {
  padding:28px;
  gap:14px;
  justify-items:start
}

.journey .dl h4 {
  font-family:var(--display);
  font-size:1.5rem
}

.journey .dl p {
  font-size:1rem
}

.journey .two {
  grid-template-columns:1fr;
  gap:8px
}

.journey .mini {
  padding:16px 0;
  border:0;
  border-bottom:1px solid var(--line);
  background:transparent;
  text-align:left;
  gap:8px
}

.journey .mini h4 {
  font-family:var(--display);
  font-size:1.125rem;
  color:var(--ink)
}

.journey .mini:hover h4 {
  color:var(--gold)
}

.journey .mini p {
  font-size:1rem
}

.demo {
  font-family:var(--ui);
  font-size:.8125rem;
  letter-spacing:0;
  line-height:1.6
}

.band {
  margin-top:72px;
  padding-block:32px;
  gap:28px
}

.vow,.vow+.vow {
  padding:0;
  border:0
}

.vow .k {
  font-family:var(--display);
  font-size:1.25rem;
  font-weight:400;
  letter-spacing:0;
  text-transform:none
}

.vow .v {
  font-size:1rem;
  margin-top:10px
}

.duo {
  gap:40px;
  margin-top:72px
}

.duo .panel {
  padding:36px
}

.duo .panel h3 {
  font-size:clamp(1.8rem,2.6vw,2.4rem)
}

.duo p,.rules li {
  font-size:1rem
}

.rules {
  gap:12px
}

.rules li::before {
  content:"+";
  width:auto;
  height:auto;
  border:0;
  transform:none;
  margin:0;
  color:var(--green);
  font-family:var(--ui)
}

.rules.never li::before {
  content:"−";
  background:none;
  color:var(--ember)
}

.rules-label {
  font-family:var(--ui);
  font-size:.8125rem;
  color:var(--ink-mute)
}

.callout {
  margin-top:72px;
  border-color:var(--line-gold);
  background:linear-gradient(90deg,#0f1012ed,#0f1012b3),url("img/client-portal.jpg") center/cover;
  padding:clamp(32px,6vw,72px);
  gap:20px;
  text-align:left;
  justify-items:start
}

.callout h2 {
  font-family:var(--display);
  font-size:clamp(2rem,4vw,3.3rem);
  max-width:23ch;
  text-shadow:none;
  letter-spacing:0;
  color:var(--ink)
}

.callout p {
  max-width:55ch;
  font-size:1.125rem;
  text-shadow:none;
  color:var(--ink-soft)
}

.page-head {
  padding:56px 0 12px;
  gap:16px
}

.page-head h1 {
  font-family:var(--display);
  font-size:clamp(2.2rem,4.5vw,3.5rem);
  letter-spacing:0;
  color:var(--ink)
}

.page-head .lead {
  font-size:1.125rem;
  max-width:60ch
}

.page {
  grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr);
  gap:48px;
  margin-top:28px
}

.acct {
  min-width:0;
  border-color:var(--line);
  background:var(--surface);
  padding:32px;
  gap:20px;
  box-shadow:none
}

.acct .t {
  margin:0;
  font-family:var(--display);
  font-size:1.5rem;
  letter-spacing:0;
  color:var(--ink)
}

.acct h3,.acct h4 {
  font-family:var(--ui);
  font-size:.875rem;
  letter-spacing:0;
  text-transform:none;
  font-weight:600;
  border-top:1px solid var(--line);
  padding-top:20px;
  margin-top:4px
}

.field {
  gap:8px;
  min-width:0;
  align-content:start
}

.field label {
  font-family:var(--ui);
  font-size:.875rem;
  font-weight:500;
  letter-spacing:0;
  text-transform:none;
  color:var(--ink)
}

.field input,.field select {
  font-family:var(--ui);
  font-size:1rem;
  min-height:48px;
  height:52px;
  padding:12px 14px;
  min-width:0;
  background:var(--ground)
}

.field small,.pw-hint {
  font-family:var(--ui);
  font-size:.8125rem;
  line-height:1.55
}

.row2,.row3 {
  gap:16px;
  align-items:start
}

.check {
  font-family:var(--ui);
  font-size:.875rem;
  gap:12px
}

.check input {
  width:18px;
  height:18px;
  flex:0 0 18px;
  accent-color:var(--gold)
}

.check a,.acct a.inline {
  text-decoration:underline;
  text-underline-offset:3px
}

.msg {
  font-family:var(--ui);
  font-size:.875rem;
  padding:14px 16px;
  background:var(--ground);
  overflow-wrap:anywhere
}

.msg.ok {
  border:1px solid var(--line);
  border-left:3px solid var(--green)
}

.msg.err {
  border:1px solid var(--line);
  border-left:3px solid var(--ember)
}

.faq {
  margin-top:24px
}

.faq details {
  padding:18px 0
}

.faq summary {
  font-size:1.125rem
}

.faq p {
  margin-top:12px;
  font-size:1rem
}

.subnav {
  gap:8px;
  margin-top:12px;
  padding-bottom:16px;
  border-bottom:1px solid var(--line)
}

.subnav a {
  font-family:var(--ui);
  font-size:.875rem;
  letter-spacing:0;
  text-transform:none;
  padding:12px 18px;
  border-color:transparent
}

.subnav a:hover {
  background:var(--surface)
}

.subnav a[aria-current] {
  border-color:var(--line-gold)
}

.password-wrap {
  display:flex;
  align-items:stretch;
  border:1px solid var(--line-strong);
  background:var(--ground);
  border-radius:4px
}

.password-wrap input {
  border:0;
  background:transparent;
  height:50px;
  min-height:0
}

.password-wrap { height:52px }

.account-page .page-head { padding-top:36px; gap:12px }
.account-page .page-head h1 { font-size:clamp(2rem,4vw,3rem); margin:0 }
.account-page .page-head .lead { max-width:62ch; font-size:1.0625rem }
.account-page:has(#entrar:not([hidden]) #form-login:not([hidden])) .page-head {
  max-width:520px;
  margin-inline:auto;
  text-align:center;
  justify-items:center
}
.account-page .subnav { margin-top:12px }
.account-page #criar { grid-template-columns:minmax(0,1.55fr) minmax(260px,.75fr); gap:40px }
.account-page #form-signup { gap:18px }
.account-page #form-signup>h3:first-of-type { border-top:0; padding-top:0 }
.legal-document a { text-decoration:underline; text-underline-offset:3px }
.account-page #criar .side { padding:28px; background:var(--surface); border:1px solid var(--line); border-radius:4px; gap:20px }
.account-page #criar .side .steps { gap:24px }
@media(max-width:960px) { .account-page #criar { grid-template-columns:1fr; gap:28px } }
@media(max-width:640px) {
  .account-page .page-head { padding-top:24px }
  .account-page #criar .side { padding:24px }
}

.password-toggle {
  flex:0 0 auto;
  padding:8px 12px;
  border:0;
  background:transparent;
  color:var(--gold);
  font-family:var(--ui);
  font-size:.8125rem;
  cursor:pointer
}

.panelgrid {
  grid-template-columns:repeat(auto-fit,minmax(min(100%,350px),1fr));
  gap:24px
}

.side {
  gap:28px;
  padding-block:20px
}

.side .t {
  font-family:var(--display);
  font-size:1.75rem;
  letter-spacing:0
}

.side p.lead {
  font-size:1.125rem
}

.status-line {
  font-size:1rem;
  overflow-wrap:anywhere
}

#form-login,#form-recover {
  margin-inline:auto
}

.login-links { display:flex; justify-content:space-between; gap:16px; flex-wrap:wrap; font-family:var(--ui); font-size:.875rem; margin-top:-8px }
.login-links a { display:inline-flex; align-items:center; min-height:44px; color:var(--gold) }
.login-links a:hover { text-decoration:underline; text-underline-offset:3px }

.codes span {
  overflow-wrap:anywhere
}

#qr {
  max-width:100%
}

.dlcard {
  border-top:2px solid var(--gold)
}

.dlcard .hash {
  font-size:.8125rem
}

.dlcard .hash b {
  display:block;
  margin-bottom:8px
}

.dlcard .alt {
  font-family:var(--ui);
  font-size:.875rem;
  text-align:center
}

.dlcard .alt a {
  text-decoration:underline
}

.dlcard .state {
  border:0;
  border-top:1px solid var(--line);
  padding:16px 0 0;
  font-family:var(--ui);
  font-size:.875rem
}

.download-details {
  border-top:1px solid var(--line);
  padding-top:16px
}

.download-details summary {
  cursor:pointer;
  color:var(--gold);
  font-family:var(--ui);
  font-size:.875rem;
  padding-block:6px
}

.download-details .hash {
  display:block;
  margin-top:16px
}

.grid2 {
  gap:32px;
  margin-top:48px
}

.grid2 .panel p {
  font-size:1rem
}

.download-page {
  grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr)
}

.download-guide {
  padding:24px 0
}

.download-guide h2 {
  font-family:var(--display);
  font-size:1.75rem;
  margin-bottom:28px
}

.legal-document {
  max-width:78ch;
  margin:56px auto 0
}

.legal-document h1 {
  font-family:var(--display);
  font-size:clamp(2rem,4vw,3rem);
  margin-block:16px 24px
}

.legal-document h2 {
  font-family:var(--display);
  font-size:1.5rem;
  margin-block:36px 16px
}

.legal-document p,.legal-document li {
  color:var(--ink-soft);
  font-size:1rem;
  line-height:1.8
}

.legal-document li+li {
  margin-top:10px
}

.legal-document .meta {
  font-family:var(--ui);
  font-size:.8125rem;
  color:var(--ink-mute)
}

.legal-document .note {
  border-left:2px solid var(--gold);
  background:var(--surface);
  padding:20px;
  margin-top:24px;
  color:var(--ink-soft)
}

.legal-document table {
  border-collapse:collapse;
  width:100%
}

.legal-document th,.legal-document td {
  border:1px solid var(--line);
  padding:14px;
  text-align:left;
  vertical-align:top;
  font-size:.875rem;
  color:var(--ink-soft)
}

.legal-document th {
  color:var(--ink);
  background:var(--surface);
  font-family:var(--ui);
  font-weight:500
}

.table-scroll {
  overflow-x:auto;
  margin-block:24px
}

footer {
  margin-top:80px;
  border-top-color:var(--line);
  padding-block:40px 28px;
  gap:28px
}

footer .foot {
  grid-template-columns:240px 1fr 180px;
  gap:36px;
  align-items:start
}

footer nav {
  justify-content:start;
  gap:12px 24px;
  font-family:var(--ui);
  font-size:.875rem;
  letter-spacing:0;
  text-transform:none
}

footer .motto {
  font-family:var(--display);
  font-size:1.125rem;
  letter-spacing:0;
  text-transform:none
}

footer .motto b {
  font-weight:400;
  color:var(--gold)
}

footer .legal {
  border-top:1px solid var(--line);
  padding-top:24px;
  text-align:left;
  font-family:var(--ui);
  font-size:.75rem;
  color:var(--ink-mute)
}

@media(max-width:1023px) {
  .top .bar {
    gap:16px;
    min-height:76px;
    padding-block:12px;
    flex-wrap:wrap
  }
  .top nav {
    order:3;
    width:100%;
    gap:8px 24px;
    flex-wrap:wrap;
    border-top:1px solid var(--line);
    padding-top:12px
  }
  .menu-toggle {
    display:inline-flex;
    order:2;
    min-height:44px;
    padding:10px 14px
  }
  .top[data-enhanced] nav:not([data-open]) {
    display:none
  }
  .brand small {
    display:none
  }
  .hero-grid {
    gap:40px;
    grid-template-columns:minmax(0,1fr) 340px
  }
  .cards {
    grid-template-columns:repeat(2,minmax(0,1fr))
  }
}

@media(max-width:960px) {
  .top .bar {
    min-height:76px
  }
  .menu-toggle {
    display:inline-flex;
    order:2;
    min-height:44px;
    padding:10px 14px
  }
  .top .actions {
    margin-left:auto
  }
  .top nav {
    order:3;
    width:100%;
    gap:8px 24px;
    border-top:1px solid var(--line);
    padding-top:12px
  }
  .top[data-enhanced] nav:not([data-open]) {
    display:none
  }
  .hero-grid {
    grid-template-columns:minmax(0,1fr) 280px;
    gap:28px;
    padding-block:60px 40px;
    min-height:0
  }
  .hero-copy {
    max-width:620px
  }
  .status {
    max-width:100%;
    grid-template-columns:1fr;
    padding:20px
  }
  .status .rows {
    grid-column:auto;
    grid-row:auto
  }
  .status .note {
    grid-column:1/-1
  }
  .cols {
    grid-template-columns:1fr;
    gap:36px
  }
  .journey {
    grid-template-columns:1fr 1fr;
    align-items:center
  }
  .journey>.head {
    grid-column:1/-1
  }
  .page {
    gap:28px;
    grid-template-columns:1fr
  }
  .start-section .steps {
    grid-template-columns:1fr;
    gap:28px
  }
  .band {
    grid-template-columns:1fr 1fr
  }
  .duo {
    gap:24px
  }
  footer .foot {
    grid-template-columns:1fr 1fr;
    text-align:left
  }
  footer .brand {
    justify-content:start
  }
  footer .motto {
    display:none
  }
}

@media(max-width:760px) {
  .status {
    margin-top:0
  }
  .hero-grid {
    grid-template-columns:1fr;
    gap:32px;
    padding-block:40px 32px
  }
  .hero-copy {
    max-width:none
  }
  .hero-caption {
    flex-wrap:wrap
  }
  .top nav {
    max-height:calc(100dvh - 88px);
    overflow-y:auto;
    overscroll-behavior:contain
  }
  .status-refresh {
    min-height:44px
  }
}

@media(max-width:640px) {
  html {
    scroll-padding-top:90px
  }
  .top {
    position:sticky
  }
  .top .bar {
    gap:8px;
    min-height:68px;
    padding-block:10px
  }
  .brand {
    gap:8px
  }
  .brand img {
    width:32px;
    height:32px
  }
  .brand .name {
    font-size:1.125rem;
    letter-spacing:.1em
  }
  .top .actions>.btn:not(.gold),.lang {
    display:none
  }
  .top .actions .btn {
    padding-inline:12px;
    font-size:.8125rem
  }
  .menu-toggle {
    padding-inline:10px;
    font-size:.8125rem
  }
  .top nav {
    display:grid;
    grid-template-columns:1fr 1fr
  }
  .hero::before {
    background:linear-gradient(90deg,#080b0def,#080b0d80),linear-gradient(0deg,#0c1012,transparent)
  }
  .hero-art {
    object-position:64% center
  }
  .wordmark {
    font-size:clamp(2.8rem,12vw,4.6rem)
  }
  .wordmark small {
    font-size:.625rem;
    letter-spacing:.22em
  }
  .hero h2 {
    font-size:2rem
  }
  .hero p.lead {
    font-size:1rem
  }
  .hero .cta {
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:10px
  }
  .hero .cta .btn {
    min-width:0;
    padding-inline:12px
  }
  .hero-caption {
    flex-wrap:wrap;
    font-size:.75rem
  }
  .status {
    grid-template-columns:1fr 1fr;
    padding:20px;
    gap:12px 16px
  }
  .status .head,.status .rows,.status .note {
    grid-column:1 / -1
  }
  .status-refresh {
    text-align:right;
    grid-column:2;
    grid-row:2
  }
  .status .rows {
    grid-column:1 / -1;
    grid-row:auto
  }
  .section {
    padding-top:48px
  }
  .section-heading {
    display:grid;
    gap:16px
  }
  .cards {
    grid-template-columns:1fr;
    gap:24px
  }
  .card img {
    aspect-ratio:1.9
  }
  .cols,.duo,.band,.callout {
    margin-top:48px
  }
  .start-section {
    margin-top:48px;
    padding:24px
  }
  .news article {
    display:block
  }
  .news article img {
    width:76px;
    height:76px;
    float:right;
    margin:0 0 12px 16px
  }
  .news article::after {
    content:"";
    display:block;
    clear:both
  }
  .news h4 {
    font-size:1.25rem
  }
  .panel,.acct,.duo .panel {
    padding:24px
  }
  .news-panel {
    padding:0
  }
  .journey,.duo,.band,.grid2 {
    grid-template-columns:1fr
  }
  .vow+.vow {
    padding-top:24px;
    border-top:1px solid var(--line)
  }
  .callout {
    padding:32px 24px
  }
  .callout .cta {
    display:grid
  }
  .row2,.row3 {
    grid-template-columns:1fr
  }
  .page-head {
    padding-top:36px
  }
  .subnav {
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:8px
  }
  .subnav a {
    padding:12px;
    text-align:center;
    border-color:var(--line)
  }
  .actions-row {
    flex-direction:column
  }
  .panel .head {
    flex-wrap:wrap
  }
  .field label,.field small,.check,.msg,.side,.acct,.panel {
    overflow-wrap:anywhere
  }
  .password-toggle {
    min-width:68px;
    min-height:48px
  }
  .faq summary,details.opt summary {
    min-height:44px;
    padding-block:8px
  }
  .legal-document {
    max-width:100%;
    min-width:0
  }
  .legal-document table {
    min-width:560px
  }
  .legal-document {
    margin-top:36px
  }
  footer {
    margin-top:56px
  }
  footer .foot {
    grid-template-columns:1fr;
    gap:28px
  }
  footer nav {
    gap:16px 24px
  }
}

@media(max-width:360px) {
  .top .brand .name {
    font-size:1rem
  }
  .top .brand img {
    width:28px;
    height:28px
  }
  .top .actions .btn {
    padding-inline:9px
  }
  .panel,.acct,.duo .panel,.start-section {
    padding:18px
  }
  .codes {
    grid-template-columns:1fr
  }
}

@media(prefers-reduced-motion:reduce) {
  html {
    scroll-behavior:auto
  }
  *,*::before,*::after {
    transition:none!important;
    animation:none!important
  }
}

/* Mobile navigation drawer and compact account actions. */
.drawer-head,.menu-backdrop,.drawer-open,.drawer-list { display:none }
.drawer-group,.drawer-row { display:contents }
@media(max-width:1023px) {
  .top { backdrop-filter:none }
  .top[data-enhanced] .bar { flex-wrap:nowrap }
  .top .bar .menu-toggle { order:-1 }
  .menu-is-open { overflow:hidden }
  .menu-backdrop:not([hidden]) { display:block; position:fixed; inset:0; z-index:51; background:#0009 }
  .top[data-enhanced] nav[data-open] {
    display:flex; position:fixed; inset:0 auto 0 0; z-index:52;
    width:min(320px,calc(100vw - 48px)); height:100dvh; max-height:none; overflow-y:auto;
    flex-direction:column; flex-wrap:nowrap; align-items:stretch; justify-content:flex-start;
    gap:4px; padding:24px; border:0; border-right:1px solid var(--line);
    background:var(--surface); box-shadow:16px 0 48px #0005;
  }
  .drawer-head { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:24px; color:var(--gold) }
  .drawer-close { font-size:1.5rem; width:44px; padding:0 }
  .top nav a { padding:14px 12px; border-radius:4px; min-height:48px }
  .drawer-group { display:flex; flex-direction:column }
  .drawer-row { display:flex; align-items:center; gap:4px }
  .drawer-row > a { flex:1; min-width:0 }
  .drawer-open { display:block; flex:none; width:44px; min-height:48px; padding:0; border:0; border-radius:4px; background:transparent; color:var(--ink-mute); cursor:pointer }
  .drawer-open::before { content:""; display:block; width:8px; height:8px; margin:0 auto; border-right:1.5px solid currentColor; border-bottom:1.5px solid currentColor; transform:translateY(-2px) rotate(45deg); transition:transform .18s ease }
  .drawer-open[aria-expanded="true"] { color:var(--gold) }
  .drawer-open[aria-expanded="true"]::before { transform:translateY(2px) rotate(-135deg) }
  .drawer-list { display:flex; flex-direction:column; margin:2px 0 6px 12px; padding-left:12px; border-left:1px solid var(--line) }
  .drawer-list a { min-height:44px; padding:11px 12px; font-size:.9rem; color:var(--ink-mute) }
  .drawer-list a[aria-current] { color:var(--gold); background:var(--surface-2) }
  .drawer-list[hidden] { display:none }
  @media(prefers-reduced-motion:reduce) { .drawer-open::before { transition:none } }
  .top nav a[aria-current] { background:var(--surface-2) }
  .top nav a[aria-current]::after { display:none }
}
@media(max-width:640px) {
  .top .bar { gap:6px; padding-inline:0 }
  .top .actions { gap:4px }
  .top .actions>.btn:not(.gold) { display:inline-flex }
  .top .actions .btn { padding-inline:8px; font-size:.75rem; white-space:nowrap }
  .top .brand { gap:4px }
  .top .brand img { width:24px; height:28px }
  .top .brand .name { font-size:1rem; letter-spacing:.04em }
}
@media(max-width:360px) {
  .top .brand img { display:none }
  .top .brand .name { font-size:.875rem }
}

.hero-rule { display:block; width:48px; height:1px; margin-bottom:0; background:var(--gold); }

/* Section navigation: the same strip under the page head of News, InsanumWiki, Community and Support. */
.portal-nav { display:flex; flex-wrap:wrap; gap:8px; margin:0 0 32px; font-family:var(--ui); }
.portal-nav a { padding:10px 16px; border:1px solid var(--line); border-radius:3px; color:var(--ink-soft); }
.portal-nav a[aria-current],.portal-nav a:hover { border-color:var(--gold-deep); color:var(--gold); background:var(--surface-2); }
/* On the legal pages the strip opens the page and shares the text column. */
main > .portal-nav:first-child { max-width:78ch; margin:56px auto 0; }
.portal-nav + .legal-document { margin-top:32px; }
@media(max-width:640px) {
  .portal-nav { gap:6px; }
  .portal-nav a { padding:10px 12px; font-size:.85rem; }
}

/* Buying Insanum Coins: the packs, then the Pix code of the open order. */
.coins-packs { display:grid; grid-template-columns:repeat(auto-fill,minmax(140px,1fr)); gap:10px; margin:12px 0 18px }
.coins-packs .btn { display:grid; gap:2px; min-height:64px; padding:12px 10px; text-align:center }
.coins-packs .btn strong { font:400 1.1rem var(--display) }
.coins-packs .btn small { font:.75rem var(--ui); opacity:.85 }
.coins-buy { display:grid; gap:12px; padding:16px; border:1px solid var(--line-gold); border-radius:4px; background:var(--surface-2); margin-bottom:18px }
.coins-qr:empty { display:none }
.coins-qr img { display:block; margin:0 auto; width:220px; height:220px; border-radius:4px; background:#fff; padding:8px; image-rendering:pixelated }
.coins-buy .field input { font-family:"DM Mono",Consolas,monospace; font-size:.8rem }

/* Discord: the home box, the drawer row and the page. The mark stays white on blurple, as its brand rules ask. */
.discord-box { display:flex; align-items:center; gap:14px; flex-wrap:wrap; margin-top:14px; padding:14px 16px; border:1px solid rgba(88,101,242,.45); border-radius:4px; background:linear-gradient(180deg,rgba(88,101,242,.14),rgba(88,101,242,.05)) }
.discord-badge { display:grid; place-items:center; width:46px; height:46px; flex:none; border-radius:50%; color:#fff; background:#5865F2; box-shadow:0 0 0 5px rgba(88,101,242,.18) }
.discord-badge svg { width:26px; height:26px }
.discord-text { flex:1 1 180px; min-width:0 }
.discord-text h4,.discord-text h2 { margin:0 0 2px; font-size:1.05rem }
.discord-text p { margin:0; color:var(--ink-soft); font-size:.92rem }
.btn.discord-btn { color:#fff; border-color:#5865F2; background:#5865F2 }
.btn.discord-btn:hover { border-color:#7983f5; filter:brightness(1.08) }
.discord-box-wide { padding:20px 22px }
.discord-page .note { margin-top:16px }
.drawer-discord { display:none }
@media (max-width:1023px) {
  .drawer-discord { display:flex; align-items:center; gap:10px; min-height:48px; margin-top:10px; padding:11px 14px; border-radius:4px; color:#fff; background:#5865F2; font-family:"DM Mono",Consolas,monospace; font-size:.8rem; letter-spacing:.1em; text-transform:uppercase }
  .drawer-discord svg { width:20px; height:20px; flex:none }
}

/* Editorial pages reuse Insanum's existing palette, typography and components. */
.editorial .page-head { padding-block: 32px 20px; margin-bottom: 24px; }
.editorial .news-title { font-family: var(--display); font-size: 1.3rem; font-weight: 400; margin: 0 0 8px; }
.editorial .news-title a:hover { text-decoration: underline; text-underline-offset: 4px; }
.editorial-notice, .editorial-release { margin-block: 28px; }
.editorial-notice h2, .editorial-release h2 { margin: 8px 0 12px; }
.editorial-notice p { margin-bottom: 0; }
.editorial .news-panel { margin-block: 32px; }
.editorial .legal-document { padding-top: 48px; }
.editorial .legal-document > .eyebrow { margin-top: 28px; }
.editorial .subnav { display: flex; flex-wrap: wrap; gap: 12px; margin-block: 24px; }
.editorial-release ul { padding-left: 24px; }
.editorial-release article { border-top: 1px solid var(--line); padding-top: 20px; margin-top: 24px; }
.editorial-footnote { color: var(--ink-mute); }
.news h4 a:hover { text-decoration: underline; text-underline-offset: 4px; }
.news .text-link { display: inline-block; margin-top: 10px; }
.news-panel > .head { flex-wrap: wrap; gap: 12px; }
.editorial h1, .editorial h2, .editorial h3, .news h4 { overflow-wrap: anywhere; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0; }
@media (max-width: 640px) {
  .editorial .news-title { font-size: 1.25rem; }
  .editorial .legal-document { padding-top: 28px; }
  .editorial .subnav a { white-space: normal; }
}

.daily-world { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:24px; padding-block:32px; border-bottom:1px solid var(--line); }
.daily-selection { display:grid; gap:12px; padding:12px 0; }
.daily-selection > span { font:.7rem var(--ui); letter-spacing:.12em; text-transform:uppercase; color:var(--gold); }
.daily-selection strong { font:1.25rem var(--display); color:var(--ink); overflow-wrap:anywhere; }
.daily-selection:hover strong { color:var(--gold); }
.daily-world .note { grid-column:1/-1; margin:0; }
.daily-world .note:empty { display:none; }
@media(max-width:640px) { .daily-world { grid-template-columns:1fr; gap:8px; } }

/* News: a category emblem per item (it repeats on purpose) and one featured banner on the news page. */
.news article.news-row { grid-template-columns: 64px minmax(0, 1fr); gap: 22px; align-items: start; position: relative; padding: 24px 0; transition: background-color .2s ease; }
.news article.news-row:first-child { padding-top: 4px; }
.news-medal { display: grid; place-items: center; width: 60px; height: 60px; border-radius: 50%; color: var(--gold-bright);
  background: radial-gradient(circle at 50% 35%, #232c31 0, var(--surface) 62%, var(--ground-deep) 100%);
  border: 1px solid var(--line-gold); box-shadow: inset 0 0 0 3px var(--ground), inset 0 0 0 4px rgba(212, 178, 94, .28), 0 10px 22px rgba(0, 0, 0, .35); }
.news-medal svg { width: 28px; height: 28px; fill: none; stroke: currentColor; stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; }
.news-row:hover .news-medal { color: #fff3cf; border-color: var(--gold); }
.news small, .news-feature small { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin-bottom: 10px; font: .75rem var(--ui); color: var(--ink-mute); letter-spacing: 0; text-transform: none; }
.news-cat { padding: 3px 10px; border: 1px solid var(--line-gold); border-radius: 999px; color: var(--gold-bright); background: rgba(212, 178, 94, .07);
  font: 600 .68rem var(--ui); letter-spacing: .12em; text-transform: uppercase; }
.news-row h3 a, .news-row h4 a { background: linear-gradient(var(--gold), var(--gold)) 0 100% / 0 1px no-repeat; transition: background-size .25s ease, color .2s ease; }
.news-row:hover h3 a, .news-row:hover h4 a { color: var(--gold-bright); background-size: 100% 1px; text-decoration: none; }
.news-body p { max-width: 68ch; }

.news-spotlight { margin-block: 8px 40px; }
.news-feature { position: relative; display: grid; align-items: end; min-height: 380px; overflow: hidden; isolation: isolate;
  border: 1px solid var(--line-gold); border-radius: 6px; background: var(--ground-deep); box-shadow: 0 24px 60px rgba(0, 0, 0, .45); }
.news-feature > img { position: absolute; inset: 0; z-index: -2; width: 100%; height: 100%; object-fit: cover; object-position: 70% 40%; transition: transform 1.2s ease; }
.news-feature::before { content: ""; position: absolute; inset: 0; z-index: -1;
  background: linear-gradient(90deg, rgba(8, 11, 13, .94) 0, rgba(8, 11, 13, .82) 38%, rgba(8, 11, 13, .25) 72%, rgba(8, 11, 13, .05) 100%),
    linear-gradient(0deg, rgba(8, 11, 13, .7) 0, rgba(8, 11, 13, 0) 45%); }
.news-feature::after { content: ""; position: absolute; inset: 6px; z-index: -1; border: 1px solid rgba(212, 178, 94, .22); border-radius: 3px; pointer-events: none; }
.news-feature:hover > img { transform: scale(1.03); }
.news-feature-body { max-width: 620px; padding: 44px 48px; }
.news-feature-title { margin: 0 0 12px; font: 400 2.4rem/1.12 var(--display); color: var(--ink); overflow-wrap: anywhere; }
.news-feature-title a:hover { color: var(--gold-bright); }
.news-feature p { margin: 0 0 24px; color: var(--ink-soft); font-size: 1.05rem; }

.card img { aspect-ratio: 1.4; }
.card { overflow: hidden; }
.card:hover img { transform: scale(1.04); }
.cards .card img { transition: transform .9s ease; }

@media (max-width: 760px) {
  .news article.news-row { display: grid; grid-template-columns: 46px minmax(0, 1fr); gap: 14px; padding: 20px 0; }
  .news article.news-row::after { content: none; }
  .news-medal { width: 44px; height: 44px; box-shadow: inset 0 0 0 2px var(--ground), inset 0 0 0 3px rgba(212, 178, 94, .28); }
  .news-medal svg { width: 20px; height: 20px; }
  .news-feature { min-height: 0; }
  .news-feature > img { object-position: 78% 40%; }
  .news-feature::before { background: linear-gradient(0deg, rgba(8, 11, 13, .96) 0, rgba(8, 11, 13, .86) 55%, rgba(8, 11, 13, .35) 100%); }
  .news-feature-body { padding: 150px 22px 26px; }
  .news-feature-title { font-size: 1.7rem; }
}
@media (prefers-reduced-motion: reduce) {
  .news-feature > img, .cards .card img, .news-row h3 a, .news-row h4 a { transition: none; }
  .news-feature:hover > img, .card:hover img { transform: none; }
}