/* Living matter — scoped to the production hero. */
.hero.hero--living { display:grid; grid-template-columns: .94fr 1.06fr; align-items:center; column-gap:32px; row-gap:38px; padding-top:52px; padding-bottom:0; text-align:left; overflow:clip; }
.hero--living .living-copy { min-width:0; }
.living-eyebrow, .living-byline, .pixel-stage__heading, .pixel-stage__footer, .pixel-coordinate, .living-footer { font-family:var(--font-mono); font-size:10px; letter-spacing:.055em; color:var(--text-secondary); }
.living-eyebrow { display:flex; align-items:center; gap:10px; margin:0 0 25px; text-transform:uppercase; }
.living-eyebrow > span { width:7px; height:7px; background:var(--signal-vermilion); box-shadow:5px -5px 0 var(--signal-vermilion-subtle); }
.hero--living .hero-title { position:relative; margin:0 0 28px; font-size:clamp(64px,7.6vw,108px); line-height:.89; letter-spacing:-.065em; text-transform:none; }
.hero--living .hero-title em { display:inline-block; margin-top:5px; font-size:1.18em; line-height:.8; }
.living-period { display:inline-block; margin-left:14px; color:var(--signal-vermilion); font-size:.33em; vertical-align:middle; }
.hero--living .hero-subtitle { margin:0 0 26px; max-width:390px; font-size:15px; line-height:1.7; }
.hero--living .hero-actions { justify-content:flex-start; align-items:center; gap:24px; margin-bottom:24px; }
.hero--living .btn-primary { min-height:50px; padding:13px 20px; font-size:13px; border-radius:2px; box-shadow:none; gap:24px; }
.living-work-link { display:inline-flex; gap:18px; align-items:center; min-height:44px; font-size:13px; }
.living-work-link:hover { color:var(--signal-vermilion); }
.living-byline { margin:0; }
.pixel-stage { min-width:0; align-self:stretch; display:flex; flex-direction:column; justify-content:center; }
.pixel-stage__heading { display:flex; justify-content:space-between; align-items:center; padding:14px 0; border-top:1px solid var(--line-medium); }
.pixel-live { display:flex; align-items:center; gap:6px; font-size:9px; }
.pixel-live i { width:5px; height:5px; background:var(--signal-vermilion); }
.pixel-viewport { position:relative; height:clamp(365px,35.8vw,500px); overflow:hidden; cursor:crosshair; touch-action:pan-y; background:radial-gradient(ellipse at 50% 48%,var(--signal-vermilion-subtle),transparent 65%); }
.pixel-viewport::before { position:absolute; inset:12px 0; content:""; pointer-events:none; background-image:linear-gradient(var(--line-subtle) 1px,transparent 1px),linear-gradient(90deg,var(--line-subtle) 1px,transparent 1px); background-size:48px 48px; mask-image:radial-gradient(ellipse,#000 10%,transparent 70%); opacity:.65; }
#pixelCanvas, .pixel-fallback { position:absolute; inset:0; width:100%; height:100%; }
.pixel-fallback { color:var(--signal-vermilion); }
.pixel-stage.is-ready .pixel-fallback { display:none; }
.pixel-axis { position:absolute; color:var(--text-secondary); font:18px var(--font-mono); pointer-events:none; }
.pixel-axis--top { left:0; top:12px; }
.pixel-axis--bottom { right:0; bottom:20px; }
.pixel-coordinate { position:absolute; bottom:14px; left:0; pointer-events:none; font-size:9px; }
.pixel-stage__footer { display:flex; align-items:center; justify-content:space-between; gap:12px; border-top:1px solid var(--line-medium); padding:7px 0; font-size:9px; }
.pixel-stage__footer p { margin:0; }
.pixel-controls { display:flex; gap:4px; }
.pixel-controls[hidden] { display:none; }
.pixel-controls button { min-height:44px; padding:8px 10px; border:0; background:transparent; color:var(--text-primary); cursor:pointer; font:10px var(--font-mono); white-space:nowrap; }
.pixel-controls button:hover { background:var(--signal-vermilion-subtle); color:var(--signal-vermilion); }
.pixel-controls button:disabled { opacity:.55; cursor:default; }
.pixel-hint--touch { display:none; }
.pixel-announcement { position:absolute; width:1px; height:1px; padding:0; overflow:hidden; clip-path:inset(50%); }
.living-footer { grid-column:1/-1; display:flex; align-items:center; justify-content:space-between; gap:20px; padding:23px 0; border-top:1px solid var(--line-medium); font-size:9px; }
.living-footer > span:nth-child(2) { font-family:var(--font-serif); font-style:italic; font-size:17px; letter-spacing:0; }
.living-footer a { display:inline-flex; align-items:center; min-height:44px; gap:20px; }
@media (min-width:1100px) and (min-height:800px) { .hero.hero--living { padding-top:68px; row-gap:54px; } }
@media (max-width:1000px) and (min-width:761px) { .hero.hero--living { column-gap:16px; } .hero--living .hero-title { font-size:7.7vw; } .pixel-stage__footer { flex-wrap:wrap; } .pixel-stage__footer p { flex:1 0 100%; padding-top:10px; } .hero--living .hero-actions { gap:10px; } }
@media (max-width:760px) {
 .hero.hero--living { grid-template-columns:1fr; padding-top:42px; row-gap:32px; }
 .hero--living .hero-title { font-size:clamp(62px,15vw,100px); margin-bottom:26px; }
 .hero--living .hero-title br:nth-of-type(2) { display:none; }
 .hero--living .hero-title em { margin-left:.12em; }
 .living-eyebrow { font-size:9px; margin-bottom:22px; }
 .hero--living .hero-subtitle { max-width:430px; font-size:14px; }
 .hero--living .hero-actions { flex-direction:row; align-items:center; gap:22px; margin-bottom:18px; }
 .hero--living .btn-primary { width:auto; padding:12px 16px; gap:14px; }
 .pixel-viewport { height:clamp(310px,85vw,470px); }
 .pixel-stage__footer { font-size:9px; }
 .living-footer { padding:15px 0; font-size:8px; gap:8px; }
 .living-footer > span:nth-child(2) { display:none; }
}
@media (hover:none) { .pixel-hint--mouse { display:none; } .pixel-hint--touch { display:inline; } }
@media (max-width:370px) { .hero--living .hero-actions { gap:12px; } .living-work-link { font-size:12px; gap:8px; } .pixel-stage__footer { flex-wrap:wrap; } }
@media (forced-colors:active) { .pixel-fallback { display:block!important; } #pixelCanvas { visibility:hidden; } }