/* Shared scale and layout corrections, loaded after each page's own styles. */
/* Fine gold rules and engraved flourishes mark the dark section borders. */
:is(.quiet-portfolio .portfolio-hero, .about-section, .contact-panel, .desk-hero:not(.delivery-hero)) { position: relative; isolation: isolate; z-index: 1; box-shadow: 0 12px 24px -14px rgb(20 29 24 / 42%), 0 -8px 18px -14px rgb(20 29 24 / 25%); }
:is(.about-section, .contact-panel)::before,
:is(.quiet-portfolio .portfolio-hero, .about-section, .desk-hero:not(.delivery-hero))::after {
  content: "";
  position: absolute;
  z-index: -1;
  left: 0;
  right: 0;
  height: 1.5rem;
  pointer-events: none;
  background-image: url("assets/gold-section-divider.svg"), linear-gradient(to right, transparent, rgb(185 154 93 / 45%) 20%, transparent 42%, transparent 58%, rgb(185 154 93 / 45%) 80%, transparent);
  background-size: min(15rem, 45vw) auto, 100% 1px;
  background-position: center;
  background-repeat: no-repeat;
}
:is(.about-section, .contact-panel)::before { top: .5rem; z-index: 1; }
:is(.quiet-portfolio .portfolio-hero, .about-section, .desk-hero:not(.delivery-hero))::after { bottom: .5rem; z-index: 1; }
.about-section { border-block: 0; }
.quiet-portfolio :is(.work-section, .curiosities) { border-top: 0; }
@media print {
  :is(.quiet-portfolio .portfolio-hero, .about-section, .contact-panel, .desk-hero:not(.delivery-hero)) { box-shadow: none; }
  :is(.quiet-portfolio .portfolio-hero, .about-section, .contact-panel, .desk-hero:not(.delivery-hero))::before,
  :is(.quiet-portfolio .portfolio-hero, .about-section, .contact-panel, .desk-hero:not(.delivery-hero))::after { display: none; }
}
.groffix-brand { display: inline-flex; flex: 0 0 auto; align-items: center; line-height: 1; }
.groffix-brand img { display: block; width: auto; height: 4.65rem; max-width: 100%; object-fit: contain; }
.portfolio-footer .groffix-brand img { height: 5.5rem; }
@media (max-width: 760px) {
  .groffix-brand img { height: 4rem; }
  .portfolio-footer .groffix-brand img { height: 4.75rem; }
}
.delivery-project-list { list-style: none; margin: 2rem 0; padding: 0; }
.delivery-project-list li { border-top: 1px solid var(--line); }
.delivery-project-list li:last-child { border-bottom: 1px solid var(--line); }
.delivery-project-list a { display: grid; grid-template-columns: clamp(5rem, 10vw, 8rem) minmax(0, 1fr) auto; align-items: center; gap: 1.5rem; padding: 1.5rem 0; text-decoration: none; }
.delivery-list-icon { width: 100%; height: auto; aspect-ratio: 3/2; object-fit: contain; mix-blend-mode: multiply; }
.delivery-project-list strong { display: block; font: 400 clamp(1.3rem, 2.2vw, 1.8rem)/1.3 var(--serif); }
.delivery-project-list small { display: block; margin-top: .4rem; font-size: .78rem; color: var(--muted); }
.delivery-project-list a:hover strong { text-decoration: underline; text-underline-offset: .2em; }
.project-archive { margin-top: 2.5rem; }
.project-archive summary { width: fit-content; padding: .5rem 0; cursor: pointer; font-size: .9rem; color: var(--brass); }
.project-archive[open] > .project-pair { margin-top: 2rem; }
.delivery-project-page { --project-gutter: clamp(1.25rem, 6vw, 5rem); }
.delivery-project-page .delivery-hero { display: grid; grid-template-columns: minmax(0, 1.6fr) minmax(0, 1fr); gap: clamp(2rem, 4vw, 4rem); align-items: center; padding: clamp(2.5rem, 5vw, 4.5rem) max(var(--project-gutter), calc((100% - 76rem) / 2)); background: var(--paper); color: var(--ink); }
.delivery-project-page .delivery-hero h1 { max-width: 24ch; margin-bottom: 1.25rem; font-size: clamp(2rem, 3.6vw, 3.5rem); line-height: 1.14; letter-spacing: -.035em; }
.delivery-hero .eyebrow { color: var(--brass); }
.delivery-hero > .delivery-hero-copy > p:not(.eyebrow) { max-width: 42ch; color: var(--muted); font-size: 1.1rem; line-height: 1.65; }
.delivery-art { width: 100%; max-width: 22rem; margin: 0; justify-self: end; }
.delivery-art img { width: 100%; height: auto; aspect-ratio: 3/2; object-fit: contain; mix-blend-mode: multiply; }
.delivery-facts { padding: 1.75rem max(var(--project-gutter), calc((100% - 76rem) / 2)); border-block: 1px solid var(--line); }
.delivery-facts h2 { margin: 0 0 1rem; }
.delivery-facts dl { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 2rem; margin: 0; }
.delivery-facts dt { font-size: .75rem; font-weight: 600; }
.delivery-facts dd { margin: .4rem 0 0; font-size: .95rem; }
.delivery-narrative { width: min(calc(100% - 2 * var(--project-gutter)), 70ch); margin-inline: auto; padding: clamp(2.5rem, 5vw, 4rem) 0; }
.delivery-narrative section { margin-bottom: 3rem; }
.delivery-narrative h2 { margin-bottom: 1rem; font-size: clamp(1.6rem, 2.3vw, 2rem); line-height: 1.25; letter-spacing: -.025em; }
.delivery-hero-copy > p:last-child { margin-bottom: 0; }
.delivery-narrative p { line-height: 1.8; }
.delivery-milestones { margin: 2rem 0 0; padding: 0; list-style: none; }
.delivery-milestones li { padding: 1.25rem 0; border-top: 1px solid var(--line); }
.delivery-milestones strong, .delivery-milestones span { display: block; }
.delivery-milestones strong { font-size: .9rem; }
.delivery-milestones span { margin-top: .35rem; color: var(--muted); }
@media (max-width: 850px) {
  .delivery-project-page .delivery-hero { grid-template-columns: minmax(0, 1fr); gap: 1.5rem; }
  .delivery-art { width: min(65%, 16rem); justify-self: start; }
}
@media (max-width: 650px) {
  .delivery-project-list a { grid-template-columns: 4rem minmax(0, 1fr) auto; gap: .75rem; }
  .delivery-facts dl { grid-template-columns: minmax(0, 1fr); gap: 1.25rem; }
  .delivery-project-page .portfolio-header { flex-wrap: wrap; gap: 1rem; }
  .delivery-project-page .portfolio-header nav { flex-wrap: wrap; }
}
.quiet-portfolio .portfolio-hero { grid-template-columns: minmax(0, 1fr); align-items: center; gap: 0; padding-bottom: clamp(2.5rem, 5vw, 4rem); }
.quiet-portfolio .hero-main { max-width: 60rem; }
.quiet-portfolio .hero-main { padding-bottom: 0; }
.quiet-portfolio .hero-deck { max-width: 35ch; }
.quiet-portfolio .hero-specimen { min-height: 0; margin: 0; padding: 0; border: 0; box-shadow: none; background: transparent; }
.quiet-portfolio .hero-specimen::before { content: none; }
.quiet-portfolio .specimen-moth { height: clamp(14rem, 28vw, 25rem); }
.quiet-portfolio .section-heading { display: block; max-width: 40rem; margin-bottom: 2.5rem; }
.quiet-portfolio .portfolio-section { padding-block: clamp(3.5rem, 7vw, 6rem); }
.quiet-portfolio .sample-top { border-bottom: 0; padding-bottom: 0; }
.quiet-portfolio .notebook-specimen { background: none; }
.quiet-portfolio .writing-feature, .quiet-portfolio .editing-preview, .quiet-portfolio .sample-row { box-shadow: none; }
.quiet-portfolio .sample-disclosure { margin-bottom: 1rem; }
.quiet-portfolio .project-copy { align-self: center; }
.quiet-portfolio .project-card { padding-bottom: 1rem; }
.quiet-portfolio .about-aside { max-width: 32ch; margin: 2rem 0 0; font-size: clamp(1.1rem, 1.5vw, 1.3rem); }
.quiet-portfolio .about-title { position: relative; padding-bottom: 7rem; }
.quiet-portfolio .about-title::after { content: ""; position: absolute; left: 0; right: 8%; bottom: 2rem; height: 1px; background: linear-gradient(90deg, rgb(209 181 120 / 8%), rgb(209 181 120 / 36%) 65%, transparent); pointer-events: none; }
.quiet-portfolio .about-moth { position: absolute; z-index: 1; right: -3%; bottom: -1.25rem; display: block; width: clamp(9rem, 13vw, 11.5rem); max-width: 46%; height: auto; margin: 0; transform: rotate(-20deg); pointer-events: none; }
@media (max-width: 760px) {
  .quiet-portfolio .about-title { padding-bottom: 6rem; }
  .quiet-portfolio .about-moth { right: 0; bottom: -1rem; width: 9.5rem; }
}
.quiet-portfolio .curiosity-links h3 { margin: 0; }
.quiet-portfolio .quill-note { font-size: .8rem; }
.quiet-portfolio .contact-panel .button { margin-top: .5rem; }
@media (max-width: 760px) {
  .quiet-portfolio .hero-specimen { display: block; }
  .quiet-portfolio .specimen-moth { height: 12rem; }
  .quiet-portfolio .actions { gap: 1rem 1.5rem; }
}
*, *::before, *::after { box-sizing: border-box; }
body :is(main, section, article, aside, header, footer, div, dl, ol, ul, li, figure) { min-width: 0; }
:is(h1, h2, h3, p, a, dd, dt, blockquote, figcaption) { overflow-wrap: break-word; }
img, video, iframe { max-width: 100%; }
h1, h2, h3 { text-wrap: pretty; }

