/* ===== UW THEME =====
   Source for colors: UW Web Branding (UW Brown #492F24, UW Gold #FFC425)
   https://www.uwyo.edu/web/branding/  (values confirmed on page)
*/

:root{
  --uw-brown: #492F24;       /* UW Brown */
  --uw-gold:  #FFC425;       /* UW Gold */
  --bg: #ffffff;
  --bg-alt:#faf7f2;          /* warm neutral to pair with gold */
  --text:#1b1f2a;
  --muted:#5b5f69;
  --brand: var(--uw-gold);
  --brand-strong:#d4a514;    /* darker gold for hover/contrast */
  --card:#ffffff;
  --border:#e8e1d6;
  --ok:#228b22;
  --shadow: 0 10px 24px rgba(18, 28, 45, 0.06);
}

html{scroll-behavior:smooth}
*{box-sizing:border-box}
body{
  margin:0;
  font-family:Inter, system-ui, -apple-system, Segoe UI, Roboto, "Helvetica Neue", Arial, "Noto Sans", "Apple Color Emoji","Segoe UI Emoji", "Segoe UI Symbol";
  color:var(--text);
  background:var(--bg);
  line-height:1.6;
}

/* Accessibility */
a:focus-visible, button:focus-visible { outline: 3px solid var(--uw-gold); outline-offset: 2px }

/* Gold top bar */
.uw-gold-bar{height:6px; background:var(--uw-gold)}

/* Containers & Sections */
.container{width:min(1100px, 92vw); margin-inline:auto}
.section{padding: 72px 0}
.section.alt{background:var(--bg-alt)}

