#social>.in{display:grid;grid-template-columns:1fr minmax(280px,420px);column-gap:clamp(48px,9vw,150px);align-items:center;max-width:1100px}
#social .mid{text-align:left;align-self:end;padding-bottom:var(--s5);margin:0}
#social h2{max-width:8ch}
#social .eyebrow{color:var(--lime)}
#social .soc-wrap{grid-column:1;grid-row:2;align-self:start}
#social .soc-links{justify-content:flex-start;margin-top:0}
#social .shop-film{grid-column:2;grid-row:1 / span 2;width:100%;margin:0;border:0;position:relative;overflow:hidden}
.shop-film-tools{position:absolute;inset:auto 0 0;display:flex;align-items:center;justify-content:space-between;padding:var(--s4) var(--s3) var(--s3);background:linear-gradient(transparent,var(--ink));color:var(--paper)}
.shop-film-tools[hidden]{display:none}
.shop-film-tools button{min-height:44px;padding:8px 12px;background:none;border:0;color:inherit;font-family:var(--f-mono);font-size:10px;text-transform:uppercase;letter-spacing:.08em;cursor:pointer}
.shop-film-tools button:hover{color:var(--lime)}
.shop-film-tools button:focus-visible{outline:2px solid var(--lime);outline-offset:-2px}
.shop-film-time{font-family:var(--f-mono);font-size:10px;color:var(--paper-2)}
.shop-film-progress{position:absolute;inset:auto 0 0;height:2px;background:var(--line)}
.shop-film-progress span{display:block;width:100%;height:100%;background:var(--lime);transform:scaleX(0);transform-origin:left}
@media(max-width:760px){#social>.in{display:flex;flex-direction:column;gap:0}#social .mid{align-self:stretch;text-align:left;padding-bottom:var(--s4)}#social h2{max-width:none}#social .shop-film{max-width:420px}#social .soc-wrap{align-self:stretch;margin-top:var(--s4)}#social .soc-links{justify-content:center}}