/* Portfolio: a heading should introduce its content rather than dwarf it. */
.fascinations-hero h1 { max-width: 22ch; font-size: clamp(2.6rem, 4.4vw, 5.2rem); line-height: 1.14; letter-spacing: -.035em; text-wrap: balance; }
.fascinations-hero h1 em { display: inline; }
.portfolio-section h2 { font-size: clamp(2rem, 3.5vw, 3.6rem); line-height: 1.16; letter-spacing: -.035em; }
.portfolio-section .section-heading { grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); gap: clamp(1.5rem, 4vw, 4rem); }
.portfolio-section :is(.writing-grid, .lead-project, .project-pair, .approach-grid) > * { min-width: 0; }
.about-title h2 { max-width: 18ch; }
.contact-panel h2 { font-size: clamp(2rem, 3.2vw, 3.3rem); }
.desk-hero h1 { max-width: 20ch; font-size: clamp(2.6rem, 5vw, 4.5rem); line-height: 1.1; }
.desk-section h2 { font-size: clamp(2rem, 3.5vw, 3.2rem); line-height: 1.16; }
.copy-display h3 { font-size: clamp(2rem, 4vw, 3.6rem); line-height: 1.16; }
.portfolio-footer { flex-wrap: wrap; gap: 1.5rem 3rem; }
.portfolio-footer p { flex: 1 1 20rem; }

