/* Hengecat Research · course-site concepts
   Fringed Sage system adapted: white ground, slate hue, gold labels. */
:root{
  --paper:#FFFFFF; --paper-raised:#F7F5F0; --slate-mist:#EEF1F2;
  --ink:#1C1F23; --ink-muted:#555B62;
  --slate:#3C5262; --on-slate:#FFFFFF; --slate-soft:#9FAAB2;
  --gold:#85682A; --gold-line:#B8994F; --hairline:#E4DED3;
  --band:#1C1F23; --on-band:#EEE8DC; --gold-on-band:#CDAE6A; --band-muted:#A9A69E; --band-line:#3A3E44;
  --focus:#3C5262;
  --display:"Cormorant Garamond","Cormorant",Garamond,"Times New Roman",serif;
  --text:Karla,"Helvetica Neue",Arial,sans-serif;
  --s1:4px;--s2:8px;--s3:16px;--s4:24px;--s5:40px;--s6:64px;--s7:120px;
  --measure-text:38rem; --measure-page:1200px;
}
*{box-sizing:border-box}
body{margin:0;background:var(--paper);color:var(--ink);font:400 16px/1.65 var(--text);-webkit-font-smoothing:antialiased}
h1,h2,h3,p,ul,ol,dl,dd,figure,blockquote{margin:0;padding:0}
ul,ol{list-style:none}
a{color:inherit}
img{display:block;max-width:100%}
:focus-visible{outline:2px solid var(--focus);outline-offset:2px}
.wrap{max-width:var(--measure-page);margin:0 auto;padding:0 var(--s5)}
.section{padding:var(--s7) 0}
.stack > * + *{margin-top:var(--s4)}
.stack > .label + *{margin-top:var(--s1)}
.center{text-align:center}
.center .lead{margin-left:auto;margin-right:auto}

/* Announcement banner */
.announce{background:var(--band);color:var(--on-band);font:600 11px/1.4 var(--text);letter-spacing:.18em;text-transform:uppercase;text-align:center;padding:8px 16px}
.announce a{color:var(--gold-on-band);text-decoration:underline;text-underline-offset:3px}

/* Type */
.label{font:600 12px/1.4 var(--text);letter-spacing:.22em;text-transform:uppercase;color:var(--gold)}
.display-xl{font:300 clamp(44px,6.4vw,80px)/.98 var(--display);letter-spacing:-.5px;text-wrap:balance}
.display-l{font:400 clamp(34px,4.4vw,52px)/1.05 var(--display);text-wrap:balance}
.heading{font:500 clamp(26px,3vw,32px)/1.15 var(--display);text-wrap:balance}
.title{font:500 24px/1.25 var(--display)}
.quote{font:italic 400 clamp(22px,2.6vw,28px)/1.35 var(--display);text-wrap:balance}
.lead{font-size:19px;line-height:1.6;max-width:var(--measure-text)}
.muted{color:var(--ink-muted)}
.small{font-size:14px;line-height:1.5;color:var(--ink-muted)}
.figure-num{font:500 clamp(40px,4vw,52px)/1 var(--display);color:var(--gold)}

/* Wordmark + header */
.wordmark{font:500 22px/1 var(--display);letter-spacing:.18em;text-transform:uppercase;text-decoration:none;color:var(--ink);white-space:nowrap;text-align:center}
.wordmark small{display:block;font:600 9px/1.4 var(--text);letter-spacing:.26em;color:var(--gold);margin-top:6px}
.site-header{position:sticky;top:0;z-index:20;background:var(--paper);border-bottom:1px solid var(--hairline)}
.site-header .wrap{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;height:88px}
.site-header nav{display:flex;gap:var(--s5)}
.site-header nav.right{justify-content:flex-end}
.site-header nav a{font:600 12px/1.4 var(--text);letter-spacing:.22em;text-transform:uppercase;text-decoration:none;padding:12px 0}
.site-header nav a:hover{color:var(--slate)}

