/* Crit Pick · post headers in the game-hub visual language · 24 October 2026.
   Scoped to the shared editorial header. Interactive templates and creator art retain their layouts. */
.cp-post-breadcrumb{display:flex;align-items:baseline;flex-wrap:wrap;gap:8px 12px;width:min(1092px,calc(100% - 48px));margin:0 auto;padding:22px 0;font:400 11px/1.7 var(--cp-font-mono);color:var(--cp-muted);overflow-wrap:anywhere}
.cp-post-breadcrumb a{color:var(--cp-muted);text-decoration:none}
.cp-post-breadcrumb a:hover{color:var(--cp-gold)}
.gh-article-header.cp-post-hero{display:block;position:relative;isolation:isolate;overflow:hidden;width:100%;max-width:none;margin:0 0 44px;padding:0;border-block:1px solid var(--cp-border);background:var(--cp-graphite);text-align:left}
.cp-post-hero__backdrop{position:absolute;inset:0;z-index:-2;pointer-events:none;overflow:hidden}
.cp-post-hero__backdrop img{display:block;width:100%;height:100%;object-fit:cover;object-position:center 35%;opacity:1}
.cp-post-hero::after{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:linear-gradient(90deg,rgba(22,24,29,.97) 0%,rgba(22,24,29,.9) 36%,rgba(22,24,29,.4) 70%,rgba(22,24,29,.6) 100%),linear-gradient(180deg,rgba(22,24,29,.25) 0%,rgba(22,24,29,0) 30%,rgba(22,24,29,0) 65%,rgba(22,24,29,1) 100%)}
.cp-post-hero__inner{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:center;gap:40px;width:min(1092px,calc(100% - 48px));margin:0 auto;padding:clamp(40px,7vw,96px) 0 46px}
.cp-post-hero__copy{min-width:0}
.cp-post-hero .gh-article-tag{display:inline-block;margin:0 0 18px;font:500 11px/1.7 var(--cp-font-mono);letter-spacing:.16em;text-transform:uppercase}
.cp-post-hero .gh-article-title{font-family:var(--cp-font-head);font-size:clamp(34px,5.2vw,56px)!important;line-height:1.03;letter-spacing:-.025em;font-weight:700;margin:0;color:var(--cp-text);overflow-wrap:anywhere;text-wrap:balance}
.cp-post-hero .gh-article-excerpt{font:400 18px/1.65 var(--cp-font-body);max-width:60ch;margin:18px 0 0;color:var(--cp-body)}
.cp-post-hero .gh-meta-share{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:18px;margin:26px 0 0}
.cp-post-hero .gh-article-meta{min-width:0;font-family:var(--cp-font-mono)}
.cp-post-hero .gh-article-author-name{font:500 13px/1.5 var(--cp-font-head);margin:0 0 4px}
.cp-post-hero .gh-article-meta-content{font:400 11px/1.6 var(--cp-font-mono);color:var(--cp-muted)}
.cp-post-hero .gh-button-share{min-height:40px;padding:9px 15px;border:1px solid #707580;border-radius:9px;color:var(--cp-text);font:500 12px/1.5 var(--cp-font-mono);white-space:nowrap}
.cp-post-hero .gh-button-share:hover{border-color:var(--cp-gold);color:var(--cp-gold)}
.cp-post-hero__read{display:inline-flex;align-items:center;gap:22px;min-height:44px;margin:26px 0 0;padding:12px 18px;border:1px solid var(--cp-gold);border-radius:9px;background:var(--cp-gold);color:var(--cp-gold-ink);font:500 13px/1.5 var(--cp-font-mono);text-decoration:none}
.cp-post-hero__read:hover{opacity:1;background:#ffc456;color:var(--cp-gold-ink)}
/* Fill the image frame. The caption remains a separate strip below it. */
.gh-article-header.cp-post-hero .gh-article-image{display:block;order:0;grid-column:2;grid-row:1;align-self:center;position:relative;left:auto;right:auto;transform:none;width:100%!important;max-width:100%!important;padding:0!important;margin:0!important;border:1px solid var(--cp-border)!important;border-top:3px solid var(--cp-gold)!important;border-radius:14px!important;background:var(--cp-surface)!important;overflow:hidden;box-sizing:border-box;box-shadow:0 18px 50px #0003}
.gh-article-header.cp-post-hero .gh-article-image img{display:block;width:100%!important;max-width:100%!important;height:auto!important;max-height:none!important;aspect-ratio:16/9!important;object-fit:cover!important;object-position:center!important;background:var(--cp-surface-2);border-radius:0}
.cp-post-hero .gh-article-image figcaption{font:400 11px/1.7 var(--cp-font-mono);text-align:left;color:var(--cp-muted);padding:12px 16px;margin:0;border-top:1px solid var(--cp-border)}
.cp-post-hero .gh-article-image figcaption a{color:var(--cp-gold)}
.cp-post-hero--no-image .cp-post-hero__inner{grid-template-columns:minmax(0,1fr)}
.cp-post-hero--no-image .cp-post-hero__copy{max-width:850px}
#cp-post-content{scroll-margin-top:100px}
.cp-post-hero a:focus-visible,.cp-post-breadcrumb a:focus-visible{outline:2px solid var(--cp-gold);outline-offset:5px}
@media(max-width:900px){.cp-post-hero__inner{grid-template-columns:minmax(0,1fr);gap:32px;padding:36px 0 40px}.gh-article-header.cp-post-hero .gh-article-image{grid-column:1;grid-row:auto}.cp-post-hero .gh-article-title{font-size:clamp(34px,5.2vw,56px)!important}.cp-post-hero .gh-article-excerpt{font-size:17px;line-height:1.65;margin-top:18px}.cp-post-hero .gh-meta-share{justify-content:flex-start;gap:20px}.cp-post-breadcrumb{padding:16px 0;font-size:10px;gap:6px 9px}.gh-article-header.cp-post-hero{margin-bottom:32px}.cp-post-hero::after{background:linear-gradient(180deg,rgba(22,24,29,.55) 0%,rgba(22,24,29,.9) 40%,rgba(22,24,29,1) 100%)}}
/* Let the background reach the page edges; the inner text keeps the shared 1092px grid. */
.post-template .gh-main:has(.cp-post-hero){padding-inline:0}
.cp-post-hero .gh-button-share{background:transparent!important;color:var(--cp-text)!important}
.cp-post-hero .gh-button-share:hover{color:var(--cp-gold)!important}

.cp-post-hero .gh-button-share{border:1px solid #707580!important;box-shadow:none!important}

.cp-post-hero__media{min-width:0}
.cp-post-hero__verdict{display:flex;gap:16px;align-items:center;margin:0 0 14px;padding:16px 18px;border-radius:14px;background:rgba(22,24,29,.82);backdrop-filter:blur(8px);border:.5px solid var(--cp-border);text-decoration:none;color:var(--cp-text)}
.cp-post-hero__score{display:grid;place-content:center;text-align:center;flex:none;width:76px;height:76px;border-radius:12px;background:rgba(14,16,20,.88);border:2px solid var(--score-color,#a3a7b0)}
.cp-post-hero__score b{font:700 30px/1 var(--cp-font-head);color:var(--score-color,#a3a7b0)}
.cp-post-hero__score small{font:500 9.5px var(--cp-font-mono);letter-spacing:.1em;color:var(--cp-muted);margin-top:4px}
.cp-post-hero__verdict-label{display:block;font:500 11px var(--cp-font-mono);letter-spacing:.14em;text-transform:uppercase;color:var(--cp-gold)}
.cp-post-hero__verdict-title{display:block;margin-top:4px;font:600 17px/1.3 var(--cp-font-head);color:var(--cp-text)}
.cp-post-hero__verdict:hover{border-color:var(--cp-gold-50)}
#cp-post-verdict{scroll-margin-top:100px}

/* User correction: foreground image card removed; keep the atmospheric backdrop and actual verdict. */
.cp-post-hero__media:empty{display:none}
.cp-post-hero__inner:not(:has(.cp-post-hero__verdict)){grid-template-columns:minmax(0,1fr)}
.cp-post-hero__inner:not(:has(.cp-post-hero__verdict)) .cp-post-hero__copy{max-width:850px}

.cp-post-hero__follow{margin-top:20px}.cp-post-hero__follow:empty{display:none}.cp-post-hero__follow a,.cp-post-hero__follow button{font:400 16px/1.5 var(--cp-font-body)}

/* Requested share placement: top right, with the established gold action colour. */
.cp-post-hero__inner{position:relative}
.cp-post-hero .cp-post-share{position:absolute;top:24px;right:0;z-index:3;min-height:44px;padding:10px 18px;background:var(--cp-gold,#ffb22e)!important;color:#16181d!important;border:1px solid var(--cp-gold,#ffb22e)!important;font-weight:600;box-shadow:none!important}
.cp-post-hero .cp-post-share:hover{background:#ffc457!important;color:#16181d!important}
.cp-post-hero .cp-post-share:focus-visible{outline:3px solid #f5f3ed;outline-offset:3px}
.cp-post-image-credit{width:min(1092px,calc(100% - 48px));margin:32px auto;font:12px/1.6 var(--cp-font-body);color:var(--cp-muted);overflow-wrap:anywhere}
.cp-post-image-credit a{color:inherit;text-decoration:underline}
@media(max-width:900px){.cp-post-hero__inner{padding-top:88px}.cp-post-hero .cp-post-share{top:20px}}