/* FocusTraining — shared styles for legal pages */
:root{
  --ink:#0E1A2B; --ink-2:#17263D; --ground:#EFF1F6; --surface:#FFFFFF;
  --signal:#E8A33C; --signal-deep:#B87F27; --muted:#64748F;
  --line:#D9DEE8; --line-dark:#2B3A55;
  --f-display:"Bricolage Grotesque",system-ui,sans-serif;
  --f-body:"Source Serif 4",Georgia,serif;
  --f-mono:"IBM Plex Mono",ui-monospace,monospace;
  --pad:clamp(20px,5vw,64px);
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{margin:0;background:var(--ground);color:var(--ink);
  font-family:var(--f-body);font-size:17px;line-height:1.7;-webkit-font-smoothing:antialiased}
a{color:var(--signal-deep)}
.wrap{width:100%;max-width:820px;margin:0 auto;padding-inline:var(--pad)}

.top{background:var(--ink);border-bottom:1px solid var(--line-dark);position:sticky;top:0;z-index:20}
.top-in{display:flex;align-items:center;gap:20px;height:64px;max-width:1180px;margin:0 auto;padding-inline:var(--pad)}
.brand{display:flex;align-items:baseline;text-decoration:none;font-family:var(--f-display);
  font-weight:700;font-size:19px;letter-spacing:-.03em;color:#fff}
.brand span{color:var(--signal)}
.back{margin-left:auto;font-family:var(--f-display);font-size:14px;font-weight:500;
  color:#C2CEE2;text-decoration:none;padding:8px 14px;border:1px solid var(--line-dark);border-radius:100px}
.back:hover{color:#fff;border-color:#546A90}

.hero{background:var(--ink);color:#E8EDF6;padding:clamp(40px,6vw,72px) 0 clamp(34px,5vw,56px)}
.eyebrow{font-family:var(--f-mono);font-size:11.5px;font-weight:500;letter-spacing:.16em;
  text-transform:uppercase;color:var(--signal);display:flex;align-items:center;gap:10px;margin:0 0 16px}
.eyebrow::before{content:"";width:22px;height:1px;background:var(--signal)}
h1{font-family:var(--f-display);font-size:clamp(32px,5vw,50px);font-weight:600;
  letter-spacing:-.035em;line-height:1.05;margin:0 0 16px;color:#fff}
.dateline{font-family:var(--f-mono);font-size:12px;letter-spacing:.06em;color:#8FA0BC;margin:0}

main{padding:clamp(38px,5vw,64px) 0 clamp(56px,7vw,90px)}
.card{background:var(--surface);border:1px solid var(--line);border-radius:14px;
  padding:clamp(26px,4vw,48px)}
h2{font-family:var(--f-display);font-size:clamp(21px,2.4vw,26px);font-weight:600;
  letter-spacing:-.02em;line-height:1.2;margin:44px 0 14px;padding-top:26px;border-top:1px solid var(--line)}
.card > h2:first-child{margin-top:0;padding-top:0;border-top:none}
h3{font-family:var(--f-display);font-size:18px;font-weight:600;letter-spacing:-.012em;margin:26px 0 8px}
p{margin:0 0 1em}
p:last-child{margin-bottom:0}
ul{margin:0 0 1em;padding-left:22px}
li{margin-bottom:9px}
li:last-child{margin-bottom:0}
strong{font-weight:600}

.lede{font-size:19px;line-height:1.62;color:#33425C}
.note{background:#F5F7FB;border-left:2px solid var(--signal);border-radius:0 10px 10px 0;
  padding:18px 22px;margin:22px 0;font-size:16px;color:#3A4A66}
.todo{background:rgba(232,163,60,.1);border:1px dashed var(--signal-deep);border-radius:10px;
  padding:16px 20px;margin:22px 0;font-family:var(--f-mono);font-size:13px;line-height:1.65;color:#8A5F14}

table{width:100%;border-collapse:collapse;margin:18px 0;font-size:15.5px}
th,td{text-align:left;padding:12px 14px;border-bottom:1px solid var(--line);vertical-align:top}
th{font-family:var(--f-mono);font-size:11px;letter-spacing:.1em;text-transform:uppercase;
  color:var(--muted);font-weight:500}

footer{background:#0A1422;color:#8A9BB8;padding:36px 0;border-top:1px solid var(--line-dark)}
.foot-in{max-width:1180px;margin:0 auto;padding-inline:var(--pad);display:flex;flex-wrap:wrap;
  gap:12px 24px;align-items:center;font-family:var(--f-mono);font-size:11.5px;letter-spacing:.04em}
footer a{color:#8A9BB8;text-decoration:none}
footer a:hover{color:var(--signal)}
:focus-visible{outline:2.5px solid #5B76F7;outline-offset:3px;border-radius:4px}