/* All case studies, including the legacy URLs. */
.case-body .case-header { position: relative; min-height: 5.5rem; height: auto; padding-block: 1.25rem; gap: 1.25rem; flex-wrap: wrap; background: var(--case-night); }
.case-body .case-header nav { position: static; display: flex; flex-wrap: wrap; width: auto; padding: 0; border: 0; background: transparent; }
.case-body .case-header nav a { font-size: .72rem; line-height: 1.6; }
.case-body .case-hero { min-height: 0; padding: clamp(2.5rem, 5vw, 5rem) clamp(1.25rem, 7vw, 7rem); }
.case-body .case-hero h1 { max-width: 23ch; font-size: clamp(2.4rem, 4.8vw, 4.5rem); line-height: 1.1; letter-spacing: -.02em; }
.case-body .case-deck { max-width: 65ch; font-size: clamp(1.05rem, 1.4vw, 1.2rem); line-height: 1.65; }
.case-body .case-facts { grid-template-columns: repeat(3, minmax(0, 1fr)); margin-top: 2.5rem; }
.case-body .case-file { grid-template-columns: minmax(0, .4fr) minmax(0, 1fr); gap: clamp(2rem, 5vw, 5rem); max-width: 90rem; margin-inline: auto; padding: clamp(3rem, 6vw, 5rem) clamp(1.25rem, 7vw, 7rem); }
.case-body .case-narrative { width: 100%; }
.case-body .case-narrative h2 { max-width: 27ch; font-size: clamp(1.9rem, 3vw, 2.8rem); line-height: 1.16; }
.case-body .case-narrative .controlled-heading span { display: inline !important; white-space: normal; }
.case-body .case-narrative .controlled-heading span + span { margin: 0; }
.case-body .case-narrative section > p:not(.case-number) { font-size: clamp(1rem, 1.3vw, 1.15rem); line-height: 1.7; }
.case-body .case-narrative blockquote { font-size: clamp(1.6rem, 2.8vw, 2.5rem); line-height: 1.3; }
.case-body .case-narrative > section { padding-bottom: clamp(2.5rem, 5vw, 4rem); }
.case-body .case-result { margin-inline: 0; margin-bottom: clamp(2.5rem, 5vw, 4rem); padding: clamp(1.25rem, 3vw, 2.5rem) !important; }
.case-body .result-lockup { flex-wrap: wrap; gap: 1rem; }
.case-body .result-lockup strong { font-size: clamp(3rem, 6vw, 5rem); line-height: 1.05; }
.case-body .method-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.case-body .method-grid > div { border-bottom: 1px solid var(--case-rule); }
.case-body .method-grid > div:nth-child(even) { border-right: 0; }
.case-body .method-grid > div:nth-last-child(-n+2) { border-bottom: 0; }
.case-body :is(.engine-grid, .signal-grid, .archive-grid, .ops-principle-grid, .calm-choice-grid) { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.case-body .case-next { display: flex; flex-direction: column; align-items: flex-start; justify-content: flex-start; gap: .75rem; margin: 0; padding: 1.5rem 0 0; background: transparent; color: var(--case-ink); border-top: 1px solid var(--case-rule); font-family: var(--sans); letter-spacing: normal; text-transform: none; }
.case-body .case-next .eyebrow { margin: 0 0 .25rem; }
.case-body .case-next a, .case-body .case-next a + a { display: inline-block; max-width: 100%; margin: 0; font: 500 1rem/1.6 var(--sans); letter-spacing: normal; text-transform: none; text-decoration: underline; text-underline-offset: .25em; }
.case-body .case-next a:hover { color: var(--case-brass); }
.case-body .portfolio-brief dl { grid-template-columns: repeat(3, minmax(0, 1fr)); }

/* Field reports: avoid giant headings and narrow, tall text cards. */
.adventure-page .masthead { flex-wrap: wrap; padding-block: 1.25rem; gap: 1rem 2rem; }
.adventure-page .masthead nav { gap: .75rem 1.5rem; }
.adventure-page-copy h1 { font-size: clamp(2.5rem, 4.5vw, 4.5rem); line-height: 1.1; }
.adventure-page h2 { font-size: clamp(2rem, 3.3vw, 3.2rem); line-height: 1.16; }
.adventure-page .rating-grid { grid-template-columns: repeat(auto-fit, minmax(min(100%, 14rem), 1fr)); }
.adventure-page :is(.method-intro, .ratings-intro) h2 { font-size: clamp(2rem, 3.3vw, 3.2rem); line-height: 1.16; }
.adventure-page .method-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.adventure-page .method-card { min-height: 0; padding: clamp(1.25rem, 2.5vw, 2rem); }
.adventure-page .method-card:nth-child(even) { border-right: 0; }
.adventure-page .method-card:nth-child(n+3) { border-top: 1px solid var(--rule); }
.adventure-page .method-card h3 { font-size: clamp(1.6rem, 2.4vw, 2.2rem); line-height: 1.2; }
.adventure-page .recommendation-note strong { white-space: normal; }
.adventure-page .lead-photo img { height: auto; max-height: 38rem; aspect-ratio: 4/5; }
.adventure-page .adventure-meta div { grid-template-columns: minmax(0, 6rem) minmax(0, 1fr); }
.adventure-page .adventure-pagination { flex-wrap: wrap; font-size: .95rem; }

/* Rotation retains its three-card shelves at every viewport. */
.rotation-index-page .site-header { position: relative; height: auto; min-height: 5.5rem; gap: 1rem; padding-block: .5rem; }
.rotation-index-page .site-header nav { top: 100%; }
.rotation-index-hero { padding: clamp(2.5rem, 5vw, 4rem) clamp(1.25rem, 5vw, 4rem); }
.rotation-index-hero::before { content: none; }
.rotation-index-card { padding: 0; border: 0; box-shadow: none; background: transparent; }
.rotation-index-card h1 { font-size: clamp(2.6rem, 4.5vw, 4.5rem); }
.rotation-shelf-heading h2 { font-size: clamp(1.9rem, 2.8vw, 2.7rem); line-height: 1.16; }
.rotation-index-page .rotation-shelf .playlist-player iframe { min-height: 0; }
.adventures-index-page .adventures-index-card h1, .rotation-index-page .rotation-index-card h1 { max-width: 23ch; }

@media (max-width: 1100px) {
  .case-body .case-file { grid-template-columns: minmax(0, 1fr); }
  .case-body .case-margin { position: static; }
  .case-body .case-margin p:last-child { max-width: 50ch; }
  .case-body .case-narrative { max-width: 65ch; margin-inline: auto; }
  .portfolio-section .section-heading { gap: 2rem; }
}
@media (max-width: 850px) {
  .adventure-page .adventure-page-grid { grid-template-columns: minmax(0, 1fr); }
  .case-body :is(.case-orbit, .broadcast-orbit, .archive-mark, .ops-cairn, .calm-interface) { display: none; }
  .case-body .case-facts { grid-template-columns: minmax(0, 1fr); }
  .case-body .case-facts div, .case-body .case-facts div + div { padding: 1rem 0; border-right: 0; border-bottom: 1px solid rgba(230,215,185,.2); }
  .case-body .case-facts div:last-child { border-bottom: 0; }
  .case-body .portfolio-brief dl { grid-template-columns: minmax(0, 1fr); gap: 1.25rem; }
  .adventure-page .rating-grid { grid-template-columns: minmax(0, 1fr); }
  .adventure-page .rating-row { border-right: 0; border-bottom: 1px solid var(--rule); }
}
@media (max-width: 760px) {
  .fascinations-hero h1 { max-width: 22ch; font-size: clamp(2.4rem, 7.5vw, 3.8rem); }
  .portfolio-section .section-heading, .desk-section-heading { grid-template-columns: minmax(0, 1fr); }
  .portfolio-section, .desk-section { padding-block: 3rem; }
  .portfolio-section :is(.section-heading, .writing-grid, .project-pair, .about-section) { gap: 1.5rem; }
  .portfolio-header .wordmark { font-size: 1.15rem; }
  .portfolio-header nav { justify-content: flex-start; gap: .5rem 1.5rem; }
  .notebook-specimen { padding: 1.5rem; }
  .notebook-specimen h3 { font-size: clamp(2rem, 7vw, 2.8rem); }
  .project-copy { padding: 1.5rem; }
  .project-copy h3, .project-card h3 { font-size: clamp(1.8rem, 6vw, 2.3rem); }
  .portfolio-footer > span { margin-left: 0; }
  .adventure-page .recommendation-note { grid-template-columns: minmax(0, 1fr); }
  .adventure-page .recommendation-note strong { grid-column: auto; }
  .rotation-index-page .rotation-fallback-grid strong { font-size: clamp(.82rem, 2.6vw, 1rem); }
  .rotation-index-page .rotation-media-description { font-size: .78rem; line-height: 1.55; }
  .rotation-index-page :is(.rotation-media-meta, .rotation-media-genres) { font-size: .7rem; line-height: 1.5; }
}
@media (max-width: 560px) {
  .case-body :is(.method-grid, .engine-grid, .signal-grid, .archive-grid, .ops-principle-grid, .calm-choice-grid), .adventure-page .method-grid { grid-template-columns: minmax(0, 1fr); }
  .case-body .method-grid > div, .adventure-page .method-card { border-right: 0; border-bottom: 1px solid var(--rule); }
  .case-body .method-grid > div:last-child, .adventure-page .method-card:last-child { border-bottom: 0; }
  .adventure-page .method-card:nth-child(n+3) { border-top: 0; }
  .case-body .ops-timeline article { grid-template-columns: minmax(0, 1fr); gap: .75rem; }
  .case-body .ops-timeline article > b { grid-column: auto; }
  .adventure-page .rating-placeholder { grid-template-columns: minmax(0, 1fr); }
  .adventure-page .lead-photo { padding: .65rem; }
  .adventure-page .button { gap: .75rem; font-size: .9rem; }
  .adventures-index-page .header-logo img, .rotation-index-page .header-logo img { max-width: 55vw; object-fit: contain; }
}
@media print {
  .case-body .case-hero, .about-section { background: white; color: #111; }
  .case-body .case-hero h1, .case-body .case-deck, .about-copy > p, .about-title h2 em, .about-title > .eyebrow { color: #111; }
}
