:root{
  --navy:#0E1B33; --navy2:#091324; --gold:#E8B923; --red:#C8102E;
  --line:rgba(255,255,255,.12); --muted:#aeb9cc; --card:#16263f;
}
*{ box-sizing:border-box; -webkit-tap-highlight-color:transparent; }
html,body{ margin:0; }
body{
  background:linear-gradient(180deg,var(--navy) 0%,var(--navy2) 100%); color:#fff;
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  min-height:100vh; line-height:1.6;
}
.wrap{ max-width:680px; margin:0 auto; padding:24px 18px 44px; }
a{ color:#ffd97a; }

/* header */
.brand{ display:flex; align-items:center; gap:10px; justify-content:center; margin-bottom:18px; text-decoration:none; color:#fff; }
.brand img{ width:46px; height:46px; }
.brand span{ font-weight:800; letter-spacing:.3px; font-size:15px; }
.crumb{ font-size:12.5px; color:var(--muted); margin:0 0 14px; }
.crumb a{ color:var(--muted); }

/* index */
h1{ font-size:27px; line-height:1.25; margin:6px 0 10px; letter-spacing:-.4px; }
.lead{ font-size:15px; color:var(--muted); margin:0 0 24px; }
.list{ display:flex; flex-direction:column; gap:10px; }
.item{ display:block; background:var(--card); border:1px solid var(--line); border-radius:14px;
       padding:15px 16px; text-decoration:none; color:#fff; }
.item .k{ font-size:10.5px; font-weight:800; letter-spacing:.6px; text-transform:uppercase; color:var(--gold); }
.item .h{ font-size:16px; font-weight:700; margin:3px 0 5px; line-height:1.3; }
.item .d{ font-size:13px; color:var(--muted); line-height:1.5; }

/* article */
article h1{ font-size:26px; margin:6px 0 8px; }
.meta{ font-size:12.5px; color:var(--muted); margin:0 0 22px; padding-bottom:16px; border-bottom:1px solid var(--line); }
article h2{ font-size:18px; margin:28px 0 8px; color:var(--gold); }
article p{ font-size:15.5px; margin:0 0 14px; }
article ul,article ol{ font-size:15.5px; padding-left:22px; margin:0 0 16px; }
article li{ margin-bottom:9px; }
article strong{ color:#fff; }
.box{ background:var(--card); border:1px solid var(--line); border-left:3px solid var(--gold);
      border-radius:0 12px 12px 0; padding:14px 16px; margin:20px 0; font-size:14.5px; }
.box b{ display:block; margin-bottom:4px; color:var(--gold); }

/* cta */
.cta{ display:block; text-align:center; background:var(--gold); color:#0E1B33; font-weight:800;
      font-size:16px; padding:15px; border-radius:13px; text-decoration:none; margin:30px 0 8px; }
.ctanote{ font-size:12px; color:var(--muted); text-align:center; margin:0 0 8px; }

/* nav between articles */
.more{ margin-top:32px; padding-top:18px; border-top:1px solid var(--line); }
.more h3{ font-size:14px; margin:0 0 10px; color:var(--muted); font-weight:700; }
.more a{ display:block; font-size:14px; margin-bottom:8px; }

.foot{ text-align:center; color:var(--muted); font-size:11.5px; margin-top:30px;
       line-height:1.7; border-top:1px solid var(--line); padding-top:16px; }
