/* The footer bar. Loaded last on every page, including home, so it beats the
   left-gutter footer rule that plate.css sets for the two-half homepage. */

footer{
  position:relative;z-index:8;
  background:var(--bg);
  border-top:1px solid var(--line);
  padding:clamp(44px,5vw,64px) 0 26px;
  display:block;
  font-family:"Space Grotesk",system-ui,sans-serif;
  text-transform:none;letter-spacing:normal;font-size:14px;color:var(--ink-2);
}
footer .wrap{width:100%;max-width:1120px;margin:0 auto;padding:0 clamp(20px,4vw,44px)}

.fgrid{
  display:grid;grid-template-columns:1.6fr 1fr 1fr;
  gap:clamp(28px,4vw,56px);
  padding-bottom:clamp(32px,4vw,48px);
}

.fbrand .brand{margin-bottom:14px}
.ftag{font-family:"Libre Baskerville",Baskerville,Georgia,serif;font-style:italic;
  font-weight:400;font-size:16px;color:var(--teal);margin-bottom:22px}

.fsocial{display:flex;gap:12px}
.fsocial a{
  width:34px;height:34px;display:grid;place-items:center;
  border:1px solid var(--line);color:var(--ink-3);
  transition:color .4s var(--ease),border-color .4s var(--ease);
}
.fsocial a:hover{color:var(--brass);border-color:var(--brassline)}
.fsocial svg{width:15px;height:15px;display:block}

.fcol{display:flex;flex-direction:column;align-items:flex-start;gap:11px}
.fcol h5{
  font-family:"Space Mono",monospace;font-size:9.5px;letter-spacing:.26em;
  text-transform:uppercase;color:var(--brass);font-weight:400;margin-bottom:6px;
}
.fcol a{
  color:var(--ink-2);text-decoration:none;font-size:14px;
  transition:color .4s var(--ease);
}
.fcol a:hover{color:var(--ink)}

.fbase{
  display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;
  padding-top:22px;border-top:1px solid var(--line);
  font-family:"Space Mono",monospace;font-size:10px;letter-spacing:.18em;
  text-transform:uppercase;color:var(--ink-3);
}

@media (max-width:820px){
  .fgrid{grid-template-columns:1fr 1fr;gap:34px 24px}
  .fbrand{grid-column:1 / -1}
}