:root{
    --ink:#07111F;
    --panel:#1A222B;
    --panel-border:#2A343E;
    --amber:#F5A623;
    --amber-dim:#C98A2E;
    --green:#58C77B;
    --red:#C97066;
    --text:#F5F2EA;
    --text-muted:#98A2AC;
    --text-faint:#84909A;
    --serif-gap: 0.02em;
}

/* Reusable artwork for text-led process and highlight tiles. */
.tile-illustration{
  display:block;
  width:min(100%, 240px);
  aspect-ratio:1 / 1;
  object-fit:contain;
  margin:0 auto 14px;
  border-radius:8px;
}
.trial-step .tile-illustration{
  width:min(100%, 190px);
  margin-bottom:6px;
}
.highlight-card .tile-illustration{
  width:min(100%, 260px);
  margin-bottom:20px;
}
@media (max-width:640px){
  .trial-step .tile-illustration{width:min(100%, 160px);}
  .highlight-card .tile-illustration{width:min(100%, 210px);}
}

/* Marketing headings: centred. text-align is inert on flex
   containers, so display:block is forced. */
.wrap:not(.legal) h1,
.wrap:not(.legal) h2,
.wrap:not(.legal) h3 {
  display: block !important;
  text-align: center !important;
}

/* Functional exceptions */
.wrap:not(.legal) form h1,
.wrap:not(.legal) form h2,
.wrap:not(.legal) form h3,
.wrap:not(.legal) fieldset legend { text-align: left !important; }

.wrap.legal h2,
.wrap.legal h3 { display: block !important; text-align: left !important; }
.wrap.legal h1 { text-align: center !important; }

/* Keep the rest of the marketing presentation centred. */
.wrap:not(.legal) .eyebrow,
.wrap:not(.legal) :is(.svc-card, .tri-card, .card, .job-card,
  .cred-points > div, .faq-item, .highlight-card, .trial-step) p,
.wrap:not(.legal) .trial-step .n,
.wrap:not(.legal) :is(.page-cta, .cta-block, .cta-row, .btn-row),
.foot-columns { text-align: center !important; }

/* Form controls and legal copy remain functional and left aligned. */
form :is(label, input, select, textarea, .yn-row, .check-row),
.wrap.legal :is(p, li) { text-align: left !important; }
  *{box-sizing:border-box;}
  html{scroll-behavior:smooth;}
  body{
    margin:0;
    background:var(--ink);
    color:var(--text);
    font-family:'Barlow', sans-serif;
    font-size:17px;
    line-height:1.55;
    -webkit-font-smoothing:antialiased;
  }
  a{color:inherit;}
  h1,h2,h3{
    font-family:'Barlow Semi Condensed', sans-serif;
    letter-spacing:var(--serif-gap);
    margin:0;
  }
  .mono{font-family:'IBM Plex Mono', monospace;}
  .wrap{
    max-width:1280px;
    margin:0 auto;
    padding:0 48px;
  }
  :focus-visible{
    outline:2px solid var(--amber);
    outline-offset:3px;
  }
  .skip-link{
    position:fixed;
    z-index:100000;
    top:12px;
    left:16px;
    transform:translateY(-160%);
    padding:10px 14px;
    border-radius:7px;
    background:var(--amber);
    color:var(--ink);
    font-weight:700;
    text-decoration:none;
    transition:transform .16s ease;
  }
  .skip-link:focus{transform:translateY(0);}

  /* NAV */
  nav.top{
    border-bottom:1px solid var(--panel-border);
    padding:22px 0;
  }
  nav.top .wrap{
    display:flex;
    align-items:center;
    justify-content:space-between;
  }
  .logo{
    font-family:'Barlow Semi Condensed', sans-serif;
    font-weight:700;
    font-size:20px;
    letter-spacing:0.12em;
    text-transform:uppercase;
    display:flex;
    align-items:center;
    gap:10px;
    text-decoration:none;
    color:inherit;
  }
  .logo-mark{
    position:relative;
    height:32px;
    width:43px;
    display:block;
    flex-shrink:0;
  }
  .logo-mark img{
    position:absolute;
    top:0; left:0;
    height:32px;
    width:auto;
    display:block;
  }
  .logo-mark .dot-layer{
    animation:pulse 2s infinite;
  }
  .nav-tag{
    font-family:'IBM Plex Mono', monospace;
    font-size:12.5px;
    color:var(--text-muted);
    text-transform:uppercase;
    letter-spacing:0.08em;
  }

  /* NAV MENU */
  .nav-toggle-input{
    position:absolute;
    opacity:0;
    pointer-events:none;
  }
  .nav-toggle-btn{
    display:flex;
    flex-direction:column;
    justify-content:center;
    gap:5px;
    width:26px;
    height:20px;
    cursor:pointer;
    margin-left:20px;
    flex-shrink:0;
  }
  .nav-toggle-btn span{
    display:block;
    height:2px;
    background:var(--text);
    border-radius:2px;
  }
  .nav-overlay{
    position:fixed;
    inset:0;
    background:rgba(7,17,31,0.6);
    opacity:0;
    pointer-events:none;
    transition:opacity 0.2s ease;
    z-index:40;
  }
  .nav-menu{
    position:fixed;
    top:0; right:0;
    height:100vh;
    width:min(320px, 84vw);
    background:var(--ink);
    border-left:1px solid var(--panel-border);
    padding:100px 32px 32px;
    display:flex;
    flex-direction:column;
    gap:2px;
    transform:translateX(100%);
    transition:transform 0.25s ease;
    z-index:50;
    box-sizing:border-box;
  }
  .nav-menu a{
    font-family:'Barlow Semi Condensed', sans-serif;
    font-size:24px;
    font-weight:600;
    color:var(--text);
    text-decoration:none;
    padding:16px 0;
    border-bottom:1px solid var(--panel-border);
  }
  .nav-menu a:hover{color:var(--amber);}
  .nav-close{
    position:absolute;
    top:32px; right:32px;
    font-family:'IBM Plex Mono', monospace;
    font-size:13px;
    color:var(--text-muted);
    cursor:pointer;
  }
  .nav-toggle-input:checked ~ .nav-overlay{
    opacity:1;
    pointer-events:auto;
  }
  .nav-toggle-input:checked ~ .nav-menu{
    transform:translateX(0);
  }

  /* HERO */
  header.hero{
    padding:88px 0 96px;
    border-bottom:1px solid var(--panel-border);
  }