/* "Some of our work" widget (2026-10-22). Palette = the site's: navy #0B1F3A, maroon #680000, yellow #F5B800. Loaded only on the front page, after front.css. */
.work1{--wp:clamp(34px,5vw,64px);background:#0B1F3A;color:#fff;border-top:6px solid #F5B800;padding:var(--wp) 0 clamp(40px,5.5vw,72px);overflow:hidden}
.work1 .work-in{width:min(100% - 40px,1370px);margin:0 auto;display:grid;grid-template-columns:auto minmax(0,1fr);gap:clamp(18px,3vw,48px);align-items:end}
.work1 .work-signwrap{position:relative;padding-top:38px;transform-origin:50% calc(var(--wp) * -1)}
.work1 .work-sign{position:relative;display:inline-block;margin:0;padding:16px clamp(22px,3vw,40px) 18px;background:#680000;color:#fff;border:3px solid #F5B800;border-radius:6px;box-shadow:0 10px 0 -6px rgba(0,0,0,.25)}
.work1 .work-sign h2{margin:0;color:#fff;font-family:var(--f-display,'Bricolage Grotesque',sans-serif);font-weight:800;font-size:clamp(1.9rem,1.3rem + 2.8vw,3.5rem);line-height:1.02;letter-spacing:-.015em}
.work1 .work-rope{position:absolute;top:calc(var(--wp) * -1);width:3px;height:calc(var(--wp) + 38px);background:#F5B800}
.work1 .work-rope:first-child{left:20%}
.work1 .work-rope:nth-child(2){right:20%}
.work1.is-in .work-signwrap{animation:work-swing 2.8s cubic-bezier(.3,.6,.4,1) 1 both}
@keyframes work-swing{0%{transform:rotate(3deg)}16%{transform:rotate(-2deg)}32%{transform:rotate(1.3deg)}48%{transform:rotate(-.8deg)}64%{transform:rotate(.4deg)}80%{transform:rotate(-.15deg)}100%{transform:rotate(0)}}
.work1 .work-side{display:flex;flex-wrap:wrap;gap:12px 22px;align-items:center;justify-content:space-between;padding-bottom:6px}
.work1 .work-lede{margin:0;flex:1 1 260px;max-width:34rem;font-size:1.15rem;line-height:1.5;color:#fff;font-weight:500}
.work1 .work-ctrls{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.work1 .work-btn{width:48px;height:48px;border-radius:50%;border:2px solid #F5B800;background:transparent;color:#F5B800;font-size:1.9rem;line-height:1;cursor:pointer;display:grid;place-items:center;padding:0 0 4px}
.work1 .work-btn:hover{background:#F5B800;color:#0B1F3A}
.work1 .work-play{background:transparent;border:2px solid #F5B800;border-radius:999px;color:#F5B800;font-family:inherit;font-weight:700;font-size:1rem;line-height:1;cursor:pointer;padding:0 18px;height:48px}
.work1 .work-play:hover{background:#F5B800;color:#0B1F3A}
.work1 .work-all{margin-left:6px}
.work1 .work-btn:focus-visible,.work1 .work-play:focus-visible,.work1 .work-card a:focus-visible,.work1 .work-all:focus-visible,.work1 .work-track:focus-visible{outline:3px solid #fff;outline-offset:3px}
.work1 .work-rail{margin-top:clamp(22px,3vw,36px);-webkit-mask-image:linear-gradient(90deg,transparent,#000 4%,#000 96%,transparent);mask-image:linear-gradient(90deg,transparent,#000 4%,#000 96%,transparent)}
.work1 .work-track{display:flex;gap:18px;list-style:none;margin:0;padding:8px clamp(14px,3vw,40px) 16px;overflow-x:auto;scrollbar-width:none;-ms-overflow-style:none;overscroll-behavior-x:contain;touch-action:pan-x pan-y}
.work1 .work-track::-webkit-scrollbar{display:none}
.work1 .work-card{flex:0 0 clamp(224px,23vw,300px);margin:0;padding:0}
.work1 .work-card a{display:flex;flex-direction:column;height:100%;background:#fff;border-radius:8px;overflow:hidden;color:#0B1F3A;text-decoration:none;transition:transform .18s ease,box-shadow .18s ease}
.work1 .work-card a:hover{transform:translateY(-5px);box-shadow:0 0 0 3px #F5B800}
.work1 .work-bar{display:flex;gap:6px;align-items:center;padding:7px 10px;background:#0B1F3A;border-bottom:2px solid #F5B800}
.work1 .work-bar i{width:9px;height:9px;border-radius:50%;background:#F5B800;display:block}
.work1 .work-bar i:nth-child(2){background:#fff}
.work1 .work-bar i:nth-child(3){background:#680000}
.work1 .work-card img{display:block;width:100%;height:auto;aspect-ratio:4/3;object-fit:cover;object-position:top;background:#e8ecf3}
.work1 .work-plate{flex:1 1 auto;display:flex;align-items:center;min-height:3.35em;padding:10px 14px;background:#F5B800;color:#0B1F3A;font-family:var(--f-display,'Bricolage Grotesque',sans-serif);font-weight:800;font-size:1.05rem;line-height:1.2}
@media (max-width:860px){.work1 .work-in{grid-template-columns:1fr;align-items:start}.work1 .work-side{justify-content:flex-start}}
@media (max-width:640px){.work1 .work-btn{width:34px;height:34px;font-size:1.4rem;padding-bottom:3px}.work1 .work-card{flex-basis:218px}.work1 .work-lede{font-size:1.05rem}.work1 .work-play{height:34px;padding:0 14px;font-size:.92rem}}
@media (prefers-reduced-motion:reduce){.work1.is-in .work-signwrap{animation:none}.work1 .work-card a{transition:none}}
