.cover__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  align-items: center;
}

.cover__cue {
  position: absolute;
  z-index: 3;
  left: 50%;
  bottom: 22px;
  transform: translateX(-50%);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 7px;
  color: var(--white);
  opacity: .62;
  pointer-events: none;
}

.cover__cue i {
  display: block;
  width: 1px;
  height: 30px;
  background: linear-gradient(to bottom, transparent, currentColor);
}

.cover__cue svg {
  width: 13px;
  height: 13px;
  display: block;
}

@media (prefers-reduced-motion: no-preference) {
  .cover__cue { animation: cover-cue 2.6s var(--ease-out) infinite; }
  @keyframes cover-cue {
    0%, 100% { opacity: .38; transform: translateX(-50%) translateY(0); }
    50%      { opacity: .78; transform: translateX(-50%) translateY(5px); }
  }
}

@media (max-width: 767px) {
  .cover__cue { display: none; }
}


@media (min-width: 900px) {
  .trust {
    display: grid;
    grid-template-columns: repeat(3, max-content);
    justify-content: start;
    gap: 0 clamp(40px, 5vw, 76px);
  }
}


.services .section__intro {
  text-wrap: balance;
  max-width: 46ch;
}

.service > .icon--lg { color: var(--lab-accent-deep, #B5621E); }
[data-theme="dark"] .service > .icon--lg { color: var(--orange); }


.stat__num { color: var(--lab-accent-deep, #B5621E); }
[data-theme="dark"] .stat__num { color: var(--orange); }

.stat__label {
  text-wrap: pretty;
  max-width: 24ch;
}


@media (min-width: 768px) {
  .steps .step h3 {
    border-top: 1px solid var(--rule-on-dark);
    padding-top: 14px;
    margin-top: 4px;
  }
}


.project__btn { position: relative; display: block; width: 100%; }

.project__btn::after {
  content: "";
  position: absolute;
  right: 10px;
  bottom: 10px;
  width: 30px;
  height: 30px;
  border-radius: 2px;
  background:
    linear-gradient(#F5F3EE, #F5F3EE) no-repeat 50% 50% / 11px 1px,
    linear-gradient(#F5F3EE, #F5F3EE) no-repeat 50% 50% / 1px 11px,
    rgba(17, 19, 16, .55);
  box-shadow: inset 0 0 0 1px rgba(232, 226, 214, .3);
  opacity: .85;
  transition: opacity var(--fast) var(--ease-out), transform var(--fast) var(--ease-out);
  pointer-events: none;
}

.project__btn:hover::after,
.project__btn:focus-visible::after {
  opacity: 1;
  transform: scale(1.1);
}

.project__btn .media { transition: filter var(--fast) var(--ease-out), transform var(--base) var(--ease-out); }
.project__btn:hover .media,
.project__btn:focus-visible .media { filter: brightness(1.08); transform: translateY(-2px); }

@media (prefers-reduced-motion: reduce) {
  .project__btn:hover .media,
  .project__btn:focus-visible .media { transform: none; }
  .project__btn:hover::after,
  .project__btn:focus-visible::after { transform: none; }
}


.ground__chip {
  padding: 9px 12px;
  border-radius: 3px;
  box-shadow: inset 0 0 0 1px var(--rule-on-dark);
  transition: box-shadow var(--fast) var(--ease-out), background-color var(--fast) var(--ease-out);
}

.ground__chip:hover,
.ground__chip:focus-visible,
.ground__chip.is-lit {
  box-shadow: inset 0 0 0 1px var(--orange);
  background-color: rgba(254, 138, 51, .1);
}

.ground:not(.is-painted) .ground__chip:hover,
.ground:not(.is-painted) .ground__chip:focus-visible {
  color: color-mix(in srgb, var(--white) 85%, transparent);
  box-shadow: inset 0 0 0 1px var(--rule-on-dark);
  background-color: transparent;
}
.ground:not(.is-painted) .ground__chip:hover i,
.ground:not(.is-painted) .ground__chip:focus-visible i { box-shadow: none; }
.ground:not(.is-painted) .ground__place:hover { color: inherit; }

@media (hover: none) {
  .ground__chip { padding: 13px 14px; }
}

.ground__fine { color: color-mix(in srgb, var(--white) 68%, transparent); }

@media (max-width: 767px) {
  .ground--centred .ground__keywrap {
    padding-bottom: calc(76px + env(safe-area-inset-bottom, 0px));
  }
}


video[data-poster],
video[style*="--slot-bg"] {
  background-color: var(--slot-bg, transparent);
  background-position: center;
  background-size: cover;
}


.section__intro .link--tap,
.services__more .link--tap,
.form__success p .link--tap {
  text-decoration: underline;
  text-underline-offset: 3px;
  text-decoration-thickness: from-font;
}


.footer__logo { display: block; }

[data-theme="light"] .footer,
[data-theme="light"] .section--dark,
[data-theme="light"] .ground {
  --gray-on-dark: #5E5E5E;
}



:root {
  --pill-x: clamp(10px, 4.8px + 1.333vw, 24px);
  --pill-y: clamp(7px, 5.14px + 0.476vw, 12px);

  --pill-r: 64px;

  --pill-shrink: 0.95;

  --pill-ground: var(--lab-paper, #F5F3EE);

  --pill-rim:   17 19 16;
  --pill-rim-a: 0.105;
  --pill-bw:    1px;
  --pill-bangle: 132deg;

  --pill-shade:   17 19 16;
  --pill-cast-a:  0.255;
  --pill-touch-a: 0.128;
  --pill-drop: clamp(6px,  4.5px  + 0.381vw, 10px);
  --pill-blur: clamp(20px, 16.3px + 0.952vw, 30px);

  --pill-t: 720ms;
  --pill-e: cubic-bezier(0.4, 0, 0.2, 1);


  --pill-edge: max(var(--pill-x), calc((100% - var(--container-wide)) / 2 + var(--pill-x)));

  --nav-tighten: 0px;
}

:root[data-theme="dark"] {
  --pill-ground: var(--lab-base, #111310);
  --pill-shade: 0 0 0;
  --pill-rim:   255 255 255;
  --pill-rim-a: 0.14;
}

:root { --nav-h: clamp(64px, 53.6px + 2.667vw, 92px); }


.nav { background-color: transparent; }

.nav::before {
  content: '';
  position: absolute;
  top:    calc(var(--pill-y) - 3px);
  bottom: calc(var(--pill-y) - 3px);
  left:   calc(var(--pill-edge) - 10px);
  right:  calc(var(--pill-edge) - 10px);
  border-radius: var(--pill-r);
  opacity: 0;
  background-color: var(--pill-ground);
  box-shadow: 0 0 0 rgb(var(--pill-shade) / 0), 0 0 0 rgb(var(--pill-shade) / 0);
  transition:
    top        var(--pill-t) var(--pill-e),
    right      var(--pill-t) var(--pill-e),
    bottom     var(--pill-t) var(--pill-e),
    left       var(--pill-t) var(--pill-e),
    box-shadow var(--pill-t) var(--pill-e),
    opacity    var(--pill-t) var(--pill-e);
}

.nav.is-pill::before {
  top: var(--pill-y); right: var(--pill-edge);
  bottom: var(--pill-y); left: var(--pill-edge);
  opacity: 1;
  box-shadow:
    0 1px 2px rgb(var(--pill-shade) / var(--pill-touch-a)),
    0 var(--pill-drop) var(--pill-blur) rgb(var(--pill-shade) / var(--pill-cast-a));
}

.nav::after,
.nav.is-scrolled::after { opacity: 0; }


.nav__inner { position: relative; }

.nav__inner::after {
  content: '';
  position: absolute;
  top:    calc(var(--pill-y) - 3px);
  bottom: calc(var(--pill-y) - 3px);
  left:   calc(var(--pill-x) - 10px);
  right:  calc(var(--pill-x) - 10px);
  border-radius: var(--pill-r);
  padding: var(--pill-bw);
  opacity: 0;
  pointer-events: none;
  background: linear-gradient(
    var(--pill-bangle),
    rgb(var(--pill-rim) / var(--pill-rim-a)) 0%,
    rgb(var(--pill-rim) / calc(var(--pill-rim-a) * 0.22)) 42%,
    rgb(var(--pill-rim) / calc(var(--pill-rim-a) * 0.22)) 58%,
    rgb(var(--pill-rim) / calc(var(--pill-rim-a) * 0.75)) 100%
  );
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
          mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite: xor;
          mask-composite: exclude;
  transition:
    top     var(--pill-t) var(--pill-e),
    right   var(--pill-t) var(--pill-e),
    bottom  var(--pill-t) var(--pill-e),
    left    var(--pill-t) var(--pill-e),
    opacity var(--pill-t) var(--pill-e);
}
.nav.is-pill .nav__inner::after {
  top: var(--pill-y); right: var(--pill-x);
  bottom: var(--pill-y); left: var(--pill-x);
  opacity: 1;
}


@media (max-width: 1023.98px) {
  .nav__logo,
  .nav.is-scrolled .nav__logo {
    display: flex;
    align-items: center;
    width: clamp(48px, 33.2px + 3.79vw, 72px);
    min-height: 44px;
    transform: none;
  }
  .nav__logo-full { display: none; }
  .nav__logo-mark { display: block; }
}

@media (min-width: 1024px) {
  .nav__logo,
  .nav.is-scrolled .nav__logo {
    width: clamp(169px, 150.7px + 1.786vw, 190px);
  }
}


.nav__logo,
.nav__links,
.nav__actions {
  transition: transform var(--pill-t) var(--pill-e);
}
.nav.is-scrolled .nav__logo,
.nav.is-scrolled .nav__links { transform: none; }

@media (min-width: 1024px) {
  .nav.is-pill .nav__logo {
    transform: scale(var(--pill-shrink));
    transform-origin: left center;
  }
  .nav.is-pill .nav__links {
    transform: scale(var(--pill-shrink));
    transform-origin: center center;
  }
  .nav__actions { transform-origin: right center; }
  .nav.is-pill .nav__actions { transform: scale(var(--pill-shrink)); }
}

@media (prefers-reduced-motion: reduce) {
  .nav::before,
  .nav__inner::after,
  .nav__logo,
  .nav__links,
  .nav__actions { transition: none; }
}


.nav:not(.is-pill) {
  --white: var(--lab-on-dark, #E8E2D6);
  color: var(--white);
}
:root[data-theme="dark"] .nav:not(.is-pill) {
  --white: var(--lab-on-dark, #E8E2D6);
  --black: var(--lab-lift, #1C1F18);
}
.nav:not(.is-pill) .nav__iconbtn { color: var(--white); }
.nav:not(.is-pill) :focus-visible { outline-color: var(--orange); }

:root:not([data-theme="dark"]) .nav__logo-full { opacity: 1; }
:root:not([data-theme="dark"]) .nav:not(.is-pill) .nav__logo-dark { opacity: 1; }
:root:not([data-theme="dark"]) .nav.is-pill .nav__logo-dark { opacity: 0; }

.nav .btn--primary {
  box-shadow: inset 0 0 0 2px rgb(var(--pill-rim) / 0);
  transition: box-shadow var(--pill-t) var(--pill-e), color var(--fast) var(--ease-out);
}
.nav:not(.is-pill) .btn--primary { box-shadow: inset 0 0 0 2px var(--orange); }
.nav:not(.is-pill) .btn--primary::before { background: var(--white); }
.nav:not(.is-pill) .btn--primary:hover,
.nav:not(.is-pill) .btn--primary:focus-visible,
.nav:not(.is-pill) .btn--primary.is-held { color: var(--black); }

.nav { transition: color var(--pill-t) var(--pill-e); }
.nav__logo-full,
.nav__logo-dark { transition: opacity var(--pill-t) var(--pill-e); }
.nav__iconbtn {
  transition: transform 100ms var(--ease-out), color var(--pill-t) var(--pill-e);
}

:root:not([data-theme="dark"]) .nav.is-over-drawer:not(.is-pill) { --white: var(--lab-ink, #111310); }