.elementor-kit-7{--e-global-color-primary:#6EC1E4;--e-global-color-secondary:#54595F;--e-global-color-text:#7A7A7A;--e-global-color-accent:#61CE70;--e-global-typography-primary-font-family:"Roboto";--e-global-typography-primary-font-weight:600;--e-global-typography-secondary-font-family:"Roboto Slab";--e-global-typography-secondary-font-weight:400;--e-global-typography-text-font-family:"Roboto";--e-global-typography-text-font-weight:400;--e-global-typography-accent-font-family:"Roboto";--e-global-typography-accent-font-weight:500;}.elementor-kit-7 e-page-transition{background-color:#FFBC7D;}.elementor-section.elementor-section-boxed > .elementor-container{max-width:1140px;}.e-con{--container-max-width:1140px;}.elementor-widget:not(:last-child){--kit-widget-spacing:20px;}.elementor-element{--widgets-spacing:20px 20px;--widgets-spacing-row:20px;--widgets-spacing-column:20px;}{}h1.entry-title{display:var(--page-title-display);}@media(max-width:1024px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:1024px;}.e-con{--container-max-width:1024px;}}@media(max-width:767px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:767px;}.e-con{--container-max-width:767px;}}:root { --bg-base:#0A0A0C; --bg-alt:#0E0E12; --surface-1:#131318; --surface-2:#1B1B22; --border:rgba(255,255,255,0.08); --heading:#F6F6F3; --body:#B4B6BF; --muted:#8A8C96; --brand-orange:#FFA316; --orange-hover:#FFB53E; --on-orange:#0A0A0C; --glow:rgba(255,163,22,0.15); --font-heading:Sora; --font-body:Inter; --space-8:8px; --space-16:16px; --space-24:24px; --space-32:32px; --space-48:48px; --space-64:64px; --space-100:100px; --radius-card:16px; --radius-btn:10px; --radius-img:12px; --radius-pill:999px; }
/* Start custom CSS *//* === StacksMind Design System — Central CSS v1.16 === */
/* All site-wide custom CSS lives HERE only (Site Settings → Custom CSS). */
/* v1.16 (16 Oct 2026): gradient highlight declaration made BYTE-IDENTICAL to the homepage snippet's .sm-grad rule (Bilal's call) — background-image (not shorthand), no @supports wrapper, same color fallback; font-style:normal added because <em> is italic by default (the homepage span is not). */
/* v1.15 (16 Oct 2026): gradient highlight word made TAG-BASED (.e-heading-base em) — Elementor KEEPS inline <em> in heading HTML but STRIPS class attributes, so a stored-title <span class="sm-grad"> loses its class and renders plain. Fix: wrap the focus word in <em>; .sm-grad kept for the homepage snippet's JS-injected spans. */
/* v1.14 (16 Oct 2026): ADDED sitewide .sm-grad gradient highlight-word utility (promoted from Homepage FX snippet → central). Snippet keeps its own .sm-grad for the Statement manifesto reveal — dedupe at mass production. */
/* v1.13 (14 Oct 2026, housekeeping): REMOVED dead header-v1 rules (.sm-header glassy bar, #e-n-menu-content-1921 mega panel, @media #menubar-192 block, .elementor-102 rule — all targeted the deleted old Menu widget/template). */
/* v1.12 (14 Oct 2026, Bilal's spec): body stage = ONE vertical linear gradient black → teal → dark teal. NO radial domes (they read as a blotch and leaked teal into the topbar). Topbar sits fully on the black zone; teal rises as a uniform band; stage settles to Teal-A. Header floats transparent; hero root transparent. Stage lives HERE only (head) — Homepage FX v20 removed its body rule. v1.11/v1.10 history in Master Brain. */

html { scroll-behavior: smooth; }
body {
  background-color: #060D0D;
  background-image:
    linear-gradient(180deg, #020607 0px, #020607 90px, #07201D 340px, #060D0D 640px),
    radial-gradient(rgba(255,255,255,0.028) 1px, transparent 1.3px);
  background-size: auto, 26px;
  background-repeat: no-repeat, repeat;
}

/* No grey tap-flash on touch devices (sitewide; focus-visible outlines below keep accessibility) */
* { -webkit-tap-highlight-color: transparent; }

/* Selection colour — brand touch */
::selection { background: rgba(255,163,22,0.30); color: #F6F6F3; }

/* Visible focus for accessibility */
a:focus-visible, button:focus-visible, input:focus-visible,
textarea:focus-visible, select:focus-visible {
  outline: 2px solid #FFA316;
  outline-offset: 2px;
}

/* ===== Gradient highlight word (sitewide, v1.16) — ONE focus word per section heading.
   Usage: wrap the focus word in <em> inside any heading. Elementor keeps the <em> tag but
   STRIPS class attributes, so the highlight is TAG-based (.e-heading-base em), not .sm-grad.
   Declaration is BYTE-IDENTICAL to the homepage snippet's .sm-grad rule — background-image
   (not shorthand), no @supports wrapper; font-style:normal added because <em> is italic by
   default (the homepage span is not). .sm-grad kept for the snippet's JS-injected spans. ===== */
.sm-grad, .e-heading-base em {
  background-image: linear-gradient(94deg, #FFC966 0%, #FFA316 52%, #FF8A00 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  color: var(--brand-orange, #FFA316);
  font-style: normal;
}
/* ===== end gradient highlight word ===== */

/* ===== Font-loading CLS fix (added v1.9, 2 Oct 2026).
   Arial-based fallback faces metric-adjusted to Sora/Inter so text wraps identically
   before/after swap; font variables get fallback stacks. Fonts SELF-HOSTED woff2 in
   /wp-content/uploads/2026/09/ (@font-face in post-7.css); sora-600 + inter-regular
   preloaded by Custom Code snippet "Font Preload" (head). Tune: raise % = wider. ===== */
@font-face {
  font-family: "Sora-fallback";
  src: local("Arial");
  size-adjust: 112%;
  ascent-override: 97%;
  descent-override: 25%;
  line-gap-override: 0%;
}
@font-face {
  font-family: "Inter-fallback";
  src: local("Arial");
  size-adjust: 107%;
  ascent-override: 90%;
  descent-override: 22.5%;
  line-gap-override: 0%;
}
html body {
  --font-heading: "Sora", "Sora-fallback", sans-serif;
  --font-body: "Inter", "Inter-fallback", sans-serif;
}
/* ===== end font-loading CLS fix ===== */

/* Hide Hello theme's auto page-title block (we design our own H1s). */
.page-header:has(> h1.entry-title:only-child) {
  display: none;
}
h1.entry-title { display: none; }

/* ===== Header v5 mobile menu (template 234) — JS-driven open states.
   Class .sm-open toggled by Custom Code snippet "Mobile Menu Collapsed Feature".
   IDs: burger 1185f34f, panel 7c59001e, groups 2ee49057/62ee0555,
   sublists 3aad8ad0/35ba10c4, carets 112685a6/19179021. ===== */
.elementor-element-1185f34f.sm-open .elementor-element-7c59001e {
  opacity: 1; visibility: visible; pointer-events: auto;
  transform: translateX(-50%) translateY(0);
}
.elementor-element-2ee49057.sm-open .elementor-element-3aad8ad0 {
  max-height: 620px; opacity: 1; padding-bottom: 10px;
}
.elementor-element-2ee49057.sm-open .elementor-element-112685a6 { transform: rotate(225deg); margin-top: 2px; }
.elementor-element-62ee0555.sm-open .elementor-element-35ba10c4 {
  max-height: 400px; opacity: 1; padding-bottom: 10px;
}
.elementor-element-62ee0555.sm-open .elementor-element-19179021 { transform: rotate(225deg); margin-top: 2px; }
/* ===== end Header v5 mobile menu ===== */

/* ===== Header v5 topbar trust ticker (template 234).
   IDs: viewport 5a1e8de0, track e2139c9 (2 copies; -50% = one full copy). ===== */
@keyframes sm-ticker {
  from { transform: translateX(0); }
  to { transform: translateX(-50%); }
}
.elementor-element-e2139c9 {
  animation: sm-ticker 38s linear infinite;
  will-change: transform;
}
.elementor-element-5a1e8de0 {
  -webkit-mask-image: linear-gradient(90deg, transparent 0, #000 24px, #000 calc(100% - 24px), transparent 100%);
  mask-image: linear-gradient(90deg, transparent 0, #000 24px, #000 calc(100% - 24px), transparent 100%);
}
@media (prefers-reduced-motion: reduce) {
  .elementor-element-e2139c9 { animation: none; }
}
/* ===== end Header v5 trust ticker ===== */

/* ===== Footer (template 275) — 1025–1204px band: pills 2x2 in trust card.
   Atomic widgets → [data-id]. IDs: container 452d0fa8 · pills 1c31d4f4/6a19e102/5cac743e/65f3f597. ===== */
@media (min-width: 1025px) and (max-width: 1204px) {
  [data-id="452d0fa8"] { flex-wrap: wrap !important; gap: 10px !important; }
  [data-id="1c31d4f4"], [data-id="6a19e102"],
  [data-id="5cac743e"], [data-id="65f3f597"] {
    flex: 0 0 auto !important;
    width: calc(50% - 5px) !important;
    min-width: 0 !important;
  }
}
/* ===== end footer pills band ===== */

/* ===== Footer — under 380px: stat numbers 15px (decision 1 Oct 2026).
   IDs: 444ce9ca/708389d3/2f92fbaa. ===== */
@media (max-width: 379px) {
  [data-id="444ce9ca"], [data-id="708389d3"], [data-id="2f92fbaa"] {
    font-size: 15px !important;
  }
}
/* ===== end footer stats band ===== */

/* ===== Homepage Hero V2 "Live Agent Command" (page 345) — motion layer (v1.9, 2 Oct 2026).
   IDs: h1 5e222bc · badge 488e42fc · badge-dot 720fe1ef · lead 14de2c57 · cta-row 7cfa2a57 ·
   mock-wrap 6d361ac8 · orb 49ec1477 · ring-orbit 5ebe496d · toast 77739d1c · chip 18eb7657 ·
   step dots 737eff07/49355282/53acbea0 · result 7e39f43d · status-dot 4fd8a9f9 · cue-dot 638a29b7 ·
   buttons 3b7a7aa8/1347e395 · section root 2719c49b. Hero rebuild = update IDs. ===== */
@keyframes sm-rise {
  from { opacity: 0; transform: translateY(22px); }
  to { opacity: 1; transform: translateY(0); }
}
@keyframes sm-breathe { from { transform: scale(1); } to { transform: scale(1.07); } }
@keyframes sm-orbit { from { transform: rotate(0deg); } to { transform: rotate(360deg); } }
@keyframes sm-float { from { transform: translateY(-7px); } to { transform: translateY(7px); } }
@keyframes sm-pulse {
  0% { box-shadow: 0 0 0 0 rgba(255,163,22,0.55); }
  70% { box-shadow: 0 0 0 9px rgba(255,163,22,0); }
  100% { box-shadow: 0 0 0 0 rgba(255,163,22,0); }
}
@keyframes sm-step {
  0%, 40%, 100% { opacity: 0.35; box-shadow: none; }
  10%, 26% { opacity: 1; box-shadow: 0 0 10px rgba(255,163,22,0.9); }
}
@keyframes sm-resultglow {
  0%, 100% { box-shadow: 0 0 0 rgba(255,163,22,0); }
  50% { box-shadow: 0 0 26px rgba(255,163,22,0.20); }
}
@keyframes sm-blink { 0%, 100% { opacity: 1; } 50% { opacity: 0.25; } }
@keyframes sm-cue {
  0% { transform: translateY(-12px); opacity: 0; }
  25% { opacity: 1; }
  100% { transform: translateY(48px); opacity: 0; }
}

/* H1 typewriter text colours — HARD GUARD (stale "& span" variant quirk).
   Never target a bare span under the H1. */
[data-id="5e222bc"] .sm-type { color: var(--heading) !important; }
[data-id="5e222bc"] .sm-type .sm-hl { color: var(--brand-orange) !important; }
@supports (-webkit-background-clip: text) {
  [data-id="5e222bc"] .sm-type .sm-hl {
    background: linear-gradient(92deg, #FFA316 0%, #FFC866 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent !important;
  }
}

/* Entrance stagger (badge → h1 → lead → CTAs → mockup) */
[data-id="488e42fc"] { animation: sm-rise 0.6s cubic-bezier(0.22,1,0.36,1) 0.05s both; }
[data-id="5e222bc"] { animation: sm-rise 0.7s cubic-bezier(0.22,1,0.36,1) 0.15s both; }
[data-id="14de2c57"] { animation: sm-rise 0.7s cubic-bezier(0.22,1,0.36,1) 0.28s both; }
[data-id="7cfa2a57"] { animation: sm-rise 0.7s cubic-bezier(0.22,1,0.36,1) 0.40s both; }
[data-id="6d361ac8"] { animation: sm-rise 0.8s cubic-bezier(0.22,1,0.36,1) 0.50s both; }

/* Ambient layers */
[data-id="49ec1477"] { animation: sm-breathe 11s ease-in-out infinite alternate; will-change: transform; }
[data-id="5ebe496d"] { animation: sm-orbit 26s linear infinite; will-change: transform; }

/* Floating satellite cards */
[data-id="77739d1c"] { animation: sm-float 6.5s ease-in-out infinite alternate; will-change: transform; }
[data-id="18eb7657"] { animation: sm-float 7.5s ease-in-out 1.2s infinite alternate-reverse; will-change: transform; }

/* Live agent loop */
[data-id="737eff07"] { animation: sm-step 6s infinite; }
[data-id="49355282"] { animation: sm-step 6s 1.1s infinite; }
[data-id="53acbea0"] { animation: sm-step 6s 2.2s infinite; }
[data-id="7e39f43d"] { animation: sm-resultglow 6s 3.4s infinite; }
[data-id="4fd8a9f9"] { animation: sm-blink 1.6s infinite; }

/* Scroll cue */
[data-id="638a29b7"] { animation: sm-cue 2s cubic-bezier(0.4,0,0.6,1) infinite; }

@media (prefers-reduced-motion: reduce) {
  [data-id="488e42fc"], [data-id="5e222bc"], [data-id="14de2c57"],
  [data-id="7cfa2a57"], [data-id="6d361ac8"], [data-id="49ec1477"],
  [data-id="5ebe496d"], [data-id="77739d1c"], [data-id="18eb7657"],
  [data-id="737eff07"], [data-id="49355282"], [data-id="53acbea0"],
  [data-id="7e39f43d"], [data-id="4fd8a9f9"], [data-id="638a29b7"] { animation: none; }
}
/* ===== end Homepage Hero V2 motion ===== */

/* ===== CTA button hover parity guard (stale inset-shadow variant quirk).
   One site-standard hover on both classes = header CTA: lift -2px + 0 6px 28px orange .35.
   Change hover design HERE + in the two global classes. ===== */
.elementor .sm-btn-primary:hover, .elementor .sm-btn-primary:focus, .elementor .sm-btn-primary:focus-visible,
.elementor .sm-btn-secondary:hover, .elementor .sm-btn-secondary:focus, .elementor .sm-btn-secondary:focus-visible {
  box-shadow: 0px 6px 28px 0px rgba(255,163,22,0.35) !important;
  border: none !important;
  border-color: transparent !important;
  outline: none !important;
}
/* ===== end CTA hover parity guard ===== */

/* ===== Hero H1 typewriter (v1.9; v2 fixed-breaks 2 Oct).
   Snippet "Hero H1 Typewriter" (body end) renders "|" markers as <br class="sm-br">:
   hidden desktop/tablet, ACTIVE mobile → all 3 phrases EXACTLY 3 lines every phone width.
   H1 mobile font fluid clamp(24px,(100vw-96px)/10,62px). min-height in EM. ===== */
.sm-br { display: none; }
@media (max-width: 767px) { .sm-br { display: inline; } }
[data-id="5e222bc"] { min-height: 3.25em; }
@media (max-width: 1024px) { [data-id="5e222bc"] { min-height: 2.2em; } }
@media (max-width: 767px) { [data-id="5e222bc"] { min-height: 3.5em; } }
@keyframes sm-caretblink { 0%, 100% { opacity: 1; } 50% { opacity: 0; } }
.sm-caret {
  display: inline-block;
  width: 4px;
  height: 0.82em;
  margin-inline-start: 8px;
  border-radius: 2px;
  background: var(--brand-orange, #FFA316) !important;
  vertical-align: baseline;
  transform: translateY(0.08em);
  animation: sm-caretblink 1s steps(1) infinite;
}
@media (prefers-reduced-motion: reduce) {
  .sm-caret { display: none; }
}
/* ===== end Hero H1 typewriter ===== */

/* ===== Hero tiny screens <360px (320/344 Fold band; added 2 Oct 2026).
   Bilal measured: CTA labels wrap ≤352px. This band narrows gutters to 24px and makes
   button font fluid to the available row width: avail = 100vw − 48(gutters) − 14(padL)
   − 4(padR) − 34(circle) − 8(gap) = 100vw − 108px; longest label 29ch ≈ /18.
   Joins seamlessly at 360px (13.9px ↔ clamp's 14.04px). 379px footer query precedent —
   Elementor breakpoints untouched (§6.21). ===== */
@media (max-width: 359px) {
  [data-id="2719c49b"] { padding-inline: 24px !important; }
  [data-id="3b7a7aa8"], [data-id="1347e395"] {
    font-size: calc((100vw - 108px) / 18) !important;
    gap: 8px !important;
    padding-inline-start: 14px !important;
  }
  [data-id="3b7a7aa8"] span, [data-id="1347e395"] span {
    width: 34px !important;
    height: 34px !important;
    min-width: 34px !important;
    min-height: 34px !important;
    font-size: 15px !important;
  }
}
/* ===== end hero tiny screens ===== */

/* ===== Trust bar tiny screens <360px (page 345; added 3 Oct 2026).
   At ≤346px the 2x2 stat labels ("Projects Delivered" etc.) wrap to 2 lines
   (Bilal measured 347 OK / 346 wrap). Match the hero ≤359 treatment: gutters 24px,
   tighten the row gap, widen the stat columns so labels stay single-line down to 320.
   IDs: root 62d8c8c4 · row 509e7dc4 · stats 5109169a/6512790a/6ac4e4e3/bd483ce. ===== */
@media (max-width: 359px) {
  [data-id="62d8c8c4"] { padding-inline: 24px !important; }
  [data-id="509e7dc4"] { gap: 20px !important; }
  [data-id="5109169a"], [data-id="6512790a"],
  [data-id="6ac4e4e3"], [data-id="bd483ce"] {
    flex-basis: calc(50% - 10px) !important;
  }
}
/* ===== end trust bar tiny screens ===== *//* End custom CSS */
/* Start Custom Fonts CSS */@font-face {
	font-family: 'Sora';
	font-style: normal;
	font-weight: 600;
	font-display: auto;
	src: url('https://stacksmind.co.uk/wp-content/uploads/2026/09/sora-v17-latin-600.woff2') format('woff2');
}
@font-face {
	font-family: 'Sora';
	font-style: normal;
	font-weight: 700;
	font-display: auto;
	src: url('https://stacksmind.co.uk/wp-content/uploads/2026/09/sora-v17-latin-700.woff2') format('woff2');
}
/* End Custom Fonts CSS */
/* Start Custom Fonts CSS */@font-face {
	font-family: 'Inter';
	font-style: normal;
	font-weight: 400;
	font-display: auto;
	src: url('https://stacksmind.co.uk/wp-content/uploads/2026/09/inter-v20-latin-regular.woff2') format('woff2');
}
@font-face {
	font-family: 'Inter';
	font-style: normal;
	font-weight: 500;
	font-display: auto;
	src: url('https://stacksmind.co.uk/wp-content/uploads/2026/09/inter-v20-latin-500.woff2') format('woff2');
}
@font-face {
	font-family: 'Inter';
	font-style: normal;
	font-weight: 600;
	font-display: auto;
	src: url('https://stacksmind.co.uk/wp-content/uploads/2026/09/inter-v20-latin-600.woff2') format('woff2');
}
/* End Custom Fonts CSS */