/* trckIQ — modern marketing concept | one editable CSS file */
:root {
  --navy:#071325;--navy-mid:#0b1d32;--navy-light:#102843;--ink:#10243d;
  --muted:#64758b;--line:#dce5ee;--soft:#f4f7fa;--white:#fff;
  --blue:#2b86f7;--blue-light:#5fb5ff;--aqua:#58d0dd;
  --radius:18px;--shell:1320px;
}
*,*::before,*::after {box-sizing:border-box}
html {scroll-behavior:smooth;scroll-padding-top:84px}
body {margin:0;background:white;color:var(--ink);font-family:'DM Sans',Arial,sans-serif;font-size:16px;line-height:1.6;-webkit-font-smoothing:antialiased}
img,svg {display:block}img {max-width:100%}svg {flex-shrink:0}
a {text-decoration:none;color:inherit}button,input,textarea,select {font:inherit}
button {cursor:pointer}::selection {background:#89c9ff;color:#031326}
:focus-visible {outline:3px solid #66c3ff;outline-offset:3px}
h1,h2,h3,h4,p {margin-top:0}h1,h2,h3,h4 {font-family:'Space Grotesk','Arial Narrow',Arial,sans-serif;font-weight:600;line-height:1.08;letter-spacing:-.055em}
h2 {font-size:clamp(35px,4.2vw,60px)}h3 {font-size:23px}
p {color:var(--muted)}
.shell {max-width:var(--shell);padding:0 30px;margin:0 auto}
.icon {vertical-align:middle}
.skip-link {position:absolute;top:-100px;left:12px;z-index:999;background:white;color:#000;padding:10px 14px}
.skip-link:focus {top:12px}
/* Navigation */
.site-header {position:sticky;top:0;z-index:100;background:rgba(7,19,37,.96);border-bottom:1px solid rgba(255,255,255,.08);backdrop-filter:blur(16px)}
.nav-wrap {display:flex;align-items:center;justify-content:space-between;min-height:84px;gap:40px}
.brand {display:inline-flex;align-items:center;gap:12px;white-space:nowrap;color:white}
.brand-emblem {position:relative;display:grid;place-items:center;width:38px;height:38px;transform:rotate(-10deg);background:linear-gradient(135deg,#40aeff,#2473df);border-radius:9px;box-shadow:0 0 22px rgba(43,134,247,.2)}
.brand-emblem::before {content:"";position:absolute;inset:4px;border:1px solid rgba(255,255,255,.5);border-radius:5px}
.brand-emblem-core {transform:rotate(10deg);font:700 19px 'Space Grotesk',sans-serif;color:white;line-height:1}
.brand-emblem-pulse {position:absolute;right:-6px;top:3px;width:7px;height:7px;background:var(--aqua);border-radius:50%;box-shadow:0 0 0 3px #071325}
.brand-lettering {font:700 27px 'Space Grotesk',sans-serif;letter-spacing:-.085em;line-height:1}
.brand-lettering span {color:#48b0ff}
.nav {display:flex;align-items:center;gap:32px}
.nav-links {display:flex;align-items:center;gap:30px}
.nav-links a {font-size:13px;letter-spacing:.015em;font-weight:700;color:#b9c9dc;transition:color .2s}
.nav-links a:hover,.nav-links a.active {color:white}
.nav-links a.active {position:relative}
.nav-links a.active::after {content:"";position:absolute;bottom:-31px;left:0;right:0;height:2px;background:var(--blue)}
.button {display:inline-flex;justify-content:center;align-items:center;gap:13px;padding:14px 22px;border:1px solid transparent;border-radius:7px;font-size:14px;font-weight:700;line-height:1.2;min-height:49px;transition:transform .2s ease,background .2s ease,box-shadow .2s ease}
.button:hover {transform:translateY(-2px)}.button svg {transition:transform .2s}.button:hover svg {transform:translateX(4px)}
.button-primary {background:var(--blue);color:#fff;box-shadow:0 8px 28px rgba(43,134,247,.19)}
.button-primary:hover {background:#1472e9;box-shadow:0 13px 28px rgba(43,134,247,.28)}
.button-ghost {background:transparent;color:#eef7ff;border:1px solid rgba(255,255,255,.29)}
.button-ghost:hover {background:rgba(255,255,255,.08)}
.button-dark {background:var(--navy);color:white}.button-dark:hover {background:#17314f}
.button-light {background:#fff;color:#12365d}.button-light:hover {background:#eaf6ff}
.button-outline-light {border-color:rgba(255,255,255,.32);color:white}.button-outline-light:hover {background:rgba(255,255,255,.1)}
.menu-toggle {display:none;background:none;border:0;padding:10px;min-width:45px;color:#fff}
.menu-toggle span {display:block;width:24px;height:2px;margin:5px auto;background:#fff}
/* Universal section design */
.section {padding:106px 0}.section-light {background:var(--soft)}
.eyebrow {display:inline-block;margin-bottom:22px;font-size:11px;letter-spacing:.18em;font-weight:700;color:#62baff;line-height:1.5}
.eyebrow.dark-label {color:#1676cb}
.text-link {display:inline-flex;align-items:center;gap:11px;color:#116fd1;font-size:14px;font-weight:700;margin-top:13px}
.text-link svg {transition:transform .2s}.text-link:hover svg {transform:translateX(5px)}
.section-header {display:flex;align-items:end;justify-content:space-between;gap:50px;margin-bottom:47px}
.section-header h2 {margin:0}.section-header > p {max-width:305px;margin:0 0 4px;font-size:16px}
/* Hero / dark tech atmosphere */
.hero-home,.page-hero {background:radial-gradient(700px 520px at 76% 36%,rgba(22,84,143,.31),transparent 76%),linear-gradient(120deg,#071325,#0b1f34 76%,#061b31);color:#fff;position:relative;overflow:hidden}
.hero-gridlines {position:absolute;inset:0;pointer-events:none;background-image:linear-gradient(rgba(255,255,255,.028) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.028) 1px,transparent 1px);background-size:64px 64px;mask-image:linear-gradient(90deg,transparent,black 45%,black)}
.hero-layout {display:grid;grid-template-columns:1fr 1.08fr;gap:32px;align-items:center;position:relative;z-index:1;padding-top:70px;padding-bottom:73px;min-height:710px}
.hero-copy {padding:14px 0 30px;z-index:5}
.hero-kicker {display:inline-flex;align-items:center;gap:12px;color:#aac7e7;letter-spacing:.15em;font-size:10px;font-weight:700;margin-bottom:29px}
.pulse-dot {width:8px;height:8px;display:inline-block;background:#54d7bf;border-radius:50%;box-shadow:0 0 0 6px rgba(84,215,191,.1)}
.hero-copy h1 {font-size:clamp(58px,5.2vw,87px);letter-spacing:-.075em;margin-bottom:24px;line-height:1.04;white-space:nowrap}
.hero-copy h1 span {color:#6bbcff}
.hero-lead {color:#b9cadd;max-width:528px;font-size:17px;line-height:1.83;margin-bottom:28px}
.hero-actions {display:flex;gap:11px;flex-wrap:wrap;align-items:center}
.hero-proof {display:flex;align-items:center;gap:12px;margin-top:60px}
.hero-proof p {color:#aabfd6;font-size:12px;line-height:1.45;max-width:250px;margin:0}
.mini-mark {display:grid;place-items:center;width:39px;height:39px;flex-shrink:0;color:#61bdff;border:1px solid #315471;border-radius:9px}
.hero-visual {position:relative;min-height:595px;align-self:stretch;display:flex;align-items:center;justify-content:flex-end;margin-right:-22px}
.hero-photo {position:absolute;right:9px;top:0;width:79%;height:490px;border-radius:5px;overflow:hidden;background:linear-gradient(115deg,#2a495f,#13263d)}
.hero-photo::after,.page-hero-photo::after {content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(7,19,37,.1),rgba(5,20,35,.14)),linear-gradient(0deg,rgba(5,16,29,.46),transparent 45%)}
.hero-photo img,.page-hero-photo img,.showcase-image img,.industry-card img,.service-feature-photo img,.mission-photo img,.aside-photo img {width:100%;height:100%;object-fit:cover}
.hero-photo img {object-position:55% 25%}
.hero-glow {position:absolute;width:290px;height:290px;filter:blur(62px);border-radius:50%;background:rgba(0,112,244,.32);right:25px;bottom:20px}
.dashboard-panel {position:relative;z-index:4;margin-top:105px;margin-right:65px;width:min(550px,100%);padding:18px 20px 13px;border:1px solid rgba(183,219,255,.21);border-radius:10px;box-shadow:0 25px 70px #020a15a8;background:rgba(9,24,43,.94);backdrop-filter:blur(18px)}
.dashboard-head,.dash-brand,.dash-title {display:flex;align-items:center;justify-content:space-between}
.dash-brand {justify-content:flex-start;gap:11px;font:600 13px 'Space Grotesk',sans-serif;letter-spacing:-.03em}
.dash-monogram {display:grid;place-items:center;background:#1e71c9;width:29px;height:29px;color:#fff;border-radius:5px;font-size:12px}
.dash-live {font-size:10px;color:#9fbad2}.dash-live span {display:inline-block;width:6px;height:6px;background:#42c9af;margin-right:4px;border-radius:50%}
.dash-stats {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin-top:21px}
.dash-stats>div {background:#112b46;border:1px solid #1a3655;border-radius:7px;padding:11px 10px 10px}
.dash-stats small {display:block;color:#9cb6cf;font-size:10px}.dash-stats strong {display:block;color:#fff;font:700 29px 'Space Grotesk',sans-serif;letter-spacing:-.06em;line-height:1.35}.dash-stats span {font-size:9px;color:#63849e}
.dash-title {color:#d4e8f7;margin-top:18px;font-size:11px;font-weight:700}.dash-title span {display:inline-flex;align-items:center;gap:5px;color:#6db4f7;font-weight:500}
.dash-rows {margin-top:5px}.dash-rows>div {display:flex;align-items:center;gap:8px;padding:10px 0;border-bottom:1px solid #1a334e;color:#e4f2ff;font-size:11px}
.d-icon {width:28px;height:28px;display:grid;place-items:center;background:#17344e;color:#76bafb;border-radius:6px;font-style:normal}
.dash-rows>div>span {flex:1;font-weight:700}.dash-rows small {display:block;color:#7894ac;font-size:10px;font-weight:400}
.status {font:600 9px 'DM Sans',sans-serif;padding:5px 9px;font-style:normal;border-radius:3px;white-space:nowrap}
.status-blue {background:#183d64;color:#89c6ff}.status-green {background:#174e47;color:#78e1c4}.status-amber {background:#524227;color:#f4d38c}
.dash-caption {font-size:9px;color:#63829e;text-align:right;padding-top:9px}
.vertical-tag {position:absolute;right:-4px;bottom:16px;writing-mode:vertical-rl;color:#79a5cd;letter-spacing:.24em;font-size:9px}
.hero-tail {display:flex;align-items:center;justify-content:space-between;gap:18px;position:relative;z-index:2;border-top:1px solid rgba(255,255,255,.12);min-height:70px;color:#7694ae;font-size:10px;font-weight:700;letter-spacing:.13em}
/* Intro */
.two-column-intro {display:grid;grid-template-columns:1fr .76fr;gap:100px;align-items:center}
.two-column-intro h2 {margin:0}.two-column-intro h2 span {color:#668097}
.two-column-intro p {font-size:19px;line-height:1.9;color:#52667e}
/* Feature cards */
.features-grid {display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:13px}
.feature-card {min-height:275px;background:white;border:1px solid var(--line);padding:27px;border-radius:8px;transition:border-color .2s,transform .25s,box-shadow .25s}
.feature-card:hover {border-color:#9fc8f1;box-shadow:0 24px 45px rgba(23,58,92,.07);transform:translateY(-4px)}
.feature-top {display:flex;align-items:start;justify-content:space-between;margin-bottom:42px}
.feature-icon {display:grid;place-items:center;height:50px;width:50px;background:#eaf4ff;color:#1978d6;border-radius:10px}
.feature-index {font-size:11px;font-weight:700;color:#b0c2d3;letter-spacing:.1em}
.feature-card h3 {font-size:20px;margin-bottom:12px}.feature-card p {font-size:14px;line-height:1.7;margin:0}
/* Photography + content */
.showcase-section,.service-feature {background:#091a2d;color:white}
.showcase-layout,.service-feature-inner,.mission-layout {display:grid;grid-template-columns:1.06fr 1fr;gap:110px;align-items:center}
.showcase-image,.service-feature-photo,.mission-photo {position:relative;min-height:510px;background:#153953;overflow:hidden}
.showcase-image img {filter:saturate(.87)}
.showcase-image-tag {position:absolute;bottom:25px;left:25px;padding:9px 14px;border:1px solid #ffffff66;color:white;backdrop-filter:blur(10px);background:#06243a8c;font-size:10px;letter-spacing:.16em;font-weight:700}
.showcase-copy h2 {margin-bottom:25px}.showcase-copy h2 span {color:#65b6ff}
.showcase-copy > p,.service-feature-inner p {color:#afc4d8;font-size:17px;line-height:1.8}
.showcase-points {margin:27px 0 34px}.showcase-points>div {display:flex;align-items:flex-start;gap:12px;margin-bottom:15px;font-size:13px;color:#d1e0ef}.showcase-points svg {color:#58cbff;margin-top:1px}
/* Photo panels */
.industry-grid {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:15px}
.industry-card {position:relative;min-height:410px;background:#173c5d;overflow:hidden;border-radius:5px;color:white}
.industry-card img {position:absolute;inset:0;transition:transform .55s ease;filter:brightness(.9);object-position:center}
.industry-card:hover img {transform:scale(1.045)}
.industry-shade {position:absolute;inset:0;background:linear-gradient(to bottom,transparent 10%,rgba(3,13,24,.3) 38%,rgba(3,13,24,.95) 100%)}
.industry-content {position:absolute;bottom:0;left:0;right:0;padding:27px}
.industry-content>span {font-size:10px;color:#70bbff;letter-spacing:.17em;font-weight:700}
.industry-content h3 {margin:12px 0 8px;font-size:26px}.industry-content p {color:#ced9e4;font-size:13px;line-height:1.5;max-width:280px;margin-bottom:0}
.industry-grid-two {grid-template-columns:repeat(2,minmax(0,1fr))}.industry-grid-two .industry-card {min-height:430px}
/* Dark timeline workflow */
.workflow-section {background:#0c2037;color:white}
.workflow-header {display:flex;align-items:end;justify-content:space-between;margin-bottom:55px}.workflow-header h2 {margin-bottom:0}
.workflow-steps {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-top:1px solid #28435d}
.workflow-steps article {position:relative;padding:40px 30px 0 0}.workflow-steps article::before {position:absolute;content:"";top:-4px;left:0;width:8px;height:8px;background:#57b6f8;border-radius:50%}
.workflow-steps article>span {color:#578cbd;font-size:13px;letter-spacing:.16em;font-weight:700}
.workflow-steps article>div {width:48px;height:48px;display:grid;place-items:center;margin-top:34px;margin-bottom:21px;border:1px solid #335674;border-radius:8px;color:#73bbfc}
.workflow-steps h3 {font-size:24px}.workflow-steps p {color:#aec0d1;max-width:300px;line-height:1.75;font-size:14px}
/* Bottom CTA */
.cta-section {background:#f1f6fa;padding:88px 0}
.cta-panel {background:linear-gradient(115deg,#174e88,#0c61af 52%,#0a3c6f);padding:63px 66px;display:flex;align-items:center;justify-content:space-between;gap:55px;color:#fff;border-radius:9px;position:relative;overflow:hidden}
.cta-copy {position:relative;z-index:1;max-width:650px}.cta-copy .eyebrow {color:#b2e5ff}.cta-copy h2 {font-size:clamp(38px,4vw,55px);margin:0 0 16px}.cta-copy p {color:#d8eafb;font-size:15px;margin-bottom:0}
.cta-panel>.button {flex-shrink:0;position:relative;z-index:1}
.orb {position:absolute;border:1px solid #ffffff35;border-radius:50%;pointer-events:none}.orb-one {width:350px;height:350px;right:-100px;top:-230px}.orb-two {width:540px;height:540px;right:-130px;top:-340px}
/* Subpage banner */
.page-hero {min-height:470px;display:flex;align-items:center}
.page-hero-inner {position:relative;z-index:1;width:100%;display:grid;grid-template-columns:1.25fr .7fr;align-items:center;gap:45px;padding-top:76px;padding-bottom:72px}
.page-hero h1 {font-size:clamp(48px,5vw,73px);margin-bottom:20px;max-width:950px}
.page-hero h1 span {color:#6bbcff}.page-hero .lead {font-size:17px;max-width:630px;line-height:1.8;color:#c1d3e4;margin-bottom:0}
.page-hero-photo {position:relative;height:305px;border-radius:4px;overflow:hidden;background:#17405d;box-shadow:0 10px 40px #06101f60}
.page-hero-photo img {object-position:50% 40%}
.page-hero-inner:has(.page-hero-photo) .page-hero-copy {max-width:800px}
/* Services */
.services-grid {grid-template-columns:repeat(3,minmax(0,1fr))}
.services-grid .feature-card {min-height:260px}
.service-feature-inner {gap:90px}.service-feature-photo {min-height:440px}
.service-feature-inner h2 {margin-bottom:23px}
.check-list {list-style:none;padding:0;margin:23px 0 0}.check-list li {display:flex;align-items:center;gap:13px;padding:9px 0;color:#d7e7f6}.check-list svg {color:#53cbff}
.roadmap-grid {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.roadmap-card {border:1px solid #d9e4ed;background:#fff;padding:32px;border-radius:6px}.roadmap-card svg {color:#156cbb;margin-bottom:28px}
.roadmap-card>span {display:block;color:#8b692c;font-size:10px;letter-spacing:.16em;font-weight:700;margin-bottom:9px}
.roadmap-card h3 {font-size:22px;margin-bottom:10px}.roadmap-card p {font-size:14px;margin:0}
/* Pricing */
.pricing-note {border:1px solid #d8e4ee;background:#f1f7fc;border-radius:5px;color:#456887;font-size:13px;padding:15px 18px;margin-bottom:23px;display:flex;align-items:center;gap:10px}
.note-dot {height:7px;width:7px;border-radius:50%;background:#2584e5;flex-shrink:0}
.pricing-grid {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:17px;align-items:stretch}
.plan-card {position:relative;border:1px solid #dce6ed;border-radius:8px;padding:34px 30px 30px;min-height:565px;display:flex;flex-direction:column;background:#fff;overflow:hidden}
.plan-featured {border:2px solid #3689d9;box-shadow:0 24px 50px #1c5b8e16}
.plan-ribbon {position:absolute;top:0;right:0;background:#287fd6;color:white;padding:7px 12px;font-size:9px;font-weight:700;letter-spacing:.12em}
.plan-tier,.plan-sub {font-size:11px;font-weight:700;letter-spacing:.14em;color:#227ad0}
.plan-card h2 {font-size:34px;margin:22px 0 10px}.plan-card p {font-size:14px;min-height:61px;margin:0 0 28px}
.plan-price {font:600 24px 'Space Grotesk',sans-serif;color:#10253c;letter-spacing:-.06em}
.plan-divider {border-top:1px solid var(--line);margin:23px 0}
.plan-sub {color:#8193a5;margin-bottom:10px}
.plan-card ul {list-style:none;padding:0;margin:0 0 32px;flex:1}
.plan-card li {font-size:13px;line-height:1.55;color:#40546c;padding:10px 0 10px 23px;position:relative}
.plan-card li::before {content:'✓';position:absolute;left:0;color:#167ac6;font-weight:700}
.plan-card .button {width:100%}
.faq-layout,.story-layout,.callout-layout {display:grid;grid-template-columns:.9fr 1fr;gap:100px;align-items:start}
.faq-layout h2,.story-layout h2,.callout-layout h2 {margin-bottom:23px}
.faq-layout>div>p,.callout-layout>div>p {font-size:17px;line-height:1.85}
.faq-items details {padding:22px 0;border-bottom:1px solid #d7e2e9}
.faq-items details:first-child {border-top:1px solid #d7e2e9}
.faq-items summary {list-style:none;display:flex;align-items:center;justify-content:space-between;gap:20px;cursor:pointer;font-size:16px;font-weight:700;color:#12314e}
.faq-items summary::-webkit-details-marker {display:none}.faq-items summary span {font:400 25px 'DM Sans',sans-serif;color:#2376c1}
.faq-items details[open] summary span {transform:rotate(45deg)}
.faq-items details p {font-size:14px;line-height:1.8;margin:11px 0 0}
/* About */
.story-layout>div p {font-size:16px;line-height:1.92}
.story-layout>div .story-large {color:#153652;font-size:23px;line-height:1.6;font-family:'Space Grotesk',sans-serif;font-weight:500;letter-spacing:-.03em}
.values-section {background:#0a1e34;color:white}.values-section h2 {margin-bottom:48px}
.values-grid {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:35px}
.values-grid article {padding-top:25px;border-top:1px solid #34516c}.values-grid article>span {color:#70b5fa;font-size:12px;letter-spacing:.16em}.values-grid h3 {margin:30px 0 14px;font-size:26px}.values-grid p {font-size:15px;color:#acbfd2;max-width:310px}
.mission-layout {grid-template-columns:1fr 1fr;gap:100px}.mission-photo {min-height:450px}
.mission-layout>div>p {font-size:17px;line-height:1.85}
/* Contact */
.contact-section {background:#f4f7fa}.contact-layout {display:grid;grid-template-columns:.82fr 1.18fr;gap:95px;align-items:start}
.contact-aside h2 {font-size:44px;margin-bottom:22px}.contact-aside>p {font-size:16px;line-height:1.85}
.contact-info {margin-top:40px}.contact-info>div {display:flex;gap:14px;align-items:start;padding:17px 0;border-bottom:1px solid #dce5ed}.contact-info svg {color:#167bd6;margin-top:3px}
.contact-info strong {display:block;color:#132f4a;font-size:14px}.contact-info small {display:block;color:#6a8097;font-size:13px;line-height:1.6;margin-top:4px}
.aside-photo {height:225px;overflow:hidden;margin-top:42px;border-radius:5px;background:#154967}
.contact-form-card {background:#fff;border:1px solid #dbe5ee;padding:42px;border-radius:10px;box-shadow:0 15px 60px #1139600a}
.form-header h3 {font-size:30px;margin:0 0 8px}.form-header p {font-size:14px}
.form {display:grid;gap:18px;margin-top:30px}.form-row {display:grid;grid-template-columns:1fr 1fr;gap:17px}
.field label {display:block;font-size:12px;color:#214460;font-weight:700;margin-bottom:7px}
.field input,.field select,.field textarea {width:100%;border-radius:5px;border:1px solid #d6e2ec;background:#fafcfe;padding:13px 14px;min-height:50px;font-size:13px;color:#163750;outline:none;transition:border-color .2s,box-shadow .2s}
.field textarea {min-height:136px;resize:vertical}.field input:focus,.field select:focus,.field textarea:focus {border-color:#2984e6;box-shadow:0 0 0 3px #dceefe}
.hp {position:absolute;left:-10000px;opacity:0;pointer-events:none}
#msg {display:none;padding:13px 15px;font-size:13px;border-radius:5px}#msg.ok {display:block;color:#145b36;background:#e6f8ef}#msg.err {display:block;color:#842a29;background:#fdebe9}
.form-disclaimer {font-size:11px;line-height:1.55;margin:0;color:#8ea0b1}
.form .button {justify-self:start}
/* Footer */
.footer {background:#061222;color:#98aec5;padding-top:72px}
.footer-layout {display:grid;grid-template-columns:2.1fr 1fr 1.3fr 1.35fr;gap:60px;padding-bottom:63px}
.footer-brand p {max-width:300px;line-height:1.8;font-size:13px;margin:20px 0 25px;color:#8aa2b8}
.footer-note {font-size:10px;color:#527d9b;letter-spacing:.14em;font-weight:700}
.footer h4 {font:700 12px 'DM Sans',sans-serif;color:white;letter-spacing:.07em;margin:7px 0 20px}
.footer-layout>div:not(:first-child)>a:not(.brand):not(.text-link) {display:block;color:#a0b2c4;margin:0 0 10px;font-size:13px}
.footer-layout>div:not(:first-child)>a:hover {color:white}
.footer-small {display:block;color:#68859e;font-size:12px;line-height:1.6;margin-top:17px}
.footer-action .eyebrow {margin:4px 0 13px}.footer-action h3 {color:#fff;font-size:23px;line-height:1.25}
.footer-action .text-link {color:#80bffa;margin-top:0}
.footer-bottom {min-height:69px;border-top:1px solid #193049;display:flex;justify-content:space-between;align-items:center;gap:22px;color:#6d86a0;font-size:11px}
/* Reveal animations */
.reveal {opacity:1;transform:none;transition:transform .4s ease,box-shadow .4s ease}
.reveal.in {opacity:1;transform:none}
/* Responsive design */
@media (max-width:1170px) {
 .nav {gap:18px}.nav-links {gap:18px}
 .hero-copy h1 {font-size:clamp(54px,5.7vw,75px)}
 .dashboard-panel {margin-right:26px;width:99%}
 .features-grid {grid-template-columns:repeat(2,minmax(0,1fr))}
 .showcase-layout,.service-feature-inner {gap:55px}
 .footer-layout {gap:35px}
}
@media (max-width:940px) {
 .nav-wrap {min-height:72px}.menu-toggle {display:block;z-index:6}.nav {display:none;position:absolute;top:72px;left:0;right:0;align-items:stretch;background:#0a1a2b;padding:18px 30px 30px;border-top:1px solid #19354c;box-shadow:0 25px 35px #05111d55}
 .nav.open {display:flex;flex-direction:column}.nav-links {display:flex;flex-direction:column;align-items:stretch;gap:0}
 .nav-links a {display:block;padding:13px 0;border-bottom:1px solid #20364a;font-size:15px}.nav-links a.active::after {display:none}
 .nav-cta {align-self:stretch}
 .hero-layout {grid-template-columns:1fr;padding-top:74px;gap:25px}
 .hero-copy h1 {white-space:normal;font-size:clamp(58px,8vw,82px)}
 .hero-visual {min-height:570px;max-width:720px;margin-right:0;width:100%}
 .hero-photo {height:475px;right:0}
 .dashboard-panel {margin-right:70px;max-width:570px}
 .hero-tail {flex-wrap:wrap;padding-top:20px;padding-bottom:20px;gap:15px}
 .two-column-intro,.faq-layout,.story-layout,.callout-layout,.contact-layout {gap:45px}
 .showcase-layout,.mission-layout,.service-feature-inner {gap:45px}
 .industry-card {min-height:350px}.industry-content {padding:20px}
 .industry-content h3 {font-size:22px}
 .pricing-grid {gap:10px}.plan-card {padding:30px 20px}
 .footer-layout {grid-template-columns:1.7fr 1fr 1fr;gap:38px}.footer-action {grid-column:1/-1}
}
@media (max-width:730px) {
 .shell {padding:0 21px}.section {padding:72px 0}
 .hero-layout {padding-top:60px;padding-bottom:35px}
 .hero-kicker {font-size:9px;line-height:1.8}
 .hero-copy h1 {font-size:clamp(45px,10vw,62px)}
 .hero-lead {font-size:16px}
 .hero-proof {margin-top:36px}
 .hero-visual {min-height:520px}
 .hero-photo {width:80%;height:360px}
 .dashboard-panel {margin-right:30px;padding:13px;max-width:510px;margin-top:155px}
 .dash-stats>div {padding:9px 7px}.dash-stats strong {font-size:23px}.dash-stats span {font-size:8px}
 .dash-live {display:none}.vertical-tag {display:none}
 .hero-tail {font-size:9px}
 .two-column-intro,.showcase-layout,.mission-layout,.service-feature-inner,.story-layout,.faq-layout,.callout-layout,.contact-layout {grid-template-columns:1fr;gap:36px}
 .section-header {display:block}.section-header>p,.section-header>.text-link {margin-top:20px}.section-header>p {max-width:500px}
 .section-intro .two-column-intro p {font-size:16px}
 .industry-grid,.industry-grid-two,.pricing-grid,.roadmap-grid,.values-grid {grid-template-columns:1fr}
 .industry-card,.industry-grid-two .industry-card {min-height:350px}
 .showcase-image,.service-feature-photo,.mission-photo {min-height:330px}
 .workflow-steps {grid-template-columns:1fr}.workflow-steps article {padding-bottom:25px}.workflow-header {display:block}
 .cta-section {padding:50px 0}.cta-panel {padding:37px 26px;display:block}.cta-panel>.button {margin-top:26px}
 .page-hero-inner {grid-template-columns:1fr;gap:33px;padding-top:68px;padding-bottom:65px}
 .page-hero h1 {font-size:clamp(42px,9vw,62px)}.page-hero-photo {height:215px}
 .pricing-grid {gap:18px}.plan-card {min-height:auto}.plan-card p {min-height:0}
 .footer-layout {grid-template-columns:1fr 1fr;gap:35px}.footer-brand,.footer-action {grid-column:1/-1}
 .footer-bottom {align-items:flex-start;flex-direction:column;justify-content:center;padding:18px 21px}
 .contact-form-card {padding:28px 22px}.contact-aside h2 {font-size:39px}
}
@media (max-width:430px) {
 .shell {padding:0 17px}.brand-lettering {font-size:25px}
 .hero-actions .button {width:100%}
 .hero-photo {width:89%;height:310px}
 .hero-visual {min-height:450px}.dashboard-panel {margin-right:0;margin-top:130px;max-width:100%}
 .dash-stats {gap:4px}.dash-stats small {font-size:9px}.dash-stats strong {font-size:21px}.dash-caption {font-size:8px}
 .features-grid,.services-grid {grid-template-columns:1fr}
 .feature-card {min-height:225px}.feature-top {margin-bottom:25px}
 .form-row {grid-template-columns:1fr}
}
@media (prefers-reduced-motion:reduce) {
 html {scroll-behavior:auto}*,*::before,*::after {animation:none!important;transition:none!important}
 .reveal {opacity:1;transform:none}
}


/* ==============================================================
   OFFICIAL TRCKIQ BRAND SYSTEM — supplied logo assets (Oct 2026)
   All assets are local, no remote logo dependencies.
   ============================================================= */
:root {--blue:#1179f2;--blue-light:#58aaff}
.brand {gap:12px;min-height:48px}
.brand-wolf {width:35px;height:38px;object-fit:contain;flex:none;filter:drop-shadow(0 0 12px rgba(23,121,242,.13))}
.brand-wordmark {width:148px;height:auto;max-height:46px;object-fit:contain;object-position:left center;flex:none}
.brand-footer .brand-wolf {width:34px;height:37px}
.brand-footer .brand-wordmark {width:143px}
.brand:hover .brand-wordmark {opacity:.92}
.hero-home {isolation:isolate}
.hero-brand-watermark {position:absolute;width:440px;height:auto;left:-174px;top:38px;opacity:.028;pointer-events:none;transform:rotate(-8deg)}
.hero-brand-signature {position:absolute;z-index:5;right:24px;top:30px;display:flex;align-items:center;gap:12px;padding:11px 17px 11px 12px;border:1px solid rgba(196,227,255,.25);border-radius:8px;background:rgba(7,24,44,.76);backdrop-filter:blur(14px);box-shadow:0 14px 36px rgba(0,9,23,.22)}
.hero-signature-icon {display:grid;place-items:center;width:40px;height:40px;padding:5px;border-radius:7px;background:#1179f2;flex:none}
.hero-signature-icon img {height:100%;width:100%;object-fit:contain}
.hero-brand-signature strong {display:block;font:700 15px 'Space Grotesk',sans-serif;color:#fff;letter-spacing:-.035em;line-height:1.15}
.hero-brand-signature small {display:block;font:700 8px 'DM Sans',sans-serif;letter-spacing:.12em;color:#b9d8f2;margin-top:5px;white-space:nowrap}
.dash-monogram {background:#1179f2;border:1px solid rgba(255,255,255,.12);border-radius:6px}
.dash-monogram img {width:19px;height:20px;object-fit:contain}
@media (max-width:940px) {
 .brand-wolf {width:31px;height:35px}
 .brand-wordmark {width:137px}
 .hero-brand-watermark {width:340px;left:-160px}
 .hero-brand-signature {right:15px;top:21px}
}
@media (max-width:730px) {
 .brand {gap:9px}
 .brand-wolf {width:29px;height:32px}
 .brand-wordmark {width:126px}
 .hero-brand-watermark {display:none}
 .hero-brand-signature {top:16px;right:8px;padding:7px 10px 7px 7px;gap:8px}
 .hero-signature-icon {width:31px;height:31px}
 .hero-brand-signature strong {font-size:12px}
 .hero-brand-signature small {font-size:7px;letter-spacing:.07em}
}
@media (max-width:430px) {
 .brand-wordmark {width:120px}
 .hero-brand-signature small {max-width:126px;white-space:normal;line-height:1.3}
}


/* =============================================================
   HOMEPAGE PHOTOGRAPHY & INTERACTIVE PRODUCT TOUR — OCT 2026
   ============================================================= */
.hero-photo {width:88%;height:520px;right:1px;top:4px;border-radius:14px;box-shadow:0 28px 90px rgba(0,5,18,.24)}
.hero-photo img {object-position:66% 50%;filter:saturate(.88) contrast(1.06)}
.hero-photo:after {background:linear-gradient(90deg,rgba(5,19,34,.24),rgba(5,20,35,.08)),linear-gradient(0deg,rgba(4,14,26,.60),transparent 55%)}
.dashboard-panel {width:min(455px,100%);margin-right:50px;margin-top:220px;background:rgba(8,23,43,.96);box-shadow:0 32px 78px rgba(0,9,24,.64)}
.hero-brand-signature {top:31px;right:22px}
.hero-visual {min-height:620px}
.showcase-image img,.industry-card img,.page-hero-photo img,.service-feature-photo img,.mission-photo img,.aside-photo img {filter:saturate(.90) contrast(1.04)}
.product-section {background:#eff5fb;border-top:1px solid #dfe9f2;border-bottom:1px solid #dfe9f2}
.product-section-heading {display:flex;justify-content:space-between;align-items:end;gap:60px;margin-bottom:44px}
.product-section-heading h2 {margin:0;font-size:clamp(39px,4vw,59px)}
.product-section-heading h2 span {color:#1d78cf}
.product-section-heading>p {max-width:385px;font-size:16px;line-height:1.8;margin:0 0 5px}
.product-showcase {display:grid;grid-template-columns:minmax(265px,.73fr) minmax(0,1.65fr);background:#091a2c;border-radius:17px;overflow:hidden;box-shadow:0 35px 85px rgba(11,35,57,.18)}
.product-rail {padding:48px 35px;display:flex;flex-direction:column;background:radial-gradient(circle at 0 100%,#163d61 0%,transparent 70%),linear-gradient(155deg,#0b263f,#081626);border-right:1px solid #28445e}
.product-rail-number {color:#6ea9dc;font-size:10px;letter-spacing:.19em;font-weight:700}
.product-rail h3 {color:white;font-size:clamp(33px,3.3vw,48px);margin:57px 0 22px}
.product-rail p {color:#a8c1d9;font-size:14px;line-height:1.83;max-width:285px}
.product-highlights {margin:28px 0 32px}
.product-highlights>div {display:flex;align-items:flex-start;gap:10px;color:#d8e8f6;font-size:12px;line-height:1.55;margin:0 0 18px}
.product-check {display:grid;place-items:center;width:19px;height:19px;flex:none;border:1px solid #46a8f6;color:#80c3ff;border-radius:50%;font-size:10px;font-weight:800}
.product-rail-cta {margin-top:auto;align-self:flex-start}
.app-demo {min-width:0;background:#f7fafc;display:flex;flex-direction:column;color:#16324c}
.app-topbar {height:59px;display:flex;align-items:center;justify-content:space-between;gap:15px;background:#0d233b;color:#dcefff;border-bottom:1px solid #2a4059;padding:0 21px}
.app-top-brand {display:flex;align-items:center;gap:8px}.app-top-brand img {width:23px;height:24px;object-fit:contain}.app-top-brand strong {font:700 20px 'Space Grotesk',sans-serif;letter-spacing:-.07em}.app-top-brand strong span {color:#3c9ffb}
.app-workspace {display:flex;align-items:center;gap:9px;color:#8caec9;letter-spacing:.13em;font-size:9px;font-weight:800}.app-workspace i {background:#42caa3;width:6px;height:6px;border-radius:50%}
.app-main {display:grid;grid-template-columns:155px minmax(0,1fr);min-height:505px}
.app-sidebar {background:#112a42;border-right:1px solid #284359;padding:25px 12px;display:flex;flex-direction:column}
.app-sidebar-label {font-size:9px;font-weight:700;letter-spacing:.15em;color:#799eba;margin-bottom:20px;padding-left:8px}
.app-sidebar-nav {display:flex;align-items:center;gap:12px;padding:11px;border-radius:6px;color:#a8c5db;font-size:12px}
.app-sidebar-nav.is-active {color:#fff;background:#1b5b96}.app-sidebar-bottom {color:#5e8099;font-size:8px;letter-spacing:.1em;margin-top:auto;padding:0 8px}
.app-content {padding:25px 28px 30px;min-width:0}
.app-view-header {display:flex;justify-content:space-between;align-items:center;gap:12px}
.app-eyebrow {color:#46789d;letter-spacing:.12em;font-size:9px;font-weight:800}
.app-view-header h3 {font-size:24px;margin:4px 0 0;letter-spacing:-.045em}
.app-demo-label {font-size:9px;font-weight:800;color:#247ac9;background:#e1f0ff;border:1px solid #c5e1fa;border-radius:50px;padding:7px 10px;white-space:nowrap}
.product-tabs {display:flex;align-items:center;flex-wrap:wrap;gap:4px;margin:23px 0 19px;border-bottom:1px solid #d9e5ef}
.product-tab {padding:10px 12px;white-space:nowrap;background:transparent;border:0;border-bottom:2px solid transparent;margin-bottom:-1px;color:#607a91;font-size:12px;font-weight:700;cursor:pointer}
.product-tab:hover {color:#146cbb}.product-tab.active {color:#116fcb;border-bottom-color:#1683ef}
.product-panel[hidden] {display:none!important}
.app-stats {display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:9px;margin-bottom:19px}
.app-stats>div {padding:13px 12px;background:#fff;border:1px solid #dfe7f0;border-radius:8px;min-width:0}
.app-stats span {display:block;font-size:9px;font-weight:800;color:#557389;letter-spacing:.045em}
.app-stats strong {display:block;font:700 27px 'Space Grotesk',sans-serif;color:#0d2b48;letter-spacing:-.06em;margin-top:4px;line-height:1.25}
.app-stats small {display:block;color:#8095a5;font-size:9px;margin-top:2px}
.app-table-wrap,.app-history {border:1px solid #dfe7f0;background:#fff;border-radius:9px;overflow:hidden}
.app-table-title {display:flex;align-items:center;justify-content:space-between;gap:12px;padding:15px 17px;border-bottom:1px solid #e5edf4}
.app-table-title strong {font-size:12px;color:#1c344b}.app-table-title span {font-size:10px;color:#8ba0b0}
.app-table {border-collapse:collapse;width:100%;text-align:left;font-size:11px}
.app-table thead {background:#f4f8fb;color:#7692a7;text-transform:uppercase;letter-spacing:.045em;font-size:9px}
.app-table th {padding:12px 15px;font-weight:700}.app-table td {padding:13px 15px;border-top:1px solid #eff2f6;color:#5f768a;white-space:nowrap}
.app-table td:first-child {display:flex;align-items:center;gap:10px;color:#1d354e;font-weight:700}
.app-table td:first-child span:last-child small {display:block;color:#819aaf;font-size:9px;font-weight:400;margin-top:2px}
.item-ico {display:grid;place-items:center;flex:none;width:29px;height:29px;background:#e5f2ff;color:#1679cf;font-size:11px;font-weight:700;border-radius:6px}
.pill {display:inline-flex;align-items:center;border-radius:4px;padding:4px 7px;font-size:9px;font-weight:700}
.pill-green {background:#e2f5ef;color:#138367}.pill-blue {background:#e3f1ff;color:#1d78b8}.pill-amber {background:#fff3da;color:#9a6b12}
.activity-event {display:flex;gap:12px;align-items:center;border-bottom:1px solid #eff3f7;padding:16px 17px}.activity-event:last-child {border:0}
.activity-event>div {flex:1;min-width:0}.activity-event strong {display:block;font-size:12px;color:#183750}.activity-event small {display:block;font-size:10px;color:#7d97aa;margin-top:4px}
.activity-event time {font-size:10px;color:#94aabc;white-space:nowrap}
.event-bubble {width:29px;height:29px;display:grid;place-items:center;flex:none;background:#e4f2ff;color:#1675c7;border-radius:50%;font-size:14px;font-weight:700}.event-bubble.attention {background:#fff0d9;color:#af7a19}
.app-disclaimer {margin-top:auto;padding:9px 17px;background:#ebf2f7;text-align:center;color:#6d8393;font-size:10px;border-top:1px solid #d7e3ec}
@media(max-width:1140px) {
 .product-showcase {grid-template-columns:270px minmax(0,1fr)}
 .product-rail {padding:36px 26px}
 .app-main {grid-template-columns:118px minmax(0,1fr)}
 .app-content {padding:22px 16px}.app-sidebar-nav {font-size:11px;padding:9px 5px}
 .app-stats>div {padding:10px 8px}
}
@media(max-width:880px) {
 .product-section-heading {display:block}.product-section-heading>p {margin-top:23px;max-width:580px}
 .product-showcase {grid-template-columns:1fr}
 .product-rail {padding:32px 30px}.product-rail h3 {margin:22px 0 14px}.product-rail p {max-width:720px}
 .product-highlights {display:flex;gap:17px;flex-wrap:wrap;margin:15px 0}.product-highlights>div {margin:0;max-width:205px}
 .product-rail-cta {margin-top:22px}
 .app-main {grid-template-columns:118px minmax(0,1fr)}
 .hero-photo {width:85%;height:490px}.hero-visual {min-height:540px}.dashboard-panel {margin-top:150px;margin-right:30px}
}
@media(max-width:660px) {
 .product-section-heading {margin-bottom:30px}
 .product-rail {padding:27px 22px}.product-rail h3 {font-size:36px}
 .app-topbar {height:51px;padding:0 13px}
 .app-main {grid-template-columns:1fr;min-height:0}.app-sidebar {display:none}
 .app-content {padding:19px 12px 20px}.app-view-header h3 {font-size:20px}.app-demo-label {font-size:8px}
 .app-stats {grid-template-columns:repeat(2,minmax(0,1fr))}.app-stats strong {font-size:25px}
 .product-tab {font-size:11px;padding:10px 9px}.app-table {font-size:10px}.app-table th,.app-table td {padding:10px 7px}
 .app-table td:first-child {gap:6px}.item-ico {width:23px;height:23px}
 .app-table-title {padding:12px 10px}.app-disclaimer {font-size:9px;line-height:1.5}
 .hero-photo {width:91%;height:360px;right:0;top:0}.dashboard-panel {margin-top:180px;width:min(450px,100%);margin-right:2px}
 .hero-visual {min-height:495px}
}
@media(max-width:390px) {
 .product-tab {font-size:10px;padding:9px 7px}.app-demo-label {display:none}
 .app-table th,.app-table td {font-size:9px;padding:9px 5px}.app-table td:first-child span:last-child small {font-size:8px}
}

/* Keep in-page product-tour link visible beneath the sticky navigation. */
#product-tour {scroll-margin-top:92px}

/* wolvIQ brand images: header and footer use the horizontal official wolf + wordmark. */
.site-header .brand-wordmark{width:188px;max-height:54px;height:auto;object-fit:contain}
.brand-footer .brand-wordmark{width:186px;max-height:60px;height:auto;object-fit:contain}
@media(max-width:560px){.site-header .brand-wordmark{width:153px;max-height:48px}}

/* Consistent white navigation across all wolvIQ pages */
.site-header{background:rgba(255,255,255,.98);border-bottom:1px solid #e5edf5;box-shadow:0 3px 16px rgba(7,23,49,.055)}
.site-header .nav-links a{color:#26354b}
.site-header .nav-links a.active,.site-header .nav-links a:hover{color:#117cf7}
.site-header .menu-toggle span{background:#152d4a}
@media(max-width:940px){.site-header .nav{background:#fff;border-top:1px solid #dbe4ed}.site-header .nav-links a{color:#1d3852;border-bottom:1px solid #edf1f5}.site-header .nav-links a.active{color:#117cf7}}
