.page-shell{
  max-width:1120px;
  margin:0 auto;
  padding:3.5rem 1.5rem 5rem;
}

.page-hero{
  display:grid;
  grid-template-columns:minmax(0, 1fr) 320px;
  gap:1.25rem;
  margin-bottom:1.5rem;
}

.page-panel,
.page-card,
.mini-card{
  border:1px solid var(--border);
  border-radius:var(--radius);
  background:var(--card-bg);
  box-shadow:var(--shadow);
}

.page-panel{
  padding:2rem;
}

.page-panel h1{
  font-family:var(--display-font);
  font-size:clamp(2.2rem, 5vw, 4.1rem);
  line-height:0.98;
  letter-spacing:-0.04em;
  margin:0.65rem 0 1rem;
}

.page-panel p{
  max-width:40rem;
  color:var(--muted);
  font-size:1.03rem;
}

.page-side{
  display:grid;
  gap:1rem;
}

.mini-card{
  padding:1.2rem;
}

.mini-card span{
  display:block;
  margin-bottom:0.35rem;
  font-size:0.75rem;
  letter-spacing:0.12em;
  text-transform:uppercase;
  color:var(--muted);
}

.mini-card strong{
  font-size:1.02rem;
}

.page-grid{
  display:grid;
  grid-template-columns:280px minmax(0, 1fr);
  gap:1.25rem;
}

.page-nav{
  position:sticky;
  top:6rem;
  align-self:start;
}

.page-nav h2{
  font-size:0.82rem;
  letter-spacing:0.12em;
  text-transform:uppercase;
  color:var(--muted);
  margin-bottom:0.9rem;
}

.page-nav-links{
  display:grid;
  gap:0.65rem;
}

.page-nav-links a{
  color:var(--muted);
}

.page-nav-links a:hover,
.page-nav-links a:focus-visible{
  color:var(--text);
}

.page-content{
  display:grid;
  gap:1rem;
}

.page-card{
  padding:1.5rem;
}

.page-card h3{
  font-size:1.12rem;
  margin-bottom:0.55rem;
}

.page-card p{
  color:var(--muted);
}

.page-card p + p{
  margin-top:0.95rem;
}

.list-grid{
  display:grid;
  gap:0.75rem;
  margin-top:1rem;
}

.list-item{
  padding:1rem;
  border-radius:var(--radius-sm);
  border:1px solid var(--border);
  background:rgba(255,255,255,0.56);
}

.list-item strong{
  display:block;
  margin-bottom:0.3rem;
}

.list-item span{
  color:var(--muted);
}

.chip-row{
  display:flex;
  gap:0.55rem;
  flex-wrap:wrap;
  margin-top:1rem;
}

.inline-links{
  display:flex;
  gap:0.75rem;
  flex-wrap:wrap;
  margin-top:1rem;
}

.page-footer{
  margin-top:1rem;
  color:var(--muted);
  font-size:0.9rem;
}

.portrait{
  width:100%;
  aspect-ratio:4 / 5;
  object-fit:cover;
  border-radius:var(--radius);
  box-shadow:var(--shadow);
}

@media (max-width:920px){
  .page-hero,
  .page-grid{
    grid-template-columns:1fr;
  }

  .page-nav{
    position:static;
  }
}

@media (max-width:640px){
  .page-shell{
    padding:2.5rem 1.25rem 4rem;
  }

  .page-panel,
  .page-card,
  .mini-card{
    padding:1.2rem;
  }
}