*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:#111;color:#2b2b2b;
  font:400 16px/1.65 Lato,"Trebuchet MS",Tahoma,Arial,sans-serif}
img{max-width:100%;height:auto;display:block}
a{color:#1d5c0f;text-decoration:none}
a:hover{text-decoration:underline}
a:focus-visible,button:focus-visible{outline:2px solid #2c7d17;outline-offset:2px}
.skip{position:absolute;left:-9999px;top:0;background:#fff;color:#000;padding:8px 14px;z-index:60}
.skip:focus{left:8px;top:8px}

.frame{max-width:1300px;margin:0 auto;background:#000}

/* 1. black top strip */
.strip{background:#000;border-bottom:1px solid #262626;display:flex;align-items:stretch;flex-wrap:wrap}
.brandmark{display:flex;align-items:center;gap:10px;padding:8px 18px;min-height:48px;
  border-right:1px solid #262626;text-decoration:none}
.brandmark:hover{text-decoration:none}
.brandmark img{width:30px;height:30px}
.wordmark{font-weight:900;letter-spacing:.06em;text-transform:uppercase;line-height:1.02;
  font-size:15px;color:#fff}
.wordmark span{display:block}
.wordmark span+span{color:#bdbdbd}
.strip nav{display:flex;flex-wrap:wrap;align-items:stretch;flex:1}
.strip nav ul{display:flex;flex-wrap:wrap;list-style:none;margin:0;padding:0}
.strip nav a{display:flex;align-items:center;min-height:48px;padding:0 15px;color:#e6e6e6;
  font:700 11px/1 Lato,"Trebuchet MS",Arial,sans-serif;letter-spacing:.1em;text-transform:uppercase}
.strip nav a:hover{background:#1b1b1b;text-decoration:none}
.strip nav li.on a{background:#2c7d17;color:#fff}
.striputil{display:flex;align-items:center;padding:0 16px;color:#8f8f8f;
  font:700 11px/1 Lato,Arial,sans-serif;letter-spacing:.1em;text-transform:uppercase;
  border-left:1px solid #262626}

/* shell grid */
.shell{display:grid;grid-template-columns:230px minmax(0,1fr) 240px;
  grid-template-areas:"rail feat side" "rail stream side" "rail arch side";align-items:start}
.rail{grid-area:rail;background:#000;padding:20px 18px 32px;align-self:stretch}
.feat{grid-area:feat}
.stream{grid-area:stream}
.side{grid-area:side;background:#000;padding:20px 16px 32px;align-self:stretch}
.arch{grid-area:arch}

/* 2. left rail */
.rail p.railnote{color:#9a9a9a;font-size:13px;margin:0 0 20px;border-bottom:1px solid #262626;padding-bottom:16px}
.railtitle{font:700 11px/1 Lato,Arial,sans-serif;letter-spacing:.12em;text-transform:uppercase;
  color:#fff;margin:0 0 10px;padding-bottom:8px;border-bottom:2px solid #2c7d17}
.rail ul{list-style:none;margin:0 0 26px;padding:0}
.rail li{border-bottom:1px solid #1e1e1e}
.rail li a{display:block;padding:8px 0;color:#dcdcdc;font-size:14px}
.rail li a:hover{color:#fff}
.railmark{width:54px;height:54px;margin-bottom:14px}

/* 3. featured tile grid */
.feat{background:#000;padding:16px 16px 0}
.feathead{font:700 11px/1 Lato,Arial,sans-serif;letter-spacing:.12em;text-transform:uppercase;
  color:#fff;margin:0 0 12px}
.tiles{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:0 0 16px}
.tile{position:relative;background:#0a0a0a;border:1px solid #1f1f1f;display:flex;
  flex-direction:column;color:#fff}
.tile:hover{text-decoration:none}
.tile img{width:100%;aspect-ratio:4/3;object-fit:cover;height:auto}
.tilebar{padding:10px 12px 14px;background:#000;flex:1}
.tag{display:inline-block;background:#2c7d17;color:#fff;padding:3px 8px;
  font:700 10px/1.3 Lato,Arial,sans-serif;letter-spacing:.1em;text-transform:uppercase;margin-bottom:8px}
.tiletitle{font:700 19px/1.28 Lato,"Trebuchet MS",Arial,sans-serif;color:#fff;margin:0;
  overflow-wrap:break-word}

/* 4. stream */
.stream{background:#fff;padding:26px 30px 30px}
.lead{margin:0 0 6px;font:700 46px/1.1 Lato,"Trebuchet MS",Arial,sans-serif;color:#111;letter-spacing:-.01em}
.deck{margin:0 0 22px;font-size:18px;color:#4a4a4a;max-width:52ch;padding-bottom:22px;border-bottom:4px solid #000}
.sechead{font:700 11px/1 Lato,Arial,sans-serif;letter-spacing:.12em;text-transform:uppercase;color:#111;
  margin:0 0 14px;padding-bottom:8px;border-bottom:2px solid #000}
.entry{display:grid;grid-template-columns:170px minmax(0,1fr);gap:18px;padding:18px 0;border-bottom:1px solid #d6d6d6}
.entry:first-of-type{padding-top:4px}
.entry h3{margin:0 0 6px;font:700 22px/1.25 Lato,"Trebuchet MS",Arial,sans-serif}
.entry h3 a{color:#111}
.meta{font:700 11px/1 Lato,Arial,sans-serif;letter-spacing:.1em;text-transform:uppercase;color:#7a7a7a;margin:0 0 8px}
.entry p.ex{margin:0;color:#3d3d3d;font-size:15px}
.tagline{display:inline-block;background:#2c7d17;color:#fff;padding:2px 7px;
  font:700 10px/1.3 Lato,Arial,sans-serif;letter-spacing:.1em;text-transform:uppercase;margin-right:8px}

/* 5. right widgets */
.widget{margin:0 0 26px}
.widget h2{font:700 11px/1 Lato,Arial,sans-serif;letter-spacing:.12em;text-transform:uppercase;color:#fff;
  margin:0 0 10px;padding-bottom:8px;border-bottom:2px solid #2c7d17}
.widget ul{list-style:none;margin:0;padding:0}
.widget li{border-bottom:1px solid #1e1e1e;padding:8px 0;color:#c8c8c8;font-size:13px}
.widget li a{color:#e8e8e8;display:block;font-size:14px;line-height:1.35}
.widget li a:hover{color:#fff}
.widget li .meta{color:#7e7e7e;margin:4px 0 0}
.widget p{color:#bdbdbd;font-size:13px;margin:0 0 10px}

/* 6. archives */
.arch{background:#fff;padding:4px 30px 34px}
.archgrid{display:grid;grid-template-columns:1fr 1fr;gap:0 34px}
.archgrid ul{list-style:none;margin:0;padding:0}
.archgrid li{display:flex;justify-content:space-between;gap:12px;padding:8px 0;border-bottom:1px solid #d6d6d6;font-size:15px}
.archgrid li b{font:700 11px/1.6 Lato,Arial,sans-serif;letter-spacing:.08em;color:#7a7a7a}

/* 7. footer */
.foot{background:#000;color:#bdbdbd;padding:30px 30px 26px;border-top:4px solid #2c7d17}
.footcols{display:grid;grid-template-columns:repeat(3,1fr);gap:26px}
.foot h2{font:700 11px/1 Lato,Arial,sans-serif;letter-spacing:.12em;text-transform:uppercase;color:#fff;
  margin:0 0 10px;padding-bottom:8px;border-bottom:1px solid #2a2a2a}
.foot ul{list-style:none;margin:0;padding:0}
.foot li{padding:5px 0}
.foot a{color:#cfcfcf;font-size:14px}
.foot .wordmark{font-size:24px;margin-bottom:10px}
.rights{margin:24px 0 0;padding-top:14px;border-top:1px solid #2a2a2a;font-size:12px;color:#8a8a8a}

/* detail routes */
.detail{background:#fff;padding:26px 30px 34px}
.label{display:inline-block;background:#2c7d17;color:#fff;padding:3px 9px;
  font:700 10px/1.3 Lato,Arial,sans-serif;letter-spacing:.1em;text-transform:uppercase;margin-bottom:12px}
.detail h1{margin:0 0 8px;font:700 38px/1.15 Lato,"Trebuchet MS",Arial,sans-serif;color:#111;max-width:22ch}
.dateline{font:700 11px/1 Lato,Arial,sans-serif;letter-spacing:.1em;text-transform:uppercase;color:#7a7a7a;
  margin:0 0 20px;padding-bottom:14px;border-bottom:4px solid #000}
.measure{max-width:700px}
.measure p{margin:0 0 16px}
.measure h2{font:700 24px/1.25 Lato,Arial,sans-serif;color:#111;margin:30px 0 10px;
  padding-bottom:8px;border-bottom:1px solid #d6d6d6}
.measure h3{font:700 17px/1.35 Lato,Arial,sans-serif;color:#111;margin:22px 0 6px}
.measure ul{margin:0 0 16px;padding-left:20px}
.measure li{margin:0 0 6px}
.jumps{list-style:none;display:flex;flex-wrap:wrap;gap:8px;margin:0 0 24px;padding:0}
.jumps a{display:inline-block;background:#2c7d17;color:#fff;padding:4px 10px;
  font:700 10px/1.3 Lato,Arial,sans-serif;letter-spacing:.1em;text-transform:uppercase}
.tablewrap{overflow-x:auto;margin:0 0 20px}
table{border-collapse:collapse;width:100%;min-width:360px;font-size:15px}
th,td{text-align:left;padding:9px 12px;border-bottom:1px solid #d6d6d6}
th{font:700 11px/1 Lato,Arial,sans-serif;letter-spacing:.1em;text-transform:uppercase;color:#111;
  border-bottom:2px solid #000}
.formula{background:#f4f4f4;border-left:4px solid #2c7d17;padding:14px 16px;margin:0 0 18px;font-size:15px}
.formula p{margin:0 0 6px}
.formula p:first-child{font-weight:700}
.prevnext{display:flex;flex-wrap:wrap;gap:16px;justify-content:space-between;
  margin:30px 0 0;padding-top:16px;border-top:4px solid #000;font-size:15px}
.backlink{margin:16px 0 0;font:700 11px/1 Lato,Arial,sans-serif;letter-spacing:.1em;text-transform:uppercase}
.prevnext+.backlink{margin-top:24px}
.qablock{border-bottom:1px solid #d6d6d6;padding:14px 0}
.qablock dt{font:700 18px/1.35 Lato,Arial,sans-serif;color:#111;margin:0 0 6px}
.qablock dd{margin:0;color:#3d3d3d}
.qablock dd p{margin:0 0 8px}
dl{margin:0 0 26px}

/* tablet */
@media (max-width:1080px){
  .shell{grid-template-columns:210px minmax(0,1fr);
    grid-template-areas:"rail feat" "rail stream" "rail side" "rail arch"}
  .side{background:#0a0a0a}
  .lead{font-size:38px}
}
/* mobile */
@media (max-width:900px){
  .shell{grid-template-columns:minmax(0,1fr);
    grid-template-areas:"rail" "feat" "stream" "side" "arch"}
  .rail{padding:18px 18px 24px}
  .rail ul{margin-bottom:18px}
  .railmark{width:44px;height:44px}
  .brandmark{border-right:0}
  .strip{flex-direction:column}
  .strip nav a{min-height:42px;padding:0 12px}
  .striputil{border-left:0;border-top:1px solid #262626;padding:10px 16px}
  .tiles{grid-template-columns:1fr 1fr}
  .tiles > *:first-child{grid-column:1/-1}
  .lead{font-size:32px}
  .deck{font-size:16px}
  .detail h1{font-size:28px}
  .stream,.arch,.detail,.foot{padding-left:18px;padding-right:18px}
  .entry{grid-template-columns:minmax(0,1fr);gap:10px}
  .entry img{max-width:220px}
  .archgrid{grid-template-columns:1fr}
  .footcols{grid-template-columns:1fr}
  .foot .brandcol{order:2}
}