.sm{margin-top:35px;margin-bottom:100px}.sm-heading{display:flex;justify-content:space-between;gap:32px;align-items:end;margin-bottom:30px}.hp-site .sm-heading h2{font-size:clamp(30px,3.15vw,47px);max-width:760px}.sm-heading h2 em{font-weight:inherit;color:var(--hp-accent)}.sm-heading>p{font-size:15px;line-height:1.5;color:var(--hp-muted);flex-shrink:0}.sm-grid{display:grid;grid-template-columns:repeat(3,1fr);border:1px solid var(--hp-line);border-radius:20px;overflow:hidden;background:var(--hp-paper)}.sm-cell{position:relative;display:flex;flex-direction:column;min-height:265px;padding:24px 28px 28px;text-decoration:none;border-right:1px solid var(--hp-line);isolation:isolate;transition:background .3s}.sm-cell:nth-child(3n){border-right:0}.sm-cell:nth-child(-n+3){border-bottom:1px solid var(--hp-line)}.sm-cell-0{background:var(--hp-contact)}.sm-cell:before{content:"";position:absolute;inset:0;background:var(--hp-accent);opacity:0;transition:opacity .35s;z-index:-1}.sm-cell:hover:before,.sm-cell:focus-visible:before{opacity:.055}.sm-cell:after{content:"";position:absolute;bottom:0;left:28px;right:28px;height:2px;background:var(--hp-accent);transform:scaleX(0);transform-origin:left;transition:transform .45s cubic-bezier(.22,1,.36,1)}.sm-cell:hover:after,.sm-cell:focus-visible:after{transform:scaleX(1)}.sm-top{display:flex;justify-content:space-between;align-items:start;gap:12px}.sm-note{font-size:11px;letter-spacing:.07em;text-transform:uppercase;color:var(--hp-muted)}.sm-arrow{font-size:23px;color:var(--hp-accent);line-height:1;transition:transform .35s}.sm-cell:hover .sm-arrow,.sm-cell:focus-visible .sm-arrow{transform:translate(3px,-3px)}.sm-drawing{width:96px;height:80px;margin:14px 0 14px;color:var(--hp-accent)}.sm-act{transform-origin:center;transition:transform .65s cubic-bezier(.22,1,.36,1)}.sm-cell-0:hover .sm-act,.sm-cell-0:focus-visible .sm-act{transform:translate(4px,-4px)}.sm-cell-1:hover .sm-act,.sm-cell-1:focus-visible .sm-act{transform:translateY(-3px)}.sm-cell-2:hover .sm-act,.sm-cell-2:focus-visible .sm-act{transform:rotate(7deg)}.sm-cell-3:hover .sm-act,.sm-cell-3:focus-visible .sm-act{transform:translateX(7px)}.sm-cell-4:hover .sm-act,.sm-cell-4:focus-visible .sm-act{transform:translate(-5px,-4px)}.sm-cell-5:hover .sm-act,.sm-cell-5:focus-visible .sm-act{transform:rotate(180deg)}.hp-site .sm-copy h3{font-size:30px;margin-bottom:9px}.sm-copy p{font-family:Jost,sans-serif;font-size:16px;line-height:1.5;max-width:30ch;color:var(--hp-muted)}.sm-foot{display:flex;justify-content:space-between;gap:24px;padding-top:20px;font-size:14px;color:var(--hp-muted)}.sm-foot a{text-decoration:none;border-bottom:1px solid var(--hp-line);color:var(--hp-accent)}.hp-site .sm-cell:focus-visible{outline-offset:-5px;border-radius:0;outline-width:2px}.hp-work .hp-clients-relocated{width:100%;margin:50px 0 65px}.sm.sm-entered .sm-copy,.sm.sm-entered .sm-drawing{animation:sm-arrive .65s both;animation-delay:calc(var(--sm-i)*70ms)}@keyframes sm-arrive{from{transform:translateY(12px);opacity:.3}to{transform:translateY(0);opacity:1}}
@media(max-width:900px){.sm-heading{display:block}.sm-heading>p{margin-top:18px}.sm-cell{padding:20px;min-height:260px}.sm-note{font-size:10px}.sm-copy p{font-size:15px}.hp-site .sm-copy h3{font-size:27px}.sm-foot{font-size:13px}}
@media(max-width:600px){.sm{margin-top:20px;margin-bottom:65px}.sm-heading{margin-bottom:24px}.hp-site .sm-heading h2{font-size:34px}.sm-heading h2 em{display:block}.sm-heading>p{font-size:14px}.sm-grid{grid-template-columns:1fr 1fr;border-radius:16px}.sm-cell{padding:18px 15px;min-height:250px}.sm-cell:nth-child(n){border-right:1px solid var(--hp-line);border-bottom:1px solid var(--hp-line)}.sm-cell:nth-child(2n){border-right:0}.sm-cell:nth-last-child(-n+2){border-bottom:0}.sm-note{font-size:9px;letter-spacing:.03em;max-width:17ch}.sm-drawing{width:74px;height:62px;margin:15px 0}.hp-site .sm-copy h3{font-size:25px}.sm-copy p{font-size:14px;line-height:1.45}.sm-arrow{font-size:20px}.sm-foot{display:block}.sm-foot>a{display:inline-block;margin-top:12px}.hp-work .hp-clients-relocated{margin:35px 0 45px}}
@media(prefers-reduced-motion:reduce){.sm *,.sm *:before,.sm *:after{animation:none!important;transition:none!important}.sm-cell:hover .sm-act,.sm-cell:focus-visible .sm-act{transform:none}}