/* Buttons */
.btn{display:inline-block;font:700 13px/1 var(--text);letter-spacing:.18em;text-transform:uppercase;text-decoration:none;padding:16px 28px;border:1px solid transparent;border-radius:0;cursor:pointer;transition:background .2s,color .2s;min-height:44px}
.btn-primary{background:var(--slate);color:var(--on-slate)}
.btn-primary:hover{background:#2E404D}
.btn-secondary{background:transparent;color:var(--ink);border-color:var(--ink)}
.btn-secondary:hover{background:var(--ink);color:var(--paper)}
.band .btn-secondary{color:var(--on-band);border-color:var(--on-band)}
.band .btn-secondary:hover{background:var(--on-band);color:var(--band)}
.link{font:600 12px/1.4 var(--text);letter-spacing:.22em;text-transform:uppercase;color:var(--slate);text-underline-offset:4px}
.rule{width:48px;height:1px;background:var(--gold-line);border:0;margin:0}

/* Photos */
.photo{position:relative;overflow:hidden;background:var(--paper-raised)}
.photo img{width:100%;height:100%;object-fit:cover;transition:transform .4s}
.photo .credit{position:absolute;right:8px;bottom:6px;font:600 9px/1 var(--text);letter-spacing:.14em;text-transform:uppercase;color:#fff;background:rgba(0,0,0,.35);padding:4px 6px}
a:hover .photo img,.photo.zoom:hover img{transform:scale(1.02)}
.r45{aspect-ratio:4/5}.r32{aspect-ratio:3/2}.r11{aspect-ratio:1/1}.r21{aspect-ratio:2/1}
.bleed{width:100%;height:clamp(320px,52vw,640px)}
@media (prefers-reduced-motion:reduce){.photo img{transition:none}a:hover .photo img,.photo.zoom:hover img{transform:none}}

/* Mist + band */
.mist{background:var(--slate-mist)}
.mist .label{color:var(--ink-muted)}
.band{background:var(--band);color:var(--on-band)}
.band .label{color:var(--gold-on-band)}
.band .rule{background:var(--gold-on-band)}
.band .muted,.band .small{color:var(--band-muted)}

/* Session list */
.sessions{border-top:1px solid var(--hairline)}
.sessions li{display:flex;justify-content:space-between;gap:var(--s3);padding:12px 0;border-bottom:1px solid var(--hairline);font-size:15px}
.sessions li span:last-child{color:var(--ink-muted)}

/* Forms */
.field{margin-bottom:var(--s4)}
.f{display:block;font:600 11px/1.4 var(--text);letter-spacing:.2em;text-transform:uppercase;color:var(--ink-muted);margin-bottom:var(--s2)}
input,select,textarea{width:100%;font:400 16px/1.5 var(--text);color:var(--ink);background:var(--paper);border:1px solid var(--hairline);border-radius:2px;padding:12px 14px;min-height:44px}
textarea{resize:vertical;min-height:110px}

/* Footer */
.site-footer{padding:var(--s6) 0 var(--s5)}
.site-footer .top{display:flex;justify-content:space-between;align-items:center;gap:var(--s5);padding-bottom:var(--s5);border-bottom:1px solid var(--band-line)}
.site-footer .wordmark{color:var(--on-band);text-align:left}
.site-footer nav{display:flex;gap:var(--s5);flex-wrap:wrap}
.site-footer nav a{font:600 12px/1.4 var(--text);letter-spacing:.22em;text-transform:uppercase;text-decoration:none;color:var(--on-band)}
.site-footer .legal{padding-top:var(--s4);display:flex;justify-content:space-between;gap:var(--s5);font-size:14px;color:var(--band-muted)}
.site-footer .legal p{max-width:var(--measure-text)}

@media (max-width:760px){
  .wrap{padding:0 var(--s3)}
  .section{padding:var(--s6) 0}
  .site-header .wrap{grid-template-columns:1fr auto;height:64px}
  .site-header nav{display:none}
  .site-header nav.right{display:flex;gap:var(--s3)}
  .site-header nav.right a:not(:last-child){display:none}
  .wordmark{text-align:left;font-size:18px}
  .site-footer .top,.site-footer .legal{flex-direction:column;align-items:flex-start}
  .site-footer nav{gap:var(--s3) var(--s4)}
}

/* Placeholder crop: keep the people, not the light fixture */
img[src*="1521737604893"]{object-position:center 85%}

/* Mid widths: drop the left nav so the header fits on one line */
@media (min-width:761px) and (max-width:980px){
  .site-header .wrap{grid-template-columns:auto 1fr}
  .site-header nav:not(.right){display:none}
  .site-header nav.right{gap:var(--s4)}
  .wordmark{text-align:left}
}