h1,h2,h3{line-height:1.2; margin:0 0 .5rem}
h1.headline{font-size: clamp(1.8rem, 1.1rem + 3vw, 3rem); font-weight:800; color: var(--uw-brown)}
h2{font-size: clamp(1.25rem, 1rem + 2vw, 2rem); font-weight:800; color: var(--uw-brown)}
h3{font-size: 1.1rem; font-weight:700; color: var(--uw-brown)}
p{margin:.25rem 0 1rem}
.subtitle{color:#684b3c; font-weight:600}
.lead{font-size:1.05rem}

/* Links */
a{color:var(--uw-brown); text-decoration-color: var(--uw-gold); text-underline-offset: 2px}
a:hover{color:#2d1d16; text-decoration-thickness: 2px}

/* Skip link */
.skip-link{
  position:absolute; left:-9999px; top:auto;
}
.skip-link:focus{
  left:1rem; top:.5rem; background:var(--uw-brown); color:#fff; padding:.5rem .75rem; border-radius:.5rem; z-index:10000;
}

/* Header */
.site-header{
  position:sticky; top:0; z-index:1000;
  background: rgba(255, 255, 255, .86);
  border-bottom:1px solid var(--border);
  backdrop-filter:saturate(1.2) blur(8px);
}
.nav-wrap{display:flex; gap:1rem; align-items:center; justify-content:space-between; padding: .6rem 0}
.brand{display:flex; align-items:center; gap:.6rem; font-weight:800; color:var(--uw-brown)}
.brand-mark{
  display:grid; place-items:center; width:34px; height:34px; border:2px solid var(--uw-brown);
  border-radius:6px; color:var(--uw-brown); font-weight:800; font-size:.85rem; background: color-mix(in lab, var(--uw-gold) 35%, white);
}
.brand-text{display:flex; flex-direction:column}
.brand-sub{font-weight:600; font-size:.75rem; color:#684b3c}

.site-nav ul{display:flex; gap:1rem; list-style:none; padding:0; margin:0; align-items:center}
.site-nav a{padding:.35rem .5rem; border-radius:.4rem}
.site-nav a.active{background:var(--uw-gold); color:#1a120e; text-decoration:none; font-weight:700; box-shadow: inset 0 -2px 0 rgba(0,0,0,.08)}
.mode{
  margin-left:.5rem; background:#fff; color:#3a2a21;
  border:1px solid var(--border); border-radius:.5rem; padding:.4rem .6rem; cursor:pointer;
}

/* Mobile Nav */
.nav-toggle{display:none; background:none; border:0; padding:.25rem .5rem; cursor:pointer}
.nav-toggle .bar{display:block; width:24px; height:2px; background:var(--uw-brown); margin:5px 0}
@media (max-width: 820px){
  .nav-toggle{display:block}
  .site-nav{position:absolute; inset:60px 0 auto 0; background:#fff; border-bottom:1px solid var(--border); transform:translateY(-120%); transition:.25s ease; opacity:0; pointer-events:none}
  .site-nav.open{transform:none; opacity:1; pointer-events:auto}
  .site-nav ul{flex-direction:column; padding:1rem}
}

/* Hero */
.hero{
  background:
    radial-gradient(1200px 400px at 10% -10%, rgba(255,196,37,.18), transparent 60%),
    radial-gradient(900px 300px at 90% 10%, rgba(73,47,36,.10), transparent 60%);
}
.hero-grid{display:grid; align-items:center; gap:clamp(1rem,2vw,2rem); grid-template-columns: 1.2fr .8fr}
.hero-photo{
  justify-self:end; width:min(340px, 80%); aspect-ratio: 1/1; border-radius:16px; overflow:hidden;
  box-shadow: var(--shadow); border:3px solid var(--uw-gold); background:#fff
}
.hero-photo img{width:100%; height:100%; object-fit:cover}
.hero-cta{display:flex; gap:.75rem; margin-top:1rem}
.quick-links{display:flex; gap:1rem; list-style:none; padding:0; margin:1rem 0 0}
.quick-links a{color:#684b3c}

/* Buttons */
.btn{
  display:inline-block; border-radius:.6rem; padding:.65rem .9rem; font-weight:800; border:2px solid var(--uw-brown);
  background:#fff; color:var(--uw-brown); text-decoration:none; transition:.15s ease; box-shadow: 0 1px 0 rgba(0,0,0,.05)
}
.btn:hover{transform:translateY(-1px)}
.btn.primary{background:var(--uw-gold); border-color: var(--uw-brown); color:#1a120e}
.btn.ghost{background:transparent}
.btn.tiny{padding:.4rem .55rem; font-size:.9rem}

/* Layout helpers */
.split{display:grid; gap:1rem; grid-template-columns: 1fr 1fr}
@media (max-width: 820px){ .split{grid-template-columns:1fr} }

/* Lists */
.check li{position:relative; padding-left:1.4rem}
.check li::before{content:"✔"; position:absolute; left:0; top:.1rem; color:#1f7a1f; font-weight:800}
.pill-list{display:flex; gap:.5rem; flex-wrap:wrap; padding-left:0; list-style:none}
.pill-list li{border:1px solid var(--border); padding:.35rem .6rem; border-radius:999px; background:#fff; color:#684b3c}

/* Cards */
.grid.cards{display:grid; gap:1rem; grid-template-columns: repeat(12, 1fr)}
.card{
  grid-column: span 6;
  display:flex; flex-direction:column; gap:.5rem;
  background:#fff; border:1px solid var(--border); border-radius:12px; padding:1rem; box-shadow: var(--shadow);
}
.card header{display:flex; flex-direction:column; gap:.25rem}
.card .tags{display:flex; gap:.4rem; flex-wrap:wrap; color:#684b3c; font-size:.9rem}
.card .tags span{border:1px solid var(--border); padding:.15rem .4rem; border-radius:.4rem; background:var(--bg-alt)}
.card footer{margin-top:auto; display:flex; gap:.5rem}
@media (max-width: 1000px){ .card{grid-column: span 12} }

/* Publications */
.pub-list{display:grid; gap:.75rem; counter-reset: pubs}
.pub-list > li{
  list-style:none; background:#fff; border:1px solid var(--border); border-radius:10px; padding:.9rem; position:relative;
}
.pub-list > li::before{
  counter-increment: pubs; content: counter(pubs) ".";
  position:absolute; left:-2.2rem; top:.9rem; color:#684b3c; font-weight:800;
}
.pub-title{display:block; font-weight:800; color:var(--uw-brown)}
.pub-meta{display:block; color:#684b3c; font-size:.95rem; margin:.25rem 0 .5rem}

/* Note */
.note{
  margin:1rem 0; padding:.9rem 1rem; border:2px dashed var(--uw-brown);
  border-radius:10px; color:#684b3c; background: color-mix(in lab, var(--uw-gold) 18%, white);
}

/* Footer */
.site-footer{border-top:4px solid var(--uw-brown); background:var(--bg-alt)}
.foot{display:flex; gap:1rem; flex-wrap:wrap; justify-content:space-between; align-items:center; padding:1rem 0}
.back-to-top{color:#684b3c}
.tiny-disclaimer{color:#684b3c; font-size:.85rem}

/* Reveal on scroll (reduced motion friendly) */
.reveal{opacity:0; transform: translateY(8px); transition: opacity .5s ease, transform .5s ease}
.reveal.visible{opacity:1; transform:none}
@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto}
  .reveal{opacity:1; transform:none}
}

/* ===== Optional Dark Mode tuned to Brown/Gold ===== */
:root[data-theme="dark"]{
  --bg:#16110e;
  --bg-alt:#1f1713;
  --text:#f3eee8;
  --muted:#cab9ae;
  --card:#201915;
  --border:#3b2d25;
  --shadow: 0 8px 24px rgba(0,0,0,.45);
}
:root[data-theme="dark"] .site-header{background: rgba(22,17,14,.85)}
:root[data-theme="dark"] .brand, 
:root[data-theme="dark"] .nav-toggle .bar{color:var(--uw-gold); background-color:transparent}
:root[data-theme="dark"] .site-nav a.active{color:#2b201b}
:root[data-theme="dark"] .btn{background:var(--card); color:var(--uw-gold); border-color:#5a4236}
:root[data-theme="dark"] .btn.primary{background:var(--uw-gold); color:#2b201b}
.pub-profiles{
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
  margin: 10px 0 18px;
}