/* ============ BASE — shared across all modes ============ */
*{margin:0;padding:0;box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  font-family:'Space Grotesk', sans-serif;
  -webkit-font-smoothing:antialiased;
  background:var(--bg);
  color:var(--text);
}
a{color:inherit;text-decoration:none;}
:focus-visible{outline:1px solid var(--accent);outline-offset:4px;}
img,svg{display:block;max-width:100%;}

/* NAV */
header.site-header{
  display:flex;justify-content:space-between;align-items:center;
  padding:28px clamp(24px,5vw,64px);
  border-bottom:1px solid var(--line-soft);
}
.brand{display:flex;align-items:baseline;gap:12px;}
.logo{font-size:14px;font-weight:600;letter-spacing:0.22em;transition:opacity .2s ease;}
.logo:hover{opacity:0.6;}
.mode-tag{
  font-size:11px;letter-spacing:0.18em;text-transform:uppercase;color:var(--text-soft);
  padding:3px 10px;border:1px solid var(--line);border-radius:100px;
}
nav.site-nav{display:flex;gap:clamp(18px,3vw,36px);}
nav.site-nav a{font-size:12px;letter-spacing:0.14em;text-transform:uppercase;color:var(--text-soft);transition:color .3s ease;}
nav.site-nav a.active, nav.site-nav a:hover{color:var(--text);}

/* MOBILE NAV TOGGLE */
.nav-toggle{display:none;background:none;border:none;color:var(--text);cursor:pointer;padding:6px;}
.nav-toggle svg{width:22px;height:22px;display:block;}
@media (max-width:640px){
  .nav-toggle{display:flex;align-items:center;justify-content:center;}
  header.site-header{position:relative;}
  nav.site-nav{
    display:none;
    position:absolute;top:100%;left:0;right:0;
    background:var(--bg);
    flex-direction:column;
    padding:6px 24px 18px;
    border-bottom:1px solid var(--line-soft);
    gap:0;
    z-index:20;
  }
  nav.site-nav.nav-open{display:flex;}
  nav.site-nav a{
    padding:15px 0;
    border-bottom:1px solid var(--line-soft);
    font-size:14px;
    width:100%;
  }
  nav.site-nav a:last-child{border-bottom:none;}
}

/* SHARED TEXT ELEMENTS */
.eyebrow{
  font-size:12px;letter-spacing:.28em;text-transform:uppercase;color:var(--text-soft);margin-bottom:24px;
}
.eyebrow::before{content:'';display:inline-block;width:28px;height:1px;background:var(--text-soft);margin-right:14px;vertical-align:middle;}
.section-label{
  display:flex;align-items:center;gap:16px;font-size:12px;letter-spacing:.24em;text-transform:uppercase;color:var(--text-soft);margin-bottom:56px;
}
.section-label::after{content:'';flex:1;height:1px;background:var(--line);}

/* TAGS */
.tag{
  font-size:10px;letter-spacing:.06em;text-transform:uppercase;color:var(--text-soft);
  border:1px solid var(--line);padding:4px 9px;border-radius:100px;
  background:none;font-family:inherit;cursor:pointer;
  transition:color .2s ease, border-color .2s ease;
}
.tag:hover, .tag.tag-active{color:var(--accent);border-color:var(--accent);}

/* BUTTONS */
.btn{
  display:inline-flex;align-items:center;gap:10px;
  font-size:13px;letter-spacing:.08em;text-transform:uppercase;
  border:1px solid var(--line);padding:14px 22px;
  transition:border-color .3s ease, color .3s ease;
  background:none;color:var(--text);font-family:inherit;cursor:pointer;
}
.btn:hover{border-color:var(--accent);color:var(--accent);}

/* FOOTER */
footer.site-footer{
  padding:56px clamp(24px,5vw,64px) 36px;
  display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:20px;
  border-top:1px solid var(--line-soft);
  font-size:13px;color:var(--text-soft);
}
footer.site-footer a{border-bottom:1px solid var(--text);padding-bottom:2px;color:var(--text);}

/* FILTER ROW (shared by Work / Objects / Journal listing pages) */
.filter-row{
  display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:16px;
  border-bottom:1px solid var(--line-soft);
  padding:20px clamp(24px,5vw,64px);
  position:sticky;top:0;background:var(--bg);z-index:5;
}
.search-input{
  font-family:inherit;background:var(--bg-alt);border:1px solid var(--line);color:var(--text);
  font-size:13px;padding:12px 16px;min-width:220px;flex:1;max-width:360px;
}
.search-input::placeholder{color:var(--text-soft);}
.search-input:focus{outline:1px solid var(--accent);border-color:var(--accent);}
.filter-tabs{display:flex;gap:0;flex-wrap:wrap;}
.filter-tab{
  font-family:inherit;background:none;border:none;
  padding:12px 20px;font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:var(--text-soft);
  border-bottom:2px solid transparent;cursor:pointer;
  transition:color .3s ease, border-color .3s ease;
}
.filter-tab.active{color:var(--text);border-bottom-color:var(--accent);}
.filter-tab:hover{color:var(--text);}
