/* ===========================================================
   Financial — shared menu styling
   Same house style as the study pages: navy ground, gold ink,
   Cinzel headings over Nunito body copy.
   =========================================================== */

:root{
  --ink:#0E1630;
  --ink-2:#182448;
  --ink-3:#22315C;
  --lead:#3C4C82;
  --gold:#E9B646;
  --gold-soft:#F3D68F;
  --gold-deep:#8F6A18;
  --azure:#5C97DC;
  --azure-soft:#B7D3F4;
  --emerald:#3AA37C;
  --emerald-soft:#8FE3BE;
  --ruby:#C9484A;
  --glass:#F6F1E4;
  --muted:#A7B2D6;
  --radius:16px;
}

*{box-sizing:border-box;}
html{background:#0B1128;}
body{
  margin:0;
  min-height:100vh;
  background-color:#0B1128;
  background-image:radial-gradient(125% 62% at 50% 0%, #2E3E78 0%, rgba(46,62,120,0) 62%);
  background-repeat:no-repeat;
  background-size:100% 720px;
  color:var(--glass);
  font-family:Nunito,"Trebuchet MS",system-ui,sans-serif;
  font-size:17px;
  line-height:1.5;
  -webkit-text-size-adjust:100%;
}
.wrap{max-width:760px;margin:0 auto;padding:22px 16px 60px;}

/* ---------- back link ---------- */
.back{
  display:inline-block;color:var(--muted);font-size:14.5px;font-weight:800;
  text-decoration:none;padding:9px 15px;border:2px solid var(--lead);border-radius:11px;
  transition:border-color .18s,color .18s;
}
.back:hover{border-color:var(--gold);color:var(--gold-soft);}
.back:focus-visible{outline:3px solid var(--azure);outline-offset:2px;}

/* ---------- masthead ---------- */
header.top{text-align:center;padding:14px 0 4px;}
.crest{
  width:64px;height:64px;margin:0 auto 13px;border-radius:50%;
  background:radial-gradient(circle at 50% 42%, #FFF3D0 0%, var(--gold) 32%, #B9822A 60%, var(--lead) 61%, var(--ink-2) 100%);
  box-shadow:0 0 0 3px var(--lead),0 0 34px rgba(233,182,70,.38);
  position:relative;
}
.crest::after{
  content:"";position:absolute;inset:11px;border-radius:50%;
  border:2px solid rgba(14,22,48,.55);
}
.toolcrest{
  width:62px;height:62px;margin:0 auto 13px;border-radius:16px;
  display:flex;align-items:center;justify-content:center;
  font-family:Cinzel,Georgia,serif;font-weight:700;font-size:26px;
  color:var(--gold);background:rgba(255,255,255,.04);
  border:2px solid var(--gold);box-shadow:0 0 26px rgba(233,182,70,.22);
  letter-spacing:.04em;
}
h1{
  font-family:Cinzel,Georgia,serif;font-weight:700;
  font-size:clamp(26px,7vw,40px);letter-spacing:.055em;
  margin:0;color:var(--gold-soft);text-wrap:balance;line-height:1.15;
}
.kicker{
  margin:9px 0 0;color:var(--muted);font-size:14px;
  letter-spacing:.14em;text-transform:uppercase;font-weight:700;
}

/* ---------- tool grid (menu of tools) ---------- */
.tools{display:flex;flex-direction:column;gap:11px;margin-top:26px;}
.tool{
  display:grid;grid-template-columns:52px 1fr auto;align-items:center;gap:15px;
  text-decoration:none;color:var(--glass);
  border:2px solid var(--lead);border-radius:14px;padding:16px 17px;
  background:linear-gradient(180deg,var(--ink-2) 0%,var(--ink) 100%);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.06);
  transition:border-color .18s,transform .12s,background .18s;
}
a.tool:hover{border-color:var(--gold);transform:translateY(-1px);}
a.tool:focus-visible{outline:3px solid var(--azure);outline-offset:2px;}
.tool .icon{
  width:52px;height:52px;border-radius:13px;display:flex;align-items:center;justify-content:center;
  border:2px solid var(--lead);background:rgba(255,255,255,.04);color:var(--gold);
}
.tool .icon svg{width:26px;height:26px;}
.tool .name{
  display:block;font-family:Cinzel,Georgia,serif;font-size:19px;font-weight:700;
  color:#FFF8E8;letter-spacing:.03em;line-height:1.2;
}
.tool .count{display:block;margin-top:4px;color:var(--muted);font-size:14.5px;font-weight:700;}
.tool .go{
  color:var(--gold);font-weight:800;font-size:15px;letter-spacing:.04em;white-space:nowrap;
}
.tool.empty{opacity:.5;}
.tool.empty .icon{color:var(--muted);}
.tool.empty .name{color:var(--muted);}

/* ---------- big cards (a tool's own sub-pages) ---------- */
.cards{display:flex;flex-direction:column;gap:12px;margin-top:24px;}
.card{
  display:block;text-decoration:none;color:var(--glass);
  border:2px solid var(--lead);border-radius:var(--radius);padding:18px;
  background:linear-gradient(180deg,var(--ink-2) 0%,var(--ink) 100%);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.06);
  transition:border-color .18s,transform .12s;
}
a.card:hover{border-color:var(--gold);transform:translateY(-1px);}
a.card:focus-visible{outline:3px solid var(--azure);outline-offset:2px;}
.card .eyebrow{
  display:block;font-size:12px;font-weight:800;letter-spacing:.13em;
  text-transform:uppercase;color:var(--azure-soft);
}
.card .title{
  display:block;margin-top:6px;font-family:Cinzel,Georgia,serif;
  font-size:21px;font-weight:700;color:#FFF8E8;letter-spacing:.03em;line-height:1.2;
}
.card .blurb{display:block;margin-top:8px;color:var(--muted);font-size:15.5px;line-height:1.45;}
.card .tags{display:flex;flex-wrap:wrap;gap:6px;margin-top:12px;}
.card .tags span{
  font-size:12px;font-weight:800;letter-spacing:.06em;color:var(--azure-soft);
  border:1px solid var(--lead);border-radius:20px;padding:4px 10px;
}
.card .open{display:block;margin-top:13px;color:var(--gold);font-weight:800;font-size:15px;letter-spacing:.04em;}

/* ---------- notes ---------- */
.note{
  margin-top:20px;padding:14px 16px;border-radius:12px;
  background:rgba(92,151,220,.11);border-left:5px solid var(--azure);
  font-size:15px;line-height:1.5;color:var(--glass);
}
.note b{color:var(--azure-soft);}
.soon{margin-top:18px;text-align:center;color:var(--muted);font-size:14.5px;line-height:1.5;}

footer{margin-top:28px;text-align:center;color:var(--muted);font-size:13.5px;line-height:1.7;}
footer b{color:var(--gold-soft);}

@media (prefers-reduced-motion:reduce){*{animation:none !important;transition:none !important;}}
