/* Huddle Network — shared default theme for the multi-domain install.
   Tokens match the Huddle Network brand sheet so a property can be re-skinned
   by overriding these variables alone. */

:root{
  --ink:#0E1214; --paper:#F7F6F3; --surface:#FFFFFF;
  --muted:#5B5F63; --line:rgba(14,18,20,.10);
  --accent:#0F5D52; --accent-soft:#E7F0ED;
  --radius:14px; --maxw:900px;
  --sans:Archivo,"Helvetica Neue",Arial,sans-serif;
  --mono:"IBM Plex Mono",ui-monospace,SFMono-Regular,Menlo,monospace;
}
*{box-sizing:border-box}
body{
  margin:0; background:var(--paper); color:var(--ink);
  font:400 17px/1.65 var(--sans); -webkit-font-smoothing:antialiased;
}
a{color:inherit}
.wrap{max-width:var(--maxw); margin:0 auto; padding:0 clamp(20px,5vw,32px)}
.mono{font-family:var(--mono)}

.masthead{border-bottom:1px solid var(--line); background:var(--paper)}
.masthead .wrap{display:flex; align-items:baseline; justify-content:space-between; gap:20px; padding-top:20px; padding-bottom:20px}
.brand{font-weight:700; font-size:1.15rem; letter-spacing:-.015em; text-decoration:none}
.nav{display:flex; gap:18px; font-size:.86rem}
.nav a{text-decoration:none; color:var(--muted); padding-bottom:2px; border-bottom:1px solid transparent}
.nav a:hover{color:var(--ink); border-bottom-color:var(--accent)}

main{padding-bottom:56px}
.page-head{padding:clamp(36px,7vw,64px) 0 8px}
h1{margin:0 0 10px; font-size:clamp(1.9rem,4.6vw,2.7rem); line-height:1.06; letter-spacing:-.028em}
.lede{margin:0 0 10px; max-width:60ch; color:var(--muted); font-size:1.05rem}
.meta{font-size:.76rem; letter-spacing:.06em; color:var(--muted); margin:0}

.block{padding-top:34px}
.block-title{margin:0 0 14px; font-size:.74rem; letter-spacing:.16em; text-transform:uppercase; color:var(--muted); font-weight:500}

.list{list-style:none; margin:0; padding:0; display:grid; gap:10px}
.item{display:block; padding:18px 20px; background:var(--surface); border:1px solid var(--line); border-radius:var(--radius); text-decoration:none; transition:border-color .18s ease, transform .18s ease}
.item:hover{border-color:rgba(15,93,82,.4); transform:translateY(-2px)}
.item:focus-visible{outline:2px solid var(--accent); outline-offset:2px}
.item-title{display:block; font-weight:600; letter-spacing:-.012em}
.item-sub{display:block; margin-top:6px; color:var(--muted); font-size:.94rem}
.item-date{display:block; margin-top:8px; font-size:.72rem; letter-spacing:.1em; text-transform:uppercase; color:var(--muted)}
.list-compact .item{padding:12px 18px}
.empty{margin:0; padding:20px; border:1px dashed var(--line); border-radius:var(--radius); color:var(--muted); font-size:.94rem}

.article{padding-top:clamp(28px,5vw,44px); max-width:70ch}
.article-title{margin:0 0 8px; font-size:clamp(1.7rem,4vw,2.4rem); line-height:1.1; letter-spacing:-.025em}
.article-meta{margin:0 0 26px; font-size:.74rem; letter-spacing:.1em; text-transform:uppercase; color:var(--muted)}
.article-body{font-size:1.06rem}
.article-body p{margin:0 0 1.1em}
.back{display:inline-block; margin-top:30px; font-family:var(--mono); font-size:.78rem; color:var(--accent); text-decoration:none}
.back:hover{text-decoration:underline}

.foot{border-top:1px solid var(--line)}
.foot .wrap{display:flex; flex-wrap:wrap; gap:8px 12px; padding:22px clamp(20px,5vw,32px) 30px; font-size:.8rem; color:var(--muted); max-width:var(--maxw); margin:0 auto}
.foot .sep{color:var(--line)}

@media (prefers-reduced-motion:reduce){*{transition:none!important} .item:hover{transform:none}}