/* Readable supporting type and consistent section hierarchy. */
body.home-page #content .home-section-description{
 font-size:32px!important;line-height:1.15!important;letter-spacing:-.02em!important;
 max-width:none;margin:0;
}
body.home-page .home-section-heading{margin-bottom:32px}
body.about-page .about-page-title{padding-bottom:64px}
body.about-page #content .about-section-title{
 font-size:32px!important;line-height:1.15!important;letter-spacing:-.02em!important;
}
body.about-page #content .about-expertise article :is(h2,p),
body.about-page #content .experience-row>div :is(h3,p),
body.about-page #content .award-row :is(h3,p):not(.award-year){
 font-size:24px!important;line-height:1.3!important;letter-spacing:-.01em!important;
}
body.about-page #content .about-expertise article>p{white-space:normal;overflow:visible;text-overflow:clip}
body.about-page #content :is(.experience-date,.award-year){font-size:16px!important;line-height:24px!important}
body.about-page .about-expertise article{gap:8px}
body.about-page .about-section-title{margin-bottom:32px}
body.about-page .about-expertise>.about-section-title{margin-bottom:8px}
body.about-page .experience-description{margin-top:20px}

/* Home alone uses the inverted palette, with a pure black canvas. */
html:has(body.home-page){background:#000;color-scheme:dark}
body.home-page{
 --bg:#000;--fg:#fff;--muted:#6e6e73;--description-color:#fff;
 --line:rgba(255,255,255,.2);--secondary-surface:#171717;
 --button-ink:#000;--control-surface:#fff;--control-hover:#d9d9d9;
 --link-hover:#aaa;background:#000;color:#fff;
}
body.home-page .header-backdrop{background:#000!important;border:0}
body.home-page .site-header .header-row .main-nav a{background:#1a1a1a}
body.home-page .action-button{background:#fff!important;color:#000!important}
body.home-page .action-button.fill-control::before{background:#d9d9d9!important}
body.home-page .action-button:is(:hover,:focus-visible){background:#d9d9d9!important;color:#000!important}
body.home-page :is(.hover-tooltip,.site-cursor.is-view){background:#fff;color:#000}
body.home-page .site-cursor.is-view span{color:#000}
body.home-page .site-header :focus-visible{outline-color:#fff}
body.home-page .project-media{background:#171717}
body.home-page .page-transition{background:#000}
body.home-page .skip-link{background:#fff;color:#000}
@media(max-width:767px){
 body.about-page .about-page-title{padding-bottom:64px}
 body.home-page .home-section-heading{row-gap:20px;margin-bottom:32px}
}

/* Larger pauses on Home; a tighter title-to-bio transition on About. */
body.home-page .hero.gallery-intro{margin-bottom:112px}
body.home-page .home-section-heading{margin-bottom:96px}
body.home-page :is(#work,#special-projects,#website-work,#creative-work){margin-bottom:160px}
body.about-page #content .about-expertise article>h2{font-weight:600!important}
body.about-page #content .experience-row>div .company-heading{
 font-size:32px!important;line-height:1.15!important;letter-spacing:-.02em!important;
}
body.case-page .case-subtitle{margin-bottom:48px}
@media(max-width:767px){
 body.home-page .hero.gallery-intro{margin-bottom:80px}
 body.home-page .home-section-heading{margin-bottom:64px}
 body.home-page :is(#work,#special-projects,#website-work,#creative-work){margin-bottom:96px}
}

body.about-page .about-hero{padding-bottom:48px}

/* Secondary copy regains the earlier hierarchy without tinting headings. */
body.home-page #content .project .project-description{color:#6e6e73}
body.about-page #content :is(.about-location,.experience-description,.experience-date,.award-row>p),
body.about-page #content .about-expertise article>p{color:#6e6e73!important}

/* Twice the space between expertise illustrations and their titles (24 + 8). */
body.about-page .about-expertise .expertise-visual{margin-bottom:24px}

/* Symmetric with the 64px header: 40px control, 12px vertical / 16px side inset. */
body>.back-top{
 position:fixed;z-index:28;right:16px;bottom:12px;
 display:inline-flex;align-items:center;justify-content:center;
 width:40px;height:40px;padding:8px;border:0;border-radius:8px;
 background:#f3f3f3;color:var(--fg);font-family:var(--font-copy);
 font-size:16px!important;line-height:24px!important;font-weight:500;letter-spacing:0;
 text-align:center;transition:color .32s cubic-bezier(.22,.61,.36,1);
}
body.home-page>.back-top{background:#1a1a1a}
body>.back-top:is(:hover,:focus-visible){opacity:.4}
/* Reserve the corner for the top control when Project Details is also present. */
body.case-page .details-trigger.action-button{right:68px!important}
@media(max-width:767px){body>.back-top{font-size:14px!important}}

/* Match the actual menu height in the optional typography preview too. */
html.type-voskhod body>.back-top{width:38px;height:38px;bottom:13px;line-height:22px!important}
@media(max-width:767px){html.type-voskhod body>.back-top{width:36px;height:36px;bottom:14px;line-height:19.25px!important}}