/* Site: closer to Macaly's floating navigation, cartoon ink and colour fields. */
body.site-root{--paper:#fff;--ink:#171917;--muted:#4d4c46;--wash:#faf9f5;--lime:#e8e6dc;--peach:#faf9f5;--lilac:#faf9f5;--rose:#faf9f5;background:hsl(240 27% 25% / 1);color:var(--ink)}

.site-root :is(h1,h2,h3,h4){font-weight:650}
.site-root :is(h1,h2,h3,h4,blockquote){font-variation-settings:"SOFT" 0,"WONK" 1;letter-spacing:-.055em}

.site-root .wrap{max-width:1200px;width:calc(100% - 64px)}

.site-root .text-link{font-size:1rem}

.site-root .actions{justify-content:center;margin-top:24px;gap:28px}

.site-root .section{padding-block:88px}

.site-root .pop-work h2,.site-root #writing h2{max-width:none;font-weight:650;line-height:1.05}

.site-root .recommendations{max-width:920px;margin:auto}

.site-root .recommendations blockquote{font-size:1.4rem;font-weight:600;line-height:1.2}

.site-root .recommendation-slides{min-height:260px}

.site-root .recommendation-controls button{border-radius:8px;background:var(--wash);box-shadow:2px 2px 0 var(--ink);width:42px;height:42px}

.site-root .recommendation-controls button:hover{background:white;transform:translate(1px,1px);box-shadow:1px 1px 0 var(--ink)}

@media(max-width:800px){
 .site-root .wrap{width:calc(100% - 40px)}

 .site-root .section{padding-block:60px}

.site-root .recommendation-slides{min-height:320px}

}

/* The same language continues through long-form reading. */
.site-root.detail-page .source-note{font-size:.875rem;border-left:2px solid var(--ink);padding:8px 14px;line-height:1.5}

.site-root.detail-page .narrow{width:calc(100% - 48px);max-width:800px}

.site-root.detail-page .fit>div,.site-root.detail-page .fit>div.no{border:1px solid #17171426;border-radius:16px}

.site-root.detail-page .fit>div{background:var(--lilac)}

.site-root.detail-page .fit>div.no{background:var(--wash)}

.site-root.detail-page .wk{border-color:#17171426}

.site-root.detail-page .wk .n{font-family:Inter,Arial,sans-serif;font-size:.875rem}

.site-root.detail-page .wk h4{font-weight:600;}

.site-root.detail-page .faq details{border:1px solid #17171430;border-radius:10px;margin-bottom:12px;padding:20px}

.site-root.detail-page .faq details[open]{background:var(--wash)}

.site-root.detail-page .contact{background:var(--lime);border-radius:24px;overflow:hidden}

.site-root.detail-page .contact h2{font-weight:650}
.site-root .blobby path{fill:var(--rose)}

.site-root.post-page main>article::before{background:var(--wash);width:140vw;height:720px;left:-20vw;top:-110px;border-radius:0 0 50% 40%;transform:none}

.site-root.detail-page.post-page main>article{padding-top:65px}

.site-root.detail-page .body h2{font-weight:600;line-height:1.15}

.site-root.detail-page .pull{background:var(--rose);border-radius:16px;transform:rotate(-1deg)}

.site-root.detail-page .pull p{font-weight:600}

.site-root.detail-page .theme-notes{max-width:1140px;padding-top:65px;padding-bottom:80px}

.site-root .theme-notes .source-note{margin-block:48px 30px}

.site-root .index-story>:not(img){margin-inline:20px;margin-block:0}

.site-root .sample-body{padding-block:55px 80px}

.site-root :is(#work,#experience,#contact,#weeks){scroll-margin-top:100px}
@media(max-width:800px){

 .site-root.detail-page .theme-notes{padding-top:45px}

 .site-root.detail-page .source-note{font-size:.875rem}

 .site-root :is(#work,#experience,#contact,#weeks){scroll-margin-top:110px}
}

/* One continuous green field; decorative colour is confined to the hero edge. */
.site-root main{background:var(--wash)}

.site-root main::after{content:"";display:block;height:70px;background:url('/assets/footer-wave.svg') bottom/100% 100% no-repeat}

.site-root .pop-article-art,.site-root.detail-page .pull,.site-root.detail-page .fit>div,.site-root.detail-page .contact{background:#ffffff30}
@media(max-width:800px){
.site-root main::after{height:40px}
}

body.site-root.detail-page{background:linear-gradient(var(--wash) 0 180px,#141512 180px)}

/* Reference-led composition: a focused illustration, with one local accent. */

/* Opaque cards separate articles while the page keeps its continuous green field. */

/* A broad shaped colour field forms the ending itself, without a boxed illustration. */
.site-root .page-ending{position:relative;isolation:isolate;background:var(--lime);padding:100px 0;border-radius:0}

.site-root .page-ending::before{display:none}

.site-root .page-ending .contact{background:transparent;text-align:center;padding:0;border-radius:0}

.site-root .page-ending .cta-row{justify-content:center}

.site-root main:has(>.page-ending)::after{background-color:var(--lime)}
@media(max-width:800px){.site-root .page-ending{padding:75px 0}
}

/* Frame the usable photographic region; the generated outer canvas is excluded. */

/* Homepage and blog share a title-only article list. */
.site-root .article-list{list-style:none;padding:0;margin:0}

.site-root .article-list>li{border-top:1px solid #17171435}

.site-root .article-list>li:last-child{border-bottom:1px solid #17171435}

.site-root .article-list a{display:grid;grid-template-columns:minmax(0,1fr) 24px;gap:10px 30px;align-items:start;padding:28px 0;text-decoration:none;color:var(--ink)}

.site-root .article-list :is(h2,h3){grid-column:1;grid-row:1;font-weight:600;line-height:1.2;margin:0}

.site-root .article-list .article-arrow{grid-column:2;grid-row:1;align-self:center;margin:0;color:var(--ink)}

.site-root .article-list a:hover :is(h2,h3){text-decoration:underline;text-underline-offset:4px}

.site-root main::after{display:none}

body.site-root{padding-bottom:0}

/* Optional resources start the article body, below the hero. */
.site-root .article-resources{display:flex;flex-wrap:wrap;gap:14px;margin:0 0 38px}

.site-root .body .article-resource{display:flex;align-items:center;gap:13px;flex:1 1 260px;padding:18px 20px;border:1px solid var(--line);border-radius:12px;color:var(--ink);font-family:var(--sans);font-size:1rem;line-height:1.4;font-weight:600;text-decoration:none;transition:background .18s,border-color .18s,transform .18s}

.site-root .article-resource>svg{flex:none}

.site-root .article-resource>span:first-of-type{flex:1;min-width:0}

.site-root .article-resource small{display:block;font-size:.875rem;font-weight:400;line-height:1.5;color:var(--muted);margin-top:5px}

.site-root .body .article-resource-download{background:hsl(240 27% 25% / 1);border-color:hsl(240 27% 25% / 1);color:#fff}
.site-root .article-resource-download small{color:#d9ded9}

.site-root .body .article-resource:hover{background:color-mix(in srgb,var(--lime) 65%,var(--wash));border-color:var(--ink);transform:translateY(-2px)}
.site-root .body .article-resource-social:is(:hover,:focus-visible){background:hsl(240 27% 25% / 1);border-color:hsl(240 27% 25% / 1);color:#fff}
.site-root .article-resource-social:is(:hover,:focus-visible) small{color:#d9ded9}
.site-root .body .article-resource-download:hover{background:hsl(240 27% 25% / 1);border-color:hsl(240 27% 25% / 1)}

.site-root .article-resource:focus-visible{outline:2px solid var(--ink);outline-offset:4px}
@media(max-width:600px){.site-root .article-resources{gap:12px;margin-bottom:30px}
.site-root .body .article-resource{flex-basis:100%;padding:16px;font-size:1rem}
}
@media(prefers-reduced-motion:reduce){.site-root .body .article-resource{transition:none;transform:none}
}

@media(max-width:800px){.site-root .article-list a{gap:12px 20px;padding:24px 0}

}

.site-root .recommendation-controls{margin-left:auto}

@media(max-width:800px){

 .site-root.post-page article :is(h1,.standfirst,.byline,.crumb){text-align:center;margin-inline:auto}
}


.site-root .situation-toggle{transition:background-color .18s ease,transform .18s ease}

.site-root .situation-toggle::after{transition:transform .2s ease,opacity .2s ease}

.site-root .mentoring-situation summary:is(:hover,:focus-visible) .situation-toggle{background:color-mix(in srgb,var(--ink) 10%,transparent);transform:scale(1.08)}

.site-root .mentoring-situation[open] .situation-toggle{background:var(--lime)}

.site-root .mentoring-situation[open] .situation-content,.site-root .recommendation-slide:not([hidden]){animation:reading-reveal .24s ease-out both}

.site-root .article-list :is(h2,h3,.article-arrow){transition:transform .2s ease}

.site-root .article-list a:is(:hover,:focus-visible) :is(h2,h3){transform:translateX(3px)}

.site-root .article-list a:is(:hover,:focus-visible) .article-arrow{transform:translate(3px,-3px)}

.site-root :is(.menu-toggle,.recommendation-controls button){transition:transform .16s ease,background-color .16s ease}

.site-root :is(.menu-toggle,.recommendation-controls button):active{transform:scale(.95)}

@media(prefers-reduced-motion:reduce){
 .site-root :is(.site-header nav a,.situation-toggle,.situation-content,.recommendation-slide,.article-list h2,.article-list h3,.article-arrow,.menu-toggle,.menu-toggle path,.site-menu,.recommendation-controls button),.site-root .situation-toggle::after{animation:none!important;transition:none!important}

 .site-root .article-list a:is(:hover,:focus-visible) :is(h2,h3,.article-arrow),.site-root .mentoring-situation summary:is(:hover,:focus-visible) .situation-toggle{transform:none}
}

.site-root.detail-page.post-page main>article{padding-top:0}

.site-root.post-page main>article::before{display:none}

/* Current site palette. */
/* One palette across the site. */
html body.site-root{--peach:var(--wash);--lilac:var(--wash);--rose:var(--wash)}
html .site-root .page-ending{background-image:none}
html .site-root .page-ending::before{display:none}
html body.site-root{--lime:#e8e6dc;--wash:#faf9f5;--ink:#171917;--muted:#4d4c46;--line:#17191726}
html .site-root .framework-core{background:var(--lime);color:var(--ink)}
html .site-root .framework-core :is(.framework-label,.framework-from,.framework-to){color:var(--ink)}
html .site-root .framework-core .framework-label{border-color:color-mix(in srgb,var(--ink) 24%,transparent)}