@font-face { font-family: Gruppo; src: url('/assets/atrium/fonts/gruppo.woff2') format('woff2'); font-display: swap; }
@font-face { font-family: Jura; src: url('/assets/atrium/fonts/jura.woff2') format('woff2'); font-display: swap; }

/* Keep the original global tokens and footer. Only the public content surface is restyled. */
body:not([data-page="admin"]) .site > .nav { margin-bottom: 0; min-height: 88px; z-index: 5; }
body:not([data-page="admin"]) .nav .brand-text { font: 400 28px/1 Gruppo, sans-serif; }
/* Gruppo's capitals sit slightly below the navigation font's optical center. */
body:not([data-page="admin"]) .nav .brand-text { transform: translateY(-1px); }
body:not([data-page="admin"]) .nav-links { gap: 28px; }
body:not([data-page="admin"]) .site > :is(.hero, .journal-masthead):has(> .atrium-art) {
  position: relative; isolation: isolate; display: block; min-height: 530px;
  margin: 0 calc(50% - 50vw); padding: 100px max(var(--journal-gutter, 48px), calc((100vw - 1248px) / 2)) 64px;
  overflow: hidden; background: #fafaf8;
}
.atrium-art {
  position: absolute; inset: 0; z-index: -1; width: 100%; height: 100%; object-fit: cover; object-position: center; max-width: none;
  mask-image: linear-gradient(to right, transparent, #000 5%, #000 95%, transparent), linear-gradient(to bottom, transparent, #000 9%, #000 73%, transparent);
  mask-composite: intersect;
}
body:not([data-page="admin"]) .hero:has(> .atrium-art) .hero-art { display: none; }
body:not([data-page="admin"]) .hero:has(> .atrium-art) .hero-copy { width: 52%; max-width: 650px; position: relative; }
body:not([data-page="admin"]) .hero:has(> .atrium-art) .hero-copy h1 { font: 400 64px/1.2 Jura, 'PingFang SC', sans-serif; }
body:not([data-page="admin"]) .hero:has(> .atrium-art) .hero-copy > .gold-stroke { display: none; }
body:not([data-page="admin"]) .hero:has(> .atrium-art) .hero-copy h2 { font: 500 22px/1.65 var(--sans); margin: 24px 0 14px; max-width: 25em; }
body:not([data-page="admin"]) .hero:has(> .atrium-art) .hero-copy p { font-size: 16px; line-height: 1.85; max-width: 34em; color: #52564f; }
body:not([data-page="admin"]) .hero:has(> .atrium-art) .eyebrow { color: #706c61; font: 400 13px/1.5 Jura, sans-serif; }
body:not([data-page="admin"]) .hero:has(> .atrium-art) .actions { gap: 24px; margin-top: 24px; }
body:not([data-page="admin"]) .hero:has(> .atrium-art) .button-primary { border: 0; border-bottom: 1px solid #987332; border-radius: 0; background: transparent; box-shadow: none; color: #242822; padding: 8px 0; }
body[data-page="home"] .site > .nav { position: relative; background: transparent; border: 0; }
body[data-page="home"] .journal-masthead > .eyebrow { color: #67532d; }
body[data-page="home"] .site > .journal-masthead:has(> .atrium-art) { min-height: 738px; margin-top: calc(-1 * var(--atrium-nav-height, 88px)); padding-top: calc(96px + var(--atrium-nav-height, 88px)); }
body[data-page="home"] .journal-masthead > .atrium-art {
  mask-image: linear-gradient(to right, transparent, #000 2%, #000 98%, transparent), linear-gradient(to bottom, #000 78%, transparent);
}
body[data-page="home"] .journal-masthead:has(> .atrium-art) h1 { font: 400 116px/1.05 Gruppo, sans-serif; margin: 20px 0; max-width: 100%; }
body[data-page="home"] .journal-masthead:has(> .atrium-art) > :is(.gold-stroke, .journal-introduction-image) { display: none; }
body[data-page="home"] .journal-masthead:has(> .atrium-art) .journal-introduction { display: block; width: min(100%, 700px); max-width: 700px; margin-top: 22px; }
body[data-page="home"] .journal-masthead:has(> .atrium-art) .journal-introduction h2 { font: 500 28px/1.6 var(--sans); max-width: 700px; }
body[data-page="home"] .journal-masthead:has(> .atrium-art) .journal-introduction p { font-size: 18px; line-height: 1.8; margin-top: 16px; max-width: 580px; }
body:not([data-page="admin"]) .site > :is(.hero, .journal-masthead):has(> .atrium-art) + .section { margin-top: 64px; }
body[data-page="observe"] .site > .observe-detail-hero + .section { margin-top: 64px; }
body:not([data-page="admin"]) .site > .section { color: #282b26; }
body:not([data-page="admin"]) .section :is(.section-title, h2, h3), body:is([data-page="article"], [data-page="project"], [data-page="draft-preview"]) .detail-title {
  font-family: Jura, 'PingFang SC', 'Microsoft YaHei', sans-serif; letter-spacing: 0;
}
body[data-page="thinking"] :is(.article-item, .article-list-item) { border: 0; }
body[data-page="thinking"] .article-list > :is(a, article) { border-bottom: 0; }
body[data-page="thinking"] .archive-month-group { border-top: 1px solid #daddd6; }
body[data-page="thinking"] .thinking-index-title h2 { font-size: 28px; }
body:not([data-page="admin"]) .site :is(.project-card, .method-card) { border-radius: 4px; }
.atrium-section-art {
  display: block; width: 100%; height: auto; aspect-ratio: 3 / 2; object-fit: contain; mix-blend-mode: multiply;
  mask-image: linear-gradient(to right, transparent, #000 9%, #000 91%, transparent), linear-gradient(to bottom, transparent, #000 13%, #000 82%, transparent);
  mask-composite: intersect;
}
body[data-page="home"] :is(img.journal-topic-image.atrium-section-art, .journal-practice img.atrium-section-art) { aspect-ratio: 3 / 2; object-fit: contain; background: transparent; }
body[data-page="home"] #work-preview .case-art:has(.atrium-section-art) { padding: 0; background: transparent; aspect-ratio: 3 / 2; }
body[data-page="work"] .project-shot:has(.atrium-section-art) { padding: 0; background: transparent; border: 0; border-radius: 0; aspect-ratio: 3 / 2; height: auto; }
body[data-page="work"] .project-card:has(.atrium-section-art) { grid-template-rows: auto 1fr; }
body[data-page="observe"] .observe-unified-topics > a > .atrium-section-art { margin: -12px 0 12px; }
body[data-page="observe"] .observe-nexus-board { background: #f7f7f5; border-color: #e0e0dc; }
body[data-page="observe"] .observe-nexus-canvas {
  background: linear-gradient(rgba(44, 47, 47, .035) 1px, transparent 1px), linear-gradient(90deg, rgba(44, 47, 47, .035) 1px, transparent 1px), #f7f7f5;
  background-size: 40px 40px, 40px 40px, auto;
}
body[data-page="observe"] .observe-nexus-lines path { stroke: #b1b3b2; }
body[data-page="observe"] .observe-nexus-lines path:nth-child(3n + 1) { stroke: #b4a077; }
body[data-page="observe"] .observe-nexus-lines path:nth-child(3n + 2) { stroke: #b1b3b2; }
/* Keep these small markers neutral; gold is reserved for a restrained accent. */
body[data-page="home"] .journal-principles .principle { grid-template-columns: 44px minmax(0, 1fr); column-gap: 20px; }
body[data-page="home"] .journal-principles .principle .principle-icon { width: 40px; height: 40px; align-self: start; color: #454944; }
body[data-page="home"] .journal-principles .principle-icon-accent { stroke: #89713f; }
body[data-page="home"] .journal-principles .principle:is(:hover, :focus-visible) svg { color: #242622; }
body[data-page="method"] .method-card .num { background: #efefed; color: #454944; border: 1px solid #b8bcb8; font-family: Jura, sans-serif; font-size: 11px; font-weight: 600; font-variant-numeric: tabular-nums; }
body[data-page="method"] .method-row strong { color: #626862; font-variant-numeric: tabular-nums; }
@media (min-width: 1800px) {
  body:not([data-page="admin"]) .site > :is(.hero, .journal-masthead):has(> .atrium-art) { min-height: 600px; }
  body[data-page="home"] .site > .journal-masthead:has(> .atrium-art) { min-height: 788px; }
}
@media (max-width: 1000px) {
  body:not([data-page="admin"]) .nav-links { gap: 16px; }
  body:not([data-page="admin"]) .hero:has(> .atrium-art) .hero-copy { width: 62%; }
  body:not([data-page="admin"]) .hero:has(> .atrium-art) .hero-copy h1 { font-size: 54px; }
  body[data-page="home"] .journal-masthead:has(> .atrium-art) h1 { font-size: 90px; }
}
@media (max-width: 700px) {
  body:not([data-page="admin"]) .nav .brand { min-width: 0; gap: 8px; }
  body:not([data-page="admin"]) .nav .brand-text { font-size: 22px; }
  body[data-page="observe"] .site > .observe-detail-hero + .section { margin-top: 40px; }
  body[data-page="home"] .journal-principles .principle { grid-template-columns: 34px minmax(0, 1fr); column-gap: 16px; }
  body[data-page="home"] .journal-principles .principle .principle-icon { width: 32px; height: 32px; }
  body:not([data-page="admin"]) .site > :is(.hero, .journal-masthead):has(> .atrium-art) { margin-inline: calc(-1 * var(--journal-gutter)); min-height: 570px; padding: 32px var(--journal-gutter) 190px; }
  body:not([data-page="admin"]) .hero:has(> .atrium-art) .hero-copy { width: 100%; max-width: none; }
  .atrium-art { height: 280px; top: auto; bottom: 0; width: 145%; left: -45%; object-position: center; mask-image: linear-gradient(to right, transparent, #000 34%, #000 94%, transparent), linear-gradient(to bottom, transparent, #000 25%, #000 76%, transparent); }
  body:not([data-page="admin"]) .hero:has(> .atrium-art) .hero-copy h1 { font-size: 44px; }
  body:not([data-page="admin"]) .hero:has(> .atrium-art) .hero-copy h2 { font-size: 20px; margin-top: 18px; }
  body:not([data-page="admin"]) .hero:has(> .atrium-art) .hero-copy p { font-size: 15px; }
  body[data-page="home"] .site > .nav { min-height: 122px; }
  body[data-page="home"] .site > .journal-masthead:has(> .atrium-art) { min-height: 660px; margin-top: calc(-1 * var(--atrium-nav-height, 122px)); padding-top: calc(32px + var(--atrium-nav-height, 122px)); padding-bottom: 120px; }
  body[data-page="home"] .journal-masthead:has(> .atrium-art) h1 { font-size: 50px; }
  body[data-page="home"] .journal-masthead:has(> .atrium-art) .journal-introduction h2 { font-size: 22px; }
  body[data-page="home"] .journal-masthead:has(> .atrium-art) .journal-introduction p { font-size: 15px; line-height: 1.75; }
  body[data-page="home"] .journal-masthead > .atrium-art { inset: 0; width: 100%; height: 100%; object-position: 58% center; mask-image: linear-gradient(to right, transparent, #000 3%, #000 97%, transparent), linear-gradient(to bottom, #000 78%, transparent); }
  body[data-page="home"] .journal-masthead:has(> .atrium-art)::after { content: ''; position: absolute; inset: 0; z-index: -1; background: linear-gradient(to bottom, rgba(250,250,248,.7), rgba(250,250,248,.55) 54%, transparent 83%); pointer-events: none; }
  body:not([data-page="admin"]) .site > :is(.hero, .journal-masthead):has(> .atrium-art) + .section { margin-top: 40px; }
}
@media (max-width: 360px) {
  body[data-page="home"] .journal-masthead:has(> .atrium-art) h1 { font-size: 44px; }
}
