/* Approved sandbox hero, shared by single posts and the design reference. */
.post-hero { box-sizing: border-box; width:100%; font-family: Inter,sans-serif; }
.post-hero *, .post-hero::before { box-sizing: border-box; }
.post-hero { --shade: #131812; --glow: #87925c; position: relative; isolation: isolate; aspect-ratio: 5/2; overflow: hidden; border-radius: 12px; background: radial-gradient(ellipse at 95% 35%, var(--glow), transparent 72%), linear-gradient(105deg, #090b09 10%, var(--shade) 100%); }
.post-hero--branding { --shade: #302820; --glow: #bcaf98; }
.post-hero--webdesign { --shade: #17262b; --glow: #819ea3; }
.post-hero::before { content: ''; position: absolute; inset: 0; z-index: -1; background-image: linear-gradient(rgb(255 255 255 / 12%) 1px, transparent 1px), linear-gradient(90deg, rgb(255 255 255 / 12%) 1px, transparent 1px); background-size: 36px 36px; mask-image: linear-gradient(120deg, #000, rgb(0 0 0 / 35%) 75%); }
.post-hero__copy { position: relative; z-index: 2; padding: 40px; max-width: 44%; color: #fff; }
.post-hero__eyebrow { font-size: 14px; letter-spacing: .11em; line-height: 1.4; margin: 0 0 18px; color: #e0e1da; }
.post-hero__topic { font-size: clamp(26px, 3.3vw, 38px); line-height: 1.12; letter-spacing: -.02em; margin: 0; text-wrap: balance; }
.post-hero__platform { position: absolute; z-index: 1; width: 62%; height: auto; right: 0; bottom: -12%; object-fit: contain; }
.post-hero__signature { position: absolute; bottom: 25px; left: 40px; color: #ddd; font-size: 14px; letter-spacing: .04em; }
.post-hero .post-hero__topic { font-family: "Funnel Display",sans-serif; font-weight:400; color:#fff; }
.post-hero .post-hero__eyebrow { font-weight:400; }
.post-hero .post-hero__signature { line-height:1.65; }
.post-hero img.post-hero__platform { display:block; max-width:none; margin:0; border:0; border-radius:0; }
@media(max-width:600px) {
    .post-hero { aspect-ratio: 1.08; }
    .post-hero::before { background-size: 28px 28px; }
    .post-hero__copy { padding: 24px; max-width: 85%; }
    .post-hero__topic { font-size: 29px; max-width: 235px; }
    .post-hero__eyebrow { font-size: 12px; margin-bottom: 12px; }
    .post-hero__platform { width: 84%; right: 0; bottom: -5%; }
    .post-hero__signature { left: 24px; bottom: 18px; font-size: 12px; }
}
/* Span the full heading block above both the article and sidebar. */
.single-post .skema-article-heading-group > .skema-single-hero { width:100%; max-width:none; align-self:flex-start; margin-inline:0; }
@media(max-width:1024px) {
    .single-post .skema-article-heading-group > .skema-single-hero { width:calc(100% - 4px); margin-inline:auto; }
}