/* ==========================================================================
   The Journal of Applied Wealth Management — original academic theme
   Deep viridian + antique gold + ivory. Classic journal masthead layout.
   ========================================================================== */
:root {
  --green:      #14453d;
  --green-dk:   #0c2f2a;
  --green-lt:   #1e6355;
  --gold:       #c9a227;
  --gold-dk:    #a5841c;
  --ivory:      #fbfaf5;
  --ivory-2:    #f3f1e8;
  --white:      #ffffff;
  --ink:        #23282b;
  --muted:      #5f6a66;
  --line:       #ddd8c8;
  --serif:      'Palatino Linotype', 'Book Antiqua', Palatino, Georgia, serif;
  --sans:       'Segoe UI', 'Helvetica Neue', Arial, sans-serif;
  --maxw:       1060px;
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin:0; font-family:var(--serif); color:var(--ink); background:var(--ivory); line-height:1.75; font-size:17.5px; -webkit-font-smoothing:antialiased; }
h1,h2,h3,h4 { font-family:var(--serif); color:var(--green); line-height:1.2; margin:0 0 .5em; font-weight:700; }
h2 { font-size:clamp(1.5rem,2.8vw,2.1rem); }
h3 { font-size:1.25rem; }
p { margin:0 0 1.1em; }
a { color:var(--green-lt); text-decoration:none; border-bottom:1px solid rgba(30,99,85,.3); }
a:hover { color:var(--gold-dk); border-bottom-color:var(--gold-dk); }
.wrap { max-width:var(--maxw); margin:0 auto; padding:0 24px; }

/* ---------- Masthead ---------- */
.topline { height:6px; background:linear-gradient(90deg, var(--green) 60%, var(--gold) 60%); }
.masthead { text-align:center; padding:34px 24px 20px; background:var(--white); border-bottom:1px solid var(--line); }
.masthead .publisher { font-family:var(--sans); text-transform:uppercase; letter-spacing:.3em; font-size:.68rem; color:var(--muted); margin-bottom:10px; }
.masthead h1.title { font-size:clamp(1.7rem,4vw,2.7rem); margin:0 0 4px; color:var(--green); font-weight:700; letter-spacing:.01em; }
.masthead h1.title a { color:inherit; border:0; }
.masthead .subtitle { font-style:italic; color:var(--muted); font-size:1.02rem; margin:0; }
.mast-rule { width:120px; height:2px; background:var(--gold); margin:14px auto 0; border:0; }

