/* HumTum V96 — one consistent interaction vocabulary, same layouts and icon shapes.
   Green is used only for actionable hover/focus states, not informational text. */
:root { --ht-qc-accent: #96ff32; --ht-qc-ink: #f5f6f7; --ht-qc-muted: #b8bcc2; --ht-qc-dark: #111417; }
html { scroll-padding-top: 92px; }
/* Accessible keyboard navigation: one visible green ring across the site. */
html body :is(a,button,input,textarea,select,summary,[tabindex]):focus-visible {
  outline: 2px solid var(--ht-qc-accent) !important;
  outline-offset: 3px !important;
}
/* Primary buttons: dark surfaces + white text. Do not invert glyphs independently. */
html body :is(a.ht-action,button.ht-action):is(:hover,:focus-visible),
html body :is(.v34-calc-actions button,.v34-calc-actions a,.v34-add):is(:hover,:focus-visible) {
  background: #30363b !important;
  border-color: var(--ht-qc-accent) !important;
  color: var(--ht-qc-ink) !important;
  -webkit-text-fill-color: var(--ht-qc-ink) !important;
}
html body :is(a.ht-action,button.ht-action):is(:hover,:focus-visible) :is(span,strong,small,i,svg),
html body :is(.v34-calc-actions button,.v34-calc-actions a,.v34-add):is(:hover,:focus-visible) :is(span,strong,small,i,svg) {
  color: var(--ht-qc-ink) !important;
  -webkit-text-fill-color: var(--ht-qc-ink) !important;
}
/* Editorial text links: green is a deliberate interaction cue, never green-on-green. */
html body a.ht-text-action:is(:hover,:focus-visible),
html body :is(.v27-steps a,.v20-footer-nav a,.v59-services a,.v33-model-link,.v77-link,.v29-security-link):is(:hover,:focus-visible) {
  color: var(--ht-qc-accent) !important;
  -webkit-text-fill-color: var(--ht-qc-accent) !important;
  text-decoration-color: var(--ht-qc-accent) !important;
  border-bottom-color: var(--ht-qc-accent) !important;
}
html body a.ht-text-action:is(:hover,:focus-visible) {background:transparent !important;}
/* The small round-arrow icon remains light-filled with DARK lettering. */
html body :is(a.round-link,a.v9-link,a.ht-text-action):is(:hover,:focus-visible) :is(.circle-arrow,.v9-circle) {
  background: #f5f6f7 !important; border-color:#f5f6f7 !important;
  color: #0b0c0e !important; -webkit-text-fill-color: #0b0c0e !important;
}
html body :is(a.round-link,a.v9-link,a.ht-text-action):is(:hover,:focus-visible) :is(.circle-arrow,.v9-circle) * {
  color: #0b0c0e !important; -webkit-text-fill-color: #0b0c0e !important;
}
/* Menu: same header, same geometry on desktop and mobile. */
html body .nav a:is(:hover,:focus-visible),html body .nav a[aria-current=page] {
  color: var(--ht-qc-accent) !important; -webkit-text-fill-color:var(--ht-qc-accent) !important;
}
html body .menu-toggle:is(:hover,:focus-visible) { border-color: var(--ht-qc-accent) !important; }
/* Project links: keep the established arrow glyph; strengthen feedback and hit area. */
html body a.project-icon {
  display: inline-flex;align-items:center;justify-content:center;
  min-width: 40px;min-height:40px;flex:0 0 40px;
  border:1px solid transparent;border-radius:50%;
  color:#e3e6e8 !important; -webkit-text-fill-color:#e3e6e8 !important;
  text-decoration:none !important;transition:color .18s,border-color .18s,background .18s;
}
html body a.project-icon:is(:hover,:focus-visible) {
  background:#24292d !important;border-color:var(--ht-qc-accent) !important;
  color:var(--ht-qc-accent) !important;-webkit-text-fill-color:var(--ht-qc-accent) !important;
}
html body .capability:is(:hover,:focus-visible),html body .service-button:is(:hover,:focus-visible) {
  color: #f5f6f7 !important; border-color:#73787c !important;
}
html body .capability:is(:hover,:focus-visible) .cap-arrow,
html body .service-button:is(:hover,:focus-visible) .service-arrow {color:var(--ht-qc-accent) !important;-webkit-text-fill-color:var(--ht-qc-accent) !important;}
/* Forms and focus state: keep labels readable on dark surfaces. */
html body :is(input:not([type=range]),textarea,select):focus {
  border-color:var(--ht-qc-accent) !important;
}
html body :is(input,textarea,select)::placeholder {color:#9ea4aa;opacity:1;}
html body :is(button,input,select,textarea):disabled {cursor:not-allowed;}
/* Homepage video cards: exactly the same 16:9 box as stills and before/after cards.
   Hide Safari native control chrome, which previously overlaid the project imagery. */
html body .work-grid .project-art>.ht-card-video-wrap {
  position:absolute !important;inset:0 !important;width:100% !important;height:100% !important;
  display:block !important;overflow:hidden !important;background:#111417 !important;
}
html body .work-grid .project-art .ht-card-video {
  position:absolute !important;inset:0 !important;width:100% !important;height:100% !important;
  max-width:none !important;display:block !important;object-fit:cover !important;
  object-position:center !important;aspect-ratio:auto !important;background:#111417 !important;
  border:0 !important;pointer-events:none !important;
}
html body .ht-card-video::-webkit-media-controls,
html body .ht-card-video::-webkit-media-controls-enclosure {display:none !important;}
html body .ht-card-video-toggle {
  position:absolute;z-index:4;right:14px;bottom:14px;
  display:grid;place-items:center;width:38px;height:38px;padding:0;
  border:1px solid rgba(255,255,255,.56);border-radius:50%;
  background:rgba(9,11,12,.82);color:#f7f7f7;
  backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);
  cursor:pointer;transition:background .18s,border-color .18s;
}
html body .ht-card-video-toggle::before {
  content:"";width:0;height:0;margin-left:3px;
  border-top:6px solid transparent;border-bottom:6px solid transparent;border-left:9px solid currentColor;
}
html body .ht-card-video-toggle[data-playing=true]::before {
  width:9px;height:12px;margin:0;border:0;
  background:linear-gradient(90deg,currentColor 0 3px,transparent 3px 6px,currentColor 6px 9px);
}
html body .ht-card-video-toggle:is(:hover,:focus-visible) {
  background:#252b2d;border-color:var(--ht-qc-accent);color:var(--ht-qc-accent);
}
@media(max-width:700px) {
  html body .ht-card-video-toggle {width:36px;height:36px;right:11px;bottom:11px;}
  html body a.project-icon {min-width:40px;min-height:40px;}
}
@media(prefers-reduced-motion:reduce) {
  html body :is(.ht-card-video-toggle,a.project-icon){transition:none !important;}
}
/* TPN trust block: the old navy title was nearly invisible against the dark footer.
   Preserve the official badge colours; keep adjacent editorial copy neutral. */
html body .v20-footer-shield {align-items:center;}
html body .v20-shield-copy strong .v71-tpn-name {
  color:#d9dce1 !important;-webkit-text-fill-color:#d9dce1 !important;
}
html body .v20-shield-copy strong .v71-tpn-level {
  color:#f7f8f9 !important;-webkit-text-fill-color:#f7f8f9 !important;
}
html body .v20-shield-copy .v71-tpn-support {
  color:#bfc3c9 !important;-webkit-text-fill-color:#bfc3c9 !important;
}
