/* 18 Oct: the message itself is the hero: full-bleed and square under the menu, the title beneath */
.s-top { padding-top: var(--nav-h); }
.s-top .inner { display: grid; gap: var(--s-m); padding-top: var(--s-l); }
.s-video { position: relative; width: 100%; height: min(80svh, 56.25vw); border-radius: 0; overflow: hidden; display: block; background: var(--char-900); }
.s-video img { width: 100%; height: 100%; object-fit: cover; opacity: .9; transition: opacity var(--d-move), transform 1200ms var(--ease); }
.s-video:hover img { opacity: 1; transform: scale(1.02); }
.playbig { position: absolute; right: var(--s-s); bottom: var(--s-s); width: clamp(72px, 7vw, 120px); aspect-ratio: 1; border-radius: var(--r-card); display: grid; place-items: center; background: rgba(17, 20, 24, .5); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); color: var(--white); border: 1px solid rgba(255, 255, 255, .3); transition: background var(--d-move), transform 500ms var(--ease); }
.playbig svg { width: 36%; height: 36%; }
.s-video:hover .playbig { background: var(--gold-500); color: var(--ink); transform: scale(1.06); }
.s-title { display: grid; gap: var(--s-s); }
.s-meta { display: flex; flex-wrap: wrap; gap: .6em 2em; padding-block: var(--s-s); border-block: 1px solid var(--border); }
.s-meta span { display: inline-flex; align-items: center; gap: .5em; color: var(--grey-600); }
.s-meta b { font-weight: 500; color: var(--ink); }
.s-meta svg { width: 1.2em; height: 1.2em; color: var(--gold-600); }
.s-body .inner { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--gap); align-items: start; row-gap: var(--s-l); }
.s-body article { grid-column: 1 / 8; display: grid; gap: var(--s-m); }
.s-body article .lead-p { font-size: var(--t-big); font-weight: 300; line-height: 1.55; color: var(--ink); }
.s-body .point { display: grid; grid-template-columns: 2.2em minmax(0, 1fr); gap: var(--s-xs) var(--s-s); padding-top: var(--s-m); border-top: 1px solid var(--border); }
.s-body .point .n { font-size: var(--t-xxl); font-weight: 500; letter-spacing: -.05em; line-height: .85; color: var(--gold-700); }
.s-body .point h2 { font-size: var(--t-l); font-weight: 500; text-transform: uppercase; letter-spacing: -.02em; line-height: 1.1; }
.s-body .point p { grid-column: 2; color: var(--grey-600); }
.s-body aside { grid-column: 9 / 13; position: sticky; top: calc(var(--nav-h) + var(--s-l)); display: grid; gap: var(--s-s); }
.s-body aside .box { border-radius: var(--r-card); padding: var(--s-m); display: grid; gap: var(--s-s); }
.s-body aside li { display: grid; gap: .25em; padding-block: .7em; border-top: 1px solid var(--rule); }
.s-body aside li b { color: var(--gold-solid); font-weight: 500; }
.s-body aside li span { font-size: var(--t-small); color: var(--muted); }
.reflect { text-align: center; }
.reflect .inner { display: grid; justify-items: center; gap: var(--s-m); }
.reflect .t-accent { max-width: 22em; font-weight: 500; letter-spacing: -.03em; line-height: 1.2; }
@media (max-width: 1024px) { .s-body article, .s-body aside { grid-column: 1 / -1; position: relative; top: auto; } }
.keys2 { display: grid; gap: var(--s-s); padding-top: var(--s-s); border-top: 2px solid var(--gold-500); }