
:root{
  --bg:#0b0b0d;
  --panel:#101114;
  --panel-soft:#0f1013;
  --text:#eceef1;
  --muted:#b8bdc5;
  --brand:#caa85a;
  --brand-2:#e5cf8f;
  --ring:rgba(202,168,90,.45);
  --max:1120px;
  --radius:18px;
  --shadow:0 10px 30px rgba(0,0,0,.45);
}
*{box-sizing:border-box}
body{margin:0;background:radial-gradient(1200px 600px at 50% -100px, rgba(202,168,90,.08), transparent 60%), var(--bg);color:var(--text);font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;line-height:1.65}
a{color:var(--brand);text-decoration:none}a:hover{text-decoration:underline}
.container{max-width:var(--max);margin:0 auto;padding:0 1rem}

/* Header + logo */
.header{position:sticky;top:0;z-index:10;background:linear-gradient(180deg, rgba(11,11,13,.9), rgba(11,11,13,.65) 70%, rgba(11,11,13,0));backdrop-filter:saturate(1.2) blur(6px);border-bottom:1px solid #1e2026;padding-top:.25rem}
.nav{display:flex;align-items:center;justify-content:space-between;padding:.8rem 0}
.brand img{height:100px;margin-left:22px;filter:drop-shadow(0 10px 22px rgba(202,168,90,.28))}
.nav .right a{margin-left:1rem;opacity:.9}.nav .right a:hover{opacity:1}

/* Mobile nav padding so last item doesn't touch edge */
@media (max-width:640px){
  .nav .right{padding-right:14px}
  .nav .right a{margin-left:.9rem;margin-right:.9rem}
}

/* Hero + headings */
.hero{padding:2.2rem 0 1.2rem;border-bottom:1px solid #1c1f26}
body h1, body h2{color:var(--brand) !important;text-shadow:0 1px 0 #000}
.hero .sub{margin-top:.4rem;color:var(--muted)}

/* Grid + panels */
.grid{display:grid;gap:1rem;grid-template-columns:repeat(auto-fit,minmax(300px,1fr))}
.section{padding:1.6rem 0}
.panel{background:linear-gradient(180deg,var(--panel),var(--panel-soft));border:1px solid #23262e;border-radius:var(--radius);box-shadow:var(--shadow), inset 0 0 0 1px rgba(255,255,255,.02);padding:1rem;transition:transform .15s ease, box-shadow .2s ease, border-color .2s ease}
.card:hover{transform:translateY(-2px);box-shadow:0 16px 42px rgba(0,0,0,.55);border-color:#2b2f39}
.card h3{font-size:1rem;margin:.25rem 0}
.card .issuer{color:#dde0e6;font-weight:600}
.card .meta{color:#a1a7b0;font-size:.9rem;margin:.35rem 0}
.card .note{color:#d7dbe1;font-size:.95rem;margin:.5rem 0}

/* Buttons */
.btn{display:inline-block;background:linear-gradient(180deg,#1b1e25,#14171d);border:1px solid #2a2f39;border-radius:12px;padding:.55rem .85rem;color:#f5f7fa;text-decoration:none;font-size:.85rem;box-shadow:0 0 0 0 rgba(202,168,90,0);transition:box-shadow .2s}
.btn:hover{background:#151922;box-shadow:0 0 0 3px var(--ring)}

/* Cards as flex to pin PDF button at bottom */
.panel.card{display:flex;flex-direction:column;min-height:260px}
.panel.card .note{flex:0 0 auto}
.panel.card .btn{margin-top:auto;align-self:flex-start}
@media (max-width:520px){ .panel.card{min-height:unset} }

/* Details summary (Archiv) gold + hover glow */
details.panel summary{color:var(--brand) !important;cursor:pointer;font-weight:700;padding:.9rem 1rem;transition:color .2s, text-shadow .2s}
details.panel summary:hover{color:var(--brand-2) !important;text-shadow:0 0 6px rgba(202,168,90,.45)}

/* Footer */
.footer{border-top:1px solid #1c1f26;padding:1.6rem 0;color:#a6aebb;font-size:.92rem}
.footer a{color:#cbd1da}

/* v3.9 tweaks: round floating back-to-top button */
#toTop{
  position:fixed; right:18px; bottom:18px; z-index:50;
  display:none; opacity:.92;
  width:46px; height:46px;
  border-radius:50%;
  background:linear-gradient(180deg,#1b1e25,#14171d);
  color:#f7f9fb; font-size:20px; font-weight:bold;
  border:1px solid #2a2f39;
  box-shadow:0 8px 18px rgba(0,0,0,.45);
  cursor:pointer;
}
#toTop:hover{box-shadow:0 0 0 3px rgba(202,168,90,.45)}

/* v4.0: sticky, circular, gold-outline back-to-top */
.toTopWrap{position:sticky; bottom:18px; display:none;}
.toTopWrap .inner{display:flex; justify-content:flex-end;}
#toTop{
  width:46px; height:46px; border-radius:50%;
  background:transparent; color:var(--brand);
  border:2px solid var(--brand);
  display:inline-flex; align-items:center; justify-content:center;
  font-size:20px; line-height:1; font-weight:700;
  cursor:pointer;
  box-shadow:0 6px 14px rgba(0,0,0,.35);
}
#toTop:hover{box-shadow:0 0 0 3px rgba(202,168,90,.35)}