@media(max-width:600px){.sm-grid{grid-template-columns:1fr}.sm-cell{display:grid;grid-template-columns:52px 1fr 18px;gap:13px;align-items:center;min-height:112px;padding:18px 16px}.sm-cell:nth-child(n){border-right:0;border-bottom:1px solid var(--hp-line)}.sm-cell:last-child{border-bottom:0}.sm-top{display:contents}.sm-note{display:none}.sm-arrow{grid-column:3;grid-row:1;align-self:start}.sm-drawing{grid-column:1;grid-row:1;width:52px;height:48px;margin:0}.sm-copy{grid-column:2;grid-row:1}.hp-site .sm-copy h3{font-size:25px;margin-bottom:6px}.sm-copy p{font-size:14px;max-width:none}.sm-cell:after{left:16px;right:16px}}

/* Service-specific colour feedback. Default surfaces remain restrained. */
.sm-cell-0{--sm-wash:#eee1fa;--sm-colour:#7438a0}
.sm-cell-1{--sm-wash:#e7f0fa;--sm-colour:#295f91}
.sm-cell-2{--sm-wash:#fbece2;--sm-colour:#995022}
.sm-cell-3{--sm-wash:#eaf1e7;--sm-colour:#42643c}
.sm-cell-4{--sm-wash:#f7e8ee;--sm-colour:#934967}
.sm-cell-5{--sm-wash:#eaeafb;--sm-colour:#5654a0}
html[data-theme=dark] .sm-cell-0{--sm-wash:#362341;--sm-colour:#d6a5fa}
html[data-theme=dark] .sm-cell-1{--sm-wash:#1c3044;--sm-colour:#9fc9ed}
html[data-theme=dark] .sm-cell-2{--sm-wash:#3d2b22;--sm-colour:#f1bb96}
html[data-theme=dark] .sm-cell-3{--sm-wash:#27382a;--sm-colour:#b3d4a6}
html[data-theme=dark] .sm-cell-4{--sm-wash:#3c2632;--sm-colour:#e8afc5}
html[data-theme=dark] .sm-cell-5{--sm-wash:#2d2b47;--sm-colour:#bebafa}
.sm-cell{transition:background-color 250ms ease}.sm-drawing,.sm-arrow{transition:color 250ms ease,transform .45s cubic-bezier(.22,1,.36,1)}
.sm-cell:before{display:none}.sm-cell:after{background:var(--sm-colour)}
.sm-cell:focus-visible,.sm-cell:active{background:var(--sm-wash)}
.sm-cell:focus-visible .sm-drawing,.sm-cell:focus-visible .sm-arrow,.sm-cell:active .sm-drawing,.sm-cell:active .sm-arrow{color:var(--sm-colour)}
@media(hover:hover){.sm-cell:hover{background:var(--sm-wash)}.sm-cell:hover .sm-drawing,.sm-cell:hover .sm-arrow{color:var(--sm-colour)}}
.hp-site .sm{margin-bottom:48px}.hp-site .sm + .hp-work{padding-top:0;margin-top:0}
@media(max-width:600px){.hp-site .sm{margin-bottom:32px}}
@media(prefers-reduced-motion:reduce){.sm-cell,.sm-drawing,.sm-arrow{transition:none}}

/* Simplified service matrix: no eyebrow captions, compact rows. */
.sm-cell{min-height:220px;padding-top:20px;padding-bottom:23px}.sm-top{position:absolute;top:20px;right:24px}.sm-arrow{font-size:18.4px}.sm-drawing{margin:0 0 12px}.sm-copy p{max-width:30ch}
@media(max-width:900px) and (min-width:601px){.sm-cell{min-height:228px}.sm-top{right:18px}}
@media(max-width:600px){.sm-cell{min-height:104px;padding:16px}.sm-top{display:contents;position:static}.sm-arrow{font-size:16px}.sm-drawing{margin:0}.sm-copy p{max-width:none}}

/* Align copy to the films, distributing the four text groups evenly. */
@media(min-width:651px){.hp-site .hp-hero{align-items:stretch}.hp-site .hp-hero-copy{display:flex;flex-direction:column;justify-content:space-between;padding:0 0 27px;gap:24px}.hp-site .hp-hero-copy h1{margin:0 -30px 0 0}.hp-site .hp-hero-copy .hp-actions,.hp-site .hp-hero-copy .hp-hero-note{margin-top:0;margin-bottom:0}.hp-site .hp-hero-copy .hp-actions{align-self:flex-start}}
@media(max-width:650px){.hp-site .hp-hero-copy{display:flex;flex-direction:column;gap:24px;padding:0}.hp-site .hp-hero-copy h1{margin:0}.hp-site .hp-hero-copy .hp-actions,.hp-site .hp-hero-copy .hp-hero-note{margin:0}.hp-site .hp-hero-copy .hp-actions{align-self:flex-start}}

/* Optical top alignment; keep the closing service line anchored. */
@media(min-width:651px){.hp-site .hp-hero-copy>.hp-eyebrow{position:relative;top:-5px}.hp-site .hp-hero-copy>h1{position:relative;top:-20px}.hp-site .hp-hero-copy>.hp-actions{position:relative;top:-20px}}

@media(min-width:651px) and (max-width:700px){.hp-site .hp-hero-copy{padding-bottom:99px;gap:20px}.hp-site .hp-hero-copy h1{margin-right:0;top:0}.hp-site .hp-hero-copy>.hp-actions{top:0}}