/* The same navigation geometry on every public page. */
html{--shared-header-top:clamp(16px,4.5svh,50px);--shared-header-height:60px;--shared-header-edge:clamp(16px,6.5vw,116px)}
html body *,html body *::before,html body *::after{text-decoration:none!important}
html body header.shared-site-header.reference-nav:is(.nav,.learn-header,.shared-site-header){
 position:fixed;inset:calc(env(safe-area-inset-top,0px) + var(--shared-header-top)) 0 auto!important;
 z-index:100;display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:center;
 gap:14px;width:min(1800px,calc(100% - 2 * var(--shared-header-edge)));max-width:none;
 min-height:60px;height:auto;margin:0 auto;padding:0!important;border:0;background:transparent;box-shadow:none;
 font:500 13px/1.3 Manrope,Arial,sans-serif
}
html body header.shared-site-header.reference-nav:is(.nav,.learn-header,.shared-site-header) .site-brand{grid-area:1/1;justify-self:start;width:clamp(104px,9vw,156px);max-width:100%;display:block;padding:0;background:none;box-shadow:none;filter:none}
html body header.shared-site-header.reference-nav:is(.nav,.learn-header,.shared-site-header) .site-brand img{display:block;width:100%;height:auto;filter:brightness(0)}
html body header.shared-site-header.reference-nav[data-brand-tone="light"] .site-brand img,
html[data-education-theme=dark] body header.shared-site-header.reference-nav .site-brand img{filter:brightness(0) invert(1)}
html body header.shared-site-header.reference-nav:is(.nav,.learn-header,.shared-site-header) .reference-menu{
 grid-area:1/2;justify-self:center;position:relative;isolation:isolate;display:flex;flex-wrap:wrap;justify-content:center;align-items:center;
 gap:2px;width:max-content;max-width:100%;padding:5px;margin:0;border:1px solid #d5d2cb;border-radius:999px;background:#fff!important;box-shadow:0 4px 18px #2222200d
}
html body header.shared-site-header.reference-nav:is(.nav,.learn-header,.shared-site-header) .reference-menu a{
 display:inline-flex;justify-content:center;align-items:center;min-height:34px;padding:7px 14px;border:0;border-radius:999px;background:none!important;color:#222220!important;
 font:500 13px/1.3 Manrope,Arial,sans-serif;letter-spacing:0;text-transform:none;white-space:nowrap
}
html body header.shared-site-header.reference-nav:is(.nav,.learn-header,.shared-site-header) .reference-menu a:is(:hover,:focus-visible):not([aria-current]){background:#eeede9!important}
html body header.shared-site-header.reference-nav:is(.nav,.learn-header,.shared-site-header) .reference-menu a[aria-current]{background:#222220!important;color:#fff!important}
html body header.shared-site-header.reference-nav:is(.nav,.learn-header,.shared-site-header) .reference-menu:has(.nav-glider) a[aria-current]{background:transparent!important}
html body header.shared-site-header.reference-nav:is(.nav,.learn-header,.shared-site-header) .nav-glider{background:#222220;border:0;box-shadow:none}
html body header.shared-site-header.reference-nav:is(.nav,.learn-header,.shared-site-header) .reference-actions{grid-area:1/3;display:flex;align-items:center;justify-content:flex-end;justify-self:end;gap:10px;min-width:0}
html body header.shared-site-header.reference-nav:is(.nav,.learn-header,.shared-site-header) .reference-actions :is(.lang-switch,.telegram){
 display:inline-flex;align-items:center;justify-content:center;min-height:40px;margin:0;border:1px solid transparent;
 border-radius:999px;font:500 13px/1.3 Manrope,Arial,sans-serif;letter-spacing:0;text-transform:none;white-space:nowrap
}
html body header.shared-site-header.reference-nav:is(.nav,.learn-header,.shared-site-header) .reference-actions .lang-switch{min-width:42px;padding:8px;background:#fff;color:#222220!important}
html body header.shared-site-header.reference-nav:is(.nav,.learn-header,.shared-site-header) .reference-actions .telegram{padding:8px 18px;background:#222220;color:#fff!important}
html body header.shared-site-header.reference-nav:is(.nav,.learn-header,.shared-site-header) .reference-actions .telegram:hover{background:#41413f}
html body header.shared-site-header.reference-nav:is(.nav,.learn-header,.shared-site-header) :is(a,button):focus-visible{outline:2px solid #575651;outline-offset:2px}
.shared-header-spacer,html body .learn-header-spacer{height:calc(var(--shared-header-top) + var(--shared-header-height) + env(safe-area-inset-top,0px) + 14px);flex:0 0 auto}
html body .reference-nav-spacer{height:calc(var(--shared-header-height) + 14px);flex:0 0 calc(var(--shared-header-height) + 14px)}
html body :is(#work,#blog,#about){scroll-margin-top:calc(var(--shared-header-top) + var(--shared-header-height) + 16px)}
@media(max-width:1000px){
 html{--shared-header-top:clamp(12px,3svh,28px);--shared-header-height:90px}
 html body header.shared-site-header.reference-nav:is(.nav,.learn-header,.shared-site-header){grid-template-columns:minmax(0,1fr) auto;gap:7px 10px;min-height:0}
 html body header.shared-site-header.reference-nav:is(.nav,.learn-header,.shared-site-header) .reference-menu{grid-area:2/1/3/-1}
 html body header.shared-site-header.reference-nav:is(.nav,.learn-header,.shared-site-header) .reference-actions{grid-area:1/2}
}
@media(max-width:600px){
 html{--shared-header-edge:16px;--shared-header-height:94px}
 html body header.shared-site-header.reference-nav:is(.nav,.learn-header,.shared-site-header) .reference-menu{border-radius:22px;gap:1px;padding:4px}
 html body header.shared-site-header.reference-nav:is(.nav,.learn-header,.shared-site-header) .reference-menu a{font-size:11px;padding:5px 7px;min-height:28px}
 html body header.shared-site-header.reference-nav:is(.nav,.learn-header,.shared-site-header) .reference-actions{gap:5px}
 html body header.shared-site-header.reference-nav:is(.nav,.learn-header,.shared-site-header) .reference-actions .telegram{padding-inline:11px}
}
@media(max-height:620px) and (max-width:1000px){html{--shared-header-top:8px}}

/* Keep the source casing and round media consistently across editorial pages. */
.magazine-page :is(.magazine-feature h1,.magazine-card h3),
html.cgd-light body :is(.blog-feature h3,.blog .section-label h2,.site-relay-article .hero h1,.seo-heading h1){text-transform:none}
.magazine-main :is(.magazine-feature-image,.magazine-card)>img,
body :is(.editorial-hero,.editorial-inline,.article-visual,.ai-case-visual) img{border-radius:clamp(14px,2vw,28px);corner-shape:squircle}
html.cgd-light body.site-relay-home{--home-soft-corner:clamp(28px,4vw,64px)}
html.cgd-light body.site-relay-home :is(.stage.reference-stage,.portfolio,.blog,#about){border-radius:var(--home-soft-corner);corner-shape:squircle;background-clip:padding-box}
html.cgd-light body.site-relay-home :is(.portfolio-grid>a,.blog-feature){border-radius:clamp(14px,2vw,28px);corner-shape:squircle;overflow:hidden;isolation:isolate}
html.cgd-light body.site-relay-home a.blog-feature{display:grid;text-decoration:none;color:var(--graph)}
html.cgd-light body.site-relay-home a.blog-feature .blog-feature-copy{padding:clamp(16px,2vw,26px);justify-content:center}
html.cgd-light body.site-relay-home a.blog-feature:focus-visible{outline:2px solid #575651;outline-offset:4px}
html.cgd-light body.site-relay-home #about .home-about-editorial{
 display:grid;width:100%;margin:0;padding:clamp(26px,5vw,80px) 0;
 grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);align-items:center;gap:clamp(22px,4vw,66px);border-radius:inherit
}
html.cgd-light body.site-relay-home .home-about-editorial .home-about-portrait{width:min(100%,420px);margin:0;justify-self:center;min-width:0}
html.cgd-light body.site-relay-home .home-about-editorial .home-about-portrait figcaption{margin-inline:0}
html.cgd-light body.site-relay-home .home-about-editorial .home-about-copy{grid-column:1/-1;width:100%;max-width:none;margin:0}
html.cgd-light body.site-relay-home .home-about-editorial .home-about-bio{
 display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,280px),1fr));
 max-width:none;gap:clamp(22px,3vw,46px);border-top:1px solid var(--edge);padding-top:clamp(22px,3vw,46px)
}
html.cgd-light body.site-relay-home .home-about-editorial .home-about-bio h3{font-size:clamp(14px,1.3vw,18px)}
html.cgd-light body.site-relay-home .home-about-editorial .home-about-bio p{font-size:clamp(13px,1.15vw,16px)}
@media(max-width:640px){html.cgd-light body.site-relay-home #about .home-about-editorial{grid-template-columns:minmax(0,1fr)}}

/* One borderless clipping edge for both the card and its media. */
html.cgd-light body.site-relay-home :is(.portfolio-grid>a.project,.blog-grid>a.blog-feature){
 --card-rounding:clamp(20px,2.5vw,36px);
 border:0;box-shadow:none;
 border-radius:var(--card-rounding);corner-shape:round;
 overflow:hidden;clip-path:inset(0 round var(--card-rounding))
}
html.cgd-light body.site-relay-home :is(.portfolio-grid>a.project,.blog-grid>a.blog-feature)>:is(img,video,.museum-cover){
 border:0;border-radius:0;box-shadow:none
}
html.cgd-light body.site-relay-home :is(.portfolio-grid>a.project,.blog-grid>a.blog-feature):focus-visible{
 outline:2px solid #fff;outline-offset:-4px
}