:root {
  color-scheme: dark;
  --black: #080d14;
  --night: #0b131d;
  --deep: #101c29;
  --panel: #142332;
  --paper: #0c131b;
  --paper-soft: #121b25;
  --white: #f7f8f6;
  --ink: #f1f4f4;
  --muted: #98a5ae;
  --muted-light: #b9c3ca;
  --muted-dark: #9aa7af;
  --line-dark: rgb(225 237 242 / 14%);
  --line-light: rgb(225 237 242 / 14%);
  --orange: #ed792e;
  --orange-bright: #ff984f;
  --green: #478d5c;
  --cyan: #77c1cb;
  --blue: #719fbc;
 --font-display: "Montserrat", Arial, sans-serif;
  --font-body: "Inter", Arial, sans-serif;
  --font-mono: "DM Mono", monospace;
  --container: 1280px;
  --gutter: clamp(1.15rem, 5vw, 5.25rem);
  --space-1: 0.5rem;
  --space-2: 0.9rem;
  --space-3: 1.35rem;
  --space-4: 1.9rem;
  --space-5: 2.7rem;
  --space-6: 3.7rem;
  --space-7: 5.2rem;
  --space-8: 7rem;
  --space-9: 9rem;
  --radius-tight: 2px;
  --radius-small: 5px;
  --radius-medium: 10px;
  --shadow-float: 0 28px 75px rgb(0 0 0 / 40%);
  --glow-cyan: 0 0 0 1px rgb(119 193 203 / 22%), 0 0 30px rgb(119 193 203 / 10%);
  --glow-orange: 0 0 0 1px rgb(237 121 46 / 33%), 0 0 27px rgb(237 121 46 / 12%);
  --ease: cubic-bezier(0.2, 0.7, 0.2, 1);
  --transition-fast: 180ms var(--ease);
  --transition: 360ms var(--ease);
}

* { box-sizing: border-box; }
/* =========================================
   PAGE-WIDE MOUSE LIGHT
   ========================================= */

.mouse-light {
    position: fixed;
    width: 420px;
    height: 420px;
    border-radius: 50%;
    pointer-events: none;
    z-index: 0;

    background: radial-gradient(
        circle,
        rgba(125, 145, 255, 0.10) 0%,
        rgba(100, 120, 255, 0.055) 28%,
        rgba(80, 100, 220, 0.025) 48%,
        transparent 72%
    );

    filter: blur(18px);

    transform: translate(-50%, -50%);
    opacity: 0;
    transition: opacity 0.35s ease;

    will-change: left, top;
}

/* Make sure your actual website content stays above it */
.site-header,
main,
.site-footer {
    position: relative;
    z-index: 1;
}

@media (hover: hover) and (pointer: fine) {
    .mouse-light {
        opacity: 1;
    }
}

/* Don't show it on touch devices */
@media (hover: none), (pointer: coarse) {
    .mouse-light {
        display: none;
    }
}
html {
  scroll-behavior: smooth;
  scroll-padding-top: 6rem;
  background: var(--black);
}

