/* ESI critical-path accent (light scheme --acc in ESI theme.css), used ONLY for the critical path */
:root{--acc:#cc3d12}
/* IDRS shared polish: page transitions, focus, reveals, consistent nav. Greyscale only. */
@view-transition{navigation:auto}
::view-transition-old(root){animation:idrsVtOut .28s cubic-bezier(.4,0,1,1) both}
::view-transition-new(root){animation:idrsVtIn .52s cubic-bezier(.22,1,.36,1) both}
@keyframes idrsVtOut{to{opacity:0;transform:translateY(-6px)}}
@keyframes idrsVtIn{from{opacity:0;transform:translateY(10px)}}
.floatbar{view-transition-name:idrs-nav}
::view-transition-group(idrs-nav){animation-duration:0s}
/* nav: same three items on every page */
.fnav a.cta{color:var(--ink);border:1px solid rgba(11,11,11,.28);padding:9px 16px;transition:background .3s,color .3s,border-color .3s}
.fnav a.cta::after{display:none}
.fnav a.cta:hover{background:var(--ink);color:#fff;border-color:var(--ink)}
.fnav a[aria-current="page"]:not(.cta){color:var(--ink)}
.fnav a[aria-current="page"]:not(.cta)::after{width:100%}
/* keyboard focus */
:focus{outline:none}
:focus-visible{outline:1px solid var(--ink);outline-offset:5px;border-radius:1px}
.band :focus-visible{outline-color:#f4f4f2}
.skip{position:absolute;left:12px;top:-60px;z-index:100;background:var(--ink);color:#fff;font-family:var(--m);font-size:11px;letter-spacing:.16em;text-transform:uppercase;padding:10px 14px;transition:top .2s}
.skip:focus{top:12px}
/* reveals: soft blur into focus, staggered by idrs.js */
.rv{opacity:0;transform:translateY(18px);filter:blur(5px);transition:opacity 1s cubic-bezier(.22,1,.36,1),transform 1s cubic-bezier(.22,1,.36,1),filter .9s ease}
.rv.in{opacity:1;transform:none;filter:none}
/* capability rows: the mini timeline replays on hover */
@keyframes idrsPgBar{from{transform:scaleX(0)}to{transform:none}}
@keyframes idrsPgMs{0%{transform:scale(0) rotate(-90deg)}70%{transform:scale(1.25) rotate(0)}100%{transform:none}}
.row:hover .pg-b,.prow:hover .pg-b,.row:focus-visible .pg-b{animation:idrsPgBar .7s cubic-bezier(.22,1,.36,1) both;animation-delay:calc(var(--i)*.09s)}
.row:hover .pg-ms,.prow:hover .pg-ms,.row:focus-visible .pg-ms{animation:idrsPgMs .6s cubic-bezier(.22,1,.36,1) both;animation-delay:calc(var(--i)*.09s)}
.row:hover .pg-b.crit,.prow:hover .pg-b.crit{fill:var(--acc)}
.row .t{transition:letter-spacing .5s cubic-bezier(.22,1,.36,1)}
.row:hover .pgc{color:var(--grey)}
@media(prefers-reduced-motion:reduce){
  @view-transition{navigation:none}
  .rv{opacity:1;transform:none;filter:none;transition:none}
  .row:hover .pg-b,.prow:hover .pg-b,.row:hover .pg-ms,.prow:hover .pg-ms{animation:none}
  *{scroll-behavior:auto!important}
}
/* small grey text: AA contrast (#6b6b6b on white ≈ 5.3:1) */
footer .meta,.pgc,.mono-cap,.row .n,.label{color:#6b6b6b}
.band .label,.hero .label{color:var(--on-dark-mute)}
/* contact page: same AA treatment, styles only (form markup untouched) */
#enquiry-form label,.form-note,.form-note a,.aside .k{color:#6b6b6b}
@media(max-width:640px){#enquiry-form label,.form-note,.aside .k{font-size:12px}}

/* critical path in orange: mini timelines (home, expertise, service pages) */
.pg-b.crit{fill:var(--acc);stroke:var(--acc)}
.pg-ms{fill:var(--acc)}

/* G3 logo (19 Oct 2026): split diamond + IDRS. Ink parts use currentColor, so the existing nav tone (light over the dark hero) still applies. */
.wordmark{display:flex;align-items:center;line-height:0}
.wordmark .wm-logo{display:block;height:32px;width:auto;flex:none}
@media(max-width:760px){.wordmark .wm-logo{height:28px}}

/* Page transition (ESI/CACAP pattern): dark sheet, the two halves of the IDRS diamond close in and the orange centre lands, then navigate.
   On arrival the page starts covered (html.pt-in, set in <head> only after an in-site click), then the sheet fades away. Reduced motion: none. */
.ipt{position:fixed;inset:0;z-index:1000;background:#07080b;opacity:0;pointer-events:none;transition:opacity .26s cubic-bezier(.7,0,.3,1)}
.ipt svg{position:absolute;left:calc(50% - 28px);top:calc(50% - 28px);width:56px;height:56px;overflow:visible}
.ipt .l,.ipt .r{transition:transform .34s cubic-bezier(.22,1,.36,1),opacity .2s}
.ipt .l{transform:translateX(-14px);opacity:0}.ipt .r{transform:translateX(14px);opacity:0}
.ipt .c{transform-origin:20px 20px;transform:scale(0);transition:transform .2s cubic-bezier(.34,1.56,.64,1) .2s}
.ipt.in{opacity:1;pointer-events:all}
.ipt.in .l,.ipt.in .r,.ipt.cover .l,.ipt.cover .r{transform:none;opacity:1}
.ipt.in .c,.ipt.cover .c{transform:none}
.ipt.cover,.ipt.cover *{transition:none}
.ipt.cover{opacity:1}
.ipt.out{opacity:0;transition:opacity .42s cubic-bezier(.4,0,.2,1)}
.ipt.out svg{transform:scale(.92);opacity:0;transition:transform .42s,opacity .3s}
html.pt-in body::after{content:"";position:fixed;inset:0;z-index:1000;background:#07080b url(/assets/idrs-mark-reversed.svg) no-repeat;background-size:56px 56px;background-position:calc(50% ) calc(50% )}
@media (prefers-reduced-motion:reduce){.ipt{display:none}}

footer .name{max-width:none}