/* shell.css — the index button on the pages beyond the landing page, and each page's own small changes. */
.shell-btn{display:inline-flex;align-items:center;gap:10px;margin-left:16px;padding:9px 13px;border:1px solid currentColor;background:none;color:inherit;font-family:'JetBrains Mono',monospace;font-size:12px;letter-spacing:.08em;line-height:1;text-transform:none;cursor:pointer;pointer-events:auto;transition:background .25s,color .25s}
.shell-btn:hover{background:#b48a3a;border-color:#b48a3a;color:#fff}
.shell-btn:focus-visible{outline:2px solid #b48a3a;outline-offset:2px}
.shell-btn .index-glyph{display:flex;flex-direction:column;gap:3px}
.shell-btn .index-glyph span{display:block;width:14px;height:1px;background:currentColor}
@media (max-width:699.98px){
  .uhead nav a,.jhead nav a,.whead nav a{display:none}
  .shell-btn{margin-left:0}
}

/* Papers: the sheet in the hero takes the same wash as the photograph behind it, and the title carries the screen */
#face-photo::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(20,34,28,.35),rgba(20,34,28,.55))}
#face-photo{isolation:isolate}
.hero-copy .hero-title{font-size:clamp(52px,10.4vw,160px);line-height:.96;letter-spacing:-.018em}
.hero-copy .hero-sub{margin-top:24px}

/* Work: the whole headline fits, whatever the width */
.hero .hero-h{max-width:none;font-size:min(7.25vw,132px)}
.hero .hero-h .line:nth-child(2){padding-left:0}
@media (max-width:699.98px){
  .hero .hero-h{font-size:6.7vw}
  .hero .hero-idx{display:none}
  .hero .hero-sub{left:var(--pad);right:var(--pad);max-width:none;text-align:left}
}

/* Overview and Courses: on a phone the words sit on a dark ground, not on the points */
@media (max-width:699.98px){
  .scene::before{content:"";position:fixed;left:0;right:0;bottom:0;z-index:-1;height:82vh;background:linear-gradient(to top,rgba(11,20,15,.97) 58%,rgba(11,20,15,.82) 76%,rgba(11,20,15,0));pointer-events:none}
}

/* News: a larger opening for each story */
.article-page .article{max-width:1040px}
.article-page .article-title{margin-top:18px;font-size:clamp(46px,8.2vw,118px);line-height:.98;letter-spacing:-.018em;text-wrap:balance}
.article-page .article-lead{max-width:44rem;margin-top:28px;font-size:clamp(22px,2.6vw,31px);line-height:1.3}
.article-page .article-hero{max-width:1040px;margin-top:44px}