:root {
  color-scheme: light;
  --ink: #152238;
  --muted: #596b83;
  --paper: #ffffff;
  --soft: #f3f7fc;
  --dark: #0b1220;
  --dark-soft: #121c2d;
  --accent: #1685e8;
  --accent-bright: #37b9f2;
  --line: #d9e2ef;
  --font-display: "Aptos Display", "Segoe UI", sans-serif;
  --font-body: Aptos, "Segoe UI", sans-serif;
  --font-mono: Consolas, "Courier New", monospace;
}

:root[data-theme="dark"] {
  color-scheme: dark;
  --ink: #e7eef8;
  --muted: #aab9cc;
  --paper: #0b1220;
  --soft: #111c2d;
  --dark: #070d18;
  --dark-soft: #101a2a;
  --line: #2a3a51;
}

* { box-sizing: border-box; }
[hidden] { display: none !important; }
html { overflow-x: clip; scroll-behavior: smooth; scroll-padding-top: 86px; }
body { margin: 0; color: var(--ink); background: var(--paper); font-family: var(--font-body); font-size: 16px; line-height: 1.65; -webkit-font-smoothing: antialiased; }
body.menu-open { overflow: hidden; }
a { color: inherit; text-decoration: none; }
button, input, select, textarea { font: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
button:focus-visible, a:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible, summary:focus-visible { outline: 3px solid #1479e8; outline-offset: 4px; }
::selection { background: var(--accent); color: var(--dark); }
.container { width: min(1160px, calc(100% - 72px)); margin-inline: auto; }
.section-pad { padding: 112px 0; }
.mono { font-family: var(--font-mono); font-size: 10px; letter-spacing: .1em; }
.eyebrow { margin: 0 0 26px; color: #c8d4e5; font: 500 10px/1.5 var(--font-mono); letter-spacing: .14em; text-transform: uppercase; }
.eyebrow-dark { color: #52637a; }
.status-dot { display: inline-block; width: 7px; height: 7px; margin: 0 10px 1px 0; border-radius: 50%; background: var(--accent); box-shadow: 0 0 12px #1685e880; }
.dark-section { color: #f7faff; background: var(--dark); }
.soft-section { background: var(--soft); }
h1, h2, h3, p { margin-top: 0; }
h1, h2, h3 { font-family: var(--font-display); }
h1, h2 { letter-spacing: -.055em; }
h1 em, h2 em { color: #248ee8; font-style: normal; }
.dark-section h1 em, .dark-section h2 em, .cta-section h2 em { color: var(--accent); }
.skip-link { position: fixed; z-index: 1000; top: 12px; left: 12px; padding: 10px 16px; transform: translateY(-160%); color: var(--dark); background: var(--accent); }
.skip-link:focus { transform: none; }

/* Header and navigation */
.site-header { position: sticky; z-index: 50; top: 0; height: 76px; background: rgba(255,255,255,.96); border-bottom: 1px solid #e3eaf3; backdrop-filter: blur(16px); }
.header-inner { width: min(1280px, calc(100% - 72px)); height: 100%; margin: auto; display: flex; align-items: center; justify-content: space-between; }
.brand { display: inline-flex; align-items: center; gap: 11px; flex: 0 0 auto; }
.brand-monogram { display: grid; width: 36px; height: 36px; place-items: center; border: 1px solid #c8d8eb; border-radius: 9px; color: #fff; background: var(--dark); font: 700 13px/1 var(--font-display); letter-spacing: -.06em; }
.large-mark { width: 47px; height: 47px; margin-bottom: 12px; border-color: #3d6b9d; border-radius: 13px; background: #102944; box-shadow: 0 0 28px #1685e833; font-size: 18px; }
.brand-name { display: flex; flex-direction: column; font: 700 12px/1.22 var(--font-display); letter-spacing: .025em; }
.brand-name b { font-size: 9px; letter-spacing: .19em; }
.primary-nav { display: flex; align-items: center; gap: 35px; height: 100%; }
.primary-nav > a { color: #56657a; font-size: 12px; font-weight: 600; transition: color .2s ease; }
.primary-nav > a:hover, .primary-nav > a.active:not(.nav-cta) { color: #152238; }
.primary-nav > a.active:not(.nav-cta) { box-shadow: inset 0 -2px #28a7f0; }
.primary-nav .nav-cta { display: inline-flex; align-items: center; gap: 18px; padding: 11px 15px; border: 1px solid #cbd6e5; border-radius: 2px; color: var(--ink); }
.primary-nav .nav-cta:hover { border-color: var(--ink); background: var(--ink); color: white; }
.nav-cta span { font-size: 16px; line-height: 1; }
.theme-toggle { display: inline-flex; align-items: center; justify-content: center; min-width: 38px; min-height: 38px; padding: 0 10px; border: 1px solid #d5e0ed; border-radius: 5px; color: var(--ink); background: transparent; font-size: 11px; font-weight: 700; cursor: pointer; transition: border-color .2s ease, background .2s ease; }
.theme-toggle:hover { border-color: var(--accent); background: #edf6ff; }
.menu-toggle { display: none; }

:root[data-theme="dark"] .site-header { background: rgba(11,18,32,.96); border-bottom-color: #26364d; }
:root[data-theme="dark"] .brand-monogram { border-color: #3b5878; }
:root[data-theme="dark"] .primary-nav > a { color: #b5c4d8; }
:root[data-theme="dark"] .primary-nav > a:hover,
:root[data-theme="dark"] .primary-nav > a.active:not(.nav-cta) { color: #fff; }
:root[data-theme="dark"] .primary-nav .nav-cta { border-color: #40536d; color: #e7eef8; }
:root[data-theme="dark"] .primary-nav .nav-cta:hover { border-color: var(--accent); background: var(--accent); color: #fff; }
:root[data-theme="dark"] .theme-toggle { border-color: #40536d; color: #e7eef8; }
:root[data-theme="dark"] .theme-toggle:hover { background: #172940; }

/* Homepage hero carousel */
.home-hero { position: relative; overflow: hidden; padding: 0 0 50px; }
.home-hero::before { position: absolute; inset: 0; content: ""; pointer-events: none; background: radial-gradient(ellipse at 77% 48%, #17263d 0, transparent 37%), radial-gradient(ellipse at 3% 0%, #111e33 0, transparent 46%); }
.hero-grain { position: absolute; inset: 0; opacity: .12; pointer-events: none; background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.18'/%3E%3C/svg%3E"); }
.hero-carousel { position: relative; z-index: 1; outline: none; }
.hero-carousel:focus-visible { outline: 3px solid var(--accent-bright); outline-offset: -5px; }
.hero-slides { display: grid; }
.hero-slide { grid-area: 1 / 1; display: grid; min-width: 0; min-height: 570px; grid-template-columns: 1.08fr .92fr; align-items: center; gap: clamp(24px, 4vw, 58px); padding: 52px 0 37px; opacity: 0; visibility: hidden; transform: translateX(22px); pointer-events: none; transition: opacity .5s ease, transform .5s ease, visibility .5s; }
.hero-slide.is-active { z-index: 1; opacity: 1; visibility: visible; transform: translateX(0); pointer-events: auto; }
.hero-copy { width: 100%; max-width: 640px; padding: 0 0 4px; }
.hero-copy .eyebrow { margin-bottom: 27px; }
.hero-slide h1, .hero-slide h2 { max-width: 690px; margin: 0; color: #f7faff; font-size: clamp(42px, 5.35vw, 72px); line-height: 1.04; font-weight: 600; letter-spacing: -.055em; text-wrap: balance; }
.hero-slide h2 { font-size: clamp(46px, 5.8vw, 76px); }
.accent-word { color: var(--accent) !important; }
.hero-intro { max-width: 520px; margin: 23px 0 29px; color: #b6c5d9; font-size: 15px; line-height: 1.8; }
.hero-actions { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.button { min-height: 48px; display: inline-flex; justify-content: center; align-items: center; gap: 28px; padding: 0 19px; border: 1px solid transparent; border-radius: 2px; font-size: 12px; font-weight: 700; transition: background .2s ease, color .2s ease, border-color .2s ease, transform .2s ease; cursor: pointer; }
.button:hover { transform: translateY(-2px); }
.button span { font-size: 17px; line-height: 1; }
.button-lime { color: var(--dark); background: var(--accent); }
.button-lime:hover { background: #69d5f2; }
.button-outline { color: #f2f7ff; border-color: #55677f; background: transparent; }
.button-outline:hover { border-color: var(--accent); color: var(--accent); }
.button-dark { color: white; background: var(--dark); }
.button-dark:hover { background: #1b2b43; }
.text-link { display: inline-flex; align-items: center; gap: 12px; font-size: 12px; font-weight: 700; }
.text-link span { font-size: 17px; transition: transform .2s ease; }
.text-link:hover span { transform: translateX(4px); }
.light-link { color: #d5e0ee; }
.dark-link { color: #202e43; }
.hero-art { position: relative; width: min(100%, 470px); aspect-ratio: 1 / 1; justify-self: end; display: grid; place-items: center; }
.hero-art::before { position: absolute; width: 74%; height: 74%; border: 1px solid #465772; border-radius: 50%; content: ""; box-shadow: 0 0 70px #28a7f00b, inset 0 0 65px #42c4e808; }
.art-orbit { position: absolute; border: 1px solid #465772; border-radius: 50%; }
.orbit-one { width: 90%; height: 54%; transform: rotate(-31deg); }
.orbit-two { width: 90%; height: 54%; transform: rotate(47deg); }
.art-center { position: relative; z-index: 2; display: flex; width: 154px; height: 154px; flex-direction: column; align-items: center; justify-content: center; gap: 12px; border: 1px solid #50617c; border-radius: 50%; color: #e4edfa; background: #152239; box-shadow: 0 0 0 14px #0b122080, 0 0 55px #28a7f020; text-align: center; font: 500 8px/1.5 var(--font-mono); letter-spacing: .15em; }
.art-center .large-mark { width: 47px; height: 47px; margin-bottom: 0; border-color: #3d6b9d; border-radius: 13px; background: #102944; box-shadow: 0 0 28px #1685e833; font-size: 18px; }
.art-node { position: absolute; z-index: 3; display: flex; width: 88px; height: 88px; flex-direction: column; align-items: center; justify-content: center; gap: 4px; border: 1px solid #50617a; border-radius: 50%; color: #c5d3e8; background: #0b1220; box-shadow: 0 8px 30px #0003; font: 9px var(--font-mono); letter-spacing: .08em; }
.node-icon { color: var(--accent); font: 23px/1 var(--font-body); }
.node-top { top: 2%; left: 43%; }
.node-right { top: 39%; right: 0; }
.node-bottom { bottom: 1%; left: 43%; }
.node-left { top: 39%; left: 0; }
.orbit-dot { position: absolute; z-index: 3; width: 8px; height: 8px; border-radius: 50%; background: var(--accent); box-shadow: 0 0 15px var(--accent); }
.dot-a { top: 22%; right: 18%; }.dot-b { bottom: 22%; right: 19%; }.dot-c { top: 51%; left: 9%; width: 5px; height: 5px; }
.art-caption { position: absolute; right: 4%; bottom: 7%; left: 4%; display: flex; justify-content: space-between; color: #8a9bb2; font-size: 9px; }
.hero-carousel-controls { display: flex; min-height: 53px; align-items: center; gap: 19px; padding: 0 0 11px; border-top: 1px solid #ffffff24; }
.hero-pagination, .hero-control-buttons { display: flex; align-items: center; }
.hero-pagination { gap: 10px; }
.hero-dot { display: inline-grid; width: 26px; height: 30px; place-items: center; border: 0; background: transparent; cursor: pointer; }
.hero-dot::after { width: 7px; height: 7px; border: 1px solid #a7b8cd; border-radius: 50%; content: ""; transition: width .2s, border-radius .2s, background .2s; }
.hero-dot.is-active::after { width: 24px; border-color: var(--accent-bright); border-radius: 8px; background: var(--accent-bright); }
.hero-slide-count { color: #bac8d9; font: 10px var(--font-mono); letter-spacing: .08em; }
.count-divider { margin-inline: 3px; color: #73849b; }
.hero-control-buttons { gap: 8px; margin-left: auto; }
.hero-arrow, .hero-autoplay { display: inline-flex; min-width: 39px; height: 36px; align-items: center; justify-content: center; border: 1px solid #50617a; border-radius: 4px; color: #e7eff9; background: #0b1220; cursor: pointer; transition: border-color .2s, background .2s, color .2s; }
.hero-arrow { font-size: 18px; }
.hero-autoplay { min-width: 78px; padding: 0 10px; font-size: 10px; }
.hero-arrow:hover, .hero-autoplay:hover { border-color: var(--accent-bright); background: #142641; }
.hero-edge { position: absolute; right: 0; bottom: 0; left: 0; display: flex; justify-content: center; gap: clamp(32px, 8vw, 110px); padding: 14px 24px; border-top: 1px solid #ffffff15; color: #8b9ab0; font: 9px var(--font-mono); letter-spacing: .15em; }

/* CSS-built slide illustrations, avoiding external image dependencies */
.expertise-orbit { position: absolute; width: 74%; aspect-ratio: 1; border: 1px solid #405674; border-radius: 50%; box-shadow: 0 0 85px #1685e820, inset 0 0 65px #1685e810; }
.expertise-orbit::before, .expertise-orbit::after { position: absolute; inset: 13%; border: 1px solid #405674; border-radius: 50%; content: ""; transform: rotate(35deg) scaleX(.64); }
.expertise-orbit::after { transform: rotate(-35deg) scaleX(.64); }
.expertise-core { position: relative; z-index: 2; display: flex; width: 148px; height: 148px; flex-direction: column; align-items: center; justify-content: center; gap: 8px; border: 1px solid #50617c; border-radius: 50%; color: #e7eff9; background: #13243a; box-shadow: 0 0 0 13px #0b122080, 0 0 55px #1685e833; text-align: center; font: 9px/1.5 var(--font-mono); letter-spacing: .08em; }
.core-spark { color: var(--accent-bright); font-size: 32px; line-height: 1; }
.expertise-card { position: absolute; z-index: 3; display: flex; width: 195px; min-height: 109px; flex-direction: column; gap: 5px; padding: 13px 15px; border: 1px solid #405674; border-radius: 8px; background: #111c2d; box-shadow: 0 16px 40px #0004; }
.expertise-card .mono { color: #9db0c8; font-size: 8px; }
.expertise-card strong { color: #f7faff; font: 600 25px/1.15 var(--font-display); }
.expertise-card > span:last-child { color: #b6c5d9; font-size: 10px; line-height: 1.45; }
.expertise-ai { top: 7%; right: 0; }
.expertise-web3 { right: 3%; bottom: 16%; }
.expertise-security { bottom: 12%; left: 0; }
.growth-panel { position: relative; z-index: 2; width: 76%; padding: 22px; border: 1px solid #405674; border-radius: 9px; background: linear-gradient(145deg, #172943, #0d1727); box-shadow: 0 24px 65px #0005; }
.growth-panel-heading, .growth-panel-footer { display: flex; align-items: center; justify-content: space-between; color: #a9bad0; font-size: 9px; }
.growth-panel-heading .mono { font-size: 8px; letter-spacing: .08em; }
.growth-indicator { width: 7px; height: 7px; border-radius: 50%; background: #41c7ab; box-shadow: 0 0 14px #41c7ab88; }
.growth-chart { height: 182px; display: flex; align-items: end; gap: 10px; margin: 20px 0 14px; padding: 15px 8px 0; border-bottom: 1px solid #405674; background: repeating-linear-gradient(to bottom, transparent 0, transparent 44px, #ffffff0b 45px, transparent 46px); }
.growth-chart span { flex: 1; height: var(--bar-height); border: 1px solid #58b6eb66; border-bottom: 0; border-radius: 4px 4px 0 0; background: linear-gradient(180deg, #1685e866, #1685e811); }
.growth-chart span:nth-child(1) { --bar-height: 24%; }.growth-chart span:nth-child(2) { --bar-height: 38%; }.growth-chart span:nth-child(3) { --bar-height: 31%; }.growth-chart span:nth-child(4) { --bar-height: 51%; }.growth-chart span:nth-child(5) { --bar-height: 46%; }.growth-chart span:nth-child(6) { --bar-height: 68%; }.growth-chart span:nth-child(7) { --bar-height: 73%; }.growth-chart span:nth-child(8) { --bar-height: 96%; }
.growth-panel-footer { font-size: 8px; }
.growth-orbit { position: absolute; width: 90%; height: 63%; border: 1px solid #405674; border-radius: 50%; }
.growth-orbit-one { transform: rotate(43deg); }.growth-orbit-two { transform: rotate(-43deg); }
.growth-badge { position: absolute; z-index: 3; display: flex; min-width: 99px; min-height: 71px; align-items: center; gap: 8px; padding: 10px; border: 1px solid #50617a; border-radius: 7px; color: #c5d3e8; background: #0b1220; box-shadow: 0 10px 30px #0004; font: 8px/1.45 var(--font-mono); letter-spacing: .04em; }
.growth-symbol { color: var(--accent-bright); font-size: 21px; }
.growth-store { top: 15%; left: 0; }.growth-strategy { right: 0; bottom: 15%; }

/* Intro and service cards */
.intro-grid { display: grid; grid-template-columns: .38fr 1fr; gap: 30px; }
.intro-grid > .eyebrow { padding-top: 13px; }
.intro-content h2, .section-heading h2, .story-copy h2, .service-ways h2, .faq-grid h2 { margin-bottom: 27px; font-size: clamp(37px, 5vw, 58px); line-height: 1.1; font-weight: 600; }
.intro-content h2 em, .section-heading h2 em, .story-copy h2 em, .service-ways h2 em, .faq-grid h2 em { color: #258ddd; }
.intro-bottom { display: flex; max-width: 730px; align-items: center; justify-content: space-between; gap: 30px; }
.intro-bottom p { max-width: 520px; margin-bottom: 0; color: #66748a; font-size: 14px; }
.round-link { display: inline-grid; width: 46px; height: 46px; flex: 0 0 auto; place-items: center; border: 1px solid #cbd7e7; border-radius: 50%; color: var(--ink); font-size: 18px; transition: color .2s, background .2s, transform .2s; }
.round-link:hover { transform: rotate(45deg); color: var(--dark); background: var(--accent); border-color: var(--accent); }
.services-preview { padding-top: 100px; }
.section-heading { display: flex; align-items: end; justify-content: space-between; gap: 50px; margin-bottom: 47px; }
.section-heading .eyebrow { margin-bottom: 23px; }
.section-heading h2 { margin: 0; }
.heading-aside { max-width: 330px; margin: 0 0 5px; color: #596579; font-size: 13px; line-height: 1.8; }
.service-grid { display: grid; grid-template-columns: repeat(4, 1fr); border-top: 1px solid #d8e1ed; border-bottom: 1px solid #d8e1ed; }
.service-catalogue { background: var(--soft); }
.service-catalog-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.service-catalog-card { display: flex; min-width: 0; min-height: 284px; flex-direction: column; align-items: flex-start; padding: 23px; border: 1px solid var(--line); background: var(--paper); transition: transform .2s ease, border-color .2s ease, box-shadow .2s ease; }
.service-catalog-card:hover { transform: translateY(-3px); border-color: #a8c4e2; box-shadow: 0 14px 35px #0b12200c; }
.service-catalog-card > .mono { color: #6f8199; font-size: 9px; }
.service-catalog-card h3 { margin: 19px 0 8px; font-size: 19px; letter-spacing: -.03em; }
.service-catalog-card > p:not(.catalog-need) { min-height: 45px; margin: 0 0 15px; color: var(--muted); font-size: 12px; line-height: 1.7; }
.service-catalog-card .catalog-need { display: grid; gap: 2px; margin: 0 0 17px; color: var(--muted); font-size: 11px; line-height: 1.5; }
.catalog-need strong { color: var(--ink); font-size: 10px; }
.catalog-cta { display: inline-flex; width: 100%; min-height: 43px; align-items: center; justify-content: space-between; gap: 9px; margin-top: auto; padding: 10px 12px; border-radius: 3px; color: #fff; background: #145ea8; font-size: 11px; font-weight: 700; transition: background .2s ease; }
.catalog-cta:hover { background: #0b477f; }
.catalog-cta span { flex: 0 0 auto; font-size: 15px; }
.catalog-detail { margin-top: 11px; color: #1c73bd; font-size: 10px; font-weight: 700; text-decoration: underline; text-underline-offset: 3px; }
.service-card { position: relative; min-height: 270px; padding: 25px 23px 22px; border-right: 1px solid #d8e1ed; transition: background .2s ease; }
.service-card:first-child { border-left: 1px solid #d8e1ed; }
.service-card:hover { background: #f7faff; }
.card-index { color: #7b8aa1; }
.service-card h3 { margin: 22px 0 10px; font-size: 18px; letter-spacing: -.03em; }
.service-card p { max-width: 235px; margin: 0; color: #68768b; font-size: 12px; line-height: 1.8; }
.card-arrow { position: absolute; right: 22px; bottom: 19px; font-size: 18px; transition: transform .2s; }
.service-card:hover .card-arrow { transform: translate(3px,-3px); }
.service-icon { position: relative; display: block; width: 43px; height: 35px; margin-top: 20px; color: #1685d6; }
.icon-strategy i { position: absolute; bottom: 1px; width: 8px; border: 1px solid currentColor; transform: skewY(-28deg); }
.icon-strategy i:nth-child(1) { left: 2px; height: 15px; }.icon-strategy i:nth-child(2) { left: 16px; height: 25px; }.icon-strategy i:nth-child(3) { left: 30px; height: 33px; }
.icon-build i { position: absolute; top: 5px; width: 27px; height: 27px; border: 1px solid currentColor; border-radius: 8px; transform: rotate(45deg); }
.icon-build i:nth-child(1) { left: 1px; }.icon-build i:nth-child(2) { left: 15px; background: #f1f5fa; }.icon-build i:nth-child(3) { top: 13px; left: 15px; width: 8px; height: 8px; background: currentColor; border-radius: 50%; }
.icon-cloud i:first-child { position: absolute; top: 4px; left: 3px; width: 37px; height: 22px; border: 1px solid currentColor; border-radius: 20px; }
.icon-cloud i:last-child { position: absolute; bottom: 0; left: 12px; width: 20px; height: 18px; border: 1px solid currentColor; border-top: 0; background: var(--soft); }
.icon-data { display: flex; align-items: end; gap: 4px; }
.icon-data i { width: 7px; border: 1px solid currentColor; }
.icon-data i:nth-child(1) { height: 14px; }.icon-data i:nth-child(2) { height: 23px; }.icon-data i:nth-child(3) { height: 18px; }.icon-data i:nth-child(4) { height: 31px; }
.services-link-wrap { display: flex; justify-content: flex-end; margin-top: 25px; }
.capability-strip { margin: 24px 0 0; color: #70819a; font-size: 9px; line-height: 1.9; letter-spacing: .09em; }

/* Approach */
.approach-section { position: relative; overflow: hidden; }
.approach-section::after { position: absolute; right: -210px; bottom: -360px; width: 610px; height: 610px; border: 1px solid #253956; border-radius: 50%; content: ""; box-shadow: 0 0 0 45px #0b1220, 0 0 0 46px #253956, 0 0 0 106px #0b1220, 0 0 0 107px #253956; opacity: .5; }
.approach-grid { position: relative; z-index: 1; display: grid; grid-template-columns: .9fr 1.1fr; gap: 100px; }
.approach-heading h2 { margin: 0 0 24px; font-size: clamp(38px, 4.5vw, 57px); line-height: 1.08; font-weight: 600; }
.approach-heading > p:not(.eyebrow) { max-width: 380px; margin-bottom: 27px; color: #aab8cb; font-size: 13px; line-height: 1.8; }
.approach-steps { border-top: 1px solid #ffffff24; }
.approach-step { display: grid; grid-template-columns: 34px 1fr 30px; align-items: start; gap: 14px; padding: 26px 0; border-bottom: 1px solid #ffffff24; }
.step-number { padding-top: 4px; color: var(--accent); }
.approach-step h3 { margin: 0 0 7px; font-size: 16px; letter-spacing: -.02em; }
.approach-step p { max-width: 385px; margin: 0; color: #9baac0; font-size: 12px; line-height: 1.8; }
.step-symbol { color: var(--accent); font-size: 22px; text-align: right; }

/* Work visuals shared */
.work-heading { align-items: end; }
.work-heading > .text-link { margin-bottom: 7px; }
.work-grid { display: grid; grid-template-columns: 1.2fr .8fr; gap: 26px; }
.work-visual { position: relative; min-height: 290px; display: grid; overflow: hidden; place-items: center; }
.work-card-large .work-visual { min-height: 360px; }
.visual-commerce { background: #d8e4f2; }
.visual-commerce::before { position: absolute; top: -35%; left: -10%; width: 60%; height: 140%; transform: rotate(22deg); background: #b9d3eb; content: ""; }
.commerce-window { position: relative; z-index: 1; width: 65%; height: 70%; min-height: 210px; border: 7px solid #edf4fc; border-radius: 6px; background: #ffffff; box-shadow: 0 25px 55px #213b6330; }
.window-dots { position: absolute; top: 8px; left: 10px; color: #8d9bb0; font-size: 8px; letter-spacing: 2px; }
.window-bar { position: absolute; top: 13px; right: 8%; width: 23%; height: 4px; background: #dce5f0; }
.window-content { position: absolute; top: 28%; left: 11%; display: flex; flex-direction: column; align-items: flex-start; }
.window-label { color: #64748b; font: 9px var(--font-mono); letter-spacing: .08em; }
.window-title { margin: 9px 0 16px; color: #1b2940; font: 700 clamp(18px, 2.7vw, 32px)/1.1 var(--font-display); letter-spacing: -.05em; }
.window-button { padding: 8px 11px; color: #f5f9ff; background: #17243a; font-size: 8px; }
.visual-label { position: absolute; right: 18px; bottom: 15px; z-index: 2; color: #556b88; font-size: 8px; }
.visual-insight { background: #d7e9f3; }
.visual-insight::before { position: absolute; inset: 0; background: linear-gradient(140deg, transparent 55%, #b1d9ec 55%); content: ""; }
.insight-ui { position: relative; z-index: 1; width: 74%; padding: 22px 22px 16px; background: #f6faff; box-shadow: 0 20px 50px #233d5f30; }
.insight-title { display: block; color: #26364d; font: 700 17px var(--font-display); letter-spacing: -.05em; }
.insight-sub { display: block; margin-top: 3px; color: #8090a5; font-size: 9px; }
.chart-bars { height: 82px; display: flex; align-items: end; gap: 7px; margin-top: 18px; border-bottom: 1px solid #ccd8e7; background: repeating-linear-gradient(to bottom, transparent 0, transparent 26px, #e2eaf3 27px); }
.chart-bars i { width: 9%; background: #36a7dd; }
.chart-bars i:nth-child(1) { height: 35%; }.chart-bars i:nth-child(2) { height: 49%; }.chart-bars i:nth-child(3) { height: 42%; }.chart-bars i:nth-child(4) { height: 62%; }.chart-bars i:nth-child(5) { height: 54%; }.chart-bars i:nth-child(6) { height: 71%; }.chart-bars i:nth-child(7) { height: 63%; }.chart-bars i:nth-child(8) { height: 84%; }.chart-bars i:nth-child(9) { height: 94%; }
.chart-footer { display: flex; justify-content: space-between; margin-top: 11px; color: #71829a; font-size: 8px; }.chart-footer b { color: #197bd4; font-size: 15px; }
.visual-systems { background: #d9e2ee; }.visual-product { background: #dbe5f1; }
.system-canvas { position: relative; width: 80%; height: 220px; }
.system-center, .system-node { position: absolute; z-index: 2; display: grid; place-items: center; border: 1px solid #8296ad; border-radius: 50%; color: #273750; background: #f0f5fb; text-align: center; font: 8px/1.5 var(--font-mono); letter-spacing: .04em; }
.system-center { top: 65px; left: calc(50% - 48px); width: 96px; height: 96px; border-color: #258ddd; background: #c1e6f3; }
.system-node { width: 70px; height: 70px; }
.system-node-a { top: 4px; left: 5%; }.system-node-b { top: 7px; right: 4%; }.system-node-c { right: 36%; bottom: 0; }
.system-line { position: absolute; z-index: 1; width: 42%; height: 1px; background: #8ba0ba; transform-origin: left; }
.line-a { top: 47px; left: 22%; transform: rotate(28deg); }.line-b { top: 49px; left: 69%; transform: rotate(151deg); }.line-c { top: 145px; left: 47%; transform: rotate(95deg); }
.product-card { position: relative; width: 44%; min-width: 170px; height: 200px; padding: 18px; background: #f7faff; box-shadow: 0 24px 50px #1c3b6430; }
.product-card-top { position: absolute; top: 13px; left: 14px; width: 30px; height: 4px; background: #aebdd1; }
.product-card-orb { position: absolute; top: 39px; left: 50%; width: 74px; height: 74px; transform: translateX(-50%); border-radius: 50%; background: radial-gradient(circle at 37% 34%, #b7e8f4, #76bfea 70%); }
.product-card-line { position: absolute; bottom: 52px; left: 17%; width: 66%; height: 5px; background: #c9d7e6; }
.product-card-line.short { bottom: 39px; left: 28%; width: 44%; height: 3px; background: #d9e3ef; }
.product-card-button { position: absolute; bottom: 15px; left: 34%; width: 32%; height: 14px; background: #1c2a40; }
.product-spark { position: absolute; top: 18%; right: 20%; color: #2388d9; font-size: 25px; }
.work-card-meta { display: flex; align-items: center; justify-content: space-between; gap: 18px; padding: 19px 0 0; }
.work-card-meta h3 { margin: 0 0 3px; font-size: 16px; letter-spacing: -.03em; }
.work-card-meta p { margin: 0; color: #7f8ca0; font-size: 11px; }
.home-featured-project { display: grid; grid-template-columns: minmax(180px, .42fr) minmax(0, 1fr); overflow: hidden; margin-bottom: 24px; border: 1px solid #d9e2ef; background: #f3f7fc; transition: border-color .2s ease, transform .2s ease; }
.home-featured-project:hover { transform: translateY(-2px); border-color: #9bb8d7; }
.home-featured-visual { position: relative; min-height: 190px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 9px; overflow: hidden; color: #d5e4f5; background: radial-gradient(ellipse at center, #173352 0, #0b1220 74%); }
.home-project-orbit { position: absolute; width: 144px; height: 144px; border: 1px solid #4d7095; border-radius: 50%; box-shadow: 0 0 0 16px #0b122080, 0 0 40px #1685e833; }
.home-project-monogram { position: relative; z-index: 1; display: grid; width: 56px; height: 56px; place-items: center; border: 1px solid #4a89bb; border-radius: 15px; color: #fff; background: #12345b; font: 700 27px var(--font-display); }
.home-featured-visual > .mono { position: relative; z-index: 1; color: #b5c8de; font-size: 8px; }
.home-featured-copy { display: flex; flex-direction: column; align-items: flex-start; justify-content: center; gap: 9px; padding: 25px 30px; }
.home-featured-copy > .mono { color: #657991; font-size: 8px; }
.home-featured-copy > strong { color: #152238; font: 700 24px/1.15 var(--font-display); letter-spacing: -.04em; }
.home-featured-copy > span:not(.mono) { max-width: 650px; color: #596b83; font-size: 12px; line-height: 1.75; }
.home-featured-copy > b { margin-top: 2px; color: #145ea8; font-size: 11px; }
.home-featured-copy > b span { padding-left: 4px; font-size: 15px; }
.small-round { width: 36px; height: 36px; font-size: 15px; }
.concept-note { margin: 32px 0 0; color: #8191a6; font-size: 9px; }
.insight-preview-grid { display: grid; grid-template-columns: repeat(3, 1fr); border-top: 1px solid #d8e1ed; border-bottom: 1px solid #d8e1ed; }
.insight-preview-card { min-height: 190px; display: flex; flex-direction: column; align-items: flex-start; padding: 22px; border-right: 1px solid #d8e1ed; transition: background .2s; }
.insight-preview-card:first-child { border-left: 1px solid #d8e1ed; }
.insight-preview-card:hover { background: #f7faff; }
.insight-preview-card .mono { color: #7a8aa0; font-size: 9px; }
.insight-preview-card h3 { max-width: 300px; margin: 22px 0 18px; font-size: 17px; line-height: 1.45; letter-spacing: -.03em; }
.preview-arrow { margin-top: auto; color: #4f6a88; font-size: 10px; font-weight: 700; }

/* Page hero, story and process */
.page-hero { position: relative; overflow: hidden; }
.page-hero::after { position: absolute; top: -210px; right: -125px; width: 520px; height: 520px; border: 1px solid #354b6b; border-radius: 50%; content: ""; box-shadow: 0 0 0 38px #0b1220, 0 0 0 39px #354b6b, 0 0 0 92px #0b1220, 0 0 0 93px #354b6b; opacity: .48; }
.page-hero-inner { position: relative; z-index: 1; min-height: 390px; display: flex; flex-direction: column; align-items: flex-start; justify-content: center; padding-top: 50px; padding-bottom: 32px; }
.page-hero .eyebrow { margin-bottom: 22px; }
.page-hero h1 { margin: 0; font-size: clamp(54px, 7vw, 82px); line-height: 1.01; font-weight: 600; }
.page-intro { max-width: 560px; margin: 22px 0 0; color: #b6c5d9; font-size: 14px; line-height: 1.8; }
.page-hero-bottom { display: flex; width: 100%; justify-content: space-between; margin-top: 46px; padding-top: 15px; border-top: 1px solid #ffffff24; color: #92a0b4; font-size: 10px; }
.story-grid { display: grid; grid-template-columns: .38fr 1fr; gap: 30px; }
.story-grid > .eyebrow { padding-top: 12px; }
.story-copy { max-width: 770px; }
.story-copy h2 { font-size: clamp(35px, 4.5vw, 55px); }
.lead-copy { color: #45556d !important; font-size: 17px !important; line-height: 1.7 !important; }
.story-copy > p:not(.lead-copy) { max-width: 670px; margin-bottom: 26px; color: #596579; font-size: 13px; line-height: 1.9; }
.values-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; }
.founder-grid { display: grid; grid-template-columns: .38fr 1fr; gap: 30px; }
.founder-grid > .eyebrow { padding-top: 12px; }
.founder-copy { max-width: 770px; }
.founder-copy h2 { margin: 0 0 25px; font-size: clamp(37px, 4.8vw, 56px); line-height: 1.1; }
.founder-copy h2 em { color: #258ddd; font-style: normal; }
.founder-copy .lead-copy { max-width: 710px; }
.founder-copy > p:last-child { max-width: 670px; color: #596579; font-size: 13px; line-height: 1.9; }
.founder-copy > p:not(.lead-copy) { max-width: 720px; color: #596579; font-size: 13px; line-height: 1.9; }
.founder-details { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; margin: 30px 0; }
.founder-details article { min-height: 127px; padding: 16px; border: 1px solid #d9e2ee; background: #f2f6fc; }
.founder-details .mono { color: #7a8aa0; font-size: 8px; }
.founder-details h3 { margin: 15px 0 4px; font-size: 14px; line-height: 1.45; }
.founder-details p { margin: 0; color: #64748b; font-size: 10px; line-height: 1.6; }
.founder-strengths { padding-top: 7px; }
.founder-strengths h3 { margin: 0 0 12px; font-size: 15px; }
.founder-strengths ul { display: flex; flex-wrap: wrap; gap: 8px; margin: 0; padding: 0; list-style: none; }
.founder-strengths li { padding: 7px 10px; color: #516780; background: #eef5fc; font-size: 10px; }
.founder-profile-layout { display: grid; grid-template-columns: .7fr 1.3fr; align-items: start; gap: clamp(30px, 6vw, 82px); }
.founder-photo-placeholder { position: sticky; top: 110px; display: flex; min-height: 430px; flex-direction: column; align-items: center; justify-content: center; gap: 20px; padding: 24px; border: 1px solid #d9e2ee; background: radial-gradient(circle at 50% 38%, #203b5b 0, #12243a 40%, #0b1220 100%); color: #b8c9dd; text-align: center; }
.founder-photo-initials { display: grid; width: 126px; height: 126px; place-items: center; border: 1px solid #587798; border-radius: 50%; color: #f5f9ff; background: #ffffff0d; font: 500 42px/1 var(--font-display); letter-spacing: -.08em; }
.founder-photo-placeholder .mono { max-width: 220px; font-size: 9px; line-height: 1.8; }
.founder-profile-copy { max-width: 760px; }
.founder-profile-copy h2 { margin: 0 0 25px; font-size: clamp(38px, 5vw, 60px); line-height: 1.08; }
.founder-profile-copy h2 em { color: #258ddd; font-style: normal; }
.founder-profile-copy > p:not(.eyebrow) { color: #596579; font-size: 13px; line-height: 1.9; }
.founder-profile-interests { margin: 28px 0; }
.founder-profile-interests h3, .founder-credentials h3 { margin: 0 0 12px; font-size: 16px; }
.founder-profile-interests ul { display: flex; flex-wrap: wrap; gap: 8px; margin: 0; padding: 0; list-style: none; }
.founder-profile-interests li { padding: 7px 10px; color: #516780; background: #eef5fc; font-size: 11px; }
.founder-credentials { margin: 28px 0; padding: 21px; border: 1px solid #d9e2ee; background: #f5f9ff; }
.founder-credentials p { margin: 0; color: #64748b; font-size: 12px; line-height: 1.8; }
.founder-contact-button { margin-top: 5px; }
.mission-panel { display: grid; grid-template-columns: .3fr 1fr; gap: 28px; padding: 27px 30px; border: 1px solid #d3deeb; background: #f5f9ff; }
.mission-panel .mono { padding-top: 7px; color: #708199; }
.mission-panel p { margin: 0; color: #465772; font: 500 clamp(16px, 2vw, 21px)/1.65 var(--font-display); letter-spacing: -.02em; }
.mission-vision-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.vision-panel { background: #eef5fc; }
.value-card { min-height: 250px; padding: 25px; border: 1px solid #d9e2ee; background: #f6f9fe; }
.value-icon { display: inline-grid; width: 43px; height: 43px; margin-bottom: 27px; place-items: center; border: 1px solid #bfd4eb; border-radius: 50%; color: #2589d8; font-size: 21px; }
.value-card > .mono { margin-bottom: 11px; color: #64748b; font-size: 9px; }
.value-card h3 { margin-bottom: 9px; font-size: 19px; letter-spacing: -.03em; }
.value-card > p:last-child { margin: 0; color: #64748b; font-size: 12px; line-height: 1.8; }
.process-list { border-top: 1px solid #d9e2ee; }
.process-list article { display: grid; grid-template-columns: 80px 1fr auto; align-items: center; gap: 20px; padding: 23px 0; border-bottom: 1px solid #d9e2ee; }
.process-num { color: #217ac5; }
.process-list h3 { margin: 0 0 3px; font-size: 17px; }
.process-list p { margin: 0; color: #64748b; font-size: 12px; }
.process-tag { color: #8292a8; font: 9px var(--font-mono); letter-spacing: .1em; }

/* Service detail pages */
.service-detail { display: grid; grid-template-columns: .7fr 1.1fr .8fr; align-items: center; gap: 42px; min-height: 390px; padding: 50px 0; border-bottom: 1px solid var(--line); scroll-margin-top: 90px; }
.service-detail:first-child { padding-top: 4px; }
.detail-number { align-self: start; padding-top: 7px; color: #7c8da4; }
.detail-content h2 { margin: 0 0 17px; font-size: clamp(30px, 3.6vw, 42px); line-height: 1.1; }
.detail-content > p:not(.lead-copy) { color: #68768b; font-size: 12px; line-height: 1.85; }
.detail-content ul { display: grid; grid-template-columns: 1fr 1fr; gap: 10px 19px; margin: 23px 0 25px; padding: 0; list-style: none; }
.detail-content li { position: relative; padding-left: 14px; color: #4f6077; font-size: 11px; }
.detail-content li::before { position: absolute; top: 9px; left: 0; width: 5px; height: 5px; border-radius: 50%; background: #2b9de0; content: ""; }
.detail-graphic { position: relative; min-height: 240px; display: grid; place-items: center; overflow: hidden; background: #eef5fc; }
.graphic-strategy::before, .graphic-product::before, .graphic-data::before { position: absolute; width: 170px; height: 170px; border: 1px solid #c5d5e8; border-radius: 50%; content: ""; box-shadow: 0 0 0 20px #eef5fc, 0 0 0 21px #c5d5e8, 0 0 0 43px #eef5fc, 0 0 0 44px #c5d5e8; }
.strategy-ring { position: relative; z-index: 1; display: grid; width: 100px; height: 100px; place-items: center; border: 1px solid #2d9de0; border-radius: 50%; color: #2675bd; background: #cce8f5; font: 9px var(--font-mono); letter-spacing: .1em; }
.strategy-point { position: absolute; z-index: 2; display: grid; width: 33px; height: 33px; place-items: center; border: 1px solid #98abc1; border-radius: 50%; color: #2675bd; background: #f5faff; font: 9px var(--font-mono); }
.point-1 { top: 18%; left: 50%; }.point-2 { right: 18%; bottom: 27%; }.point-3 { bottom: 22%; left: 20%; }
.graphic-product { background: #e2edf8; }.graphic-product::before { border-color: #cbd9e9; }
.graphic-product .product-card { z-index: 1; height: 177px; transform: rotate(-5deg); }
.graphic-product .product-card-orb { width: 60px; height: 60px; }
.graphic-product .product-spark { z-index: 2; right: 13%; top: 19%; }
.graphic-cloud { background: #e8f0f8; }
.cloud-stack { position: relative; z-index: 1; width: 76%; display: flex; flex-direction: column; align-items: center; gap: 11px; color: #596f8d; font: 8px var(--font-mono); letter-spacing: .1em; }
.cloud-stack span { display: grid; width: 100%; min-height: 40px; place-items: center; border: 1px solid #cbd9e9; background: #f3f7fc; }
.cloud-stack span:last-child { border-color: #72b9df; background: #d9edf8; }
.cloud-stack i { width: 1px; height: 12px; background: #87a6c6; }
.graphic-data { background: #e7eff9; }
.data-chart { position: relative; z-index: 1; width: 72%; height: 140px; display: flex; align-items: end; justify-content: space-around; padding: 14px 13px 23px; border-bottom: 1px solid #bdccdf; background: repeating-linear-gradient(to bottom, transparent 0, transparent 30px, #dce6f0 31px); }
.data-chart i { width: 9%; background: #38a6dc; }
.data-chart i:nth-of-type(1) { height: 31%; }.data-chart i:nth-of-type(2) { height: 46%; }.data-chart i:nth-of-type(3) { height: 38%; }.data-chart i:nth-of-type(4) { height: 69%; }.data-chart i:nth-of-type(5) { height: 58%; }.data-chart i:nth-of-type(6) { height: 83%; }.data-chart i:nth-of-type(7) { height: 93%; }
.chart-x { position: absolute; right: 0; bottom: -23px; color: #6a7e98; font: 8px var(--font-mono); letter-spacing: .08em; }
.service-ways { display: grid; grid-template-columns: .8fr 1.2fr; gap: 55px; }
.service-ways h2 { font-size: clamp(36px, 4.5vw, 50px); }
.ways-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 25px 30px; }
.ways-grid article { padding-top: 17px; border-top: 1px solid #cbd8e7; }
.ways-grid .mono { color: #7a8aa0; font-size: 9px; }
.ways-grid h3 { margin: 13px 0 6px; font-size: 17px; }
.ways-grid p { margin: 0; color: #64748b; font-size: 12px; line-height: 1.8; }
.ways-intro { max-width: 340px; margin: -4px 0 0; color: #64748b; font-size: 12px; line-height: 1.8; }

/* Portfolio */
.portfolio-section { padding-top: 77px; }
.portfolio-records-section { padding-bottom: 35px; }
.portfolio-record { display: grid; grid-template-columns: minmax(260px, .75fr) minmax(0, 1.25fr); overflow: hidden; border: 1px solid #d5e0ed; background: #fff; }
.portfolio-record-thumbnail { position: relative; display: flex; min-height: 100%; flex-direction: column; align-items: center; justify-content: center; gap: 18px; overflow: hidden; color: #c6d8eb; background: radial-gradient(ellipse at 50% 45%, #173352 0, #0b1220 68%); }
.portfolio-record-thumbnail > .mono { z-index: 1; color: #a9bed4; font-size: 8px; text-align: center; }
.portfolio-record-orbit { position: absolute; width: 72%; aspect-ratio: 1; border: 1px solid #4b749e; border-radius: 50%; }
.portfolio-record-orbit-one { transform: scaleY(.6) rotate(-32deg); }
.portfolio-record-orbit-two { width: 91%; border-color: #324f71; transform: scaleY(.6) rotate(36deg); }
.portfolio-record-mark { z-index: 1; display: grid; width: 108px; height: 108px; place-items: center; border: 1px solid #4f6e90; border-radius: 50%; color: #f7faff; background: #111c2d; box-shadow: 0 0 0 12px #0b122080, 0 0 45px #1685e833; font: 600 55px/1 var(--font-display); }
.portfolio-record-art-note { position: absolute; right: 14px; bottom: 12px; color: #a9bed4; font-size: 9px; }
.portfolio-record-body { min-width: 0; padding: clamp(25px, 4vw, 44px); }
.portfolio-record-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 20px; }
.portfolio-record-heading h2 { margin: 12px 0 0; font-size: clamp(30px, 3.4vw, 42px); line-height: 1.08; }
.project-record-badge, .project-status-badge { display: inline-block; border: 1px solid #d2e5f4; color: #1b6fa9; background: #f0f7fd; font-size: 9px; font-weight: 700; }
.project-record-badge { padding: 6px 9px; }
.portfolio-record-heading > div > .mono { color: #74869d; font-size: 9px; }
.project-status-badge { flex: 0 0 auto; padding: 7px 9px; color: #596b83; border-color: #d9e2ef; background: #f7f9fc; font-size: 9px; line-height: 1.55; text-align: center; }
.portfolio-record-summary { max-width: 700px; margin: 18px 0 22px; color: #596b83; font-size: 12px; line-height: 1.8; }
.portfolio-record-facts { display: grid; grid-template-columns: 1fr 1fr; gap: 0 22px; margin: 0; border-top: 1px solid #e0e7f0; }
.portfolio-record-facts > div { min-width: 0; padding: 13px 0 12px; border-bottom: 1px solid #e0e7f0; }
.portfolio-record-facts dt { margin-bottom: 4px; color: #718198; font: 9px var(--font-mono); letter-spacing: .06em; text-transform: uppercase; }
.portfolio-record-facts dd { margin: 0; color: #354a63; font-size: 11px; line-height: 1.65; overflow-wrap: anywhere; }
.portfolio-record-facts dd span { color: #78889d; }
.portfolio-record-facts a { color: #176eae; text-decoration: underline; text-underline-offset: 2px; }
.portfolio-record-actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 21px; }
.portfolio-record-actions .button { min-height: 43px; gap: 12px; padding-inline: 13px; font-size: 10px; }
.portfolio-record-actions .button-outline { border-color: #c8d6e7; color: #152238; }
.portfolio-record-actions .button-outline:hover { border-color: #1685e8; color: #145ea8; }
.more-projects { display: grid; grid-template-columns: 48px 1fr auto; align-items: center; gap: 19px; margin-top: 22px; padding: 23px 25px; border: 1px dashed #c8d6e7; background: #f7f9fc; }
.more-projects-icon { display: grid; width: 40px; height: 40px; place-items: center; border: 1px solid #c8d6e7; border-radius: 50%; color: #2585c8; font-size: 24px; }
.more-projects .mono { color: #718198; font-size: 8px; }
.more-projects h3 { margin: 3px 0 4px; font-size: 17px; }
.more-projects p { max-width: 620px; margin: 0; color: #68768b; font-size: 11px; line-height: 1.7; }
.more-projects > a { color: #176eae; font-size: 11px; font-weight: 700; white-space: nowrap; }
.more-projects > a span { margin-left: 5px; }
.concept-library { border-top: 1px solid #e3eaf3; }
.portfolio-intro { display: grid; grid-template-columns: .4fr 1fr; gap: 28px; max-width: 900px; margin-bottom: 37px; }
.portfolio-intro .eyebrow { padding-top: 5px; }
.portfolio-intro > p:last-child { max-width: 660px; margin: 0; color: #65748a; font-size: 13px; line-height: 1.8; }
.portfolio-filters { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 31px; }
.filter-button { padding: 9px 14px; border: 1px solid #d4dfec; border-radius: 2px; color: #586981; background: transparent; font-size: 11px; cursor: pointer; transition: background .2s, color .2s, border-color .2s; }
.filter-button span { margin-left: 8px; color: #8796ab; font: 9px var(--font-mono); }
.filter-button:hover, .filter-button.active { border-color: var(--dark); color: white; background: var(--dark); }
.filter-button.active span { color: var(--accent); }
.portfolio-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 48px 24px; }
.portfolio-card[hidden] { display: none; }
.portfolio-card .work-visual { min-height: 300px; }
.portfolio-card.portfolio-featured .work-visual { min-height: 385px; }
.portfolio-featured-project { display: grid; grid-template-columns: 1.1fr .9fr; overflow: hidden; margin: 0 0 42px; border: 1px solid #d5e0ed; background: #fff; }
.portfolio-featured-art { position: relative; min-height: 350px; overflow: hidden; display: grid; place-items: center; background: radial-gradient(ellipse at 50% 48%, #173352 0, #0b1220 65%); }
.portfolio-featured-art::before, .portfolio-featured-art::after { position: absolute; width: 65%; aspect-ratio: 1; border: 1px solid #4b749e; border-radius: 50%; content: ""; }
.portfolio-featured-art::after { width: 84%; border-color: #324f71; transform: scaleY(.56) rotate(-28deg); }
.portfolio-featured-art .case-banner-center { position: relative; z-index: 2; display: flex; width: 190px; height: 190px; flex-direction: column; align-items: center; justify-content: center; gap: 8px; border: 1px solid #4f6e90; border-radius: 50%; color: #f7faff; background: #111c2d; box-shadow: 0 0 0 15px #0b122080, 0 0 50px #1685e833; text-align: center; }
.portfolio-featured-art .case-banner-symbol { width: 47px; height: 47px; font-size: 25px; }
.portfolio-featured-art .case-banner-center .mono { color: #a9bed4; font-size: 8px; }
.portfolio-featured-art .case-banner-center strong { color: #f7faff; font: 600 15px/1.3 var(--font-display); }
.portfolio-featured-copy { display: flex; flex-direction: column; align-items: flex-start; justify-content: center; padding: clamp(25px, 4vw, 50px); }
.portfolio-featured-copy .mono { color: #60758d; font-size: 9px; }
.portfolio-featured-copy h2 { margin: 16px 0 12px; font-size: clamp(29px, 3.3vw, 42px); line-height: 1.08; }
.portfolio-featured-copy > p { max-width: 510px; color: #596b83; font-size: 13px; line-height: 1.8; }
.portfolio-featured-links { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 10px; }
.portfolio-featured-links .button { font-size: 10px; gap: 10px; }
.portfolio-featured-project .button-outline { border-color: #c8d6e7; color: #152238; }
.portfolio-featured-project .button-outline:hover { border-color: #1685e8; color: #145ea8; }
.portfolio-card-meta { display: flex; justify-content: space-between; align-items: flex-start; gap: 15px; padding-top: 20px; }
.portfolio-card-meta .mono { color: #64748b; font-size: 9px; }
.portfolio-card-meta h2 { margin: 9px 0 7px; font-size: 21px; letter-spacing: -.04em; }
.portfolio-card-meta p { max-width: 450px; margin: 0; color: #68768b; font-size: 12px; line-height: 1.8; }
.tag-row { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 13px; }
.tag-row span { padding: 5px 8px; color: #58708c; background: #e9f1f8; font-size: 9px; }
.empty-filter { margin: 28px 0; color: #67768c; font-size: 13px; }
.empty-filter button { border: 0; color: #1c73bd; background: none; text-decoration: underline; cursor: pointer; }

/* Editorial content */
.insights-section { padding-top: 72px; }
.insight-article { display: grid; grid-template-columns: .35fr 1fr; gap: 40px; padding: 48px 0; border-bottom: 1px solid var(--line); scroll-margin-top: 90px; }
.insight-article:first-child { padding-top: 0; }
.insight-meta { padding-top: 9px; color: #7889a0; font-size: 9px; }
.insight-meta span { padding-inline: 4px; color: #95a3b6; }
.insight-content { max-width: 760px; }
.insight-content h2 { margin: 0 0 18px; font-size: clamp(28px, 3.5vw, 40px); line-height: 1.15; }
.insight-lead { color: #4e6077; font-size: 16px; line-height: 1.75; }
.insight-content > p:not(.insight-lead) { color: #596579; font-size: 13px; line-height: 1.9; }
.insight-content h3 { margin: 24px 0 11px; font-size: 17px; }
.insight-content ol, .insight-content ul { display: grid; gap: 11px; padding-left: 21px; color: #586981; font-size: 12px; line-height: 1.8; }
.insight-content li::marker { color: #217ac5; }
.insight-content .text-link { margin-top: 11px; }

/* Contact and FAQ */
.contact-hero .page-hero-inner { min-height: 355px; }
.contact-section { padding-top: 86px; }
.contact-grid { display: grid; grid-template-columns: .72fr 1.28fr; gap: 85px; }
.contact-aside h2 { margin: 0 0 18px; font-size: clamp(38px, 4.3vw, 51px); line-height: 1.1; }
.contact-aside > p:not(.eyebrow):not(.contact-response) { max-width: 350px; color: #68768b; font-size: 13px; line-height: 1.85; }
.contact-note { display: flex; gap: 14px; margin-top: 35px; padding: 18px 0; border-top: 1px solid #d9e2ef; border-bottom: 1px solid #d9e2ef; }
.note-icon { display: grid; width: 34px; height: 34px; flex: 0 0 auto; place-items: center; border: 1px solid #c8d9eb; border-radius: 50%; color: #2589d8; }
.contact-note strong { font-size: 12px; }
.contact-note p { margin: 3px 0 0; color: #64748b; font-size: 11px; }
.contact-response { margin: 18px 0 0; color: #64748b; font-size: 9px; }
.contact-details { display: grid; gap: 14px; margin-top: 30px; padding-top: 21px; border-top: 1px solid #d9e2ef; }
.contact-details p { display: grid; gap: 3px; margin: 0; }
.contact-details .mono { color: #64748b; font-size: 9px; }
.contact-details strong { color: #4c6079; font-size: 11px; font-weight: 500; }
.contact-form { display: flex; flex-direction: column; gap: 19px; }
.contact-form label { display: flex; flex-direction: column; gap: 7px; color: #344760; font-size: 11px; font-weight: 700; }
.contact-form label > span:first-of-type:not(.field-hint) { color: #197bd4; }
.contact-form .optional { color: #8695a9 !important; font-weight: 400; }
.form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 17px; }
.contact-form input:not([type="checkbox"]), .contact-form select, .contact-form textarea { width: 100%; min-height: 46px; padding: 12px 13px; border: 1px solid #d8e1ed; border-radius: 2px; color: var(--ink); background: #ffffff; font-size: 12px; font-weight: 400; }
.contact-form textarea { min-height: 125px; resize: vertical; }
.contact-form input::placeholder, .contact-form textarea::placeholder { color: #9aa9bc; }
.contact-form select:invalid { color: #909eb2; }
.field-hint { color: #7e8fa6; font-size: 10px; font-weight: 400; }
.consent-check { display: flex !important; flex-direction: row !important; align-items: flex-start; gap: 10px !important; color: #64748b !important; font-size: 10px !important; font-weight: 400 !important; }
.consent-check input { width: 16px; height: 16px; flex: 0 0 auto; margin: 1px 0 0; accent-color: #2487d2; }
.consent-check span span { color: #197bd4; }
.contact-form .button { align-self: flex-start; min-width: 195px; }
.form-status { min-height: 0; margin: -5px 0 0; color: #286d9f; font-size: 12px; }
.form-status:empty { display: none; }
.form-status.error { color: #b54242; }
.form-privacy { margin: -9px 0 0; color: #8493a7; font-size: 10px; line-height: 1.7; }
.faq-grid { display: grid; grid-template-columns: .72fr 1.28fr; gap: 85px; }
.faq-grid h2 { font-size: clamp(38px, 4vw, 48px); }
.faq-list { border-top: 1px solid #cbd6e5; }
.faq-list details { border-bottom: 1px solid #cbd6e5; }
.faq-list summary { display: flex; align-items: center; justify-content: space-between; gap: 15px; padding: 19px 0; color: #293a53; font: 700 13px var(--font-display); cursor: pointer; list-style: none; }
.faq-list summary::-webkit-details-marker { display: none; }
.faq-list summary span { color: #2586d5; font: 21px var(--font-body); transition: transform .2s; }
.faq-list details[open] summary span { transform: rotate(45deg); }
.faq-list details p { max-width: 600px; margin: -4px 0 19px; color: #6e7e94; font-size: 12px; line-height: 1.8; }

/* Closing CTA and footer */
.cta-section { position: relative; overflow: hidden; color: #f7faff; background: #111b2d; }
.cta-inner { position: relative; min-height: 300px; display: flex; align-items: center; justify-content: space-between; gap: 35px; padding-top: 52px; padding-bottom: 52px; }
.cta-inner .eyebrow { margin-bottom: 19px; }
.cta-inner h2 { margin: 0; font-size: clamp(42px, 5.5vw, 64px); line-height: 1.02; font-weight: 600; }
.cta-inner > .button { position: relative; z-index: 2; margin-right: 80px; }
.cta-decoration { position: absolute; top: 50%; right: -20px; transform: translateY(-50%) rotate(-14deg); color: #243858; font-size: 290px; line-height: 1; }
.site-footer { color: #e8eff8; background: var(--dark); }
.footer-main { position: relative; display: flex; justify-content: space-between; gap: 50px; padding-top: 58px; padding-bottom: 50px; }
.footer-logo .brand-monogram { border-color: #485d79; color: #e8eff8; background: #111c2d; }
.footer-logo .brand-name { color: #f4f8fd; }
.footer-brand > p { margin: 20px 0 0 41px; color: #92a1b5; font-size: 11px; line-height: 1.8; }
.footer-links { display: flex; gap: clamp(40px, 8vw, 110px); margin-right: 90px; }
.footer-links > div { display: flex; flex-direction: column; align-items: flex-start; gap: 10px; }
.footer-title { margin: 0 0 6px; color: #8494aa; font-size: 9px; }
.footer-links a { color: #c6d3e4; font-size: 11px; transition: color .2s; }
.footer-links a:hover, .footer-bottom a:hover { color: var(--accent); }
.footer-links a span { color: var(--accent); }
.back-top { position: absolute; top: 59px; right: 0; display: grid; width: 37px; height: 37px; place-items: center; border: 1px solid #485d79; border-radius: 50%; color: #c7d4e5; transition: background .2s, color .2s; }
.back-top:hover { color: var(--dark); background: var(--accent); }
.footer-bottom { display: flex; justify-content: space-between; gap: 20px; padding-top: 17px; padding-bottom: 19px; border-top: 1px solid #ffffff1c; color: #8796ab; font-size: 9px; }
.footer-bottom a { transition: color .2s; }
.animated-headline { animation: headline-arrive .8s cubic-bezier(.2,.75,.2,1) both; }
@keyframes headline-arrive { from { opacity: 0; transform: translateY(15px); } to { opacity: 1; transform: translateY(0); } }
.benefits-grid { display: grid; grid-template-columns: repeat(4, 1fr); border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.benefits-grid article { min-height: 172px; padding: 20px; border-right: 1px solid var(--line); }
.benefits-grid article:first-child { border-left: 1px solid var(--line); }
.benefits-grid .mono { color: #7a8aa0; font-size: 9px; }
.benefits-grid h3 { margin: 23px 0 8px; font-size: 16px; }
.benefits-grid p { margin: 0; color: #68768b; font-size: 11px; line-height: 1.8; }
.testimonial-placeholder { display: flex; align-items: center; gap: 25px; min-height: 145px; padding: 24px 30px; border: 1px solid #d9e2ef; background: #f7faff; }
.quote-mark { color: #258ddd; font: 80px/.9 Georgia, serif; }
.testimonial-placeholder p { margin: 0 0 8px; color: #455872; font: 500 17px/1.5 var(--font-display); }
.testimonial-placeholder .mono { color: #788579; font-size: 9px; }
.comparison-wrap { overflow-x: auto; border: 1px solid #d9e2ee; }
.comparison-table { width: 100%; border-collapse: collapse; background: #ffffff; font-size: 11px; }
.comparison-table th, .comparison-table td { padding: 14px 15px; border-bottom: 1px solid #d9e2ef; text-align: left; vertical-align: top; }
.comparison-table thead th { color: #e8eff8; background: var(--dark); font: 500 10px var(--font-mono); letter-spacing: .03em; }
.comparison-table tbody th { min-width: 155px; color: #293a52; font-size: 11px; }
.comparison-table td { color: #6a7a90; }
.comparison-table td > a { display: block; width: fit-content; margin: 0 0 7px; white-space: normal; }
.comparison-table td > a.table-detail-link { margin: 0; color: #64748b; font-size: 10px; font-weight: 600; text-decoration: underline; text-underline-offset: 2px; }
.comparison-table tbody tr:last-child th, .comparison-table tbody tr:last-child td { border-bottom: 0; }
.comparison-table a { color: #1c73bd; font-weight: 700; white-space: nowrap; }
.service-faq-section { padding-top: 80px; padding-bottom: 80px; }
.service-directory { padding-top: 80px; padding-bottom: 80px; }
.directory-grid { display: grid; grid-template-columns: repeat(3, 1fr); border-top: 1px solid var(--line); border-left: 1px solid var(--line); }
.directory-grid a { display: flex; min-height: 60px; align-items: center; justify-content: space-between; gap: 14px; padding: 15px 18px; border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); font-size: 12px; font-weight: 600; transition: background .2s; }
.directory-grid a:hover { background: var(--soft); }
.directory-grid a span { color: #217ac5; font-size: 16px; }
.caveat-panel { display: grid; grid-template-columns: .28fr 1fr auto; align-items: center; gap: 26px; padding: 27px; border: 1px solid #d9e2ef; background: #f7faff; }
.caveat-panel > .mono { color: #73849c; font-size: 9px; }
.caveat-panel > p { max-width: 690px; margin: 0; color: #5c6d83; font-size: 12px; line-height: 1.8; }
.caveat-panel .button { white-space: nowrap; }
.service-related { padding-top: 58px; padding-bottom: 58px; }
.service-delivery { padding-top: 70px; padding-bottom: 76px; }
.service-delivery .section-heading { margin-bottom: 32px; }
.service-delivery .section-heading h2 { max-width: 700px; font-size: clamp(32px, 4.5vw, 48px); }
.service-delivery-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }
.service-delivery-card { min-width: 0; padding: 22px; border: 1px solid var(--line); background: var(--paper); }
.service-delivery-card .mono { color: #6f8199; font-size: 9px; }
.service-delivery-card h3 { margin: 14px 0 12px; font-size: 17px; }
.service-delivery-card ul { display: grid; gap: 9px; margin: 0; padding-left: 17px; color: var(--muted); font-size: 11px; line-height: 1.7; }
.quote-next-step { display: flex; align-items: center; justify-content: space-between; gap: 24px; margin-top: 20px; padding: 22px 24px; border: 1px solid var(--line); background: var(--soft); }
.quote-next-step p { max-width: 700px; margin: 0; color: var(--muted); font-size: 12px; line-height: 1.7; }
.quote-next-step .button { flex: 0 0 auto; white-space: nowrap; }
.related-links { display: flex; flex-wrap: wrap; gap: 12px; }
.related-links a { display: flex; align-items: center; gap: 14px; padding: 12px 15px; border: 1px solid #d9e2ef; font-size: 11px; font-weight: 600; }
.related-links a span { color: #217ac5; }
.project-facts { margin-top: 13px !important; padding-top: 10px; border-top: 1px solid #d9e2ef; font-size: 10px !important; }
.project-facts strong { color: #485a73; }
.case-link-card { display: flex; align-items: center; justify-content: space-between; gap: 24px; padding: 25px 28px; border: 1px solid #d8e1ed; background: #f7faff; transition: background .2s; }
.case-link-card:hover { background: #ffffff; }
.case-link-card .mono { color: #788579; font-size: 9px; }
.case-link-card h2 { margin: 9px 0; font-size: 28px; }
.case-link-card p { margin: 0; color: #68768b; font-size: 12px; }
.project-case-link { padding-top: 75px; padding-bottom: 75px; }
.case-study-content { padding-top: 75px; }
.case-hero .page-hero-inner { min-height: 460px; }
.case-hero .page-intro { max-width: 690px; }
.case-ecosystem-tag { display: inline-block; margin-left: 10px; padding: 5px 8px; border: 1px solid #496583; border-radius: 3px; color: #cfdeef; font-size: 8px; vertical-align: middle; }
.case-hero-actions { display: flex; flex-wrap: wrap; gap: 11px; margin-top: 24px; }
.case-hero-actions .button { gap: 13px; }
.case-feature-banner { position: relative; min-height: 380px; display: grid; place-items: center; overflow: hidden; margin-bottom: 28px; border: 1px solid #263e5d; background: radial-gradient(ellipse at 50% 45%, #173352 0, #0b1220 65%); }
.case-banner-orbit { position: absolute; width: min(64%, 470px); aspect-ratio: 1; border: 1px solid #496d92; border-radius: 50%; opacity: .76; }
.case-banner-orbit-one { transform: rotate(31deg) scaleY(.62); }
.case-banner-orbit-two { transform: rotate(-31deg) scaleY(.62); }
.case-banner-center { position: relative; z-index: 2; display: flex; width: min(235px, 58vw); height: 235px; flex-direction: column; align-items: center; justify-content: center; gap: 10px; border: 1px solid #56789d; border-radius: 50%; color: #e7eff9; background: #101d30; box-shadow: 0 0 0 16px #0b122080, 0 0 72px #1685e833; text-align: center; }
.case-banner-symbol { display: grid; width: 53px; height: 53px; place-items: center; border: 1px solid #49a3e0; border-radius: 15px; color: #fff; background: #12345b; font: 700 28px var(--font-display); }
.case-banner-center .mono { color: #a9bed4; font-size: 8px; letter-spacing: .13em; }
.case-banner-center strong { color: #f7faff; font: 600 19px/1.2 var(--font-display); letter-spacing: -.03em; }
.case-banner-node { position: absolute; z-index: 2; display: grid; min-height: 39px; place-items: center; padding: 0 12px; border: 1px solid #536f8f; border-radius: 20px; color: #d4e3f2; background: #111c2d; font: 8px var(--font-mono); letter-spacing: .08em; }
.case-banner-node-one { top: 20%; left: max(4%, calc(50% - 380px)); }
.case-banner-node-two { right: max(4%, calc(50% - 380px)); bottom: 20%; }
.case-banner-caption { position: absolute; right: 18px; bottom: 15px; left: 18px; color: #879bb3; font-size: 8px; text-align: center; }
.case-status { max-width: 100%; margin: 0 0 56px; padding: 24px 27px; border: 1px solid #cbd9e9; border-left: 3px solid #258ddd; background: #f1f7fd; }
.case-status .mono { color: #73849b; }
.case-status strong { display: block; margin: 8px 0; color: #283b56; font: 700 17px var(--font-display); }
.case-status p { margin: 0; color: #62738a; font-size: 12px; line-height: 1.8; }
.case-overview-grid { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(250px, .8fr); align-items: start; gap: clamp(28px, 6vw, 80px); margin: 0 0 80px; }
.case-overview-copy { max-width: 720px; }
.case-overview-copy h2, .case-narrative-heading h2, .case-reflection h2 { margin: 0 0 20px; font-size: clamp(34px, 4.5vw, 51px); line-height: 1.08; }
.case-overview-copy h2 em, .case-narrative-heading h2 em, .case-reflection h2 em { color: #258ddd; font-style: normal; }
.case-overview-copy > p:not(.eyebrow) { color: #596b83; font-size: 13px; line-height: 1.9; }
.case-inline-link { margin-top: 10px; }
.case-listing-facts { display: grid; gap: 11px; padding: 23px; border: 1px solid #d9e2ef; background: #f3f7fc; color: #536780; font-size: 11px; }
.case-listing-facts .mono { color: #6f8199; font-size: 8px; }
.case-listing-facts strong { color: #152238; font: 700 20px var(--font-display); }
.case-narrative { padding: 65px 0; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.case-narrative-heading { max-width: 700px; margin-bottom: 32px; }
.case-narrative-heading .eyebrow, .case-roadmap .eyebrow { margin-bottom: 17px; }
.case-narrative-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }
.case-narrative-grid article { min-width: 0; padding: 22px; border: 1px solid var(--line); background: var(--paper); }
.case-narrative-grid .mono { color: #6f8199; font-size: 8px; }
.case-narrative-grid h3 { margin: 14px 0 9px; font-size: 17px; }
.case-narrative-grid p { margin: 0; color: #596b83; font-size: 11px; line-height: 1.8; }
.case-roadmap { display: grid; grid-template-columns: .78fr 1.22fr; gap: 50px; padding: 73px 0; border-bottom: 1px solid var(--line); }
.case-roadmap .case-narrative-heading { margin: 0; }
.case-roadmap .case-narrative-heading > p:last-child { color: #596b83; font-size: 12px; line-height: 1.8; }
.case-roadmap-list { display: grid; margin: 0; padding: 0; list-style: none; }
.case-roadmap-list li { display: grid; grid-template-columns: 35px 1fr auto; align-items: center; gap: 14px; padding: 17px 0; border-bottom: 1px solid var(--line); }
.case-roadmap-list li:first-child { padding-top: 0; }
.case-roadmap-list li:last-child { border-bottom: 0; }
.case-roadmap-list > li > span { color: #258ddd; font: 10px var(--font-mono); }
.case-roadmap-list h3 { margin: 0 0 3px; font-size: 14px; }
.case-roadmap-list p { margin: 0; color: #64748b; font-size: 10px; line-height: 1.5; }
.case-roadmap-list b { color: #657891; font: 9px var(--font-mono); white-space: nowrap; }
.case-risk-note { margin: 0; padding: 25px 28px; border-left: 3px solid #258ddd; background: #f1f7fd; }
.case-risk-note .mono { color: #526b88; font-size: 8px; }
.case-risk-note p { margin: 9px 0 0; color: #596b83; font-size: 12px; line-height: 1.8; }
.case-reflection { display: grid; grid-template-columns: .85fr 1.15fr; gap: 45px; padding: 70px 0; }
.case-reflection h2 { margin-bottom: 0; font-size: clamp(30px, 3.7vw, 42px); }
.case-reflection > p { margin: 0; color: #596b83; font-size: 13px; line-height: 1.9; }
.case-facts { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; margin: 30px 0 54px; }
.case-facts article { padding: 21px; border: 1px solid #d9e2ee; }
.case-facts .mono { color: #7c8ca2; font-size: 8px; }
.case-facts h2 { margin: 17px 0 7px; font-size: 18px; }
.case-facts p { margin: 0; color: #68788e; font-size: 11px; }
.case-pending { max-width: 750px; }
.case-pending h2 { font-size: 28px; }
.case-pending ul { display: grid; gap: 10px; margin: 20px 0; padding-left: 20px; color: #5b6d86; font-size: 12px; line-height: 1.7; }
.case-pending li::marker { color: #217ac5; }
.case-pending { max-width: 850px; padding-top: 45px; border-top: 1px solid var(--line); }
.case-pending .case-hero-actions { margin-top: 18px; }
.case-discuss-button { border-color: #c8d6e7; color: #152238; }
.case-pending p { color: #68768b; font-size: 12px; line-height: 1.8; }
.faq-page { padding-top: 70px; padding-bottom: 90px; }
.faq-page .faq-list { max-width: 900px; margin: 0 auto; }
.faq-list a { color: #1c73bd; font-weight: 600; text-decoration: underline; text-underline-offset: 2px; }
.legal-content { padding-top: 70px; padding-bottom: 100px; }
.legal-layout { display: grid; grid-template-columns: .34fr 1fr; gap: 55px; align-items: start; }
.legal-layout aside { position: sticky; top: 100px; padding: 18px; background: var(--soft); }
.legal-layout aside .mono { color: #7a8aa0; font-size: 9px; }
.legal-layout aside p:not(.mono) { color: #64748b; font-size: 11px; line-height: 1.8; }
.legal-layout article { max-width: 790px; }
.legal-layout article h2 { margin: 28px 0 10px; font-size: 20px; letter-spacing: -.03em; }
.legal-layout article h2:first-child { margin-top: 0; }
.legal-layout article p { color: #64758b; font-size: 12px; line-height: 1.9; }
.legal-placeholder { margin-top: 28px; padding: 16px; border-left: 3px solid #258ddd; background: #eff4fb; }
.not-found { min-height: 600px; display: flex; align-items: center; }
.not-found-inner { padding-top: 80px; padding-bottom: 80px; }
.not-found-code { margin: 0; color: #293d58; font: 600 clamp(100px, 20vw, 210px)/.9 var(--font-display); letter-spacing: -.09em; }
.not-found h1 { margin: 15px 0 0; font-size: clamp(48px, 7vw, 75px); line-height: 1.02; }
.not-found .page-intro { margin-bottom: 25px; }
.contact-form .form-privacy a { color: #1c73bd; text-decoration: underline; text-underline-offset: 2px; }

:root[data-theme="dark"] body { color: var(--ink); background: var(--paper); }
:root[data-theme="dark"] main :is(h1, h2, h3, h4) { color: var(--ink); }
:root[data-theme="dark"] main :is(p, li, td, th, summary, label) { color: var(--muted); }
:root[data-theme="dark"] main .dark-section :is(h1, h2, h3, h4) { color: #f7faff; }
:root[data-theme="dark"] main .dark-section :is(p, li) { color: #b6c5d9; }
:root[data-theme="dark"] main article,
:root[data-theme="dark"] main .comparison-wrap,
:root[data-theme="dark"] main .faq-list,
:root[data-theme="dark"] main .faq-list details,
:root[data-theme="dark"] main .benefits-grid,
:root[data-theme="dark"] main .benefits-grid article,
:root[data-theme="dark"] main .service-card,
:root[data-theme="dark"] main .service-catalog-card,
:root[data-theme="dark"] main .insight-preview-card,
:root[data-theme="dark"] main .insight-article,
:root[data-theme="dark"] main .directory-grid,
:root[data-theme="dark"] main .directory-grid a { border-color: var(--line); }
:root[data-theme="dark"] main .service-catalog-card,
:root[data-theme="dark"] main .service-card:hover,
:root[data-theme="dark"] main .insight-preview-card:hover,
:root[data-theme="dark"] main .testimonial-placeholder,
:root[data-theme="dark"] main .comparison-table,
:root[data-theme="dark"] main .founder-details article,
:root[data-theme="dark"] main .mission-panel,
:root[data-theme="dark"] main .vision-panel,
:root[data-theme="dark"] main .value-card,
:root[data-theme="dark"] main .legal-layout aside,
:root[data-theme="dark"] main .legal-placeholder,
:root[data-theme="dark"] main .caveat-panel,
:root[data-theme="dark"] main .related-links a,
:root[data-theme="dark"] main .case-link-card,
:root[data-theme="dark"] main .case-status,
:root[data-theme="dark"] main .case-facts article,
:root[data-theme="dark"] main .filter-button { border-color: var(--line); background: #111c2d; }
:root[data-theme="dark"] main .contact-form input:not([type="checkbox"]),
:root[data-theme="dark"] main .contact-form select,
:root[data-theme="dark"] main .contact-form textarea { border-color: var(--line); color: var(--ink); background: #0d1726; }
:root[data-theme="dark"] main .comparison-table tbody th,
:root[data-theme="dark"] main .faq-list summary,
:root[data-theme="dark"] main .case-status strong,
:root[data-theme="dark"] main .project-facts strong { color: var(--ink); }
:root[data-theme="dark"] main .comparison-table th,
:root[data-theme="dark"] main .comparison-table td { border-color: var(--line); }
:root[data-theme="dark"] main .comparison-table thead th { color: #e8eff8; background: #070d18; }
:root[data-theme="dark"] main .filter-button.active { border-color: var(--accent); background: var(--accent); color: #fff; }
:root[data-theme="dark"] main .case-link-card:hover { background: #17263a; }
:root[data-theme="dark"] main .not-found-code { color: #d6e5f8; }
:root[data-theme="dark"] main .cta-section h2 { color: #f7faff; }
:root[data-theme="dark"] main .home-featured-project,
:root[data-theme="dark"] main .case-narrative-grid article { border-color: var(--line); background: #111c2d; }
:root[data-theme="dark"] main .home-featured-copy > strong,
:root[data-theme="dark"] main .case-listing-facts strong,
:root[data-theme="dark"] main .case-narrative-grid h3,
:root[data-theme="dark"] main .case-roadmap-list h3 { color: var(--ink); }
:root[data-theme="dark"] main .home-featured-copy > span:not(.mono),
:root[data-theme="dark"] main .case-listing-facts,
:root[data-theme="dark"] main .case-overview-copy > p:not(.eyebrow),
:root[data-theme="dark"] main .case-narrative-grid p,
:root[data-theme="dark"] main .case-roadmap .case-narrative-heading > p:last-child,
:root[data-theme="dark"] main .case-roadmap-list p,
:root[data-theme="dark"] main .case-reflection > p { color: var(--muted); }
:root[data-theme="dark"] main .case-listing-facts,
:root[data-theme="dark"] main .case-risk-note { border-color: var(--line); background: #111c2d; }
:root[data-theme="dark"] main .case-status { border-color: var(--line); border-left-color: var(--accent); background: #111c2d; }
:root[data-theme="dark"] main .case-status strong { color: var(--ink); }
:root[data-theme="dark"] main .case-status p,
:root[data-theme="dark"] main .case-risk-note p { color: var(--muted); }
:root[data-theme="dark"] main .case-discuss-button,
:root[data-theme="dark"] .portfolio-featured-project .button-outline { border-color: #40536d; color: #e7eef8; }
:root[data-theme="dark"] main .portfolio-featured-project { border-color: var(--line); background: #111c2d; }
:root[data-theme="dark"] main .portfolio-featured-copy > p { color: var(--muted); }
:root[data-theme="dark"] main .portfolio-record { border-color: var(--line); background: #111c2d; }
:root[data-theme="dark"] main .portfolio-record-summary,
:root[data-theme="dark"] main .portfolio-record-facts dd { color: var(--muted); }
:root[data-theme="dark"] main .portfolio-record-facts,
:root[data-theme="dark"] main .portfolio-record-facts > div { border-color: var(--line); }
:root[data-theme="dark"] main .portfolio-record-facts dt,
:root[data-theme="dark"] main .portfolio-record-facts dd span,
:root[data-theme="dark"] main .portfolio-record-heading > div > .mono { color: #9bacbf; }
:root[data-theme="dark"] main .portfolio-record-facts a,
:root[data-theme="dark"] main .more-projects > a { color: #72b9f0; }
:root[data-theme="dark"] main .project-record-badge { border-color: #31536f; color: #9ed5f5; background: #142b40; }
:root[data-theme="dark"] main .project-status-badge { border-color: #40536d; color: #b7c5d7; background: #17263a; }
:root[data-theme="dark"] main .portfolio-record-actions .button-outline { border-color: #40536d; color: #e7eef8; }
:root[data-theme="dark"] main .portfolio-record-actions .button-outline:hover { border-color: var(--accent); color: var(--accent); }
:root[data-theme="dark"] main .more-projects { border-color: #40536d; background: #111c2d; }
:root[data-theme="dark"] main .more-projects-icon { border-color: #40536d; }
:root[data-theme="dark"] main .more-projects p,
:root[data-theme="dark"] main .more-projects .mono { color: var(--muted); }
:root[data-theme="dark"] main .concept-library { border-color: var(--line); }
:root[data-theme="dark"] main .founder-profile-copy > p:not(.eyebrow),
:root[data-theme="dark"] main .founder-credentials p { color: var(--muted); }
:root[data-theme="dark"] main .founder-profile-copy .lead-copy { color: var(--muted) !important; }
:root[data-theme="dark"] main .founder-profile-interests li,
:root[data-theme="dark"] main .founder-credentials { border-color: var(--line); background: #111c2d; }
:root[data-theme="dark"] main .founder-profile-interests li { color: #c1d0e1; }

@media (max-width: 1050px) {
  .site-header { height: 76px; }
  .header-inner { width: calc(100% - 48px); }
  .menu-toggle { display: flex; width: 40px; height: 40px; flex-direction: column; align-items: center; justify-content: center; gap: 6px; border: 1px solid #d4dfec; border-radius: 5px; background: transparent; cursor: pointer; }
  .menu-toggle span { width: 16px; height: 1px; background: var(--ink); transition: transform .2s; }
  .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); }
  .primary-nav { position: fixed; top: 76px; right: 0; left: 0; height: calc(100dvh - 76px); display: flex; flex-direction: column; align-items: stretch; justify-content: flex-start; gap: 0; padding: 18px 24px 30px; background: var(--paper); clip-path: inset(0 0 0 100%); transition: clip-path .25s ease, visibility .25s; visibility: hidden; }
  .primary-nav.is-open { clip-path: inset(0); visibility: visible; }
  .primary-nav > a { padding: 16px 4px; border-bottom: 1px solid var(--line); color: var(--ink); font-size: 15px; }
  .primary-nav > a.active:not(.nav-cta) { box-shadow: none; color: var(--accent); }
  .primary-nav .nav-cta { justify-content: space-between; margin-top: 20px; padding: 15px; font-size: 14px; }
  .primary-nav .theme-toggle { align-self: flex-start; margin-top: 15px; }
  :root[data-theme="dark"] .menu-toggle { border-color: #40536d; }
  :root[data-theme="dark"] .menu-toggle span { background: #e7eef8; }
  :root[data-theme="dark"] .primary-nav { border-top: 1px solid #26364d; }
  :root[data-theme="dark"] .primary-nav > a { border-bottom-color: #26364d; }
}

@media (max-width: 900px) {
  .container { width: min(100% - 48px, 720px); }
  .header-inner { width: calc(100% - 48px); }
  .primary-nav { gap: 22px; }
  .hero-slide { min-height: 540px; grid-template-columns: 1.05fr .95fr; gap: 18px; }
  .hero-slide h1, .hero-slide h2 { font-size: clamp(41px, 6.2vw, 57px); }
  .hero-art { width: 100%; }
  .footer-main { flex-wrap: wrap; }
  .footer-links { margin-right: 0; }
  .art-node { width: 73px; height: 73px; }
  .art-center { width: 132px; height: 132px; }
  .approach-grid { gap: 50px; }
  .founder-profile-layout { grid-template-columns: .65fr 1.35fr; gap: 34px; }
  .founder-photo-placeholder { min-height: 350px; }
  .service-catalog-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .portfolio-record { grid-template-columns: 1fr; }
  .portfolio-record-thumbnail { min-height: 270px; }
  .portfolio-record-orbit { width: 38%; }
  .portfolio-record-orbit-two { width: 50%; }
  .portfolio-featured-project { grid-template-columns: 1fr 1fr; }
  .case-overview-grid { grid-template-columns: 1fr; }
  .case-listing-facts { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .case-listing-facts .mono, .case-listing-facts strong { grid-column: 1 / -1; }
  .case-roadmap { grid-template-columns: 1fr; gap: 24px; }
  .service-card { padding-inline: 17px; }
  .service-detail { grid-template-columns: .42fr 1fr .76fr; gap: 25px; }
  .service-delivery-grid { grid-template-columns: 1fr; }
  .contact-grid, .faq-grid { gap: 48px; }
  .benefits-grid { grid-template-columns: 1fr 1fr; }
  .benefits-grid article:nth-child(odd) { border-left: 1px solid var(--line); }
  .benefits-grid article:nth-child(-n+2) { border-bottom: 1px solid var(--line); }
  .caveat-panel { grid-template-columns: .3fr 1fr; }
  .caveat-panel .button { grid-column: 2; justify-self: start; }
  .legal-layout { gap: 30px; }
}
@media (max-width: 700px) {
  html { scroll-padding-top: 70px; }
  .container { width: calc(100% - 40px); }
  .section-pad { padding: 76px 0; }
  .site-header { height: 68px; }
  .header-inner { width: calc(100% - 40px); }
  .brand-name { font-size: 11px; }.brand-name b { font-size: 8px; }
  .primary-nav { top: 68px; height: calc(100dvh - 68px); padding-right: 22px; padding-left: 22px; }
  .home-hero { padding-bottom: 44px; }
  .portfolio-record { grid-template-columns: 1fr; }
  .portfolio-record-thumbnail { min-height: 270px; }
  .portfolio-record-orbit { width: 38%; }
  .portfolio-record-orbit-two { width: 50%; }
  .hero-slide { min-height: 0; grid-template-columns: 1fr; gap: 16px; padding: 53px 0 28px; }
  .hero-copy { max-width: 620px; }
  .hero-copy .eyebrow { margin-bottom: 22px; }
  .hero-slide h1, .hero-slide h2 { max-width: 600px; font-size: clamp(40px, 10vw, 59px); line-height: 1.07; }
  .hero-intro { max-width: 540px; margin: 20px 0 23px; font-size: 14px; }
  .hero-actions { gap: 10px; }
  .hero-art { width: min(100%, 340px); margin: 0 auto; }
  .hero-carousel-controls { min-height: 49px; padding-bottom: 7px; }
  .hero-edge { gap: 0; justify-content: space-around; padding-inline: 10px; font-size: 7px; letter-spacing: .1em; }
  .intro-grid, .story-grid, .founder-grid { grid-template-columns: 1fr; gap: 17px; }
  .founder-profile-layout { grid-template-columns: 1fr; gap: 28px; }
  .founder-photo-placeholder { position: static; min-height: 260px; }
  .intro-grid > .eyebrow, .story-grid > .eyebrow, .founder-grid > .eyebrow { padding: 0; }
  .intro-content h2, .section-heading h2, .story-copy h2, .service-ways h2 { font-size: clamp(36px, 10vw, 48px); }
  .intro-bottom { align-items: flex-end; gap: 17px; }
  .intro-bottom p { font-size: 13px; }
  .section-heading { align-items: flex-start; flex-direction: column; gap: 20px; margin-bottom: 30px; }
  .section-heading .heading-aside { max-width: 410px; }
  .service-grid { grid-template-columns: 1fr 1fr; }
  .service-catalog-grid { grid-template-columns: 1fr 1fr; gap: 11px; }
  .service-catalog-card { min-height: 280px; padding: 17px 15px; }
  .service-catalog-card h3 { font-size: 17px; }
  .directory-grid { grid-template-columns: 1fr 1fr; }
  .service-card { min-height: 248px; padding: 19px 16px; border-bottom: 1px solid #d8e1ed; }
  .service-card:nth-child(odd) { border-left: 1px solid #d8e1ed; }
  .service-card:nth-child(even) { border-right: 1px solid #d8e1ed; }
  .service-card:nth-last-child(-n+2) { border-bottom: 0; }
  .service-card h3 { font-size: 16px; }
  .service-card p { font-size: 11px; }
  .service-icon { margin-top: 16px; }
  .services-link-wrap { justify-content: flex-start; }
  .approach-grid { grid-template-columns: 1fr; gap: 40px; }
  .approach-heading h2 { font-size: 43px; }
  .approach-section::after { right: -340px; bottom: -320px; }
  .work-grid { grid-template-columns: 1fr; gap: 30px; }
  .insight-preview-grid { grid-template-columns: 1fr; }
  .insight-preview-card { min-height: 155px; border-right: 1px solid #d8e1ed; border-bottom: 1px solid #d8e1ed; }
  .insight-preview-card:first-child { border-left: 1px solid #d8e1ed; }
  .insight-preview-card:last-child { border-bottom: 0; }
  .work-card-large .work-visual, .work-visual { min-height: 290px; }
  .work-heading { align-items: flex-start; }
  .work-heading > .text-link { margin: 0; }
  .page-hero-inner { min-height: 350px; padding-top: 45px; padding-bottom: 25px; }
  .page-hero h1 { font-size: clamp(53px, 13vw, 72px); }
  .page-hero::after { top: -240px; right: -320px; }
  .page-hero-bottom { margin-top: 35px; font-size: 9px; }
  .page-intro { max-width: 480px; font-size: 13px; }
  .values-grid { grid-template-columns: 1fr; gap: 12px; }
  .founder-details { grid-template-columns: 1fr; }
  .mission-vision-grid { grid-template-columns: 1fr; }
  .mission-panel { grid-template-columns: 1fr; gap: 13px; padding: 22px; }
  .value-card { min-height: auto; padding: 22px; }
  .value-icon { margin-bottom: 19px; }
  .process-list article { grid-template-columns: 39px 1fr; gap: 13px; }
  .process-tag { grid-column: 2; }
  .service-detail { grid-template-columns: 1fr; gap: 17px; padding: 34px 0; }
  .quote-next-step { align-items: flex-start; flex-direction: column; gap: 16px; }
  .service-detail:first-child { padding-top: 0; }
  .detail-number { padding: 0; }
  .detail-graphic { min-height: 215px; }
  .detail-content ul { gap: 8px 12px; }
  .service-ways { grid-template-columns: 1fr; gap: 10px; }
  .ways-grid { gap: 24px 18px; }
  .portfolio-section { padding-top: 53px; }
  .portfolio-records-section { padding-bottom: 20px; }
  .portfolio-record-body { padding: 24px 20px; }
  .portfolio-record-heading { flex-direction: column; gap: 12px; }
  .more-projects { grid-template-columns: 40px 1fr; gap: 13px; padding: 19px; }
  .more-projects > a { grid-column: 2; }
  .portfolio-intro { grid-template-columns: 1fr; gap: 9px; }
  .portfolio-featured-project { grid-template-columns: 1fr; }
  .portfolio-featured-art { min-height: 245px; }
  .portfolio-featured-copy { padding: 24px 20px; }
  .portfolio-featured-copy h2 { margin-top: 12px; }
  .home-featured-project { grid-template-columns: 1fr; }
  .home-featured-visual { min-height: 170px; }
  .home-featured-copy { padding: 21px 19px; }
  .case-hero .page-hero-inner { min-height: 0; }
  .case-hero-actions { align-items: stretch; flex-direction: column; width: 100%; }
  .case-hero-actions .button { justify-content: space-between; }
  .case-feature-banner { min-height: 300px; }
  .case-banner-node { font-size: 7px; }
  .case-banner-node-one { left: 3%; }
  .case-banner-node-two { right: 3%; }
  .case-status { padding: 20px; }
  .case-overview-grid { gap: 24px; margin-bottom: 48px; }
  .case-narrative { padding: 48px 0; }
  .case-narrative-grid { grid-template-columns: 1fr; }
  .case-narrative-grid article { padding: 19px; }
  .case-roadmap { padding: 48px 0; }
  .case-roadmap-list li { grid-template-columns: 27px minmax(0, 1fr); gap: 10px; }
  .case-roadmap-list b { grid-column: 2; }
  .case-risk-note { padding: 20px; }
  .case-reflection { grid-template-columns: 1fr; gap: 18px; padding: 48px 0; }
  .case-pending { padding-top: 30px; }
  .case-pending .case-hero-actions { margin-top: 16px; }
  .portfolio-filters { gap: 7px; }
  .filter-button { padding: 8px 10px; font-size: 10px; }
  .portfolio-grid { grid-template-columns: 1fr; gap: 37px; }
  .portfolio-card .work-visual, .portfolio-card.portfolio-featured .work-visual { min-height: 300px; }
  .insight-article { grid-template-columns: 1fr; gap: 13px; padding: 35px 0; }
  .insight-meta { padding: 0; }
  .contact-grid, .faq-grid { grid-template-columns: 1fr; gap: 40px; }
  .benefits-grid { grid-template-columns: 1fr; }
  .benefits-grid article, .benefits-grid article:first-child { border-left: 1px solid var(--line); border-bottom: 1px solid var(--line); }
  .benefits-grid article:last-child { border-bottom: 0; }
  .testimonial-placeholder { align-items: flex-start; gap: 13px; padding: 20px; }
  .testimonial-placeholder p { font-size: 15px; }
  .caveat-panel { grid-template-columns: 1fr; gap: 13px; padding: 21px; }
  .caveat-panel .button { grid-column: auto; }
  .case-facts { grid-template-columns: 1fr; }
  .legal-layout { grid-template-columns: 1fr; gap: 25px; }
  .legal-layout aside { position: static; }
  .not-found { min-height: 540px; }
  .contact-section { padding-top: 61px; }
  .contact-aside h2 { font-size: 43px; }
  .contact-note { max-width: 410px; margin-top: 24px; }
  .form-row { grid-template-columns: 1fr; gap: 18px; }
  .faq-grid h2 { font-size: 42px; }
  .cta-inner { min-height: 290px; align-items: flex-start; flex-direction: column; justify-content: center; gap: 26px; }
  .cta-inner h2 { font-size: 48px; }
  .cta-inner > .button { margin: 0; }
  .cta-decoration { right: -98px; font-size: 230px; }
  .footer-main { flex-direction: column; gap: 35px; padding-top: 43px; padding-bottom: 34px; }
  .footer-links { width: 100%; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 30px 24px; margin: 0; }
  .back-top { top: 45px; }
  .footer-bottom { flex-wrap: wrap; gap: 9px 20px; font-size: 8px; }
}
@media (max-width: 390px) {
  .portfolio-record-facts { grid-template-columns: 1fr; }
  .portfolio-record-actions { align-items: stretch; flex-direction: column; }
  .portfolio-record-actions .button { justify-content: space-between; }
  .container { width: calc(100% - 32px); }
  .header-inner { width: calc(100% - 32px); }
  .hero-edge { font-size: 6px; }
  .hero-slide { padding-top: 43px; }
  .hero-slide h1, .hero-slide h2 { font-size: clamp(37px, 10.5vw, 43px); }
  .hero-intro { font-size: 13px; line-height: 1.7; }
  .hero-actions { align-items: stretch; flex-direction: column; gap: 9px; }
  .hero-actions .button { width: 100%; justify-content: space-between; }
  .hero-carousel-controls { gap: 7px; }
  .hero-pagination { gap: 3px; }
  .hero-dot { width: 23px; }
  .hero-slide-count { display: none; }
  .hero-control-buttons { gap: 5px; }
  .hero-arrow { min-width: 35px; }
  .hero-autoplay { min-width: 68px; padding: 0 7px; }
  .art-node { width: 65px; height: 65px; font-size: 8px; }
  .art-center { width: 119px; height: 119px; }
  .expertise-card { width: 165px; min-height: 96px; padding: 10px; }
  .expertise-card strong { font-size: 22px; }
  .expertise-card .mono { font-size: 7px; }
  .expertise-core { width: 118px; height: 118px; }
  .growth-panel { width: 80%; padding: 16px; }
  .growth-chart { height: 150px; gap: 6px; }
  .growth-badge { min-width: 86px; min-height: 63px; padding: 7px; font-size: 7px; }
  .service-card { padding-inline: 12px; }
  .service-catalog-grid { grid-template-columns: 1fr; }
  .service-catalog-card { min-height: auto; padding: 20px; }
  .service-catalog-card > p:not(.catalog-need) { min-height: auto; }
  .service-card h3 { font-size: 15px; }
  .service-card p { font-size: 10px; }
  .detail-content ul { grid-template-columns: 1fr; }
  .ways-grid { grid-template-columns: 1fr; }
  .directory-grid { grid-template-columns: 1fr; }
  .portfolio-card .work-visual, .portfolio-card.portfolio-featured .work-visual { min-height: 260px; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
  .hero-slide { transform: none; }
}