/* Shared refinements: native disclosures stay usable without JavaScript. */
summary{cursor:pointer;list-style:none}
summary::-webkit-details-marker{display:none}
summary{display:flex;align-items:center;gap:12px;min-height:44px}
summary::after{content:'';display:block;flex:0 0 26px;width:26px;height:26px;margin-left:auto;background:var(--c,var(--brand));mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m14 11-8 10-3-3 9-9M10 5l4-3 7 6-3 4-4-3-2 2-4-4 2-2Z'/%3E%3C/svg%3E") center/24px 24px no-repeat;transform-origin:65% 80%}
summary:has(>.disclosure-hammer)::after{display:none}
details[open]>summary{background-color:color-mix(in srgb,var(--c,var(--brand)) 5%,white)}
.mnav__cat>summary>.chev,.faq__item>summary>.chev,.directory-card__details>summary>svg:not(.disclosure-hammer),.directory-more>summary>svg:not(.disclosure-hammer){display:none}
summary:focus-visible{outline:3px solid var(--c,var(--brand));outline-offset:4px;border-radius:6px}
.disclosure-hammer{margin-left:auto;flex:0 0 26px;width:24px;height:24px;overflow:visible;color:var(--c,var(--brand));transform-origin:65% 80%}
@media(prefers-reduced-motion:no-preference){
 details[open].directory-card__details>ul,details[open].directory-more>.directory-grid,details[open].faq__item>p{animation:alpha-disclosure-in .28s ease-out}
}
@keyframes alpha-disclosure-in{from{opacity:0;transform:translateY(-5px)}to{opacity:1;transform:none}}
/* Share heading and copy rows, so borders line up even with longer translations. */
@supports(grid-template-rows:subgrid){
 .service-directory .directory-grid{row-gap:0;grid-auto-rows:auto}
 .service-directory .directory-card{display:grid;grid-template-rows:subgrid;grid-row:span 4;margin-top:18px}
 .service-directory .directory-card>h3{grid-row:1}
 .service-directory .directory-card>p{grid-row:2}
 .service-directory .directory-card>.directory-card__details{grid-row:3;align-self:start}
 .service-directory .directory-card>.directory-card__link{grid-row:4;align-self:end;margin-top:0}
 .mega .mega__inner:has(>.mega__col){grid-template-rows:auto 1fr;row-gap:0}
 .mega .mega__col{display:grid;grid-template-rows:subgrid;grid-row:span 2;min-width:0}
 .mega .mega__head{align-self:stretch;align-items:flex-start;line-height:1.5}
 .mega .mega__head .ico{flex-shrink:0;margin-top:.12em}
}
/* Only project reference cards; blog and vacancy cards retain their layouts. */
.ref-card[id^='reference-']{display:flex;flex-direction:column}
.ref-card[id^='reference-'] .reference-figure{display:flex;flex-direction:column;margin:0}
.ref-card[id^='reference-'] .reference-figure>.ref-card__img{margin:0;aspect-ratio:16/10;height:auto}
.ref-card[id^='reference-'] .reference-figure>figcaption{min-height:44px;padding:10px 16px;font-size:12px;line-height:1.5;background:#f6f8fb;border-bottom:1px solid var(--line);overflow-wrap:anywhere}
.ref-card[id^='reference-'] .ref-card__body{display:flex;flex-direction:column;flex:1;gap:8px}
.ref-card[id^='reference-'] .reference-place{min-height:2.8em;margin:0;font-size:13px;line-height:1.4;color:var(--slate)}
.reference-place__label{font-weight:700}
.ref-card[id^='reference-'] .ref-card__body h3{margin:0 0 10px}
.ref-card[id^='reference-'] .reference-website{margin-top:auto}
.reference-location-note{max-width:80ch;color:var(--slate);font-size:14px;line-height:1.65;margin:0 0 24px}
@media(prefers-reduced-motion:reduce){.disclosure-hammer{animation:none!important;transform:none!important}}
.ref-card[id^='reference-'] .reference-figure>.ref-card__img{position:relative;min-height:0;flex:none;overflow:hidden}
.ref-card[id^='reference-'] .reference-figure>.ref-card__img img{position:absolute;inset:0;display:block;width:100%;height:100%;max-width:100%;object-fit:contain;object-position:center}
@media(hover:hover) and (pointer:fine){
 .scroll-scrub-journey .stage{cursor:grab}
 .scroll-scrub-journey .stage.is-hero-dragging{cursor:grabbing;user-select:none}
 .scroll-scrub-journey .stage a,.scroll-scrub-journey .stage button{cursor:pointer}
 .scroll-scrub-journey .hero-copy{cursor:auto}
}

@media(prefers-reduced-motion:no-preference){details[open]>summary:not(:has(>.disclosure-hammer))::after{animation:alpha-hammer-strike .44s ease-out}}
@keyframes alpha-hammer-strike{0%,100%{transform:rotate(0)}36%{transform:rotate(-38deg)}58%{transform:rotate(14deg)}78%{transform:rotate(-7deg)}}
@media(prefers-reduced-motion:reduce){summary::after{animation:none!important}}

/* Service cues replace directional arrows; labels and destinations stay intact. */
.has-service-action .service-action-icon{display:inline-block;width:27px;height:27px;flex:none;vertical-align:middle;color:var(--c,var(--brand));overflow:visible}
.has-service-action{gap:12px}
.action-tool,.action-grow,.action-wrap,.action-flame,.action-drop,.action-snow{transform-box:fill-box;transform-origin:center}
.action-grow{transform-origin:bottom}
.is-action-playing .action-tool{animation:alpha-action-tool .9s ease-in-out}
.is-action-playing .action-grow{animation:alpha-action-grow 1s ease-out}
.is-action-playing .action-wrap{animation:alpha-action-wrap 1s ease-out}
.is-action-playing .action-flame{animation:alpha-action-flame 1s ease-in-out}
.is-action-playing .action-drop{animation:alpha-action-drop 1s ease-in-out}
.is-action-playing .action-snow{animation:alpha-action-snow 1s ease-in-out}
@keyframes alpha-action-tool{0%,100%{transform:rotate(0)}30%{transform:rotate(-28deg)}60%{transform:rotate(12deg)}}
@keyframes alpha-action-grow{0%{transform:scale(.55);opacity:.4}70%{transform:scale(1.08);opacity:1}100%{transform:scale(1)}}
@keyframes alpha-action-wrap{0%{transform:scaleX(.45);opacity:.4}70%,100%{transform:scaleX(1);opacity:1}}
@keyframes alpha-action-flame{0%,100%{transform:scaleY(1)}35%{transform:scaleY(.7) translateY(1px)}70%{transform:scaleY(1.12) translateY(-1px)}}
@keyframes alpha-action-drop{0%,100%{transform:translateY(0)}40%{transform:translateY(-3px)}70%{transform:translateY(1px)}}
@keyframes alpha-action-snow{0%{transform:rotate(-20deg)}100%{transform:rotate(40deg)}}
@media(prefers-reduced-motion:reduce){.service-action-icon *{animation:none!important;transform:none!important}}

/* Consistent feedback for other selectable controls, including touch and focus. */
a,button,select,input,textarea{transition:color .18s ease,background-color .18s ease,border-color .18s ease,box-shadow .18s ease}
.location-services .sub-card>span.has-service-action{display:flex;align-items:center}
.location-services .sub-card .service-action-icon{width:32px;height:32px}
.directory-jump .service-action-icon{width:23px;height:23px}
@media(hover:hover) and (pointer:fine) and (prefers-reduced-motion:no-preference){
 a:hover>svg:not(.service-action-icon):not(.disclosure-hammer):not(.logo__mark):not(.chev),button:hover>svg:not(.chev){translate:2px 0;transition:translate .2s ease}
 main a.sub-card:hover,.reference-website:hover,.reference-filter:hover{translate:0 -2px;transition:translate .2s ease,box-shadow .2s ease}
}
main a.sub-card:focus-visible,button:focus-visible,select:focus-visible,input:focus-visible,textarea:focus-visible{outline:3px solid var(--c,var(--brand));outline-offset:4px}
@media(prefers-reduced-motion:no-preference){button:active,main a.sub-card:active,.btn:active{scale:.985}}
@media(prefers-reduced-motion:reduce){a,button,select,input,textarea{transition:none!important}a>svg,button>svg,main a.sub-card,.reference-website,.reference-filter{translate:none!important;scale:none!important}}

/* Service colours come from the same semantic map as their SVG shapes. */
.alpha-service-icon{color:var(--service-icon-color,var(--c,var(--brand)))}
.action-rail,.action-lights{transform-box:fill-box;transform-origin:center}
.is-action-playing .action-rail{animation:alpha-action-wrap 1s ease-out}
.is-action-playing .action-lights{animation:alpha-lights 1s ease-out}