/* ---------- Nav ---------- */
.jnav { background:var(--white); border-bottom:3px double var(--line); position:sticky; top:0; z-index:50; }
.jnav ul { list-style:none; display:flex; justify-content:center; gap:0; margin:0 auto; padding:0; max-width:var(--maxw); flex-wrap:wrap; }
.jnav a { display:block; font-family:var(--sans); font-size:.82rem; letter-spacing:.14em; text-transform:uppercase; color:var(--ink); padding:13px 22px; border-bottom:3px solid transparent; }
.jnav a:hover { color:var(--green); border-bottom-color:var(--gold); }
.jnav a.active { color:var(--green); border-bottom-color:var(--green); font-weight:700; }
.jnav a.submit { background:var(--green); color:#fff; margin-left:10px; }
.jnav a.submit:hover { background:var(--gold-dk); border-bottom-color:transparent; color:#fff; }

/* ---------- Hero band ---------- */
.jhero { background:var(--green); color:#e8efe9; padding:60px 0; }
.jhero h2 { color:#fff; font-size:clamp(1.6rem,3.4vw,2.4rem); max-width:24ch; }
.jhero p { color:#cfe0d6; max-width:64ch; font-size:1.08rem; }
.jhero .kicker { font-family:var(--sans); text-transform:uppercase; letter-spacing:.28em; font-size:.7rem; color:var(--gold); margin-bottom:14px; }

/* ---------- Buttons ---------- */
.jbtn { display:inline-block; font-family:var(--sans); font-weight:700; letter-spacing:.06em; text-transform:uppercase; font-size:.8rem; padding:13px 28px; border:1px solid var(--gold); color:var(--gold); background:transparent; border-radius:0; }
.jbtn:hover { background:var(--gold); color:var(--green-dk); border-bottom-color:var(--gold); }
.jbtn.solid { background:var(--gold); color:var(--green-dk); }
.jbtn.solid:hover { background:#dab73f; }
.jbtn.green { border-color:var(--green); color:var(--green); }
.jbtn.green:hover { background:var(--green); color:#fff; }

/* ---------- Sections ---------- */
section.jsec { padding:64px 0; }
.jsec.alt { background:var(--white); border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
.kicker { font-family:var(--sans); text-transform:uppercase; letter-spacing:.28em; font-size:.7rem; color:var(--gold-dk); margin-bottom:12px; }
.two-col { display:grid; grid-template-columns:1.15fr .85fr; gap:56px; align-items:start; }

/* ---------- Topic list (journal style, two columns) ---------- */
.topics { columns:2; column-gap:44px; list-style:none; margin:0; padding:0; font-size:.98rem; }
.topics li { padding:6px 0 6px 22px; position:relative; break-inside:avoid; border-bottom:1px dotted var(--line); }
.topics li::before { content:"§"; position:absolute; left:0; color:var(--gold-dk); font-size:.85rem; top:8px; }

/* ---------- Info cards ---------- */
.jcard { background:var(--white); border:1px solid var(--line); border-top:4px solid var(--green); padding:30px 28px; }
.jcard.gold { border-top-color:var(--gold); }
.jcard h3 { margin-top:0; }
.jcard .num { font-family:var(--sans); font-weight:800; font-size:1.9rem; color:var(--gold-dk); line-height:1; }

/* ---------- Process steps ---------- */
.steps { counter-reset:s; list-style:none; margin:0; padding:0; }
.steps li { counter-increment:s; position:relative; padding:14px 0 14px 58px; border-bottom:1px solid var(--line); }
.steps li:last-child { border-bottom:0; }
.steps li::before { content:counter(s,decimal-leading-zero); position:absolute; left:0; top:14px; font-family:var(--sans); font-weight:800; color:var(--gold-dk); font-size:1.25rem; letter-spacing:.05em; }
.steps li strong { color:var(--green); }

/* ---------- Board list ---------- */
.board { display:grid; grid-template-columns:1fr 1fr; gap:26px; }
.member { background:var(--white); border:1px solid var(--line); padding:30px 28px; text-align:center; }
.member .role { font-family:var(--sans); text-transform:uppercase; letter-spacing:.2em; font-size:.68rem; color:var(--gold-dk); margin-bottom:8px; }
.member h3 { margin-bottom:.2em; }
.member .creds { color:var(--muted); font-style:italic; font-size:.95rem; margin-bottom:.8em; }
.member p { font-size:.96rem; text-align:left; }

/* ---------- Definition rows (contact) ---------- */
.defs { border-top:1px solid var(--line); }
.defs .row { display:grid; grid-template-columns:240px 1fr; gap:20px; padding:18px 0; border-bottom:1px solid var(--line); }
.defs .k { font-family:var(--sans); text-transform:uppercase; letter-spacing:.14em; font-size:.75rem; color:var(--green); font-weight:700; padding-top:4px; }

/* ---------- Notice ---------- */
.notice { background:var(--ivory-2); border-left:4px solid var(--gold); padding:20px 26px; font-size:.98rem; margin:1.6rem 0; }

/* ---------- Footer ---------- */
.jfooter { background:var(--green-dk); color:#b9cabf; padding:44px 0 24px; margin-top:0; font-size:.92rem; }
.jfooter a { color:#dfe8e0; border-bottom-color:rgba(223,232,224,.3); }
.jfooter a:hover { color:var(--gold); }
.jfooter .cols { display:grid; grid-template-columns:1.5fr 1fr 1fr; gap:40px; margin-bottom:30px; }
.jfooter h4 { color:#fff; font-size:1rem; margin-bottom:12px; }
.jfooter ul { list-style:none; margin:0; padding:0; }
.jfooter li { padding:4px 0; }
.jfooter .bottom { border-top:1px solid #24463e; padding-top:18px; display:flex; justify-content:space-between; flex-wrap:wrap; gap:8px; font-size:.8rem; color:#8fa89b; }
.jfooter .jname { font-family:var(--serif); font-style:italic; font-size:1.15rem; color:#fff; margin-bottom:8px; }

@media (max-width:820px) {
  .two-col, .board, .jfooter .cols { grid-template-columns:1fr; }
  .topics { columns:1; }
  .defs .row { grid-template-columns:1fr; gap:4px; }
  .jnav a { padding:11px 12px; font-size:.74rem; }
}