body {
  min-width: 0;
  margin: 0;
  color: var(--white);
  background: var(--black);
  font-family: var(--font-body);
  font-size: 1rem;
  line-height: 1.7;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

body,
a,
button { -webkit-tap-highlight-color: transparent; }

body.menu-open { overflow: hidden; }
img { display: block; max-width: 100%; }
a { color: inherit; text-decoration: none; }
button { color: inherit; font: inherit; }

::selection { color: var(--white); background: #914b27; }
:focus-visible { outline: 2px solid var(--orange-bright); outline-offset: 4px; }

.shell {
  width: min(calc(100% - var(--gutter) * 2), var(--container));
  margin-inline: auto;
}

.mono,
.micro-label,
.section-kicker,
.feature-code,
.product-caption,
.recognition-meta,
.scene-coordinate,
.scene-index,
.product-chrome,
.hero-rail,
.scroll-cue,
.experience-label,
.voice-index {
  font-family: var(--font-mono);
  letter-spacing: 0.09em;
}

.skip-link {
  position: fixed;
  z-index: 2000;
  top: 0.7rem;
  left: 0.7rem;
  padding: 0.7rem 1rem;
  color: var(--black);
  background: var(--white);
  transform: translateY(-150%);
  transition: transform var(--transition-fast);
}
.skip-link:focus { transform: translateY(0); }

.site-header {
  position: fixed;
  z-index: 1200;
  inset: 0 0 auto;
  border-bottom: 1px solid transparent;
  background: linear-gradient(180deg, rgb(8 13 20 / 90%), rgb(8 13 20 / 35%));
  transition: background var(--transition), border-color var(--transition), box-shadow var(--transition);
}

.site-header.is-scrolled,
.site-header.menu-visible {
  border-color: rgb(255 255 255 / 9%);
  background: rgb(8 13 20 / 88%);
  box-shadow: 0 12px 38px rgb(0 0 0 / 22%);
  backdrop-filter: blur(18px);
}

.header-inner {
  display: flex;
  width: min(calc(100% - var(--gutter) * 2), 1440px);
  height: 84px;
  align-items: center;
  justify-content: space-between;
  margin-inline: auto;
}

.brand,
.footer-brand {
  display: inline-flex;
  flex: 0 0 auto;
  align-items: center;
  min-width: 0;
  padding: 0;
}

.brand { position: relative; }

.brand::before,
.footer-brand::before {
  display: none;
}

.brand img,
.footer-brand img {
  width: 148px;
  height: 167px;
  padding: 0;
  object-fit: contain;
  background: transparent;
}

.brand img {
  width: 132px;
  height: 160px;
}

.site-nav {
  display: flex;
  height: 100%;
  align-items: center;
  gap: clamp(1.6rem, 2.2vw, 2rem);
  font-size: 0.74rem;
  font-weight: 600;
}


.nav-link {
  position: relative;
  display: inline-flex;
  height: 100%;
  align-items: center;
  color: #bbc5cc;
  transition: color var(--transition-fast);
}

.nav-link::after {
  position: absolute;
  right: 0;
  bottom: 1.05rem;
  left: 0;
  height: 1px;
  background: var(--cyan);
  box-shadow: 0 0 10px rgb(119 193 203 / 55%);
  content: "";
  transform: scaleX(0);
  transform-origin: left;
  transition: transform var(--transition);
}

.nav-link:hover,
.nav-link.is-active { color: var(--white); }
.nav-link:hover::after,
.nav-link.is-active::after { transform: scaleX(1); }
.nav-contact {
  height: auto;
  min-height: 42px;
  padding: 0.55rem 0.95rem;
  border: 1px solid rgb(255 152 79 / 72%);
  border-radius: 24px;
  color: var(--white);
  background: linear-gradient(105deg, #d96626, #f18435);
  transition: background var(--transition-fast), border-color var(--transition-fast), box-shadow var(--transition-fast), transform var(--transition-fast);
}
.nav-contact::after { display: none; }
.nav-contact:hover { color: var(--white); border-color: var(--orange-bright); background: linear-gradient(105deg, #e9752d, #ff9147); box-shadow: var(--glow-orange); transform: translateY(-1px); }

.button {
  display: inline-flex;
  min-height: 48px;
  align-items: center;
  justify-content: center;
  gap: 1.1rem;
  padding: 0.72rem 1.1rem;
  border: 1px solid transparent;
  border-radius: 24px;
  font-size: 0.81rem;
  font-weight: 700;
  line-height: 1.3;
  transition:
    color var(--transition-fast),
    background var(--transition-fast),
    border-color var(--transition-fast),
    box-shadow var(--transition-fast),
    transform var(--transition-fast);
}

.button span {
  font-size: 1.05rem;
  transition: transform var(--transition-fast);
}
.button:hover span { transform: translate(3px, -3px); }

.button-nav {
  min-height: 43px;
  padding-inline: 1rem;
  color: var(--white);
  border-color: rgb(237 121 46 / 65%);
  background: linear-gradient(105deg, #d96626, #f18435);
}
.button-nav:hover {
  border-color: var(--orange-bright);
  background: linear-gradient(105deg, #e9752d, #ff9147);
  box-shadow: var(--glow-orange);
}

.button-bright {
  color: var(--white);
  border-color: rgb(237 121 46 / 65%);
  background: linear-gradient(105deg, #d96626, #f18435);
  box-shadow: 0 8px 30px rgb(237 121 46 / 16%);
}
.button-bright:hover {
  border-color: var(--orange-bright);
  background: linear-gradient(105deg, #e9752d, #ff9147);
  box-shadow: var(--glow-orange);
  transform: translateY(-2px);
}

.button-ink { color: var(--white); background: var(--black); }
.button-ink:hover { box-shadow: 0 14px 34px rgb(8 13 20 / 25%); transform: translateY(-2px); }

.menu-toggle { display: none; }

.dark-surface { color: var(--white); background: var(--night); }
.light-surface { color: var(--ink); background: var(--paper); }

.micro-label,
.section-kicker {
  display: flex;
  align-items: center;
  gap: 0.7rem;
  margin: 0 0 1.5rem;
  color: #a9b6bf;
  font-size: 0.62rem;
  font-weight: 500;
  line-height: 1.55;
  text-transform: uppercase;
}

.micro-label i,
.section-kicker > span {
  width: 7px;
  height: 7px;
  flex: 0 0 auto;
  border-radius: 50%;
  background: var(--cyan);
  box-shadow: 0 0 12px rgb(119 193 203 / 62%);
}

.micro-label b { color: var(--orange); font-weight: 500; }
.section-kicker { color: #65747d; }
.section-kicker > span {
  width: 7px;
  height: 7px;
  flex: 0 0 auto;
  border-radius: 50%;
  background: var(--cyan);
  box-shadow: 0 0 12px rgb(119 193 203 / 62%);
}

.arrow-link,
.quiet-link {
  display: inline-flex;
  align-items: center;
  gap: 0.65rem;
  color: var(--ink);
  font-size: 0.8rem;
  font-weight: 700;
  transition: color var(--transition-fast);
}
.arrow-link span,
.quiet-link span { color: var(--orange); transition: transform var(--transition-fast); }
.arrow-link:hover,
.quiet-link:hover { color: var(--orange-bright); }
.arrow-link:hover span,
.quiet-link:hover span { transform: translateX(4px); }
.quiet-link { color: var(--white); }

.glass-panel {
  border: 1px solid rgb(228 243 246 / 17%);
  background: rgb(13 24 34 / 80%);
  box-shadow: 0 20px 48px rgb(0 0 0 / 28%);
  backdrop-filter: blur(15px);
}

.neon-frame {
  border: 1px solid rgb(119 193 203 / 38%);
  box-shadow: 0 0 0 1px rgb(119 193 203 / 7%), 0 0 28px rgb(119 193 203 / 11%);
}

.data-chip {
  display: inline-flex;
  align-items: center;
  gap: 0.48rem;
  padding: 0.45rem 0.6rem;
  color: #d5e2e4;
  border: 1px solid rgb(228 243 246 / 16%);
  background: rgb(9 16 23 / 86%);
  font: 0.52rem var(--font-mono);
  letter-spacing: 0.07em;
  text-transform: uppercase;
}
.data-chip::before { width: 6px; height: 6px; border-radius: 50%; background: var(--green); box-shadow: 0 0 10px rgb(71 141 92 / 65%); content: ""; }

.hero {
  position: relative;
  min-height: min(850px, 100svh);
  overflow: clip;
  isolation: isolate;
  background: #080e15;
}

.hero-matrix {
  position: absolute;
  z-index: -2;
  inset: 0;
  background:
    linear-gradient(rgb(168 202 215 / 4%) 1px, transparent 1px),
    linear-gradient(90deg, rgb(168 202 215 / 4%) 1px, transparent 1px);
  background-size: 72px 72px;
  mask-image: linear-gradient(90deg, transparent, #000 57%, #000);
}

.hero-wash {
  position: absolute;
  z-index: -3;
  inset: 0;
  background:
    radial-gradient(ellipse at 75% 48%, rgb(35 92 109 / 27%), transparent 36%),
    radial-gradient(ellipse at 100% 86%, rgb(120 67 40 / 13%), transparent 28%),
    linear-gradient(112deg, #080d14 4%, #0d1823 59%, #080e15);
}

.hero-inner {
  position: relative;
  display: grid;
  min-height: inherit;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  align-items: center;
  gap: clamp(2rem, 5vw, 5rem);
  padding-block: 8rem 6rem;
}

.hero-copy { position: relative; z-index: 2; padding-block: 1.5rem; }

.hero h1,
.section-intro h2,
.about h2,
.client-voices h2,
.contact-band h2 {
  margin: 0;
  font-family: var(--font-display);
  font-weight: 600;
  letter-spacing: -0.04em;
  line-height: 0.99;
}

.hero h1 { max-width: 720px; font-size:clamp(3rem, 5vw, 5.5rem);   }
.hero h1 span { display: block; color: var(--cyan); }

.hero-lede {
  max-width: 490px;
  margin: 1.45rem 0 0;
  color: #bfccd3;
  font-size: clamp(0.98rem, 1.3vw, 1.1rem);
  line-height: 1.8;
}

.hero-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 1.25rem 1.7rem; margin-top: 2rem; }
.hero-signoff { display: flex; align-items: center; gap: 0.7rem; margin-top: 2.5rem; color: #8998a3; font: 0.56rem var(--font-mono); letter-spacing: 0.025em; }
.hero-signoff span { width: 25px; height: 1px; background: var(--green); box-shadow: 0 0 10px rgb(71 141 92 / 60%); }

.hero-scene { position: relative; min-height: 470px; perspective: 1200px; }
.mono { font-family: var(--font-mono); letter-spacing: 0.08em; }
.scene-coordinate,
.scene-index { position: absolute; z-index: 3; color: #879aa6; font-size: 0.52rem; }
.scene-coordinate { top: 2%; left: 2%; display: flex; width: 96%; justify-content: space-between; }
.scene-coordinate span { color: #637984; }

.scene-orbit {
  position: absolute;
  top: 50%;
  left: 50%;
  width: min(90%, 440px);
  aspect-ratio: 1;
  border: 1px solid rgb(119 193 203 / 15%);
  border-radius: 50%;
  transform: translate(-50%, -50%) rotate(-18deg);
}
.orbit-two { width: min(72%, 350px); border-style: dashed; border-color: rgb(119 193 203 / 22%); animation: orbit-turn 80s linear infinite; }
.orbit-three { width: min(50%, 245px); border-color: rgb(237 121 46 / 27%); }

.scene-wire { position: absolute; z-index: 1; height: 1px; transform-origin: left center; background: linear-gradient(90deg, transparent, rgb(119 193 203 / 65%), transparent); }
.wire-one { top: 23%; left: 18%; width: 70%; transform: rotate(39deg); }
.wire-two { top: 73%; left: 19%; width: 74%; transform: rotate(-35deg); background: linear-gradient(90deg, transparent, rgb(237 121 46 / 58%), transparent); }
.wire-three { top: 15%; left: 67%; width: 61%; transform: rotate(95deg); }

.signal-node,
.signal-core { position: absolute; z-index: 1; border: 1px solid var(--cyan); border-radius: 50%; background: #132c35; box-shadow: 0 0 12px rgb(119 193 203 / 70%); }
.signal-node { width: 7px; height: 7px; }
.signal-a { top: 23%; left: 19%; }
.signal-b { top: 72%; left: 84%; }
.signal-c { top: 13%; left: 68%; }
.signal-d { top: 81%; left: 32%; }
.signal-core { top: 49%; left: 49%; width: 16px; height: 16px; border-color: var(--orange-bright); background: rgb(237 121 46 / 35%); box-shadow: 0 0 23px rgb(237 121 46 / 58%); }

.scene-product {
  position: absolute;
  z-index: 2;
  top: 15%;
  left: 7%;
  width: 84%;
  padding: 0.55rem;
  border: 1px solid rgb(157 207 216 / 32%);
  background: linear-gradient(130deg, rgb(213 236 237 / 17%), rgb(20 35 48 / 92%) 46%, rgb(9 17 26 / 97%));
  box-shadow: var(--shadow-float), var(--glow-cyan);
  transform: rotateY(-7deg) rotateZ(1deg);
  transition: transform 650ms var(--ease), box-shadow 650ms var(--ease);
}
.hero-scene:hover .scene-product { transform: rotateY(0) rotateZ(0); box-shadow: var(--shadow-float), 0 0 44px rgb(119 193 203 / 17%); }

.product-chrome,
.product-foot { display: flex; min-height: 28px; align-items: center; justify-content: space-between; gap: 0.5rem; padding-inline: 0.4rem; color: #aec2ca; font-size: 0.47rem; }
.product-chrome > span:last-child { display: inline-flex; align-items: center; gap: 0.35rem; color: #c4ddcd; }
.product-chrome i { width: 5px; height: 5px; border-radius: 50%; background: #70c687; box-shadow: 0 0 9px #70c687; }
.scene-product > img { width: 100%; aspect-ratio: 1.6; object-fit: contain; background: #edf0f0; }
.product-foot { min-height: 24px; color: #9bacb4; font-family: var(--font-body); font-size: 0.57rem; }
.product-foot span:last-child { font-family: var(--font-mono); }

.scene-float {
  position: absolute;
  z-index: 4;
  right: -1%;
  bottom: 8%;
  display: flex;
  min-width: 225px;
  align-items: center;
  gap: 0.65rem;
  padding: 0.75rem;
  animation: float-drift 6.5s ease-in-out infinite;
}
.float-signal { width: 7px; height: 7px; flex: 0 0 auto; border-radius: 50%; background: var(--orange); box-shadow: 0 0 12px rgb(237 121 46 / 70%); }
.scene-float > span:nth-child(2) { display: flex; flex-direction: column; line-height: 1.45; }
.scene-float strong { font-size: 0.66rem; }
.scene-float small { color: #9aabb5; font-size: 0.57rem; }
.float-arrow { margin-left: auto; color: var(--cyan); }
.scene-index { right: 1%; bottom: -1.4rem; font-size: 0.5rem; }

.hero-rail { position: absolute; right: var(--gutter); bottom: 2rem; display: flex; align-items: center; gap: 0.45rem; color: #697985; font-size: 0.5rem; }
.hero-rail span:first-child { color: var(--orange-bright); }
.hero-rail i { width: 34px; height: 1px; background: linear-gradient(90deg, var(--orange), rgb(255 255 255 / 25%)); }
.scroll-cue { position: absolute; bottom: 2rem; left: var(--gutter); display: inline-flex; align-items: center; gap: 0.65rem; color: #91a0aa; font-size: 0.52rem; }
.scroll-cue span { width: 26px; height: 1px; background: var(--cyan); box-shadow: 0 0 10px rgb(119 193 203 / 65%); }
.hero-watermark { position: absolute; right: -0.05em; bottom: 1%; color: rgb(255 255 255 / 2.5%); font: 800 clamp(10rem, 21vw, 24rem)/0.8 var(--font-display); letter-spacing: -0.12em; pointer-events: none; }

.recognition { position: relative; z-index: 2; overflow: hidden; color: var(--white); border-block: 1px solid rgb(255 255 255 / 10%); background: linear-gradient(110deg, #101923, #121e29 55%, #101923); }
.recognition-toplight { position: absolute; top: 0; left: 0; width: min(30vw, 410px); height: 1px; background: linear-gradient(90deg, var(--orange), transparent); }
.recognition-layout { display: grid; grid-template-columns: 0.65fr 1.35fr 1fr auto; align-items: center; gap: 1.8rem; padding-block: 2rem; }
.recognition-meta { color: var(--orange-bright); font-size: 0.52rem; line-height: 1.8; }
.recognition-head h2 { margin: 0; font: 700 clamp(1.08rem, 1.75vw, 1.48rem)/1.3 var(--font-display); letter-spacing: -0.045em; }
.recognition-head h2 span { color: #cad3d9; }
.recognition-head > p { max-width: 650px; margin: 0.45rem 0 0; color: #9eabb4; font-size: 0.75rem; }
.recognition-more { grid-column: 2 / 4; color: #aebbc2; font-size: 0.7rem; }
.recognition-more summary { width: fit-content; color: var(--white); cursor: pointer; font-weight: 600; }
.recognition-more summary span { padding-left: 0.4rem; color: var(--orange-bright); }
.recognition-more p { max-width: 790px; margin: 0.5rem 0 0; line-height: 1.65; }
.recognition-layout > .arrow-link { color: var(--white); white-space: nowrap; }
.recognition-layout > .arrow-link span { color: var(--orange-bright); }

.section-backdrop-word { position: absolute; top: 7%; right: -0.03em; color: rgb(16 24 32 / 3%); font-size: clamp(5rem, 15vw, 15rem); letter-spacing: -0.12em; line-height: 0.8; pointer-events: none; }
.solutions { position: relative; overflow: hidden; padding-block: var(--space-9) var(--space-8); }
.solutions::before { position: absolute; top: 0; right: 0; width: 38%; height: 100%; background: linear-gradient(145deg, rgb(215 219 216 / 42%), transparent 62%); clip-path: polygon(42% 0, 100% 0, 100% 100%, 0 100%); content: ""; pointer-events: none; }
.solutions > .shell { position: relative; z-index: 1; }
.section-intro { max-width: 1050px; margin-bottom: 4.3rem; }
.intro-grid { display: grid; grid-template-columns: 1.1fr 0.6fr; align-items: end; gap: 3rem; }
.section-intro h2,
.client-voices h2 { color: var(--ink); font-size: clamp(2.8rem, 4.5vw, 5rem); }
.section-intro h2 em { color: #617986; font-style: normal; }
.intro-grid > p { max-width: 390px; margin: 0 0 0.35rem; color: #63717a; font-size: 0.88rem; }

.split-products { display: grid; grid-template-columns: 1.12fr 0.88fr; align-items: start; gap: clamp(1.3rem, 3.3vw, 3.3rem); }
.product-column { display: grid; gap: clamp(1.25rem, 3vw, 3rem); padding-top: 5.2rem; }
.product-feature { position: relative; display: block; padding: 0.8rem; border: 1px solid rgb(16 24 32 / 20%); color: var(--ink); background: #e6e7e2; transition: transform var(--transition), border-color var(--transition), box-shadow var(--transition), background var(--transition); }
.product-feature::after { position: absolute; inset: 0; border: 1px solid transparent; content: ""; pointer-events: none; transition: border-color var(--transition), box-shadow var(--transition); }
.product-feature:hover { z-index: 2; border-color: rgb(119 193 203 / 70%); background: #eeefea; box-shadow: 0 20px 56px rgb(8 15 22 / 15%), 0 0 25px rgb(119 193 203 / 13%); transform: translateY(-5px); }
.product-feature:hover::after { border-color: rgb(119 193 203 / 44%); box-shadow: inset 0 0 25px rgb(119 193 203 / 5%); }
.product-feature-offset { margin-left: 1.4rem; }
.feature-code { display: block; min-height: 32px; color: #687780; font-size: 0.51rem; }
.feature-visual { position: relative; overflow: hidden; background: #dce2e1; }
.product-feature-large .feature-visual { aspect-ratio: 1.36; }
.product-feature-wide .feature-visual,
.product-feature-offset .feature-visual { aspect-ratio: 1.75; }
.feature-visual img { width: 100%; height: 100%; object-fit: contain; transition: transform 650ms var(--ease), filter 650ms var(--ease); }
.product-feature:hover .feature-visual img { filter: saturate(1.08); transform: scale(1.025); }
.feature-grid { position: absolute; inset: 0; background-image: linear-gradient(rgb(22 55 67 / 6%) 1px, transparent 1px), linear-gradient(90deg, rgb(22 55 67 / 6%) 1px, transparent 1px); background-size: 34px 34px; mix-blend-mode: multiply; pointer-events: none; }
.light-sweep { position: absolute; top: 0; bottom: 0; left: 0; width: 1px; background: var(--cyan); box-shadow: 0 0 15px 1px var(--cyan); opacity: 0.75; transition: left 700ms var(--ease); }
.product-feature:hover .light-sweep { left: 100%; }
.feature-chip { position: absolute; right: 0.6rem; bottom: 0.6rem; display: inline-flex; min-height: 27px; align-items: center; gap: 0.42rem; padding-inline: 0.5rem; color: #d8e4e6; border: 1px solid rgb(236 246 248 / 18%); background: rgb(8 15 22 / 84%); font-size: 0.45rem; }
.feature-chip i { width: 5px; height: 5px; border-radius: 50%; background: var(--cyan); box-shadow: 0 0 8px var(--cyan); }
.feature-footer { display: flex; min-height: 67px; align-items: center; justify-content: space-between; gap: 0.8rem; }
.feature-footer > span:first-child { display: flex; flex-direction: column; gap: 0.1rem; }
.feature-footer strong { font: 700 clamp(1rem, 1.6vw, 1.38rem)/1.25 var(--font-display); letter-spacing: -0.045em; }
.feature-footer small { color: #66737b; font-size: 0.63rem; }
.feature-arrow { display: grid; width: 33px; aspect-ratio: 1; flex: 0 0 auto; place-items: center; color: var(--cyan); border: 1px solid rgb(29 106 121 / 45%); background: var(--night); transition: color var(--transition-fast), background var(--transition-fast), transform var(--transition-fast), box-shadow var(--transition-fast); }
.product-feature:hover .feature-arrow { color: var(--white); background: #176174; box-shadow: 0 0 18px rgb(62 166 182 / 28%); transform: rotate(45deg); }
.product-caption { display: flex; justify-content: space-between; margin-top: 1.15rem; padding-top: 0.75rem; color: #758189; border-top: 1px solid var(--line-light); font-size: 0.51rem; }

.about { position: relative; overflow: hidden; background: radial-gradient(ellipse at 83% 37%, rgb(36 84 99 / 23%), transparent 37%), linear-gradient(116deg, #090f16, #101b26 67%, #0a1119); }
.about-atmosphere { position: absolute; top: -36%; right: -12%; width: min(68vw, 860px); aspect-ratio: 1; border: 1px solid rgb(119 193 203 / 10%); border-radius: 50%; }
.about-atmosphere::before,
.about-atmosphere::after { position: absolute; inset: 11%; border: 1px solid rgb(119 193 203 / 8%); border-radius: 50%; content: ""; }
.about-atmosphere::after { inset: 25%; border-color: rgb(237 121 46 / 13%); }
.about-layout { position: relative; display: grid; grid-template-columns: 1fr 0.9fr; column-gap: clamp(3rem, 9vw, 9rem); padding-top: var(--space-9); }
.about-heading .micro-label { color: #a1adb6; }
.label-rule {
  width: 7px;
  height: 7px;
  flex: 0 0 auto;
  border-radius: 50%;
  background: var(--cyan);
  box-shadow: 0 0 12px rgb(119 193 203 / 62%);
}
.about h2 { color: var(--white); font-size: clamp(3.2rem, 5vw, 6.3rem); }
.about h2 em { color: var(--cyan); font-style: normal; }
.about-vision { max-width: 400px; margin: 1.5rem 0 0; color: #b4c0c9; font: 500 clamp(1rem, 1.45vw, 1.2rem)/1.65 var(--font-display); letter-spacing: -0.02em; }
.about-detail { position: relative; z-index: 1; padding-top: 2.2rem; }
.experience-panel { position: relative; display: flex; min-height: 230px; flex-direction: column; justify-content: center; overflow: hidden; padding: 1.5rem 2rem; border: 1px solid rgb(197 227 232 / 16%); background: linear-gradient(115deg, rgb(255 255 255 / 5%), rgb(255 255 255 / 1%)); box-shadow: inset 0 0 35px rgb(119 193 203 / 3%); }
.experience-figure { position: relative; z-index: 1; color: var(--white); font: 600 clamp(5.6rem, 7vw, 9rem)/0.88 var(--font-display); letter-spacing: -0.12em; }
.experience-figure span { color: var(--orange); font-size: 0.44em; vertical-align: top; }
.experience-label { position: relative; z-index: 1; margin-top: 0.7rem; color: #91a3ad; font-size: 0.57rem; }
.experience-support { position: absolute; z-index: 1; right: 1rem; bottom: 1rem; max-width: 140px; color: #b6c2c8; font-size: 0.61rem; line-height: 1.45; text-align: right; }
.experience-loop { position: absolute; top: -38%; right: -8%; width: 68%; aspect-ratio: 1; border: 1px solid rgb(119 193 203 / 23%); border-radius: 50%; }
.loop-two { top: -14%; right: 12%; border-color: rgb(237 121 46 / 18%); }
.about-detail > p { max-width: 550px; margin: 1.45rem 0 1rem; color: #b3c0c8; font-size: 0.85rem; }
.arrow-link-light { color: var(--white); }
.arrow-link-light span { color: var(--cyan); }
.leadership-strip { display: flex; grid-column: 1 / -1; align-items: center; justify-content: space-between; gap: 1.2rem; margin-top: 4.7rem; padding-block: 1rem; overflow: auto hidden; border-block: 1px solid var(--line-dark); color: #aebbc3; font-size: 0.5rem; white-space: nowrap; }
.leadership-strip span:first-child { color: var(--orange-bright); }

.client-voices { padding-block: clamp(4.5rem, 7vw, 6.5rem); }
.voices-heading { max-width: 950px; }
.client-voices h2 { font-size: clamp(3rem, 5vw, 6rem); }
.client-voices h2 em { color: #637c87; font-style: normal; }
.voice-composition { display: grid; grid-template-columns: 0.45fr 1.3fr 0.72fr; align-items: start; gap: clamp(1.3rem, 4vw, 4rem); margin-top: 2.6rem; padding-top: 1.1rem; border-top: 1px solid var(--line-light); }
.voice-index { padding-top: 0.45rem; color: #718089; font-size: 0.5rem; line-height: 1.8; }
.voice-quote { position: relative; margin: 0; }
.quote-mark { position: absolute; top: -1.5rem; right: 0; color: var(--orange); font: 4.5rem/1 Georgia, serif; }
.voice-quote blockquote { margin: 0; padding-right: 0.7rem; color: #d1dadd; font: 500 clamp(1rem, 1.4vw, 1.2rem)/1.75 var(--font-display); letter-spacing: -0.02em; }
.voice-quote figcaption { display: flex; flex-direction: column; gap: 0.12rem; margin-top: 1.35rem; }
.voice-quote figcaption strong { color: #f0f2ef; font-size: 0.82rem; }
.voice-quote figcaption span { color: #a5b1b6; font-size: 0.72rem; }
.voice-aside { align-self: end; padding: 1.25rem; border: 1px solid rgb(119 193 203 / 18%); background: linear-gradient(145deg, #141f28, #0b131b); box-shadow: inset 0 0 24px rgb(119 193 203 / 3%); }
.voice-aside > span { display: block; width: 30px; height: 2px; background: var(--green); box-shadow: 0 0 10px rgb(71 141 92 / 25%); }
.voice-aside p { margin: 1rem 0; color: #c4cdd0; font: 500 0.86rem/1.65 var(--font-display); letter-spacing: -0.02em; }
.voice-aside strong,
.voice-aside small { display: block; color: #d5dcde; font-size: 0.68rem; }
.voice-aside small { color: #98a6ac; font-size: 0.62rem; }

.contact-band { position: relative; overflow: hidden; padding-block: clamp(4rem, 6vw, 5.5rem); color: var(--white); background: radial-gradient(ellipse at 90% 30%, rgb(77 111 120 / 12%), transparent 36%), linear-gradient(115deg, #121c26, #0b131c 65%, #111b24); }
.contact-band .micro-label { color: #aeb9c1; }
.contact-layout { position: relative; z-index: 1; display: flex; align-items: end; justify-content: space-between; gap: 3rem; }
.contact-band h2 { color: var(--white); font-size: clamp(3.6rem, 5.5vw, 7rem); }
.contact-band h2 em { color: var(--orange-bright); font-style: normal; }
.contact-call { max-width: 340px; padding-bottom: 0.55rem; }
.contact-call p { margin: 0 0 1.1rem; color: #b6c1c8; font-size: 0.85rem; }
.contact-symbol { position: absolute; top: -0.6em; right: -0.03em; color: rgb(255 255 255 / 2.3%); font: 800 clamp(18rem, 39vw, 43rem)/1 var(--font-display); letter-spacing: -0.14em; pointer-events: none; }

.site-footer { color: #d4dde2; background: #080d14; }
.footer-grid { display: grid; grid-template-columns: 1.25fr 0.68fr 0.9fr 1.1fr; gap: clamp(1.4rem, 4vw, 4rem); padding-block: 4.1rem 3.5rem; }
.footer-brand {
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}
.footer-brand img {
  width: 148px;
  height: 67px;
  padding: 0;
  object-fit: contain;
  background: transparent;
}
.footer-intro > p { max-width: 290px; margin: 1rem 0 1.1rem; color: #9aa7b0; font-size: 0.75rem; }
.social-row { display: flex; gap: 0.55rem; }
.social-row a {
  display: grid;
  width: 2.15rem;
  height: 2.15rem;
  place-items: center;
  border: 1px solid rgb(255 255 255 / 18%);
  border-radius: 50%;
  color: #d3dae0;
  background: rgba(11, 18, 24, 0.8);
  transition: color var(--transition-fast), border-color var(--transition-fast), background var(--transition-fast), box-shadow var(--transition-fast), transform var(--transition-fast);
}
.social-row a:hover {
  color: var(--white);
  border-color: rgb(119 193 203 / 42%);
  background: rgba(119, 193, 203, 0.08);
  box-shadow: 0 0 18px rgb(119 193 203 / 16%);
  transform: translateY(-2px);
}
.social-row svg {
  display: block;
  width: 0.92rem;
  height: 0.92rem;
  fill: currentColor;
}
.footer-column { display: flex; flex-direction: column; align-items: flex-start; gap: 0.55rem; }
.footer-column h2 { margin: 0 0 0.5rem; color: var(--white); font: 700 0.76rem var(--font-display); }
.footer-column a { color: #9eabb3; font-size: 0.7rem; overflow-wrap: anywhere; transition: color var(--transition-fast); }
.footer-column a:hover { color: var(--cyan); }
.footer-column .footer-subhead { margin-top: 0.9rem; margin-bottom: 0; }
.footer-base { display: flex; min-height: 68px; align-items: center; justify-content: space-between; gap: 0.7rem 1.5rem; border-top: 1px solid rgb(255 255 255 / 12%); color: #7f8c95; font-size: 0.61rem; }
.footer-base address { max-width: 720px; font-style: normal; }
.footer-base a { color: #b0bbc2; white-space: nowrap; transition: color var(--transition-fast); }
.footer-base a:hover { color: var(--orange-bright); }
.footer-social .social-row { margin-top: 0.15rem; }
.footer-location { padding-bottom: 3rem; }
.footer-location-heading { display: flex; align-items: end; justify-content: space-between; gap: 2rem; margin-bottom: 1rem; padding-top: 1.6rem; border-top: 1px solid rgb(255 255 255 / 12%); }
.footer-location-heading .section-kicker { margin-bottom: 0.65rem; color: #9fadb4; }
.footer-location-heading h2 { margin: 0; color: var(--white); font: 600 clamp(1.35rem, 2vw, 1.8rem)/1.2 var(--font-display); }
.footer-location-heading address { color: #b6c1c5; font-size: 0.7rem; font-style: normal; line-height: 1.75; }
.footer-location .home-location-visual { height: 220px; margin-top: 0; border-radius: 10px; }
.section-intro[id],
.about-detail [id],
#client-voices,
#about,
#contact,
#products { scroll-margin-top: 6rem; }
.leadership-editorial-home {
  grid-column: 1 / -1;
  margin-top: 2rem;
  padding-top: 1.5rem;
  border-top: 1px solid rgb(221 238 241 / 12%);
}
.leadership-editorial-home .section-kicker { color: #a6b2b9; }
.home-leader-list {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 0.85rem;
}
.leader-card {
  position: relative;
  display: flex;
  min-height: 100%;
  flex-direction: column;
  gap: 0.7rem;
  padding: 0.75rem;
  border: 1px solid rgb(142 171 181 / 18%);
  background: linear-gradient(160deg, rgba(18, 27, 35, 0.94), rgba(10, 15, 21, 0.9));
  box-shadow: inset 0 0 28px rgb(81 141 168 / 4%);
  transition: border-color var(--transition), box-shadow var(--transition), transform var(--transition);
}
.leader-card::before {
  position: absolute;
  inset: 3px;
  border: 1px solid rgb(142 171 181 / 7%);
  content: "";
  pointer-events: none;
  transition: border-color var(--transition), box-shadow var(--transition);
}
.leader-card::after {
  position: absolute;
  top: 0;
  left: 0.75rem;
  width: 34%;
  height: 1px;
  background: linear-gradient(90deg, rgb(164 198 244 / 0%), rgb(194 218 255 / 76%), rgb(164 198 244 / 0%));
  content: "";
  pointer-events: none;
  transition: width var(--transition), filter var(--transition);
}
.leader-card:hover {
  border-color: rgb(119 193 203 / 42%);
  box-shadow: inset 0 0 28px rgb(119 193 203 / 6%), 0 0 0 1px rgb(119 193 203 / 11%), 0 0 24px rgb(108 151 214 / 16%);
  transform: translateY(-3px);
}
.leader-card:hover::before { border-color: rgb(145 183 237 / 22%); box-shadow: inset 0 0 22px rgb(119 166 228 / 8%); }
.leader-card:hover::after { width: 68%; filter: drop-shadow(0 0 4px rgb(177 207 255 / 68%)); }
.leader-card img {
  width: 100%;
  aspect-ratio: 4 / 5;
  object-fit: cover;
  border: 1px solid rgb(150 176 185 / 16%);
  border-radius: 0.7rem;
  background: #0b1218;
}
.leader-card-meta {
  display: flex;
  flex-direction: column;
  gap: 0.18rem;
}
.home-leader-list .mono { color: #91a1a8; font-size: 0.43rem; }
.home-leader-list strong { color: #f0f2ef; font: 600 clamp(0.76rem, 1vw, 0.98rem)/1.2 var(--font-display); }
.home-leader-list small { color: #a7b2b7; font-size: 0.65rem; }
.home-contact-grid {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: 1fr 1fr 1.2fr;
  gap: clamp(1.1rem, 2.4vw, 2.4rem);
  margin-top: 4rem;
  padding-top: 1.8rem;
  border-top: 1px solid rgb(230 240 243 / 13%);
}
.home-contact-grid > section { min-width: 0; }
.home-contact-grid .section-kicker { margin-bottom: 0.8rem; color: #9fadb4; font-size: 0.49rem; }
.home-contact-grid h3 { margin: 0 0 0.65rem; color: #eef0ed; font: 600 clamp(1.2rem, 1.8vw, 1.6rem)/1.2 var(--font-display); letter-spacing: -0.045em; }
.home-contact-grid > section > a { display: block; width: fit-content; margin-top: 0.48rem; color: #c3cdd0; font-size: 0.72rem; overflow-wrap: anywhere; transition: color var(--transition-fast); }
.home-contact-grid > section > a:hover { color: var(--orange-bright); }
.home-contact-grid section > p:not(.section-kicker) { margin: 0 0 0.5rem; color: #a8b4ba; font-size: 0.72rem; }
.home-contact-grid address { color: #b6c1c5; font-size: 0.7rem; font-style: normal; line-height: 1.75; }
.home-location-visual { position: relative; height: 82px; margin-top: 0.8rem; overflow: hidden; border: 1px solid rgb(218 235 239 / 13%); background: repeating-linear-gradient(27deg, transparent 0 16px, rgb(202 223 228 / 10%) 17px 18px, transparent 19px 37px), repeating-linear-gradient(150deg, #101a23 0 20px, #121e27 21px 22px, #0c141b 23px 41px); }
.home-location-visual > span { position: absolute; top: 32%; left: 56%; width: 13px; height: 13px; border: 1px solid var(--orange-bright); border-radius: 50% 50% 50% 0; background: #19242b; box-shadow: 0 0 12px rgb(237 121 46 / 45%); transform: rotate(-45deg); }
.home-location-visual > i { position: absolute; top: 39%; left: 26%; width: 42%; height: 1px; background: linear-gradient(90deg, transparent, var(--cyan), var(--orange)); transform: rotate(-18deg); }
.home-location-visual .mono,
.home-location-visual > b { position: absolute; right: 0.3rem; bottom: 0.25rem; color: #91a0a7; font-size: 0.36rem; font-weight: 400; }
.home-location-link {
  display: block;
  padding: 0.1rem 0;
  color: inherit;
  text-decoration: none;
}
.home-location-link address {
  font-style: normal;
}
.home-location-link:hover .home-location-visual,
.home-location-link:focus-visible .home-location-visual {
  border-color: rgb(119 193 203 / 38%);
  box-shadow: 0 0 24px rgb(119 193 203 / 10%);
}
.home-contact-grid .social-row { margin-top: 1rem; }
.home-contact-grid .social-row a { width: 2.15rem; height: 2.15rem; }
.digital-intro {
  position: relative;
  overflow: hidden;
  padding-block: clamp(4.5rem, 8vw, 7.5rem);
  border-block: 1px solid rgb(221 238 241 / 8%);
  background:
    radial-gradient(ellipse at 83% 52%, rgb(34 81 95 / 15%), transparent 37%),
    linear-gradient(115deg, #0b1219, #111b24 63%, #0a1118);
}
.digital-intro-layout {
  position: relative;
  display: grid;
  grid-template-columns: 0.35fr 1.15fr 0.6fr;
  align-items: end;
  gap: 1.2rem 2rem;
}
.digital-intro .section-kicker { grid-column: 1 / -1; margin-bottom: 0.2rem; color: #a6b2b9; }
.digital-intro h2 { max-width: 850px; margin: 0; color: #f1f3f0; font: 600 clamp(2.6rem, 5.3vw, 5.3rem)/1.02 var(--font-display); letter-spacing: -0.04em; }
.digital-intro h2 em { color: #aab8bf; font-style: normal; }
.digital-intro-layout > p:not(.section-kicker) { max-width: 320px; margin: 0 0 0.4rem; color: #aab6bc; font-size: 0.82rem; line-height: 1.8; }
.digital-intro-index { position: absolute; right: 0; top: 0; color: #71848e; font-size: 0.45rem; writing-mode: vertical-rl; }
.product-back-link { display: inline-flex; align-items: center; margin: 0 1rem 1rem 0; color: #bac6cb; font-size: 0.73rem; transition: color var(--transition-fast); }
.product-back-link:hover { color: var(--orange-bright); }

/* Interior pages extend the homepage's dark editorial system without repeating its layout. */
.nav-link { white-space: nowrap; }
.site-footer { border-top: 1px solid rgb(228 243 246 / 10%); }
.site-footer .footer-base address { max-width: 58ch; }
.site-footer .footer-base address strong { display: block; margin-bottom: 0.18rem; color: #aab6bd; font-size: 0.55rem; font-weight: 600; letter-spacing: 0.08em; text-transform: uppercase; }

[data-reveal] { opacity: 1; transform: none; }
.motion-ready [data-reveal] { opacity: 0; transform: translateY(17px); transition: opacity 680ms ease, transform 680ms var(--ease); }
.motion-ready [data-reveal].is-visible { opacity: 1; transform: translateY(0); }

@keyframes orbit-turn { to { transform: translate(-50%, -50%) rotate(342deg); } }
@keyframes float-drift { 0%, 100% { translate: 0 0; } 50% { translate: 0 -7px; } }

@media (min-width: 1500px) {
  .hero,
  .hero-inner { min-height: 900px; }
}

@media (max-width: 1080px) {
  :root { --space-9: 7.3rem; }
  .header-inner { height: 78px; }
  .brand img { width: 120px; height: 54px; }
  .site-nav { gap: 1.2rem; font-size: 0.73rem; }
  .hero-inner { grid-template-columns: 1fr 0.9fr; gap: 2rem; }
  .hero h1 { font-size: clamp(3.6rem, 6.4vw, 6rem); }
  .hero-scene { min-height: 400px; }
  .recognition-layout { grid-template-columns: 0.65fr 1.25fr 1fr; gap: 1.2rem; }
  .recognition-layout > .arrow-link { grid-column: 2 / -1; justify-self: start; }
  .voice-composition { grid-template-columns: 0.36fr 1.35fr 0.7fr; gap: 1.5rem; }
  .footer-grid { grid-template-columns: 1.2fr 0.8fr 1fr; row-gap: 2.5rem; }
  .footer-contact { grid-column: 2 / -1; }
}

@media (max-width: 780px) {
  :root { --gutter: 1.25rem; --space-8: 5.5rem; --space-9: 6rem; }
  html { scroll-padding-top: 5rem; }
  .header-inner { height: 72px; }
  .brand img { width: 78px; height: 47px; }
  .menu-toggle { position: relative; z-index: 1202; display: flex; width: 44px; height: 44px; flex-direction: column; align-items: center; justify-content: center; gap: 6px; border: 1px solid rgb(255 255 255 / 23%); border-radius: var(--radius-tight); background: rgb(255 255 255 / 5%); cursor: pointer; }
  .menu-toggle span { width: 18px; height: 1px; background: var(--white); transition: transform var(--transition-fast); }
  .menu-toggle[aria-expanded="true"] span:first-child { transform: translateY(3.5px) rotate(45deg); }
  .menu-toggle[aria-expanded="true"] span:last-child { transform: translateY(-3.5px) rotate(-45deg); }
  .site-nav { position: fixed; z-index: 1201; inset: 0; display: flex; height: 100svh; flex-direction: column; align-items: stretch; justify-content: center; gap: 0; padding: 5.5rem var(--gutter) 3rem; overflow-y: auto; background: radial-gradient(ellipse at 85% 17%, rgb(36 88 104 / 24%), transparent 39%), rgb(8 13 20 / 98%); opacity: 0; visibility: hidden; transform: translateY(-8px); transition: opacity var(--transition), transform var(--transition), visibility var(--transition); }
  .site-nav.is-open { opacity: 1; visibility: visible; transform: translateY(0); }
  .nav-link { min-height: 4rem; flex: 0 0 auto; border-bottom: 1px solid var(--line-dark); color: var(--white); font: 600 clamp(1.7rem, 7vw, 2.4rem)/1 var(--font-display); letter-spacing: -0.06em; }
  .nav-link::after { display: none; }
  .nav-link.is-active { color: var(--cyan); text-shadow: 0 0 22px rgb(119 193 203 / 23%); }
  .site-nav .button-nav { align-self: flex-start; margin-top: 1.3rem; font: 700 0.84rem var(--font-body); }
  .hero,
  .hero-inner { min-height: 0; }
  .hero-inner { grid-template-columns: 1fr; gap: 1.2rem; padding-block: 7.5rem 5.6rem; }
  .hero-copy { max-width: 700px; padding-top: 1.7rem; }
  .hero h1 { max-width: 680px; font-size: clamp(3.6rem, 10.5vw, 5.5rem); }
  .hero-lede { margin-top: 1.2rem; }
  .hero-signoff { margin-top: 1.7rem; }
  .hero-scene { width: min(100%, 620px); min-height: 420px; margin-inline: auto; }
  .scene-product { top: 13%; }
  .scene-float { bottom: 6%; }
  .hero-rail { bottom: 1.6rem; }
  .scroll-cue { bottom: 1.6rem; }
  .recognition-layout { grid-template-columns: 0.55fr 1.45fr; gap: 0.8rem 1.3rem; padding-block: 1.6rem; }
  .recognition-head > p { font-size: 0.71rem; }
  .recognition-more { grid-column: 2; }
  .recognition-layout > .arrow-link { grid-column: 2; }
  .intro-grid { grid-template-columns: 1fr; gap: 1.2rem; }
  .section-intro { margin-bottom: 3rem; }
  .section-intro h2,
  .client-voices h2 { font-size: clamp(3.2rem, 10vw, 5.4rem); }
  .intro-grid > p { max-width: 520px; }
  .split-products { grid-template-columns: 1fr; gap: 1.5rem; }
  .product-column { grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: start; gap: 1rem; padding-top: 0; }
  .product-feature-offset { margin: 0; transform: translateY(1rem); }
  .product-feature-wide { transform: translateY(-0.3rem); }
  .product-feature-offset:hover,
  .product-feature-wide:hover { transform: translateY(-4px); }
  .product-feature-large .feature-visual { aspect-ratio: 1.5; }
  .product-feature-wide .feature-visual,
  .product-feature-offset .feature-visual { aspect-ratio: 1.48; }
  .about-layout { grid-template-columns: 1fr 0.92fr; column-gap: 2rem; padding-top: var(--space-8); }
  .about h2,
  .contact-band h2 { font-size: clamp(3.1rem, 9vw, 5.2rem); }
  .about-detail { padding-top: 2.2rem; }
  .experience-panel { min-height: 185px; padding: 1rem; }
  .experience-figure { font-size: clamp(5rem, 11vw, 7.2rem); }
  .experience-support { right: 0.7rem; bottom: 0.7rem; font-size: 0.55rem; }
  .leadership-strip { justify-content: flex-start; margin-top: 3.6rem; }
  .voice-composition { grid-template-columns: 0.38fr 1.62fr; gap: 1.3rem; margin-top: 3rem; }
  .voice-aside { grid-column: 2; justify-self: end; width: min(86%, 380px); transform: translateY(0.5rem); }
  .contact-layout { align-items: flex-start; flex-direction: column; gap: 1.7rem; }
  .contact-call { max-width: 430px; }
  .footer-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 2.3rem 1.4rem; }
  .footer-intro { grid-column: 1 / -1; }
  .footer-contact { grid-column: auto; }
  .footer-base { align-items: flex-start; flex-wrap: wrap; justify-content: flex-start; padding-block: 1rem; }
}

@media (max-width: 520px) {
  :root { --space-8: 4.5rem; --space-9: 4.8rem; }
  .hero-inner { gap: 1rem; padding-block: 7rem 5rem; }
  .hero h1 {
  font-size: clamp(3rem, 11.5vw, 4rem);
  letter-spacing: -0.04em;
}
  .hero .micro-label { font-size: 0.55rem; }
  .hero-actions { align-items: flex-start; flex-direction: column; gap: 1rem; }
  .hero-signoff { max-width: 300px; align-items: flex-start; font-size: 0.52rem; line-height: 1.65; }
  .hero-scene { min-height: 310px; }
  .scene-coordinate,
  .scene-index { font-size: 0.43rem; }
  .scene-product { top: 15%; left: 2%; width: 93%; transform: rotateZ(0.7deg); }
  .scene-float { right: -0.1rem; bottom: 4%; min-width: 194px; padding: 0.62rem; }
  .product-chrome { font-size: 0.42rem; }
  .scene-index { bottom: -1.1rem; }
  .hero-rail { display: none; }
  .hero-watermark { font-size: 7.5rem; }
  .recognition-layout { grid-template-columns: 1fr; gap: 0.65rem; }
  .recognition-head h2 br { display: none; }
  .recognition-more,
  .recognition-layout > .arrow-link { grid-column: 1; }
  .section-intro h2,
  .client-voices h2,
  .about h2,
  .contact-band h2 { font-size: clamp(2.9rem, 11vw, 4rem); }
  .section-backdrop-word { top: 4%; font-size: 4.6rem; }
  .product-column { grid-template-columns: 1fr; gap: 1rem; }
  .product-feature-wide,
  .product-feature-offset { transform: none; }
  .product-feature-wide:hover,
  .product-feature-offset:hover { transform: translateY(-4px); }
  .product-feature-large .feature-visual,
  .product-feature-wide .feature-visual,
  .product-feature-offset .feature-visual { aspect-ratio: 1.55; }
  .feature-footer { min-height: 60px; }
  .feature-footer small { font-size: 0.61rem; }
  .product-caption { gap: 0.6rem; font-size: 0.45rem; }
  .about-layout { grid-template-columns: 1fr; gap: 0.9rem; }
  .about-detail { padding-top: 0.8rem; }
  .experience-panel { min-height: 165px; }
  .experience-figure { font-size: 5.5rem; }
  .leadership-strip { grid-column: 1; margin-top: 2.6rem; }
  .voice-composition { grid-template-columns: 1fr; gap: 0.95rem; }
  .voice-index { padding: 0; }
  .voice-aside { grid-column: 1; width: 100%; justify-self: stretch; margin-top: 0.6rem; }
  .quote-mark { top: -1.3rem; font-size: 3.8rem; }
  .contact-symbol { top: 10%; right: -8%; font-size: 20rem; }
  .footer-grid { grid-template-columns: 1fr 1fr; gap: 2rem 1rem; padding-block: 3.3rem 2.7rem; }
  .footer-intro,
  .footer-contact { grid-column: 1 / -1; }
  .footer-base { gap: 0.45rem; }
  .footer-base address { font-size: 0.59rem; line-height: 1.6; }
}

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after { scroll-behavior: auto !important; animation-duration: 0.01ms !important; animation-iteration-count: 1 !important; transition-duration: 0.01ms !important; }
  .motion-ready [data-reveal] { opacity: 1; transform: none; }
}

/* Global black foundation: keep editorial sections and every card in one visual world. */
.light-surface,
.dark-editorial {
  color: var(--white);
  background-color: #0c131b;
}

.solutions {
  background:
    radial-gradient(ellipse at 83% 35%, rgb(24 63 75 / 12%), transparent 39%),
    linear-gradient(128deg, #0b121a, #101923 57%, #0a1118);
}

.solutions::before {
  background: linear-gradient(145deg, rgb(114 166 183 / 8%), transparent 62%);
}

.section-backdrop-word {
  color: rgb(214 230 234 / 2.5%);
}

.section-intro h2,
.client-voices h2 {
  color: #f2f4f2;
}

.section-intro h2 em,
.client-voices h2 em {
  color: #aebac0;
}

.section-intro .section-kicker {
  color: #a6b2b9;
}

.intro-grid > p {
  color: #a9b4ba;
}

.product-feature {
  border-color: rgb(205 224 229 / 15%);
  color: #f0f3f2;
  background: linear-gradient(145deg, #151f2a, #101820 74%);
  box-shadow: 0 18px 46px rgb(0 0 0 / 22%);
}

.product-feature::after {
  border-color: rgb(255 255 255 / 2%);
}

.product-feature:hover {
  border-color: rgb(119 193 203 / 54%);
  background: linear-gradient(145deg, #192733, #111b25 74%);
  box-shadow: 0 24px 58px rgb(0 0 0 / 40%), 0 0 25px rgb(119 193 203 / 10%);
}

.feature-code,
.feature-footer small,
.product-caption {
  color: #a0adb5;
}

.feature-visual {
  background: #121d27;
}

.feature-visual img {
  background: #e5e8e6;
}

.voice-composition {
  border-color: var(--line-dark);
}

.voice-index {
  color: #a5b1b8;
}

.voice-quote blockquote {
  color: #d5dcdf;
}

.voice-quote figcaption strong {
  color: var(--white);
}

.voice-quote figcaption span {
  color: #9ba8af;
}

.voice-aside {
  border-color: rgb(204 226 231 / 16%);
  background: linear-gradient(145deg, #17222c, #101820);
  box-shadow: inset 0 0 24px rgb(119 193 203 / 3%), 0 18px 42px rgb(0 0 0 / 22%);
}

.voice-aside p {
  color: #d5dcdf;
}

.voice-aside strong,
.voice-aside small {
  color: #9caab1;
}

.recognition {
  background:
    radial-gradient(ellipse at 8% 50%, rgb(237 121 46 / 8%), transparent 32%),
    linear-gradient(108deg, #0b1118, #111b25 52%, #0b1219);
}

.recognition-layout {
  grid-template-columns: 150px 0.58fr 1.35fr auto;
  gap: 1.5rem;
  padding-block: 2.25rem;
}

.recognition-award-frame {
  position: relative;
  grid-column: 1;
  grid-row: 1 / span 3;
  display: grid;
  min-height: 205px;
  place-items: center;
  padding: 0.65rem;
  border: 1px solid rgb(237 121 46 / 35%);
  background:
    radial-gradient(ellipse at 50% 45%, rgb(237 121 46 / 12%), transparent 65%),
    linear-gradient(145deg, #18232e, #0c131b);
  box-shadow: 0 0 0 1px rgb(237 121 46 / 7%), 0 0 30px rgb(237 121 46 / 9%), 0 18px 38px rgb(0 0 0 / 30%);
}

.recognition-award-frame::before {
  position: absolute;
  inset: 5px;
  border: 1px solid rgb(220 231 234 / 10%);
  content: "";
  pointer-events: none;
}

.recognition-award-frame img {
  width: 100%;
  height: 177px;
  object-fit: contain;
  object-position: center;
  background: #e8e6dd;
}

.award-corner {
  position: absolute;
  right: 0.85rem;
  bottom: 0.78rem;
  color: #d4bba7;
  font-size: 0.42rem;
  text-shadow: 0 1px 5px #080d14;
}

.recognition-meta {
  grid-column: 2;
  grid-row: 1;
  align-self: end;
  color: var(--orange-bright);
}

.recognition-head {
  grid-column: 3;
  grid-row: 1;
}

.recognition-head h2 {
  color: #f4f5f3;
  font-size: clamp(1.45rem, 2.5vw, 2.2rem);
  line-height: 1.2;
}

.recognition-head h2 span {
  color: #c2ccd1;
}

.recognition-head > p {
  color: #aeb9c0;
  font-size: 0.81rem;
}

.recognition-more {
  grid-column: 2 / 4;
  grid-row: 2;
  color: #aeb9c0;
}

.recognition-layout > .arrow-link {
  grid-column: 4;
  grid-row: 1 / span 2;
  align-self: center;
}

.brand img,
.footer-brand img { filter: none; }

.hero h1 span,
.about h2 em,
.section-intro h2 em,
.client-voices h2 em,
.contact-band h2 em {
  color: #d8e0e2;
}

.hero h1 span {
  text-shadow: 0 0 28px rgb(119 193 203 / 12%);
}

.about h2 em {
  text-shadow: 0 0 24px rgb(119 193 203 / 10%);
}

html,
body {
  overflow-x: clip;
}

.solutions,
.client-voices {
  color: var(--white);
}

.client-voices {
  background:
    radial-gradient(ellipse at 95% 52%, rgb(29 74 87 / 12%), transparent 35%),
    linear-gradient(110deg, #0a1118, #101923 58%, #0b121a);
}

.contact-band {
  background:
    radial-gradient(ellipse at 90% 30%, rgb(77 111 120 / 12%), transparent 36%),
    linear-gradient(115deg, #121c26, #0b131c 65%, #111b24);
}

.contact-band h2 em {
  color: #c2cbd0;
}

.contact-call p {
  color: #bac4ca;
}

.button-ink {
  border: 1px solid rgb(237 121 46 / 52%);
  background: linear-gradient(105deg, #d96626, #f18435);
}

.button-ink:hover {
  border-color: var(--orange-bright);
  box-shadow: var(--glow-orange);
}

@media (max-width: 1080px) {
  .recognition-layout {
    grid-template-columns: 132px 0.5fr 1.25fr;
  }

  .recognition-award-frame {
    grid-column: 1;
    grid-row: 1 / span 3;
    min-height: 190px;
  }

  .recognition-award-frame img {
    height: 164px;
  }

  .recognition-meta {
    grid-column: 2;
    grid-row: 1;
  }

  .recognition-head {
    grid-column: 3;
    grid-row: 1;
  }

  .recognition-more {
    grid-column: 2 / 4;
    grid-row: 2;
  }

  .recognition-layout > .arrow-link {
    grid-column: 2 / 4;
    grid-row: 3;
  }
}

@media (max-width: 780px) {
  .recognition-layout {
    grid-template-columns: 116px 1fr;
    gap: 0.8rem 1rem;
    padding-block: 1.5rem;
  }

  .recognition-award-frame {
    grid-column: 1;
    grid-row: 1 / span 4;
    min-height: 178px;
    padding: 0.5rem;
  }

  .recognition-award-frame img {
    height: 150px;
  }

  .recognition-meta {
    grid-column: 2;
    grid-row: 1;
    align-self: start;
  }

  .recognition-head {
    grid-column: 2;
    grid-row: 2;
  }

  .recognition-head h2 {
    font-size: clamp(1.25rem, 3vw, 1.75rem);
  }

  .recognition-more {
    grid-column: 2;
    grid-row: 3;
  }

  .recognition-layout > .arrow-link {
    grid-column: 2;
    grid-row: 4;
  }

  .voice-quote blockquote {
    color: #d5dcdf;
  }
}

@media (max-width: 520px) {
  .recognition-layout {
    grid-template-columns: 120px minmax(0, 1fr);
    gap: 0.7rem 0.8rem;
  }

  .recognition-award-frame {
    min-height: 196px;
    padding: 0.4rem;
  }

  .recognition-award-frame img {
    height: 168px;
  }

  .award-corner {
    right: 0.55rem;
    bottom: 0.55rem;
    font-size: 0.34rem;
  }

  .recognition-meta {
    font-size: 0.45rem;
  }

  .recognition-head h2 {
    font-size: 1.12rem;
  }

  .recognition-head > p,
  .recognition-more {
    font-size: 0.65rem;
  }
}

@media (prefers-reduced-motion: reduce) {
  .orbit-two,
  .scene-float {
    animation: none;
  }
}

/* Hero system visualization: a CSS-built connection between business and technology. */
.hero-scene {
  min-height: 500px;
}

.scene-orbit {
  border-color: rgb(158 190 202 / 13%);
}

.orbit-two {
  border-color: rgb(158 190 202 / 20%);
}

.orbit-three {
  border-color: rgb(237 121 46 / 24%);
}

.scene-wire {
  background: linear-gradient(90deg, transparent, rgb(119 193 203 / 48%), transparent);
}

.wire-two {
  background: linear-gradient(90deg, transparent, rgb(237 121 46 / 45%), transparent);
}

.reality-panel {
  position: absolute;
  z-index: 2;
  display: flex;
  width: 64%;
  min-height: 138px;
  flex-direction: column;
  justify-content: center;
  padding: 1rem 1.1rem;
  border: 1px solid rgb(206 225 230 / 19%);
  background:
    linear-gradient(135deg, rgb(28 43 55 / 90%), rgb(13 22 31 / 94%)),
    var(--night);
  box-shadow: 0 24px 54px rgb(0 0 0 / 34%);
  transition: border-color var(--transition), box-shadow var(--transition), transform var(--transition);
}

.reality-business {
  top: 23%;
  left: 1%;
  border-left: 2px solid rgb(237 121 46 / 75%);
  transform: rotate(-5deg);
}

.reality-technology {
  right: 0;
  bottom: 20%;
  border-right: 2px solid rgb(119 193 203 / 70%);
  text-align: right;
  transform: rotate(4deg);
}

.hero-scene:hover .reality-business {
  border-color: rgb(237 121 46 / 70%);
  box-shadow: 0 24px 54px rgb(0 0 0 / 34%), 0 0 24px rgb(237 121 46 / 10%);
  transform: translate(-3px, -3px) rotate(-3deg);
}

.hero-scene:hover .reality-technology {
  border-color: rgb(119 193 203 / 58%);
  box-shadow: 0 24px 54px rgb(0 0 0 / 34%), 0 0 24px rgb(119 193 203 / 10%);
  transform: translate(3px, 3px) rotate(2deg);
}

.reality-label {
  color: #9eabb3;
  font-size: 0.5rem;
}

.reality-business .reality-label::before,
.reality-technology .reality-label::after {
  display: inline-block;
  width: 5px;
  height: 5px;
  margin-right: 0.5rem;
  border-radius: 50%;
  background: var(--orange);
  box-shadow: 0 0 9px rgb(237 121 46 / 50%);
  content: "";
  vertical-align: 1px;
}

.reality-technology .reality-label::after {
  margin-right: 0;
  margin-left: 0.5rem;
  background: var(--cyan);
  box-shadow: 0 0 9px rgb(119 193 203 / 50%);
}

.reality-title {
  margin-top: 0.38rem;
  color: var(--white);
  font-family: var(--font-display);
  font-size: clamp(1.3rem, 2.6vw, 2.15rem);
  font-weight: 600;
  letter-spacing: -0.06em;
  line-height: 1.15;
}

.reality-detail {
  margin-top: 0.35rem;
  color: #9caab2;
  font-size: 0.65rem;
}

.reality-mark {
  position: absolute;
  top: 0.65rem;
  right: 0.7rem;
  width: 24px;
  height: 24px;
  border-top: 1px solid rgb(220 236 239 / 18%);
  border-right: 1px solid rgb(220 236 239 / 18%);
}

.reality-technology .reality-mark {
  right: auto;
  bottom: 0.65rem;
  left: 0.7rem;
  top: auto;
  border: 0;
  border-bottom: 1px solid rgb(220 236 239 / 18%);
  border-left: 1px solid rgb(220 236 239 / 18%);
}

.transform-link {
  position: absolute;
  z-index: 3;
  top: 47%;
  left: 42%;
  display: flex;
  width: 21%;
  align-items: center;
  justify-content: center;
  filter: drop-shadow(0 0 12px rgb(119 193 203 / 28%));
}

.transform-link-line {
  height: 1px;
  flex: 1;
  background: linear-gradient(90deg, transparent, var(--cyan));
}

.transform-link-line:last-child {
  background: linear-gradient(90deg, var(--orange), transparent);
}

.transform-link-core {
  display: grid;
  width: 34px;
  aspect-ratio: 1;
  flex: 0 0 auto;
  place-items: center;
  border: 1px solid rgb(207 224 227 / 40%);
  border-radius: 50%;
  color: var(--white);
  background: #121d27;
  box-shadow: inset 0 0 16px rgb(119 193 203 / 12%), 0 0 20px rgb(119 193 203 / 16%);
  font: 600 0.72rem var(--font-display);
}

.system-legend {
  position: absolute;
  z-index: 4;
  right: -1%;
  bottom: 3%;
  display: flex;
  min-width: 230px;
  align-items: center;
  gap: 0.7rem;
  padding: 0.75rem;
  animation: float-drift 7s ease-in-out infinite;
}

.legend-signal {
  width: 7px;
  height: 7px;
  flex: 0 0 auto;
  border-radius: 50%;
  background: var(--cyan);
  box-shadow: 0 0 11px rgb(119 193 203 / 68%);
}

.legend-copy {
  display: flex;
  flex-direction: column;
  line-height: 1.45;
}

.legend-copy strong { font-size: 0.66rem; }
.legend-copy small { color: #9aabb5; font-size: 0.57rem; }
.legend-arrow { margin-left: auto; color: var(--orange-bright); }

.scene-index {
  bottom: -1.2rem;
}

/* Product cards stay dark and let their information lead; screenshots are supporting previews. */
.solution-deck {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  align-items: stretch;
  gap: clamp(0.8rem, 2vw, 1.7rem);
}

.solution-card {
  position: relative;
  display: flex;
  height: 100%;
  flex-direction: column;
  min-width: 0;
  overflow: hidden;
  padding: 0;
  border: 1px solid rgb(207 226 231 / 15%);
  border-radius: 12px;
  color: var(--white);
  background:
    radial-gradient(ellipse at 88% 0%, rgb(119 193 203 / 6%), transparent 42%),
    linear-gradient(145deg, #141f2a, #0d151e 72%);
  box-shadow: 0 22px 55px rgb(0 0 0 / 26%), inset 0 0 32px rgb(205 229 234 / 2%);
  transition:
    transform var(--transition),
    border-color var(--transition),
    box-shadow var(--transition),
    background var(--transition);
}

.solution-card::before {
  position: absolute;
  top: 0;
  left: 12%;
  width: 30%;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgb(119 193 203 / 72%), transparent);
  content: "";
  transition: width var(--transition), opacity var(--transition);
}

.solution-card::after {
  position: absolute;
  inset: 0;
  border: 1px solid transparent;
  content: "";
  pointer-events: none;
  transition: border-color var(--transition), box-shadow var(--transition);
}

.solution-card:hover {
  z-index: 2;
  border-color: rgb(119 193 203 / 42%);
  background:
    radial-gradient(ellipse at 88% 0%, rgb(119 193 203 / 10%), transparent 46%),
    linear-gradient(145deg, #182632, #0e1720 72%);
  box-shadow: 0 30px 64px rgb(0 0 0 / 40%), 0 0 25px rgb(119 193 203 / 10%), inset 0 0 32px rgb(205 229 234 / 3%);
  transform: translateY(-6px);
}

.solution-card:hover::before { width: 65%; }
.solution-card:hover::after { border-color: rgb(119 193 203 / 22%); }

.solution-card-sales { margin-top: 0; }
.solution-card-trace { margin-top: 0; }
.solution-card-warehouse { margin-top: 0; }

.solution-card-top {
  display: flex;
  min-height: 26px;
  align-items: flex-start;
  justify-content: space-between;
  padding: 1rem 1rem 0.55rem;
}

.card-index {
  color: #9eabb4;
  font-size: 0.49rem;
}

.card-orbit {
  width: 23px;
  aspect-ratio: 1;
  border: 1px solid rgb(119 193 203 / 32%);
  border-radius: 50%;
  box-shadow: 0 0 13px rgb(119 193 203 / 8%);
}

.solution-card-warehouse .card-orbit {
  border-color: rgb(237 121 46 / 37%);
  box-shadow: 0 0 13px rgb(237 121 46 / 8%);
}

.card-preview {
  display: flex;
  height: 240px;
  flex: 0 0 auto;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  margin: 0;
  border: 0;
  background:
    linear-gradient(110deg, rgb(119 193 203 / 7%), transparent 62%),
    #0a1118;
}

.card-preview::before {
  display: none;
}

.card-preview img {
  width: 90%;
  max-width: none;
  height: 100%;
  object-fit: cover;
  background: transparent;
  transition: transform 550ms var(--ease);
}

.solution-card:hover .card-preview img {
  transform: scale(1.045);
}

.card-preview-trace img,
.card-preview-warehouse img { width: 90%; max-width: none; }

.solution-card-body { position: relative; z-index: 1; display: flex; flex: 1; flex-direction: column; padding: 1rem; }
.card-kicker { margin: 0 0 0.42rem; color: #9eb0b8; font: 0.49rem var(--font-mono); letter-spacing: 0.09em; }
.solution-card-body h3 { margin: 0; color: #f4f5f3; font: 700 clamp(1.38rem, 2vw, 1.85rem)/1.16 var(--font-display); letter-spacing: -0.055em; }
.solution-card-body > p:not(.card-kicker) { min-height: 6.7em; margin: 0.7rem 0 0.95rem; color: #bac5ca; font-size: 0.78rem; line-height: 1.7; }

.capability-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem;
  margin: 0;
  padding: 0;
  list-style: none;
}

.capability-tags li {
  padding: 0.27rem 0.42rem;
  color: #b9c8ce;
  border: 1px solid rgb(202 223 228 / 13%);
  background: rgb(224 240 242 / 3%);
  font-size: 0.56rem;
  line-height: 1.45;
}

.solution-card-warehouse .capability-tags li:last-child {
  border-color: rgb(237 121 46 / 22%);
}

.card-link {
  display: inline-flex;
  align-items: center;
  align-self: flex-start;
  gap: 0.6rem;
  margin-top: auto;
  padding-top: 0.85rem;
  border-top: 1px solid rgb(225 237 242 / 13%);
  color: #f0f3f3;
  font-size: 0.72rem;
  font-weight: 700;
  transition: color var(--transition-fast);
}

.card-link span {
  color: var(--cyan);
  transition: transform var(--transition-fast), color var(--transition-fast);
}

.card-link:hover,
.card-link:hover span { color: var(--orange-bright); }
.card-link:hover span { transform: translate(2px, -2px); }

.product-caption {
  color: #9ba9b0;
  border-color: var(--line-dark);
}

.section-backdrop-word {
  color: rgb(221 235 238 / 2%);
}

.solution-card .card-preview img {
  max-width: none;
}

.solution-card-trace .card-preview img {
  max-width: none;
}

.solution-card-warehouse .card-preview img {
  max-width: none;
}

@media (max-width: 1080px) {
  .hero-scene { min-height: 430px; }

  .reality-panel {
    width: 70%;
    min-height: 125px;
    padding: 0.85rem;
  }

  .system-legend { min-width: 210px; }

  .solution-deck {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1.2rem;
  }

  .solution-card-sales,
  .solution-card-trace,
  .solution-card-warehouse {
    margin-top: 0;
  }

  .solution-card-trace { transform: none; }
  .solution-card-warehouse { grid-column: auto; width: 100%; margin-left: 0; }
  .solution-card-body > p:not(.card-kicker) { min-height: 5.2em; }
}

@media (max-width: 780px) {
  .hero-scene { min-height: 410px; }
  .reality-business { top: 18%; left: 2%; }
  .reality-technology { right: 1%; bottom: 17%; }
  .transform-link { top: 45%; left: 40%; width: 23%; }
  .system-legend { right: 0; bottom: 3%; }

  .solution-deck {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem;
  }

  .solution-card { padding: 0.85rem; }
  .solution-card-trace { transform: none; }
  .solution-card-warehouse { grid-column: auto; width: 100%; margin-left: 0; }
  .card-preview { height: 200px; }
  .solution-card-body h3 { font-size: clamp(1.2rem, 3vw, 1.65rem); }
  .solution-card-body > p:not(.card-kicker) { min-height: 8.3em; font-size: 0.72rem; }
  .capability-tags li { font-size: 0.52rem; }
}

@media (max-width: 520px) {
  .hero-scene { min-height: 340px; }

  .reality-panel {
    width: 72%;
    min-height: 100px;
    padding: 0.7rem;
  }

  .reality-business { top: 19%; left: 0; }
  .reality-technology { right: 0; bottom: 17%; }
  .reality-label { font-size: 0.43rem; }
  .reality-title { font-size: 1.25rem; }
  .reality-detail { font-size: 0.55rem; }
  .transform-link { top: 45%; left: 38%; width: 29%; }
  .transform-link-core { width: 29px; }
  .system-legend { right: -0.1rem; bottom: 1%; min-width: 195px; padding: 0.58rem; }
  .legend-copy strong { font-size: 0.59rem; }
  .legend-copy small { font-size: 0.51rem; }
  .scene-index { bottom: -1rem; font-size: 0.4rem; }

  .solution-deck {
    grid-template-columns: 1fr;
    gap: 1rem;
  }

  .solution-card,
  .solution-card-trace,
  .solution-card-warehouse {
    grid-column: 1;
    width: 100%;
    margin: 0;
    transform: none;
  }

  .solution-card:hover,
  .solution-card-trace:hover,
  .solution-card-warehouse:hover { transform: translateY(-4px); }

  .solution-card {
    display: flex;
    flex-direction: column;
    padding: 0;
  }

  .solution-card-body { display: flex; }

  .solution-card-top {
    min-height: 22px;
    padding: 0.8rem 0.8rem 0.45rem;
  }

  .card-preview {
    height: 180px;
  }

  .card-preview img,
  .card-preview-trace img,
  .card-preview-warehouse img { width: 100%; max-width: none; }
  .card-kicker { font-size: 0.43rem; }
  .solution-card-body h3 { font-size: 1.35rem; }
  .solution-card-body > p:not(.card-kicker) { min-height: 0; margin-top: 0.45rem; font-size: 0.69rem; line-height: 1.55; }
  .capability-tags { gap: 0.32rem; }
  .capability-tags li { padding: 0.23rem 0.35rem; font-size: 0.48rem; }
  .card-link { margin-top: 0.85rem; padding-top: 0.65rem; font-size: 0.67rem; }
}

@media (prefers-reduced-motion: reduce) {
  .system-legend { animation: none; }
}

/* Interior pages extend the homepage's dark editorial system without repeating its layout. */
.nav-link { white-space: nowrap; }
.site-footer { border-top: 1px solid rgb(228 243 246 / 10%); }
.site-footer .footer-base address { max-width: 58ch; }
.site-footer .footer-base address strong { display: block; margin-bottom: 0.18rem; color: #aab6bd; font-size: 0.55rem; font-weight: 600; letter-spacing: 0.08em; text-transform: uppercase; }
.inner-page { overflow: hidden; background: #080d14; }
.page-hero {
  position: relative;
  overflow: hidden;
  isolation: isolate;
  padding-top: 84px;
  background:
    radial-gradient(ellipse at 79% 44%, rgb(35 92 109 / 18%), transparent 38%),
    linear-gradient(112deg, #080d14 3%, #0d1823 58%, #080e15);
}
.page-hero-grid {
  position: absolute;
  z-index: -1;
  inset: 0;
  background-image: linear-gradient(rgb(168 202 215 / 3%) 1px, transparent 1px), linear-gradient(90deg, rgb(168 202 215 / 3%) 1px, transparent 1px);
  background-size: 72px 72px;
  mask-image: linear-gradient(90deg, transparent, #000 38%, #000 90%, transparent);
}
.page-hero-layout,
.product-hero-layout,
.about-hero-layout,
.voices-hero-layout,
.contact-hero-layout {
  position: relative;
  display: grid;
  min-height: 680px;
  grid-template-columns: minmax(0, 1.02fr) minmax(0, 0.98fr);
  align-items: center;
  gap: clamp(2rem, 5vw, 5.5rem);
  padding-block: 5.7rem 4rem;
}
.page-copy { position: relative; z-index: 2; max-width: 710px; }
.page-copy h1 {
  margin: 0;
  color: #f4f5f3;
  font: 600 clamp(3.7rem, 7vw, 7.2rem)/0.98 var(--font-display);
  letter-spacing: -0.078em;
}
.page-copy h1 em,
.page-section h2 em,
.page-cta h2 em,
.vision-layout blockquote em { color: #aab8bf; font-style: normal; }
.page-lede {
  max-width: 550px;
  margin: 1.45rem 0 1.8rem;
  color: #b7c3c9;
  font-size: clamp(0.98rem, 1.35vw, 1.12rem);
  line-height: 1.8;
}
.page-hero-foot {
  display: flex;
  min-height: 57px;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  color: #84949e;
  border-top: 1px solid rgb(219 235 240 / 12%);
  font-size: 0.52rem;
}
.page-section {
  position: relative;
  padding-block: clamp(5rem, 9vw, 8rem);
  background:
    radial-gradient(ellipse at 84% 30%, rgb(24 63 75 / 9%), transparent 37%),
    linear-gradient(128deg, #0b121a, #101923 57%, #0a1118);
}
.section-heading-row {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 3rem;
  margin-bottom: clamp(2.5rem, 5vw, 4.6rem);
}
.section-heading-row h2,
.page-section h2,
.warehouse-interface h2,
.social-layout h2 {
  margin: 0;
  color: #f0f2f0;
  font: 600 clamp(2.7rem, 5.6vw, 5.5rem)/1.01 var(--font-display);
  letter-spacing: -0.075em;
}
.section-heading-row > p {
  max-width: 390px;
  margin: 0 0 0.35rem;
  color: #a6b2b8;
  font-size: 0.91rem;
  line-height: 1.8;
}
.page-section .section-kicker { color: #a6b2b9; }
.page-section p { color: #aebbc2; }
.page-cta {
  position: relative;
  overflow: hidden;
  padding-block: clamp(4.5rem, 8vw, 7.5rem);
  border-top: 1px solid rgb(233 243 246 / 9%);
  background:
    radial-gradient(ellipse at 88% 25%, rgb(77 111 120 / 12%), transparent 37%),
    linear-gradient(115deg, #121c26, #0b131c 65%, #111b24);
}
.page-cta-inner { position: relative; }
.page-cta h2 {
  margin: 0 0 2rem;
  color: #f3f4f1;
  font: 600 clamp(3rem, 7vw, 6.7rem)/0.98 var(--font-display);
  letter-spacing: -0.08em;
}
.page-cta .micro-label { color: #aab6bd; }

.solutions-hero .page-hero-layout { min-height: 700px; }
.solutions-hero h1 { max-width: 740px; }
.solutions-hero h1 em { white-space: nowrap; }
.ops-visual {
  position: relative;
  min-height: 475px;
  overflow: hidden;
  border: 1px solid rgb(190 222 230 / 12%);
  background: radial-gradient(ellipse at 50% 48%, rgb(32 77 89 / 28%), transparent 59%);
}
.ops-ring {
  position: absolute;
  top: 50%;
  left: 50%;
  width: min(79%, 370px);
  aspect-ratio: 1;
  border: 1px solid rgb(132 198 207 / 20%);
  border-radius: 50%;
  transform: translate(-50%, -50%);
}
.ops-ring-inner { width: min(52%, 244px); border-style: dashed; border-color: rgb(237 121 46 / 25%); }
.ops-node { position: absolute; z-index: 2; width: 8px; height: 8px; border: 1px solid #91d2d7; border-radius: 50%; background: #18343b; box-shadow: 0 0 14px rgb(119 193 203 / 70%); }
.node-a { top: 19%; left: 30%; }.node-b { top: 51%; right: 16%; }.node-c { bottom: 17%; left: 37%; border-color: var(--orange); box-shadow: 0 0 14px rgb(237 121 46 / 55%); }
.ops-line { position: absolute; z-index: 1; top: 49%; left: 28%; width: 58%; height: 1px; background: linear-gradient(90deg, transparent, rgb(119 193 203 / 53%), transparent); transform: rotate(-32deg); }
.ops-line-b { top: 53%; left: 23%; width: 64%; background: linear-gradient(90deg, transparent, rgb(237 121 46 / 38%), transparent); transform: rotate(28deg); }
.ops-readout { position: absolute; z-index: 3; display: flex; min-width: 165px; flex-direction: column; padding: 0.78rem; border: 1px solid rgb(207 229 233 / 16%); background: linear-gradient(145deg, #17232d, #0b131c); box-shadow: 0 18px 38px rgb(0 0 0 / 32%); }
.ops-readout small,.ops-readout > span { color: #8fa0a8; font: 0.47rem var(--font-mono); letter-spacing: 0.08em; }
.ops-readout strong { margin: 0.15rem 0; color: #f4f5f2; font: 600 1.25rem var(--font-display); letter-spacing: -0.05em; }
.readout-a { top: 17%; left: 3%; transform: rotate(-4deg); }.readout-b { top: 43%; right: 3%; transform: rotate(3deg); }.readout-c { bottom: 9%; left: 11%; transform: rotate(-2deg); }
.ops-core { position: absolute; z-index: 4; top: 50%; left: 50%; display: grid; width: 45px; aspect-ratio: 1; place-items: center; border: 1px solid rgb(237 121 46 / 45%); border-radius: 50%; color: #f6f3ee; background: #131e27; box-shadow: 0 0 27px rgb(237 121 46 / 18%); font: 600 1rem var(--font-display); transform: translate(-50%, -50%); }
.page-hero-foot { position: relative; }
.solution-range { background: linear-gradient(120deg, #0b1219, #111b24 58%, #0a1118); }
.overview-stack { position: relative; display: grid; gap: 1.25rem; }
.overview-product {
  position: relative;
  display: grid;
  min-height: 300px;
  grid-template-columns: 70px minmax(0, 1fr) minmax(220px, 0.62fr);
  align-items: center;
  gap: clamp(1.2rem, 3vw, 3.2rem);
  padding: clamp(1.1rem, 3vw, 2.4rem);
  border: 1px solid rgb(218 237 241 / 12%);
  background: linear-gradient(113deg, #131e28, #0c141d 78%);
  transition: border-color var(--transition), box-shadow var(--transition), transform var(--transition);
}
.overview-product:hover { border-color: rgb(119 193 203 / 37%); box-shadow: 0 22px 50px rgb(0 0 0 / 28%), 0 0 24px rgb(119 193 203 / 7%); transform: translateY(-4px); }
.overview-no { align-self: start; padding-top: 0.65rem; color: #98a8af; font-size: 0.53rem; writing-mode: vertical-rl; }
.overview-copy .section-kicker { margin-bottom: 0.8rem; font-size: 0.5rem; }
.overview-copy h3 { margin: 0; color: #f3f4f2; font: 600 clamp(1.9rem, 3.8vw, 3.5rem)/1.05 var(--font-display); letter-spacing: -0.07em; }
.overview-copy > p:not(.section-kicker) { max-width: 520px; margin: 0.7rem 0 1rem; color: #aebbc2; font-size: 0.83rem; }
.overview-copy .capability-tags { display: flex; flex-wrap: wrap; gap: 0.4rem; }
.overview-copy .arrow-link { margin-top: 1.15rem; }
.overview-preview { position: relative; display: flex; min-width: 0; height: 165px; align-items: center; justify-content: center; overflow: hidden; border: 1px solid rgb(205 227 232 / 15%); background: radial-gradient(ellipse at center, rgb(66 119 131 / 12%), transparent 68%), #0a1118; }
.overview-preview::before { position: absolute; inset: 8px; border: 1px solid rgb(255 255 255 / 4%); content: ""; }
.overview-preview img { width: 76%; height: 112px; object-fit: contain; background: #e6e8e5; box-shadow: 0 10px 28px rgb(0 0 0 / 32%); transition: transform var(--transition); }
.overview-product:hover .overview-preview img { transform: scale(1.035); }
.overview-preview .mono { position: absolute; right: 0.55rem; bottom: 0.45rem; left: 0.55rem; overflow: hidden; color: #8c9ca4; font-size: 0.41rem; white-space: nowrap; }
.overview-trace { margin-left: 5.5%; }.overview-warehouse { margin-right: 3%; }
.connective-section { padding-block: clamp(5rem, 8vw, 8rem); border-block: 1px solid rgb(230 242 245 / 8%); background: #0a1118; }
.connective-layout { display: grid; grid-template-columns: 0.85fr 1.15fr; align-items: center; gap: clamp(3rem, 8vw, 8rem); }
.connective-layout > div:first-child > p:last-child { max-width: 400px; margin-top: 1.4rem; color: #aeb9bf; }
.flow-system { position: relative; display: grid; gap: 0; padding-left: 38px; }
.flow-axis { position: absolute; top: 20px; bottom: 25px; left: 13px; width: 1px; background: linear-gradient(var(--orange), var(--cyan) 62%, transparent); box-shadow: 0 0 12px rgb(119 193 203 / 24%); }
.flow-step { position: relative; display: grid; min-height: 79px; grid-template-columns: 58px 1fr; align-content: center; align-items: baseline; border-bottom: 1px solid rgb(226 240 244 / 10%); }
.flow-step::before { position: absolute; top: 50%; left: -30px; width: 9px; height: 9px; border: 1px solid var(--cyan); border-radius: 50%; background: #10212b; box-shadow: 0 0 12px rgb(119 193 203 / 35%); content: ""; transform: translateY(-50%); }
.flow-step b { grid-row: span 2; color: var(--orange-bright); font: 0.52rem var(--font-mono); }.flow-step span { color: #f1f3f1; font: 600 1.25rem var(--font-display); letter-spacing: -0.04em; }.flow-step small { grid-column: 2; color: #8e9da5; font-size: 0.7rem; }

.product-hero-layout { min-height: 700px; grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr); }
.product-hero .page-copy h1 { font-size: clamp(3.5rem, 5.5vw, 5rem); }
.route-visual,.trace-visual,.warehouse-visual { position: relative; min-width: 0; min-height: 450px; border: 1px solid rgb(203 228 234 / 14%); background: radial-gradient(ellipse at 53% 49%, rgb(32 78 91 / 24%), transparent 59%), #0b141d; box-shadow: 0 25px 70px rgb(0 0 0 / 25%); }
.route-map { position: absolute; inset: 0; overflow: hidden; background-image: linear-gradient(rgb(184 214 222 / 3%) 1px, transparent 1px), linear-gradient(90deg, rgb(184 214 222 / 3%) 1px, transparent 1px); background-size: 36px 36px; }
.route-grid { position: absolute; inset: 0; background: radial-gradient(ellipse at center, transparent 15%, #0b141d 82%); }
.route-map svg { position: absolute; inset: 9% 5% 14%; width: 90%; height: 77%; overflow: visible; }
.route-map path { fill: none; stroke: #76c2c9; stroke-width: 2; stroke-dasharray: 7 8; filter: drop-shadow(0 0 5px rgb(119 193 203 / 62%)); animation: route-flow 16s linear infinite; }
.route-map path.route-secondary { stroke: #dc8a51; stroke-width: 1.3; stroke-dasharray: 3 10; opacity: 0.8; animation-direction: reverse; }
@keyframes route-flow { to { stroke-dashoffset: -240; } }
.route-stop { position: absolute; z-index: 2; width: 12px; height: 12px; border: 2px solid #91d5da; border-radius: 50%; background: #132c34; box-shadow: 0 0 15px rgb(119 193 203 / 65%); }
.stop-one { left: 12%; bottom: 22%; }.stop-two { left: 38%; top: 42%; }.stop-three { right: 40%; bottom: 34%; border-color: var(--orange); }.stop-four { top: 20%; right: 13%; }
.route-label { position: absolute; color: #8499a2; font-size: 0.44rem; }.label-north { top: 12%; left: 10%; }.label-south { right: 12%; bottom: 24%; }
.route-status { position: absolute; right: 5%; bottom: 6%; display: flex; min-width: min(78%, 290px); align-items: center; gap: 0.65rem; padding: 0.72rem; border: 1px solid rgb(216 235 239 / 17%); background: #101b24; box-shadow: 0 12px 30px #05090d; }
.route-status > i,.trace-header i { width: 7px; height: 7px; flex: 0 0 auto; border-radius: 50%; background: #72c78e; box-shadow: 0 0 10px rgb(114 199 142 / 60%); }
.route-status span:nth-child(2) { display: flex; flex-direction: column; }.route-status b { color: #eff1ed; font-size: 0.68rem; }.route-status small { color: #95a4ab; font-size: 0.54rem; }.route-status .mono { margin-left: auto; color: #9eb4b9; font-size: 0.42rem; }
.mini-product { position: absolute; top: -19px; right: -15px; display: flex; width: 158px; flex-direction: column; gap: 0.35rem; padding: 0.42rem; border: 1px solid rgb(119 193 203 / 30%); background: #101b24; box-shadow: 0 18px 38px rgb(0 0 0 / 44%); transform: rotate(3deg); }
.mini-product .mono { color: #9cabb1; font-size: 0.4rem; }.mini-product img { width: 100%; height: 100%; object-fit: contain; background: #e6e8e5; }
.editorial-split { display: grid; grid-template-columns: 1fr 0.85fr; gap: clamp(2rem, 8vw, 8rem); align-items: start; }
.editorial-split h2 { max-width: 690px; }.editorial-prose { max-width: 590px; padding-top: 2.6rem; }.editorial-prose p { margin: 0 0 1.2rem; font-size: 0.95rem; line-height: 1.9; }
.accelerator-ribbon { display: flex; flex-wrap: wrap; gap: 0.5rem; margin-top: 3.6rem; padding-top: 1.2rem; border-top: 1px solid rgb(230 240 244 / 12%); }
.accelerator-ribbon span { padding: 0.48rem 0.62rem; color: #bdc8ce; border: 1px solid rgb(218 235 239 / 13%); background: #111b24; font-size: 0.68rem; }
.customer-operations { background: linear-gradient(110deg, #0a1118, #111b25 63%, #0a1118); }
.customer-layout { display: grid; grid-template-columns: 0.8fr 1.2fr; align-items: center; gap: clamp(2rem, 7vw, 7rem); }.customer-copy > p:last-child { max-width: 480px; margin-top: 1.25rem; line-height: 1.85; }
.signal-board { border-top: 1px solid rgb(220 237 241 / 18%); }.signal-row { display: grid; min-height: 73px; grid-template-columns: 1fr 1.25fr 12px; align-items: center; gap: 1rem; border-bottom: 1px solid rgb(220 237 241 / 12%); }.signal-row span { color: #8598a0; font-size: 0.47rem; }.signal-row strong { color: #e5e9e8; font-size: 0.81rem; font-weight: 500; }.signal-row i { width: 7px; height: 7px; border-radius: 50%; background: var(--cyan); box-shadow: 0 0 10px rgb(119 193 203 / 50%); }
.capability-ledger,.warehouse-ledger { border-top: 1px solid rgb(225 239 243 / 18%); }.capability-ledger > div,.warehouse-ledger > div { display: grid; min-height: 77px; grid-template-columns: 65px 1fr minmax(140px, 0.75fr); align-items: center; gap: 1.1rem; border-bottom: 1px solid rgb(225 239 243 / 12%); }.capability-ledger > div > span,.warehouse-ledger > div > span { color: var(--orange-bright); font: 0.55rem var(--font-mono); }.capability-ledger strong,.warehouse-ledger strong { color: #e9ece9; font-size: 0.93rem; font-weight: 600; }.capability-ledger small,.warehouse-ledger small { color: #96a5ac; font-size: 0.72rem; }
.claim-band { padding-block: clamp(3.5rem, 7vw, 6rem); border-block: 1px solid rgb(229 239 242 / 9%); background: linear-gradient(100deg, #111b24, #0b131b); }.claim-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; }.claim-grid article { position: relative; min-height: 218px; padding: 1.6rem; border-left: 1px solid rgb(119 193 203 / 42%); background: linear-gradient(130deg, rgb(119 193 203 / 5%), transparent 70%); }.claim-grid article:nth-child(2) { border-color: rgb(237 121 46 / 52%); background: linear-gradient(130deg, rgb(237 121 46 / 5%), transparent 70%); }.claim-grid .mono { color: #9eabb1; font-size: 0.55rem; }.claim-grid strong { display: block; margin-top: 0.5rem; color: #f4f4f1; font: 600 clamp(3rem, 6vw, 5.5rem)/1 var(--font-display); letter-spacing: -0.08em; }.claim-grid p { max-width: 420px; margin: 0.75rem 0 0; color: #aab6bc; font-size: 0.78rem; }

.trace-visual { min-height: 448px; padding: 1.4rem; background: radial-gradient(ellipse at 50% 48%, rgb(32 78 91 / 19%), transparent 58%), #0b141d; }
.trace-header,.trace-foot { display: flex; justify-content: space-between; gap: 1rem; color: #91a2a9; font: 0.48rem var(--font-mono); letter-spacing: 0.075em; }.trace-header span:last-child { display: flex; align-items: center; gap: 0.4rem; }.trace-path { position: relative; display: grid; grid-template-columns: 1fr 1fr; gap: 1rem 0.7rem; margin: 2rem auto; }.trace-pathline { position: absolute; inset: 17px 14px; z-index: 0; background: linear-gradient(160deg, rgb(119 193 203 / 60%), rgb(237 121 46 / 52%) 51%, rgb(119 193 203 / 12%)); clip-path: polygon(0 2%, 100% 2%, 100% 9%, 4% 9%, 4% 40%, 100% 40%, 100% 47%, 4% 47%, 4% 75%, 100% 75%, 100% 82%, 4% 82%, 4% 100%, 0 100%); opacity: 0.6; }.trace-node { position: relative; z-index: 1; display: grid; min-height: 67px; grid-template-columns: 35px 1fr; align-items: center; gap: 0.35rem; padding: 0.5rem; border: 1px solid rgb(217 237 241 / 12%); background: #101b25; }.trace-node:nth-of-type(even) { transform: translateX(9px); }.trace-node b { display: grid; width: 27px; aspect-ratio: 1; place-items: center; border: 1px solid rgb(119 193 203 / 38%); border-radius: 50%; color: #b4d5d7; font: 0.46rem var(--font-mono); }.trace-node span { color: #e2e7e5; font-size: 0.69rem; }.trace-node.active { border-color: rgb(119 193 203 / 24%); box-shadow: inset 0 0 20px rgb(119 193 203 / 4%); }.trace-node.active b { border-color: var(--cyan); color: #e8f3f2; box-shadow: 0 0 12px rgb(119 193 203 / 27%); }.trace-foot { padding-top: 0.9rem; border-top: 1px solid rgb(225 239 243 / 10%); font-size: 0.43rem; }
.trace-domains { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 0.5rem; margin-top: 3rem; }.trace-domains span { color: #d1d9d9; font: 0.56rem var(--font-mono); letter-spacing: 0.08em; }.trace-domains span::before { display: inline-block; width: 6px; height: 6px; margin-right: 0.5rem; border-radius: 50%; background: var(--cyan); box-shadow: 0 0 8px rgb(119 193 203 / 38%); content: ""; }
.trace-accelerator-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 1px; background: rgb(219 235 239 / 12%); }.trace-accelerator-grid article { min-height: 190px; padding: clamp(1.2rem, 3vw, 2.1rem); background: #0d161f; }.trace-accelerator-grid article:nth-child(2),.trace-accelerator-grid article:nth-child(3) { background: #101b25; }.trace-accelerator-grid article > span { color: #9bacb2; font: 0.49rem var(--font-mono); }.trace-accelerator-grid h3 { max-width: 420px; margin: 1.1rem 0 0.5rem; color: #edf0ed; font: 600 1.32rem/1.25 var(--font-display); letter-spacing: -0.045em; }.trace-accelerator-grid p { margin: 0; color: #9daab1; font-size: 0.76rem; }.trace-elements { background: #0b1219; }.trace-elements > .shell > h2 { margin: 0 0 2.8rem; }.trace-elements-layout { display: grid; grid-template-columns: 1.2fr 0.8fr; gap: clamp(2rem, 7vw, 7rem); }.trace-elements-layout h3 { color: #edf0ee; font: 600 1.2rem var(--font-display); }.element-list { display: grid; grid-template-columns: 1fr 1fr; gap: 0; padding: 0; margin: 0; list-style: none; border-top: 1px solid rgb(224 240 243 / 16%); }.element-list li { padding: 0.8rem 0.35rem; color: #c4ced1; border-bottom: 1px solid rgb(224 240 243 / 10%); font-size: 0.76rem; }.element-list li::before { margin-right: 0.55rem; color: var(--orange-bright); content: "↗"; }.trace-elements-layout aside { padding: 1.3rem; border: 1px solid rgb(216 234 239 / 13%); background: #111b25; }.trace-elements-layout aside p { line-height: 1.8; }.trace-elements-layout aside img { width: 100%; height: 138px; margin-top: 1.1rem; object-fit: contain; background: #e6e8e5; }.trace-elements-layout aside .mono { color: #8fa0a7; font-size: 0.45rem; }

.warehouse-visual { min-height: 445px; padding: 1rem; }.warehouse-top,.warehouse-bottom { display: flex; justify-content: space-between; gap: 0.5rem; color: #92a2a9; font-size: 0.44rem; }.warehouse-floor { position: relative; min-height: 345px; margin-block: 0.8rem; overflow: hidden; border: 1px solid rgb(217 236 240 / 10%); background-image: linear-gradient(rgb(184 214 222 / 3%) 1px, transparent 1px), linear-gradient(90deg, rgb(184 214 222 / 3%) 1px, transparent 1px); background-size: 28px 28px; }.warehouse-zone { position: absolute; top: 14%; bottom: 19%; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 0.75rem; border: 1px solid rgb(119 193 203 / 22%); background: linear-gradient(135deg, rgb(25 43 52 / 82%), rgb(10 17 24 / 90%)); }.warehouse-zone > span { color: #9cafb4; font: 0.43rem var(--font-mono); }.inbound-zone { left: 3%; width: 20%; }.storage-zone { left: 26%; width: 34%; border-color: rgb(119 193 203 / 32%); }.pick-zone { right: 17%; width: 16%; border-color: rgb(237 121 46 / 28%); }.dispatch-zone { right: 2%; width: 13%; }.pallet { width: 57%; height: 30px; border: 1px solid rgb(237 121 46 / 42%); background: repeating-linear-gradient(90deg, rgb(237 121 46 / 16%) 0 8px, transparent 8px 12px); box-shadow: 0 5px 9px rgb(0 0 0 / 34%); }.rack { display: grid; width: 85%; height: 47px; grid-template-columns: repeat(3, 1fr); align-items: end; gap: 4px; padding: 4px; border: 1px solid rgb(183 213 219 / 32%); border-bottom-width: 3px; }.rack i { height: 70%; border: 1px solid rgb(119 193 203 / 35%); background: linear-gradient(135deg, rgb(119 193 203 / 21%), rgb(119 193 203 / 4%)); }.rack:nth-of-type(2) i:nth-child(2) { background: linear-gradient(135deg, rgb(237 121 46 / 30%), rgb(237 121 46 / 5%)); }.pick-order { display: grid; width: 75%; gap: 0.3rem; padding: 0.45rem; border: 1px solid rgb(237 121 46 / 30%); background: #0b131b; }.pick-order b { color: #cfb59c; font: 0.39rem var(--font-mono); }.pick-order i { height: 3px; background: rgb(215 222 222 / 23%); }.dispatch-gate { display: flex; align-items: center; gap: 3px; }.dispatch-gate i { width: 14px; height: 32px; border: 1px solid rgb(119 193 203 / 35%); background: rgb(119 193 203 / 7%); }.move-arrow { position: absolute; top: 48%; z-index: 2; color: var(--cyan); font-size: 1.2rem; text-shadow: 0 0 12px rgb(119 193 203 / 56%); }.move-one { left: 21%; }.move-two { left: 58%; color: var(--orange-bright); }.move-three { right: 13%; }.handheld-readout { position: absolute; right: 2%; bottom: 2%; display: flex; align-items: center; gap: 0.55rem; padding: 0.55rem; border: 1px solid rgb(220 238 241 / 15%); background: #0b141c; box-shadow: 0 9px 20px #070c11; }.handheld-readout > span:last-child { display: flex; flex-direction: column; }.handheld-readout b { color: #e2e7e5; font: 0.42rem var(--font-mono); }.handheld-readout small { color: #8fa0a6; font-size: 0.48rem; }.handheld-signal { width: 7px; height: 7px; border-radius: 50%; background: #8bd39b; box-shadow: 0 0 9px #4b9b66; }
.warehouse-principles { display: flex; flex-wrap: wrap; gap: 0.5rem; margin-top: 3.3rem; }.warehouse-principles span { padding: 0.55rem 0.7rem; border-left: 1px solid rgb(119 193 203 / 42%); color: #c2cccf; background: #111b24; font-size: 0.68rem; }.warehouse-ledger > div { grid-template-columns: 55px 1fr minmax(200px, 0.85fr); }.warehouse-interface { padding-block: 5rem; border-top: 1px solid rgb(223 239 242 / 9%); background: #0a1118; }.warehouse-interface-layout { display: grid; grid-template-columns: 0.8fr 1.2fr; align-items: center; gap: 3rem; }.warehouse-interface-layout > div > p:last-child { max-width: 380px; color: #9eacb2; }.warehouse-interface figure { margin: 0; padding: 0.8rem; border: 1px solid rgb(221 240 244 / 15%); background: #111b24; }.warehouse-interface img { width: 100%; height: 250px; object-fit: contain; background: #e6e8e5; }.warehouse-interface figcaption { padding-top: 0.6rem; color: #9aa8ae; font-size: 0.45rem; }

.about-hero-layout { min-height: 670px; }.about-hero .page-copy h1 { max-width: 780px; }.about-motif { position: relative; display: flex; min-height: 410px; flex-direction: column; align-items: center; justify-content: center; overflow: hidden; border: 1px solid rgb(216 234 238 / 12%); background: radial-gradient(ellipse at center, rgb(39 84 96 / 22%), transparent 56%); }.about-motif-word { color: rgb(225 241 243 / 4%); font: 800 clamp(5rem, 12vw, 11rem)/0.8 var(--font-display); letter-spacing: -0.12em; }.about-motif > i { position: absolute; width: 58%; aspect-ratio: 1; border: 1px solid rgb(119 193 203 / 23%); border-radius: 50%; box-shadow: 0 0 44px rgb(119 193 203 / 5%); }.about-motif > b { position: absolute; display: grid; width: 116px; aspect-ratio: 1; place-content: center; border: 1px solid rgb(237 121 46 / 35%); color: #e8edeb; background: #111b24; box-shadow: 0 0 27px rgb(237 121 46 / 10%); font: 0.57rem/1.8 var(--font-mono); text-align: center; }.about-motif > .mono { position: absolute; right: 1rem; bottom: 1rem; color: #93a2a8; font-size: 0.45rem; }
.about-story { background: linear-gradient(110deg, #0b1219, #111b25 62%, #0a1118); }.vision-section { padding-block: clamp(4.5rem, 8vw, 7.5rem); background: #0a1118; }.vision-layout { position: relative; display: grid; grid-template-columns: 1fr minmax(225px, 0.44fr); align-items: center; gap: 1rem 4rem; }.vision-layout > .section-kicker { grid-column: 1 / -1; }.vision-layout blockquote { max-width: 910px; margin: 0; color: #f0f2ef; font: 600 clamp(2.7rem, 6vw, 6rem)/1.05 var(--font-display); letter-spacing: -0.075em; }.about-experience { position: relative; min-height: 220px; padding: 1.3rem; overflow: hidden; border: 1px solid rgb(216 235 239 / 14%); background: linear-gradient(145deg, #15212a, #0d151d); }.about-experience .experience-figure { display: block; color: #f4f4f1; font: 700 clamp(4rem, 7vw, 6rem)/0.95 var(--font-display); letter-spacing: -0.1em; }.about-experience .experience-figure span { color: var(--orange-bright); }.about-experience .experience-label,.about-experience .experience-support { position: relative; z-index: 1; display: block; margin-top: 0.7rem; color: #9eacb2; font-size: 0.53rem; }.about-experience .experience-support { font: 0.68rem/1.5 var(--font-body); }.about-experience .experience-loop { position: absolute; right: -10%; bottom: -35%; width: 75%; aspect-ratio: 1; border: 1px solid rgb(119 193 203 / 13%); border-radius: 50%; }.about-experience .loop-two { right: -2%; bottom: -43%; width: 58%; border-color: rgb(237 121 46 / 14%); }
.leadership-section { background: linear-gradient(115deg, #0b1219, #111a24 60%, #0a1118); }.leadership-editorial { display: grid; grid-template-columns: 0.8fr 1.2fr; gap: 1.1rem; }.leader { position: relative; display: flex; min-height: 142px; align-items: center; gap: 1rem; overflow: hidden; padding: 1.1rem; border: 1px solid rgb(215 235 239 / 13%); background: linear-gradient(125deg, #15212b, #0c141c); transition: border-color var(--transition), transform var(--transition), box-shadow var(--transition); }.leader:hover { z-index: 1; border-color: rgb(119 193 203 / 43%); box-shadow: 0 12px 33px rgb(0 0 0 / 32%), 0 0 18px rgb(119 193 203 / 8%); transform: translateY(-3px); }.leader-feature { min-height: 440px; flex-direction: column; align-items: stretch; justify-content: space-between; padding: 1.5rem; background: radial-gradient(ellipse at 74% 28%, rgb(119 193 203 / 10%), transparent 38%), linear-gradient(145deg, #17232d, #0c141c); }.leader-mark { display: grid; width: 57px; aspect-ratio: 1; flex: 0 0 auto; place-items: center; border: 1px solid rgb(237 121 46 / 37%); color: #f0f2ef; background: linear-gradient(145deg, #1c2b34, #101820); box-shadow: 0 0 25px rgb(237 121 46 / 8%); font: 600 1.45rem var(--font-display); }.leader-feature .leader-mark { width: clamp(110px, 15vw, 190px); font-size: clamp(3rem, 8vw, 6.5rem); }.leader .mono { color: #95a5ab; font-size: 0.48rem; }.leader h3 { margin: 0.25rem 0 0; color: #f1f3ef; font: 600 clamp(1.3rem, 2vw, 1.9rem)/1.18 var(--font-display); letter-spacing: -0.05em; }.leader p { margin: 0.35rem 0 0; color: #a5b1b6; font-size: 0.78rem; }.leader-support { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; }.leader-support .leader:nth-child(2),.leader-support .leader:nth-child(3) { transform: translateY(1rem); }.leader-support .leader:nth-child(2):hover,.leader-support .leader:nth-child(3):hover { transform: translateY(calc(1rem - 3px)); }.leadership-note { margin: 1.3rem 0 0; color: #829199 !important; font-size: 0.7rem; }

.voices-hero-layout { min-height: 610px; }.voices-hero .page-copy h1 { font-size: clamp(4.2rem, 8vw, 8rem); }.voices-hero-mark { position: relative; display: flex; min-height: 340px; align-items: center; justify-content: center; border-bottom: 1px solid rgb(222 239 242 / 14%); }.voices-hero-mark > span { color: #d8e2e2; font: 500 clamp(14rem, 28vw, 25rem)/0.8 Georgia,serif; opacity: 0.9; }.voices-hero-mark > i { position: absolute; right: 13%; bottom: 25%; width: 62%; height: 1px; background: linear-gradient(90deg, transparent, var(--orange), var(--cyan), transparent); box-shadow: 0 0 14px rgb(119 193 203 / 28%); transform: rotate(-24deg); }.voices-hero-mark .mono { position: absolute; right: 0; bottom: 0.7rem; color: #8c9da4; font-size: 0.47rem; }.testimonial-section { padding-block: clamp(4.5rem, 8vw, 7.5rem); }.testimonial-editorial { display: grid; grid-template-columns: 0.33fr 1fr 0.28fr; gap: 2rem; align-items: start; }.testimonial-index { padding-top: 1rem; color: #9baab0; font-size: 0.48rem; writing-mode: vertical-rl; }.testimonial-feature { position: relative; margin: 0; padding: clamp(1.5rem, 4vw, 3.2rem) 0; border-top: 1px solid rgb(119 193 203 / 48%); border-bottom: 1px solid rgb(222 238 241 / 12%); }.testimonial-quote-mark { position: absolute; top: -0.35em; left: -0.08em; color: rgb(237 121 46 / 75%); font: 9rem/1 Georgia,serif; opacity: 0.23; }.testimonial-feature blockquote,.optlog-layout figure blockquote { position: relative; margin: 0; color: #e1e7e5; font: 400 clamp(1.2rem, 2.15vw, 2rem)/1.65 var(--font-display); letter-spacing: -0.025em; }.testimonial-feature figcaption,.optlog-layout figcaption { display: flex; flex-direction: column; gap: 0.2rem; margin-top: 2rem; }.testimonial-feature figcaption strong,.optlog-layout figcaption strong { color: #f2f3f0; font-size: 0.85rem; }.testimonial-feature figcaption span,.optlog-layout figcaption span { color: #9ba9af; font-size: 0.72rem; }.testimonial-side { display: flex; flex-direction: column; gap: 0.6rem; padding-top: 1rem; color: #9babb1; font-size: 0.47rem; line-height: 1.7; }.testimonial-side span { color: #c2cbce; }.testimonial-side i { width: 42px; height: 1px; margin-block: 0.6rem; background: var(--cyan); }.optlog-section { background: #0a1118; }.optlog-layout { display: grid; grid-template-columns: 0.7fr 1.3fr; gap: 4rem; align-items: start; }.optlog-layout figure { position: relative; margin: 0; padding: 2rem 0 1.5rem 2rem; border-left: 1px solid rgb(237 121 46 / 45%); }.optlog-layout figure .testimonial-quote-mark { left: 0; }.optlog-layout figure blockquote { font-size: clamp(1.12rem, 1.75vw, 1.55rem); }

.contact-hero-layout { min-height: 600px; }.contact-hero .page-copy h1 { font-size: clamp(4.2rem, 8vw, 8rem); }.contact-coordinate { position: relative; display: flex; min-height: 360px; flex-direction: column; align-items: center; justify-content: center; overflow: hidden; border: 1px solid rgb(218 236 240 / 13%); background: radial-gradient(ellipse at center, rgb(119 193 203 / 10%), transparent 55%); }.coordinate-ring { position: absolute; width: 70%; aspect-ratio: 1; border: 1px solid rgb(119 193 203 / 19%); border-radius: 50%; }.coordinate-ring::before,.coordinate-ring::after { position: absolute; inset: 14%; border: 1px dashed rgb(237 121 46 / 19%); border-radius: 50%; content: ""; }.coordinate-ring::after { inset: 30%; border-style: solid; border-color: rgb(119 193 203 / 14%); }.coordinate-pin { position: relative; z-index: 1; display: grid; width: 58px; aspect-ratio: 1; place-items: center; border: 1px solid rgb(237 121 46 / 48%); border-radius: 50% 50% 50% 0; color: #f2f2ee; background: #17232c; box-shadow: 0 0 25px rgb(237 121 46 / 18%); font: 600 1rem var(--font-display); transform: rotate(-45deg); }.coordinate-pin::first-letter { transform: rotate(45deg); }.coordinate-label { z-index: 1; margin-top: 1rem; color: #dae0de; font-size: 0.55rem; line-height: 1.8; text-align: center; }.contact-coordinate small { position: absolute; bottom: 0.8rem; color: #839198; font-size: 0.54rem; }
.contact-pathways { background: linear-gradient(110deg, #0b1219, #111b25 62%, #0a1118); }.pathway-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 1.2rem; }.pathway { position: relative; display: flex; min-height: 355px; flex-direction: column; align-items: flex-start; padding: clamp(1.3rem, 3vw, 2.3rem); border: 1px solid rgb(221 239 242 / 13%); background: linear-gradient(140deg, #15212b, #0c141c); }.pathway::before { position: absolute; top: 0; left: 0; width: 34%; height: 1px; background: var(--cyan); box-shadow: 0 0 13px rgb(119 193 203 / 36%); content: ""; }.pathway-careers::before { background: var(--orange); box-shadow: 0 0 13px rgb(237 121 46 / 32%); }.pathway > span { color: #94a4aa; font: 0.5rem var(--font-mono); }.pathway h3 { margin: 1.3rem 0 0; color: #f0f2ef; font: 600 clamp(1.8rem, 3vw, 2.5rem)/1.1 var(--font-display); letter-spacing: -0.06em; }.pathway p { max-width: 440px; min-height: 3.5em; margin: 0.7rem 0 1.15rem; font-size: 0.81rem; }.pathway > a:not(.button) { margin-top: 0.3rem; color: #d8e0df; font-size: 0.78rem; }.pathway .button { margin-top: auto; }.button-outline { color: #f2f3ef; border-color: rgb(119 193 203 / 38%); background: rgb(119 193 203 / 5%); }.button-outline:hover { border-color: var(--cyan); box-shadow: var(--glow-cyan); }
.find-us { background: #0a1118; }.find-layout { display: grid; grid-template-columns: 0.72fr 1.28fr; gap: clamp(2rem, 7vw, 7rem); align-items: center; }.find-layout address { color: #ced6d6; font-size: 0.94rem; font-style: normal; line-height: 1.9; }.find-layout > div:first-child > p:not(.section-kicker) { margin: 1rem 0 0.1rem; color: #f1f2ef; font-weight: 600; }.location-panel { position: relative; min-height: 390px; overflow: hidden; border: 1px solid rgb(210 232 237 / 15%); background: radial-gradient(ellipse at 58% 42%, rgb(41 89 100 / 22%), transparent 54%), #0d161e; }.location-grid { position: absolute; inset: -15%; opacity: 0.7; background: repeating-linear-gradient(30deg, transparent 0 31px, rgb(203 226 231 / 8%) 32px 33px, transparent 34px 74px), repeating-linear-gradient(146deg, transparent 0 44px, rgb(203 226 231 / 7%) 45px 46px, transparent 47px 88px); transform: rotate(-8deg) scale(1.12); }.location-cross { position: absolute; width: 20px; height: 20px; border: 1px solid rgb(176 208 214 / 36%); border-radius: 50%; }.location-cross::before,.location-cross::after { position: absolute; top: 50%; left: 50%; width: 35px; height: 1px; background: rgb(176 208 214 / 22%); content: ""; transform: translate(-50%,-50%); }.location-cross::after { transform: translate(-50%,-50%) rotate(90deg); }.cross-one { top: 19%; left: 25%; }.cross-two { top: 31%; right: 19%; }.cross-three { bottom: 25%; left: 38%; }.location-route { position: absolute; top: 32%; left: 26%; width: 51%; height: 40%; border: 1px dashed rgb(119 193 203 / 64%); border-right-color: transparent; border-bottom-color: rgb(237 121 46 / 65%); border-radius: 50%; filter: drop-shadow(0 0 5px rgb(119 193 203 / 30%)); transform: rotate(-21deg); }.location-marker { position: absolute; top: 37%; left: 54%; display: grid; width: 42px; aspect-ratio: 1; place-items: center; border: 1px solid rgb(237 121 46 / 54%); border-radius: 50% 50% 50% 0; color: #fff; background: #18242d; box-shadow: 0 0 22px rgb(237 121 46 / 22%); font: normal 0.75rem var(--font-display); transform: rotate(-45deg); }.location-marker b { transform: rotate(45deg); }.location-label { position: absolute; top: 18%; right: 7%; color: #d0dada; font-size: 0.47rem; }.location-caption { position: absolute; bottom: 2.2rem; left: 1.2rem; display: flex; flex-direction: column; padding: 0.9rem 1.1rem; border-left: 1px solid var(--cyan); background: rgb(8 14 20 / 86%); }.location-caption strong { color: #edf0ee; font-size: 0.78rem; }.location-caption span,.location-caption small { color: #a2afb4; font-size: 0.65rem; }.location-note { position: absolute; right: 0.8rem; bottom: 0.8rem; color: #7f8e95; font-size: 0.4rem; }.contact-social { padding-block: 4rem; background: linear-gradient(110deg, #0b1219, #101923); }.social-layout { display: grid; grid-template-columns: 0.55fr 0.8fr 1.65fr; align-items: center; gap: 1rem; }.social-layout .section-kicker { margin: 0; }.social-layout h2 { font-size: clamp(1.8rem, 3vw, 2.7rem); }.social-links { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 0.5rem; }.social-links a { padding: 0.55rem 0.7rem; border: 1px solid rgb(220 238 242 / 14%); color: #d5dddd; font-size: 0.72rem; }.social-links a span { margin-left: 0.35rem; color: var(--orange-bright); }.social-links a:hover { border-color: rgb(119 193 203 / 46%); }

@media (max-width: 1280px) {
  .site-nav { gap: 1.6rem; font-size: 0.7rem; }
  .site-nav .button-nav { gap: 0.45rem; padding-inline: 0.65rem; }
}
@media (max-width: 1150px) {
  .menu-toggle { position: relative; z-index: 1202; display: flex; width: 44px; height: 44px; flex-direction: column; align-items: center; justify-content: center; gap: 6px; border: 1px solid rgb(255 255 255 / 23%); border-radius: var(--radius-tight); background: rgb(255 255 255 / 5%); cursor: pointer; }
  .menu-toggle span { width: 18px; height: 1px; background: var(--white); transition: transform var(--transition-fast); }
  .menu-toggle[aria-expanded="true"] span:first-child { transform: translateY(3.5px) rotate(45deg); }
  .menu-toggle[aria-expanded="true"] span:last-child { transform: translateY(-3.5px) rotate(-45deg); }
  .site-nav { position: fixed; z-index: 1201; inset: 0; display: flex; height: 100svh; flex-direction: column; align-items: stretch; justify-content: center; gap: 0; padding: 5.5rem var(--gutter) 3rem; overflow-y: auto; background: radial-gradient(ellipse at 85% 17%, rgb(36 88 104 / 24%), transparent 39%), rgb(8 13 20 / 98%); opacity: 0; visibility: hidden; transform: translateY(-8px); transition: opacity var(--transition), transform var(--transition), visibility var(--transition); }
  .site-nav.is-open { opacity: 1; visibility: visible; transform: translateY(0); }
  .site-nav .nav-link { height: 54px; min-height: 54px; flex: 0 0 auto; color: #edf1ef; border-bottom: 1px solid rgb(255 255 255 / 10%); font: 600 clamp(1.05rem, 2.3vw, 1.4rem) var(--font-display); }
  .site-nav .nav-link::after { bottom: 0; transform-origin: left; }
  .site-nav .nav-contact { height: auto; min-height: 42px; align-self: flex-start; margin-top: 1.3rem; padding: 0.65rem 0.95rem; border: 1px solid rgb(255 152 79 / 72%); border-radius: 8px; font: 700 0.84rem var(--font-body); letter-spacing: 0; background: linear-gradient(105deg, #d96626, #f18435); }
  .site-nav .button-nav { align-self: flex-start; margin-top: 1.3rem; font: 700 0.84rem var(--font-body); }
}
@media (max-width: 900px) {
  .page-hero-layout,.product-hero-layout,.about-hero-layout,.voices-hero-layout,.contact-hero-layout { min-height: auto; grid-template-columns: 1fr; gap: 2.8rem; padding-block: 5.2rem 3rem; }
  .page-copy h1 { max-width: 850px; font-size: clamp(3.7rem, 9vw, 6.4rem); }
  .ops-visual { width: min(100%, 690px); min-height: 420px; justify-self: center; }
  .solutions-hero h1 em { white-space: normal; }
  .overview-product { grid-template-columns: 42px minmax(0,1fr) minmax(170px,.58fr); gap: 1.2rem; }
  .overview-trace { margin-left: 3%; }.overview-warehouse { margin-right: 2%; }
  .connective-layout { grid-template-columns: 1fr 1fr; gap: 2rem; }
  .product-hero-layout { grid-template-columns: 1fr; }.product-hero-layout .page-copy { max-width: 790px; }
  .route-visual,.trace-visual,.warehouse-visual { width: min(100%, 700px); justify-self: center; }
  .editorial-split,.customer-layout,.trace-elements-layout,.warehouse-interface-layout,.find-layout { grid-template-columns: 1fr; gap: 2rem; }
  .editorial-prose { padding-top: 0; }.warehouse-interface-layout > div { max-width: 650px; }
  .leadership-editorial { grid-template-columns: 0.75fr 1.25fr; }.leader-support { grid-template-columns: 1fr; gap: 0.7rem; }.leader-feature { min-height: 550px; }.leader-support .leader { min-height: 124px; }.leader-support .leader:nth-child(2),.leader-support .leader:nth-child(3) { transform: none; }.leader-support .leader:nth-child(2):hover,.leader-support .leader:nth-child(3):hover { transform: translateY(-3px); }
  .testimonial-editorial { grid-template-columns: 40px 1fr; gap: 1rem; }.testimonial-side { grid-column: 2; flex-direction: row; flex-wrap: wrap; align-items: center; gap: 0.8rem; }.testimonial-side i { width: 30px; margin: 0; }.optlog-layout { grid-template-columns: 1fr 1.2fr; gap: 2rem; }
  .vision-layout { grid-template-columns: 1fr minmax(210px,.55fr); gap: 1.5rem; }
  .social-layout { grid-template-columns: 1fr 1fr; }.social-links { grid-column: 1 / -1; justify-content: flex-start; }
  .home-contact-grid { grid-template-columns: 1fr 1fr; }
  .home-leader-list { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .digital-intro-layout { grid-template-columns: 1fr 0.6fr; }
  .digital-intro .section-kicker { grid-column: 1 / -1; }
  .digital-intro-index { display: none; }
}
@media (max-width: 620px) {
  .header-inner { height: 72px; }.brand img { width: 78px; height: 47px; }
  .page-hero { padding-top: 72px; }.page-hero-layout,.product-hero-layout,.about-hero-layout,.voices-hero-layout,.contact-hero-layout { gap: 2rem; padding-block: 4rem 2.7rem; }
  .page-copy h1,.product-hero .page-copy h1 { font-size: clamp(3.1rem, 12vw, 4.6rem); }.page-lede { margin-top: 1rem; font-size: 0.92rem; }.page-hero-foot { min-height: 47px; font-size: 0.39rem; }
  .section-heading-row { display: block; margin-bottom: 2rem; }.section-heading-row > p { margin-top: 1rem; }.section-heading-row h2,.page-section h2,.warehouse-interface h2 { font-size: clamp(2.55rem, 10vw, 4rem); }
  .ops-visual { min-height: 340px; }.ops-readout { min-width: 134px; padding: 0.57rem; }.ops-readout strong { font-size: 1.06rem; }.ops-readout small,.ops-readout > span { font-size: 0.39rem; }.readout-a { top: 14%; left: 2%; }.readout-b { top: 42%; right: 2%; }.readout-c { bottom: 8%; left: 4%; }
  .overview-product { min-height: 0; grid-template-columns: 1fr; gap: 0.8rem; padding: 1rem; }.overview-no { padding: 0; writing-mode: initial; }.overview-copy .section-kicker { font-size: 0.45rem; }.overview-copy h3 { font-size: 2rem; }.overview-preview { width: min(100%, 300px); height: 145px; justify-self: end; }.overview-trace,.overview-warehouse { margin-inline: 0; }.overview-copy .arrow-link { font-size: 0.73rem; }
  .connective-layout { grid-template-columns: 1fr; gap: 2rem; }.flow-step { min-height: 70px; }.flow-step span { font-size: 1.1rem; }
  .route-visual,.trace-visual,.warehouse-visual { min-height: 360px; }.mini-product { top: -13px; right: -4px; width: 124px; }.mini-product img { height: 67px; }.route-status { min-width: min(88%, 290px); }.route-status .mono { font-size: 0.36rem; }
  .editorial-split { gap: 1.2rem; }.editorial-prose p { font-size: 0.85rem; }.accelerator-ribbon { margin-top: 2rem; }.accelerator-ribbon span,.warehouse-principles span { font-size: 0.6rem; }
  .customer-layout { gap: 1.8rem; }.signal-row { grid-template-columns: 0.9fr 1.1fr 9px; gap: 0.45rem; }.signal-row span { font-size: 0.37rem; letter-spacing: 0.02em; }.signal-row strong { font-size: 0.7rem; }
  .capability-ledger > div,.warehouse-ledger > div { min-height: 74px; grid-template-columns: 35px 1fr; gap: 0.4rem 0.7rem; padding-block: 0.7rem; }.capability-ledger strong,.warehouse-ledger strong { font-size: 0.82rem; }.capability-ledger small,.warehouse-ledger small { grid-column: 2; font-size: 0.65rem; }
  .claim-grid { grid-template-columns: 1fr; }.claim-grid article { min-height: 190px; }.claim-grid strong { font-size: 4.5rem; }
  .trace-visual { padding: 0.8rem; }.trace-header,.trace-foot { font-size: 0.37rem; }.trace-path { gap: 0.55rem 0.35rem; margin-block: 1.2rem; }.trace-node { min-height: 58px; grid-template-columns: 26px 1fr; gap: 0.2rem; padding: 0.35rem; }.trace-node b { width: 22px; font-size: 0.39rem; }.trace-node span { font-size: 0.58rem; }.trace-node:nth-of-type(even) { transform: translateX(4px); }.trace-pathline { inset-inline: 9px; }.trace-domains { justify-content: flex-start; gap: 0.65rem 1rem; }.trace-domains span { font-size: 0.46rem; }
  .trace-accelerator-grid { grid-template-columns: 1fr; }.trace-accelerator-grid article { min-height: 145px; }.trace-accelerator-grid h3 { font-size: 1.15rem; }.element-list { grid-template-columns: 1fr; }.trace-elements-layout { gap: 1.5rem; }
  .warehouse-visual { padding: 0.6rem; }.warehouse-top,.warehouse-bottom { font-size: 0.34rem; }.warehouse-floor { min-height: 290px; }.warehouse-zone > span { font-size: 0.34rem; }.warehouse-zone { gap: 0.45rem; }.pallet { height: 22px; }.rack { height: 37px; }.handheld-readout { right: 1%; padding: 0.4rem; }.handheld-readout b { font-size: 0.34rem; }.handheld-readout small { font-size: 0.41rem; }.move-arrow { font-size: 0.95rem; }
  .warehouse-interface-layout { gap: 1.5rem; }.warehouse-interface img { height: 180px; }
  .about-motif { min-height: 310px; }.about-motif > b { width: 95px; font-size: 0.48rem; }.vision-layout { grid-template-columns: 1fr; }.vision-layout > .section-kicker { grid-column: auto; }.vision-layout blockquote { font-size: clamp(2.45rem, 10vw, 4rem); }.about-experience { min-height: 190px; }
  .leadership-editorial { grid-template-columns: 1fr; }.leader-feature { min-height: 330px; }.leader-feature .leader-mark { width: 118px; }.leader-support { grid-template-columns: 1fr 1fr; gap: 0.65rem; }.leader-support .leader { min-height: 166px; flex-direction: column; align-items: flex-start; padding: 0.8rem; }.leader-support .leader-mark { width: 42px; }.leader-support .leader h3 { font-size: 1rem; }.leader-support .leader p { font-size: 0.64rem; }.leader-support .leader .mono { font-size: 0.39rem; }.leadership-note { font-size: 0.63rem; }
  .voices-hero-mark { min-height: 230px; }.voices-hero-mark > span { font-size: 16rem; }.testimonial-editorial { grid-template-columns: 1fr; gap: 0.5rem; }.testimonial-index { writing-mode: initial; }.testimonial-feature { padding-block: 1.8rem; }.testimonial-feature blockquote { font-size: 1.15rem; line-height: 1.65; }.testimonial-feature figcaption { margin-top: 1.5rem; }.testimonial-side { grid-column: 1; font-size: 0.42rem; }.optlog-layout { grid-template-columns: 1fr; gap: 1rem; }.optlog-layout figure { padding-left: 1.2rem; }.optlog-layout figure blockquote { font-size: 1.08rem; }
  .contact-coordinate { min-height: 290px; }.coordinate-ring { width: 63%; }.pathway-grid { grid-template-columns: 1fr; }.pathway { min-height: 340px; }.pathway p { min-height: 0; }.location-panel { min-height: 310px; }.location-caption { left: 0.7rem; bottom: 1.7rem; padding: 0.65rem; }.location-caption span,.location-caption small { font-size: 0.58rem; }.location-label { font-size: 0.4rem; }.social-layout { grid-template-columns: 1fr; gap: 0.8rem; }.social-layout h2 { font-size: 2.3rem; }.social-links { grid-column: 1; justify-content: flex-start; }
  .page-cta h2 { font-size: clamp(2.8rem, 3.5vw, 3.5rem); }
  .home-contact-grid { grid-template-columns: 1fr; gap: 1.7rem; margin-top: 2.5rem; }
  .home-leader-list { grid-template-columns: 1fr 1fr; }
  .digital-intro-layout { grid-template-columns: 1fr; gap: 1rem; }
  .digital-intro h2 { font-size: clamp(2.45rem, 10vw, 4rem); }
  .digital-intro-layout > p:not(.section-kicker) { max-width: 460px; }
}
@media (max-width: 360px) {
  .page-copy h1,.product-hero .page-copy h1 { font-size: 2.85rem; }
  .page-hero-foot { font-size: 0.34rem; }
  .route-visual,.warehouse-visual { min-height: 330px; }
  .warehouse-floor { min-height: 270px; }
  .warehouse-zone > span { font-size: 0.3rem; }
  .trace-node span { font-size: 0.52rem; }
  .leader-support .leader { padding: 0.62rem; }
  .footer-base { flex-wrap: wrap; }
  .home-leader-list { grid-template-columns: 1fr; }
}

.brand img,
.footer-brand img {
  position: relative;
  z-index: 1;
  background: transparent;
}

.solutions {
  padding-block: clamp(5rem, 7vw, 7rem);
}

.section-intro {
  margin-bottom: clamp(2rem, 3vw, 3rem);
}

.solution-card {
  display: flex;
  height: 100%;
  flex-direction: column;
  padding: 0;
  color: inherit;
  text-decoration: none;
}

.solution-card:focus-visible {
  outline: 2px solid var(--cyan);
  outline-offset: 4px;
  box-shadow: 0 0 24px rgb(119 193 203 / 22%);
}

.solution-card:hover .card-link,
.solution-card:hover .card-link span,
.solution-card:focus-visible .card-link,
.solution-card:focus-visible .card-link span {
  color: var(--orange-bright);
}

.solution-card:hover .card-link span,
.solution-card:focus-visible .card-link span {
  transform: translate(2px, -2px);
}

.solution-card .card-preview img {
  background: transparent;
}

.button-outline {
  color: var(--white);
  border-color: rgb(255 152 79 / 72%);
  background: linear-gradient(105deg, #d96626, #f18435);
}
.button-outline:hover { border-color: var(--orange-bright); box-shadow: var(--glow-orange); }

.services-overview {
  position: relative;
  overflow: hidden;
  border-block: 1px solid rgb(220 238 242 / 8%);
  background:
    radial-gradient(ellipse at 83% 48%, rgb(31 75 88 / 14%), transparent 35%),
    linear-gradient(105deg, #0b1219, #111b24 58%, #0a1118);
}

.services-layout {
  display: grid;
  grid-template-columns: 0.88fr 1.12fr;
  align-items: center;
  gap: clamp(2.5rem, 7vw, 7rem);
  padding-block: clamp(4.5rem, 7vw, 6.5rem);
}

.services-heading .section-kicker {
  color: #9fadb4;
}

.services-heading h2 {
  margin: 1.1rem 0 1.25rem;
  color: #f0f2ef;
  font: 600 clamp(2.8rem, 4.5vw, 5rem)/0.99 var(--font-display);
  letter-spacing: -0.075em;
}

.services-heading h2 em {
  color: #aebdc2;
  font-style: normal;
}

.services-heading > p:last-child {
  max-width: 440px;
  margin: 0;
  color: #b1bdc2;
  font-size: 0.9rem;
  line-height: 1.75;
}

.services-ledger {
  border-top: 1px solid rgb(218 235 239 / 15%);
}

.services-ledger > div {
  display: grid;
  grid-template-columns: 3rem 1fr;
  align-items: baseline;
  gap: 1rem;
  padding: 0.95rem 0.3rem;
  border-bottom: 1px solid rgb(218 235 239 / 13%);
  transition: padding var(--transition), border-color var(--transition), background var(--transition);
}

.services-ledger > div:hover {
  padding-inline: 0.75rem;
  border-color: rgb(119 193 203 / 36%);
  background: linear-gradient(90deg, rgb(119 193 203 / 5%), transparent 72%);
}

.services-ledger .mono {
  color: #88a3ad;
  font-size: 0.56rem;
}

.services-ledger strong {
  color: #e3e8e7;
  font: 500 clamp(0.95rem, 1.35vw, 1.16rem)/1.5 var(--font-display);
  letter-spacing: -0.025em;
}

.about-layout {
  column-gap: clamp(2.5rem, 7vw, 7rem);
  padding-top: clamp(4.5rem, 7vw, 6.5rem);
}

.leadership-editorial-home {
  margin-top: clamp(2.5rem, 5vw, 4.5rem);
}

.client-voices h2 em {
  color: #aab9bf;
}

.voice-aside {
  transform: none;
}

.contact-layout {
  align-items: center;
}

.home-contact-grid {
  gap: clamp(1.2rem, 2.5vw, 2.5rem);
  margin-top: 2.5rem;
  padding-top: 1.3rem;
}

@media (max-width: 780px) {
  .services-layout {
    grid-template-columns: 1fr;
    gap: 2rem;
  }

  .services-heading h2 {
    font-size: clamp(2.8rem, 9vw, 4.5rem);
  }

  .voice-composition {
    grid-template-columns: 1fr 1.5fr;
    gap: 1.5rem;
  }

  .voice-index {
    grid-column: 1 / -1;
  }

  .voice-aside {
    grid-column: 2;
  }

  .home-contact-grid {
    margin-top: 2rem;
  }
}

@media (max-width: 520px) {
  .voice-composition {
    grid-template-columns: 1fr;
    gap: 1.5rem;
    margin-top: 2rem;
  }

  .voice-index,
  .voice-aside {
    grid-column: 1;
  }

  .voice-quote blockquote {
    padding-right: 0;
    font-size: 0.98rem;
  }

  .contact-layout {
    align-items: flex-start;
    flex-direction: column;
    gap: 1.3rem;
  }

  .contact-call {
    max-width: 30rem;
  }

  .home-contact-grid {
    gap: 1.6rem;
  }
}

@media (max-width: 620px) {
  .footer-location-heading { align-items: flex-start; flex-direction: column; gap: 0.8rem; }
  .footer-location .home-location-visual { height: 165px; }
}


/* Mouse-follow glow effect */
.glow-card {
    position: relative;
    overflow: hidden;
    isolation: isolate;
}

.glow-card::before {
    content: "";
    position: absolute;
    width: 220px;
    height: 220px;
    left: var(--mouse-x, 50%);
    top: var(--mouse-y, 50%);
    transform: translate(-50%, -50%);
    background: radial-gradient(
        circle,
        rgba(120, 150, 255, 0.22) 0%,
        rgba(120, 150, 255, 0.10) 30%,
        rgba(120, 150, 255, 0.04) 50%,
        transparent 72%
    );
    pointer-events: none;
    opacity: 0;
    transition: opacity 0.25s ease;
    z-index: 0;
}

.glow-card:hover::before {
    opacity: 1;
}

/* Keep card content above the glow */
.glow-card > * {
    position: relative;
    z-index: 1;
}

/* Product-page sizing stays separate from the homepage and other interior pages. */
.product-page .product-hero-layout {
  min-height: 0;
  gap: clamp(1.4rem, 3vw, 3rem);
  padding-block: clamp(2.5rem, 3.3vw, 3.25rem) clamp(2rem, 3vw, 2.75rem);
}

.product-page .product-hero .page-copy h1 {
  font-size: clamp(2.65rem, 3.85vw, 3.65rem);
}

.product-page .page-section {
  padding-block: clamp(2.5rem, 3.8vw, 3.25rem);
}

.product-page .section-heading-row {
  gap: 1.5rem 2rem;
  margin-bottom: clamp(1.25rem, 2vw, 1.8rem);
}

.product-page .section-heading-row h2,
.product-page .page-section h2,
.product-page .warehouse-interface h2,
.product-page .page-cta h2 {
  font-size: clamp(1.95rem, 3.3vw, 3.1rem);
}

.product-page .editorial-prose {
  padding-top: 0.75rem;
}

.sales-page .accelerator-ribbon {
  margin-top: 2.25rem;
  padding-top: 0.9rem;
}

.sales-page .claim-band {
  padding-block: clamp(2rem, 3vw, 2.75rem);
}

.sales-page .claim-grid strong {
  font-size: clamp(2.25rem, 3.5vw, 3.25rem);
}

.sales-page .mini-product img {
  width: 100%;
  height: auto;
  object-fit: contain;
  background: transparent;
}

.trace-page .trace-visual,
.sales-page .route-visual,
.warehouse-page .warehouse-visual {
  min-height: 400px;
}

.trace-page .trace-domains {
  justify-content: center;
  gap: 0.6rem;
  margin-top: 1.5rem;
}

.trace-page .trace-domains span,
.warehouse-page .warehouse-principles span {
  min-width: 0;
  flex: 0 1 calc(25% - 0.6rem);
  max-width: calc(25% - 0.6rem);
  overflow-wrap: anywhere;
  text-align: center;
}

.trace-page .trace-accelerator-grid article {
  min-height: 165px;
  padding: clamp(1rem, 2vw, 1.7rem);
}

.trace-page .trace-elements > .shell > h2 {
  margin-bottom: 1.6rem;
}

.trace-page .trace-elements-layout aside img {
  width: 100%;
  height: auto;
  aspect-ratio: 3 / 2;
  object-fit: cover;
  background: transparent;
}

.warehouse-page .warehouse-floor {
  min-height: 305px;
}

.warehouse-page .warehouse-principles {
  justify-content: center;
  gap: 0.6rem;
  margin-top: 1.5rem;
}

.warehouse-page .warehouse-interface {
  padding-block: clamp(2.5rem, 3.8vw, 3.5rem);
}

/* .warehouse-page .warehouse-interface figure {
  width: min(100%, 560px);
  justify-self: end;
  margin: 0;
  padding: 0;
  background: none;
  border: none;
}

.warehouse-page .warehouse-interface img {
  display: block;
  width: 100%;
  height: auto;
  object-fit: contain;
  background: none;
  border: none;
  border-radius: 12px;
  box-shadow: 0 25px 60px rgb(0 0 0 / 35%);
} */

@media (max-width: 900px) {
  .product-page .product-hero-layout {
    grid-template-columns: 1fr;
    gap: clamp(1.4rem, 3vw, 2.25rem);
    padding-block: clamp(2.5rem, 3.3vw, 3rem) clamp(1.75rem, 2.7vw, 2.5rem);
  }

  .product-page .product-hero .page-copy h1 {
    font-size: clamp(2.25rem, 4.8vw, 3rem);
  }

  .product-page .editorial-prose {
    padding-top: 0;
  }

  .trace-page .trace-visual,
  .sales-page .route-visual,
  .warehouse-page .warehouse-visual {
    min-height: 390px;
  }

  .trace-page .trace-domains span,
  .warehouse-page .warehouse-principles span {
    flex-basis: calc(33.333% - 0.6rem);
    max-width: calc(33.333% - 0.6rem);
  }
}

@media (max-width: 620px) {
  .product-page .product-hero-layout {
    gap: 1.35rem;
    padding-block: 2rem 1.75rem;
  }

  .product-page .product-hero .page-copy h1 {
    font-size: clamp(2.1rem, 7.6vw, 2.7rem);
  }

  .product-page .section-heading-row h2,
  .product-page .page-section h2,
  .product-page .warehouse-interface h2 {
    font-size: clamp(1.85rem, 7.5vw, 2.5rem);
  }

  .trace-page .trace-visual,
  .sales-page .route-visual,
  .warehouse-page .warehouse-visual {
    min-height: 360px;
  }

  .sales-page .claim-grid strong {
    font-size: clamp(2.1rem, 8vw, 2.5rem);
  }

  .sales-page .claim-grid article {
    min-height: 150px;
  }

  .trace-page .trace-domains span,
  .warehouse-page .warehouse-principles span {
    flex-basis: calc(50% - 0.6rem);
    max-width: calc(50% - 0.6rem);
  }

  .warehouse-page .warehouse-interface figure {
    width: 100%;
    max-width: none;
    justify-self: stretch;
  }

  .trace-page .trace-accelerator-grid article {
    min-height: 145px;
  }
}

@media (max-width: 360px) {
  .product-page .product-hero .page-copy h1 {
    font-size: clamp(2rem, 9vw, 2.25rem);
  }

  .sales-page .route-visual,
  .warehouse-page .warehouse-visual {
    min-height: 330px;
  }
}

/* Homepage-only typography and vertical rhythm. */
body[data-page="home"] .hero {
  min-height: min(780px, 90svh);
}

body[data-page="home"] .hero-inner {
  min-height: inherit;
  padding-block: clamp(6.5rem, 7vw, 7.5rem) clamp(4rem, 5vw, 5rem);
}

body[data-page="home"] .hero h1 {
  font-size: clamp(2.8rem, 4.4vw, 4.8rem);
}

body[data-page="home"] .hero h1 span,
body[data-page="home"] .section-intro h2 em,
.product-page .product-hero .page-copy h1 em {
  color: #aab8bf;
  -webkit-text-fill-color: #aab8bf;
  -webkit-text-stroke: 0;
  text-shadow: none;
}

body[data-page="home"] .section-intro h2,
body[data-page="home"] .client-voices h2 {
  font-size: clamp(2.6rem, 3.9vw, 4.25rem);
}

body[data-page="home"] .services-heading h2 {
  font-size: clamp(2.55rem, 3.85vw, 4.4rem);
}

body[data-page="home"] .about h2 {
  font-size: clamp(2.7rem, 4.2vw, 5.1rem);
}

body[data-page="home"] .contact-band h2 {
  font-size: clamp(2.9rem, 4.5vw, 5.2rem);
}

body[data-page="home"] .experience-figure {
  font-size: clamp(5rem, 7.5vw, 7rem);
}

body[data-page="home"] .solutions {
  padding-block: clamp(3.75rem, 5.3vw, 5rem);
}

body[data-page="home"] .services-layout {
  padding-block: clamp(3.75rem, 5vw, 4.75rem);
}

body[data-page="home"] .client-voices {
  padding-block: clamp(3.75rem, 5vw, 4.75rem);
}

body[data-page="home"] .about-layout {
  padding-top: clamp(4rem, 5.2vw, 5rem);
}

body[data-page="home"] .about-detail {
  padding-top: 1.5rem;
}

body[data-page="home"] .leadership-strip {
  margin-top: 3.5rem;
}

body[data-page="home"] .contact-band {
  padding-block: clamp(3.25rem, 4.5vw, 4.25rem) clamp(1.5rem, 2.5vw, 2.5rem);
}

@media (max-width: 780px) {
  body[data-page="home"] .hero,
  body[data-page="home"] .hero-inner {
    min-height: 0;
  }

  body[data-page="home"] .hero-inner {
    padding-block: 6.5rem 4rem;
  }

  body[data-page="home"] .hero h1 {
    font-size: clamp(2.7rem, 7vw, 3.8rem);
  }

  body[data-page="home"] .section-intro h2,
  body[data-page="home"] .client-voices h2 {
    font-size: clamp(2.45rem, 6.5vw, 3.8rem);
  }

  body[data-page="home"] .about h2,
  body[data-page="home"] .contact-band h2 {
    font-size: clamp(2.6rem, 6.8vw, 4rem);
  }

  body[data-page="home"] .services-heading h2 {
    font-size: clamp(2.45rem, 6.5vw, 3.8rem);
  }

  body[data-page="home"] .experience-figure {
    font-size: clamp(4.5rem, 9vw, 6.5rem);
  }

  body[data-page="home"] .solutions,
  body[data-page="home"] .client-voices,
  body[data-page="home"] .contact-band {
    padding-block: 3.5rem;
  }

  body[data-page="home"] .services-layout {
    padding-block: 3.5rem;
  }

  body[data-page="home"] .about-layout {
    padding-top: 3.75rem;
  }
}

@media (max-width: 520px) {
  body[data-page="home"] .hero-inner {
    padding-block: 6rem 3.5rem;
  }

  body[data-page="home"] .hero h1 {
    font-size: clamp(2.55rem, 8vw, 3.2rem);
  }

  body[data-page="home"] .section-intro h2,
  body[data-page="home"] .client-voices h2 {
    font-size: clamp(2.3rem, 8vw, 3.2rem);
  }

  body[data-page="home"] .about h2,
  body[data-page="home"] .contact-band h2,
  body[data-page="home"] .services-heading h2 {
    font-size: clamp(2.45rem, 8vw, 3.2rem);
  }

  body[data-page="home"] .experience-figure {
    font-size: clamp(4rem, 11vw, 5.2rem);
  }

  body[data-page="home"] .solutions,
  body[data-page="home"] .client-voices,
  body[data-page="home"] .contact-band {
    padding-block: 3rem;
  }

  body[data-page="home"] .services-layout {
    padding-block: 3rem;
  }

  body[data-page="home"] .about-layout {
    padding-top: 3.25rem;
  }
}

@media (max-width: 360px) {
  body[data-page="home"] .hero h1 {
    font-size: clamp(2.2rem, 10vw, 2.6rem);
  }
}

.sales-page .product-hero .page-copy h1 em {
  color: #aab8bf;
  -webkit-text-fill-color: #aab8bf;
  -webkit-text-stroke-width: 0;
  -webkit-text-stroke-color: transparent;
}

.sales-page .accelerator-ribbon {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  align-items: stretch;
  gap: 0.6rem;
}

.sales-page .accelerator-ribbon span {
  display: flex;
  min-width: 0;
  min-height: 3.25rem;
  align-items: center;
  justify-content: center;
  padding: 0.55rem 0.7rem;
  overflow-wrap: anywhere;
  line-height: 1.45;
  text-align: center;
}

@media (max-width: 900px) {
  .sales-page .accelerator-ribbon {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}


/* =========================================
   FOOTER — LARGER, MORE READABLE TYPOGRAPHY
========================================= */

[data-site-footer] {
  font-size: 17px;
  line-height: 1.8;
}

[data-site-footer] .footer-grid {
  padding-top: 64px;
  padding-bottom: 48px;
  column-gap: 44px;
  row-gap: 36px;
}

[data-site-footer] .footer-intro > p {
  max-width: 380px;
  margin-top: 22px;
  font-size: 17px;
  line-height: 1.9;
  color: #c1ccd7;
}

[data-site-footer] .footer-column h2 {
  margin: 0 0 20px;
  font-size: 21px;
  line-height: 1.4;
  font-weight: 700;
  color: #ffffff;
}

[data-site-footer] .footer-column a {
  display: block;
  width: fit-content;
  margin-bottom: 11px;
  font-size: 16px;
  line-height: 1.8;
  color: #c1ccd7;
  text-decoration: none;
  overflow-wrap: anywhere;
  transition: color 0.25s ease, transform 0.25s ease;
}

[data-site-footer] .footer-column a:hover {
  color: #ff984f;
  transform: translateX(3px);
}

[data-site-footer] .footer-column .footer-subhead {
  margin-top: 26px;
}

[data-site-footer] .social-row {
  margin-top: 24px;
  gap: 14px;
}

[data-site-footer] .social-row a {
  width: 42px;
  height: 42px;
}

/* =========================================
   OUR LOCATION
========================================= */

[data-site-footer] .footer-location {
  padding-top: 28px;
  padding-bottom: 28px;
  border-top: 1px solid rgba(193, 204, 215, 0.16);
  border-bottom: 1px solid rgba(193, 204, 215, 0.16);
}

[data-site-footer] .location-content {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 28px;
}

[data-site-footer] .location-eyebrow {
  display: inline-block;
  margin-bottom: 7px;
  color: #ff984f;
  font-size: 13px;
  font-weight: 800;
  letter-spacing: 2px;
}

[data-site-footer] .location-copy h2 {
  margin: 0 0 8px;
  color: #ffffff;
  font-size: 25px;
  line-height: 1.4;
  font-weight: 750;
}

[data-site-footer] .location-copy p {
  margin: 0;
  max-width: 580px;
  color: #c1ccd7;
  font-size: 16px;
  line-height: 1.8;
}

[data-site-footer] .location-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  gap: 18px;
  min-height: 50px;
  padding: 13px 22px;
  border: 1px solid #ff984f;
  border-radius: 6px;
  background: #ff984f;
  color: #10151b;
  font-size: 16px;
  font-weight: 750;
  line-height: 1.4;
  text-decoration: none;
  transition:
    background 0.25s ease,
    color 0.25s ease,
    transform 0.25s ease,
    box-shadow 0.25s ease;
}

[data-site-footer] .location-button:hover {
  background: transparent;
  color: #ff984f;
  transform: translateY(-2px);
  box-shadow: 0 8px 28px rgba(255, 152, 79, 0.12);
}

[data-site-footer] .location-button span {
  font-size: 21px;
  line-height: 1;
}

/* =========================================
   FOOTER BOTTOM BAR
========================================= */

[data-site-footer] .footer-base {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  padding-top: 25px;
  padding-bottom: 25px;
  color: #b8c4d0;
  font-size: 15px;
  line-height: 1.8;
}

[data-site-footer] .footer-base a {
  color: #ffffff;
  font-size: 15px;
  text-decoration: none;
  transition: color 0.25s ease;
}

[data-site-footer] .footer-base a:hover {
  color: #ff984f;
}

/* =========================================
   MOBILE RESPONSIVENESS
========================================= */

@media (max-width: 768px) {
  [data-site-footer] {
    font-size: 16px;
  }

  [data-site-footer] .footer-grid {
    padding-top: 44px;
    padding-bottom: 36px;
    row-gap: 30px;
  }

  [data-site-footer] .footer-column h2 {
    font-size: 20px;
  }

  [data-site-footer] .footer-column a {
    font-size: 16px;
  }

  [data-site-footer] .footer-intro > p {
    font-size: 16px;
  }

  [data-site-footer] .location-content {
    align-items: flex-start;
    flex-direction: column;
    gap: 20px;
  }

  [data-site-footer] .location-copy h2 {
    font-size: 23px;
  }

  [data-site-footer] .location-copy p {
    font-size: 15px;
  }

  [data-site-footer] .location-button {
    width: 100%;
    min-height: 50px;
  }

  [data-site-footer] .footer-base {
    align-items: flex-start;
    flex-direction: column;
    gap: 8px;
    font-size: 14px;
  }

  [data-site-footer] .footer-base a {
    font-size: 14px;
  }
}

@media (prefers-reduced-motion: reduce) {
  [data-site-footer] .footer-column a,
  [data-site-footer] .location-button,
  [data-site-footer] .footer-base a {
    transition: none;
  }
}


/* Footer layout */
[data-site-footer] .footer-inner {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 220px;
  gap: 32px;
  align-items: start;
}

/* Small Find Us box on the right */
.footer-findus {
  justify-self: end;
  width: 100%;
  max-width: 220px;
  padding: 18px;
  border: 1px solid rgba(255, 255, 255, 0.16);
  border-radius: 12px;
  background: rgba(255, 255, 255, 0.04);
  box-sizing: border-box;
}

.footer-findus h3 {
  margin: 0 0 12px;
  font-size: 18px;
}

.footer-findus p {
  margin: 0 0 10px;
  font-size: 14px;
  line-height: 1.6;
}

.footer-location-btn {
  display: inline-block;
  margin-top: 6px;
  padding: 9px 12px;
  border: 1px solid currentColor;
  border-radius: 7px;
  text-decoration: none;
  font-size: 13px;
  transition: background 0.2s ease, color 0.2s ease;
}

.footer-location-btn:hover {
  background: #fff;
  color: #080d14;
}

/* Mobile layout */
@media (max-width: 700px) {
  [data-site-footer] .footer-inner {
    grid-template-columns: 1fr;
  }

  .footer-findus {
    justify-self: start;
    max-width: 100%;
  }
}


/* Find Us — compact box on the right */
[data-site-footer] .footer-location {
  display: flex;
  justify-content: flex-end;
  margin-top: 24px;
  margin-bottom: 24px;
}

[data-site-footer] .location-box {
  width: 100%;
  max-width: 260px;
  padding: 20px;
  box-sizing: border-box;
  border: 1px solid rgba(255, 255, 255, 0.15);
  border-radius: 12px;
  background: rgba(255, 255, 255, 0.04);
}

[data-site-footer] .location-eyebrow {
  display: block;
  margin-bottom: 8px;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 2px;
  color: #aab8cc;
}

[data-site-footer] .location-box h2 {
  margin: 0 0 10px;
  font-size: 18px;
}

[data-site-footer] .location-box p {
  margin: 0 0 16px;
  font-size: 13px;
  line-height: 1.6;
}

[data-site-footer] .location-button {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 9px 12px;
  border: 1px solid rgba(255, 255, 255, 0.3);
  border-radius: 7px;
  font-size: 12px;
  text-decoration: none;
  transition: background 0.2s ease, color 0.2s ease;
}

[data-site-footer] .location-button:hover {
  background: #fff;
  color: #080d14;
}

@media (max-width: 700px) {
  [data-site-footer] .footer-location {
    justify-content: flex-start;
  }

  [data-site-footer] .location-box {
    max-width: 100%;
  }
}



/* Vidita Solutions - footer styles (dark theme, matches reference image) */

[data-site-footer] {
  --f-bg: #0a121c;
  --f-bg-card: rgba(255, 255, 255, 0.025);
  --f-text: #e8eef5;
  --f-muted: #c4ced9;
  --f-accent: #5fc4d0;
  --f-accent-soft: #7bd3dc;
  --f-border: rgba(255, 255, 255, 0.12);

  position: relative;
  background:
    radial-gradient(ellipse at 20% 0%, rgba(95, 196, 208, 0.05), transparent 55%),
    var(--f-bg);
  color: var(--f-text);
  font-family: "Inter", system-ui, -apple-system, "Segoe UI", sans-serif;
  padding: 80px 0 0;
}

/* Top gradient line */
[data-site-footer]::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 3px;
  background: linear-gradient(
    90deg,
    transparent 0%,
    rgba(95, 196, 208, 0.65) 15%,
    rgba(95, 196, 208, 0.65) 85%,
    transparent 100%
  );
}

[data-site-footer] .shell {
  width: min(1730px, 100% - 128px);
  margin-inline: auto;
}

[data-site-footer] a {
  color: inherit;
  text-decoration: none;
}

/* ---------- Grid ---------- */

.footer-grid {
  display: grid;
  grid-template-columns: 1.5fr 0.9fr 1fr 1.15fr;
  gap: 48px;
  align-items: start;
  padding-bottom: 64px;
}

/* ---------- Intro ---------- */

.footer-brand img {
  display: block;
  height: 52px;
  width: auto;
}

.footer-intro p {
  margin: 36px 0 0;
  max-width: 330px;
  color: var(--f-muted);
  font-size: 17px;
  line-height: 34px;
}

.footer-accent-line {
  display: block;
  width: 58px;
  height: 2px;
  margin-top: 34px;
  background: linear-gradient(90deg, var(--f-accent), transparent);
}

/* ---------- Columns ---------- */

.footer-column h2 {
  margin: 0 0 28px;
  font-size: 21px;
  font-weight: 700;
  letter-spacing: 0.1px;
  color: #fff;
}

.footer-column > a {
  display: block;
  margin-bottom: 19px;
  color: var(--f-muted);
  font-size: 17.5px;
  line-height: 26px;
  transition: color 0.2s ease;
}

.footer-column > a:hover {
  color: var(--f-accent-soft);
}

/* ---------- Contact ---------- */

.footer-detail-label {
  display: block;
  margin-bottom: 8px;
  color: var(--f-accent);
  font-size: 14px;
  font-weight: 700;
  letter-spacing: 0.14em;
}

.footer-contact > a {
  margin-bottom: 22px;
}

.footer-social {
  width: 226px;
  margin-top: 34px;
  padding-top: 20px;
  border-top: 1px solid var(--f-border);
}

.footer-social h3 {
  margin: 0 0 16px;
  font-size: 18px;
  font-weight: 600;
  color: #fff;
}

.social-row {
  display: flex;
  gap: 12px;
}

.social-row a {
  display: grid;
  place-items: center;
  width: 48px;
  height: 48px;
  border: 1px solid var(--f-border);
  border-radius: 9px;
  background: rgba(255, 255, 255, 0.03);
  transition: border-color 0.2s ease, background 0.2s ease, transform 0.2s ease;
}

.social-row a:hover {
  border-color: var(--f-accent);
  background: rgba(95, 196, 208, 0.1);
  transform: translateY(-2px);
}

.social-row svg {
  width: 20px;
  height: 20px;
  fill: #fff;
}

/* ---------- Location card ---------- */

.footer-location-card {
  position: relative;
  padding: 16px 20px;
  border: 1px solid var(--f-border);
  border-radius: 18px;
  background: var(--f-bg-card);
}

.footer-location-card::before {
  content: "";
  position: absolute;
  top: -1px;
  left: 24px;
  width: 66px;
  height: 2px;
  background: linear-gradient(90deg, var(--f-accent), transparent);
}

.footer-location-tag {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  color: var(--f-accent);
  font-size: 14px;
  font-weight: 700;
  letter-spacing: 0.14em;
}

.footer-location-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--f-accent);
}

.footer-location-card h2 {
  margin: 20px 0 0;
  font-size: 25px;
}

[data-site-footer] .footer-location-card h2 {
  margin-bottom: 0;
}

.footer-city {
  margin: 12px 0 0;
  color: var(--f-accent-soft);
  font-size: 18px;
  font-weight: 600;
}

[data-site-footer] .footer-location-card .footer-city {
  margin-top: 0;
}

.footer-location-card address {
  margin: 14px 0 0;
  color: var(--f-muted);
  font-style: normal;
  font-size: 17px;
  line-height: 1.55;
}

.footer-location-card .footer-map-link {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  margin: 16px 0 0;
  padding-bottom: 5px;
  border-bottom: 1px solid var(--f-accent);
  color: #fff;
  font-size: 17px;
  font-weight: 600;
  line-height: 1.2;
}

.footer-location-card .footer-map-link:hover {
  color: var(--f-accent-soft);
}

/* ---------- Icons ---------- */

.ui-icon {
  display: inline-flex;
  width: 14px;
  height: 14px;
}

.ui-icon svg {
  width: 100%;
  height: 100%;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.6;
  stroke-linecap: round;
  stroke-linejoin: round;
}

/* ---------- Bottom bar ---------- */

.footer-base {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 16px;
  padding: 24px 0 28px;
  border-top: 1px solid var(--f-border);
  color: var(--f-muted);
  font-size: 15px;
}

.footer-base a {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  transition: color 0.2s ease;
}

.footer-base a:hover {
  color: var(--f-accent-soft);
}

/* ---------- Responsive ---------- */

@media (max-width: 1100px) {
  .footer-grid {
    grid-template-columns: 1fr 1fr;
    gap: 48px 40px;
  }
}

@media (max-width: 640px) {
  [data-site-footer] {
    padding-top: 56px;
  }

  [data-site-footer] .shell {
    width: min(100% - 40px, 1730px);
  }

  .footer-grid {
    grid-template-columns: 1fr;
  }

  .footer-intro p {
    max-width: none;
  }

  .footer-base {
    flex-direction: column;
    align-items: flex-start;
  }
}


html {
  scroll-behavior: smooth;
}
