:root {
  --ink: #202421;
  --ink-soft: #4a514a;
  --ink-faint: #74796f;
  --paper: #ede9df;
  --paper-light: #f6f2e9;
  --paper-deep: #e3ddd0;
  --night: #17201e;
  --night-2: #202d29;
  --cinnabar: #b9513d;
  --cinnabar-dark: #913c2f;
  --pine: #42645d;
  --gold: #b38b5d;
  --line: rgba(32, 36, 33, 0.16);
  --line-light: rgba(246, 242, 233, 0.17);
  --serif: "Noto Serif SC", "STSong", "SimSun", serif;
  --brush: "Ma Shan Zheng", "KaiTi", cursive;
  --sans: "PingFang SC", "Microsoft YaHei", system-ui, sans-serif;
  --container: 1200px;
  --ease: cubic-bezier(0.2, 0.75, 0.25, 1);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  background: var(--paper);
  color: var(--ink);
  font-family: var(--sans);
  line-height: 1.6;
  overflow-x: hidden;
}
::selection { background: var(--cinnabar); color: var(--paper-light); }
a { color: inherit; text-decoration: none; }
button { font: inherit; }
:focus-visible { outline: 2px solid var(--cinnabar); outline-offset: 4px; }
.container { width: min(var(--container), calc(100% - 96px)); margin: 0 auto; position: relative; z-index: 1; }
.section { position: relative; padding: clamp(88px, 10vw, 150px) 0; overflow: hidden; }
.section-paper { background: var(--paper-light); }
.section-dark { background: var(--night); color: var(--paper-light); }
.grain {
  position: fixed; inset: 0; z-index: 9; pointer-events: none; opacity: .1; mix-blend-mode: multiply;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 160 160' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.16'/%3E%3C/svg%3E");
}
.ink-canvas { position: fixed; inset: 0; z-index: 0; width: 100%; height: 100%; pointer-events: none; opacity: .52; mix-blend-mode: multiply; }

/* Header */
.site-header { position: fixed; inset: 0 0 auto; z-index: 20; transition: background .35s var(--ease), box-shadow .35s var(--ease); }
.site-header.is-scrolled { background: rgba(237, 233, 223, .88); backdrop-filter: blur(18px); box-shadow: 0 1px 0 var(--line); }
.header-inner { width: min(var(--container), calc(100% - 96px)); height: 86px; margin: 0 auto; display: flex; align-items: center; justify-content: space-between; gap: 28px; }
.brand { display: inline-flex; flex-direction: column; align-items: flex-start; gap: 3px; flex-shrink: 0; }
.brand-logo-wrap { width: 166px; height: 41px; display: block; overflow: hidden; }
.brand-logo { width: 166px; height: 44px; object-fit: contain; object-position: center; display: block; }
.brand-caption { padding-left: 2px; color: var(--ink-faint); font-size: 10px; letter-spacing: .18em; white-space: nowrap; }
.primary-nav { display: flex; align-items: center; gap: clamp(20px, 2.8vw, 42px); margin-left: auto; }
.nav-link { position: relative; color: var(--ink-soft); font-family: var(--serif); font-size: 14px; transition: color .25s ease; }
.nav-link::after { content: ""; position: absolute; left: 0; right: 100%; bottom: -8px; height: 1px; background: var(--cinnabar); transition: right .3s var(--ease); }
.nav-link:hover, .nav-link.is-active { color: var(--ink); }
.nav-link:hover::after, .nav-link.is-active::after { right: 0; }
.header-cta { display: inline-flex; align-items: center; gap: 10px; padding: 11px 17px 11px 20px; border: 1px solid var(--ink); font-family: var(--serif); font-size: 13px; transition: background .25s ease, color .25s ease, transform .25s var(--ease); }
.header-cta span { color: var(--cinnabar); font-size: 17px; line-height: 1; }
.header-cta:hover { background: var(--ink); color: var(--paper-light); transform: translateY(-2px); }
.nav-toggle { display: none; width: 44px; height: 44px; padding: 0; border: 1px solid var(--line); background: transparent; cursor: pointer; }
.nav-toggle span { width: 18px; height: 1px; margin: 4px auto; display: block; background: var(--ink); transition: transform .25s ease, opacity .25s ease; }
.nav-toggle.is-open span:first-child { transform: translateY(5px) rotate(45deg); }
.nav-toggle.is-open span:nth-child(2) { opacity: 0; }
.nav-toggle.is-open span:last-child { transform: translateY(-5px) rotate(-45deg); }
.mobile-nav { display: none; }

/* Shared typography */
.eyebrow { display: flex; align-items: center; gap: 10px; margin: 0 0 22px; color: var(--cinnabar); font-family: var(--sans); font-size: 10px; letter-spacing: .2em; font-weight: 700; }
.eyebrow-dot { width: 9px; height: 4px; display: inline-block; background: var(--cinnabar); border-radius: 62% 38% 57% 43%; transform: rotate(-12deg); filter: blur(.1px); }
.eyebrow-light { color: #d9967d; }
.eyebrow-light .eyebrow-dot { background: #d9967d; }
h1, h2, h3, p { margin-top: 0; }
h1, h2, h3, blockquote { font-family: var(--serif); font-weight: 500; }
h1 em, h2 em { color: var(--cinnabar); font-style: normal; }
h1 { margin-bottom: 25px; font-size: clamp(3.3rem, 7vw, 6.5rem); letter-spacing: -.075em; line-height: 1.08; }
h2 { margin-bottom: 22px; font-size: clamp(2.45rem, 4.8vw, 4.55rem); letter-spacing: -.065em; line-height: 1.15; }
.section-heading.centered { max-width: 720px; margin: 0 auto 65px; text-align: center; }
.section-heading.centered .eyebrow { justify-content: center; }
.section-heading.centered h2 { margin-bottom: 18px; }
.section-intro { max-width: 520px; margin: 0 auto; color: var(--ink-soft); font-size: 15px; line-height: 1.9; }
.section-dark .section-intro { color: rgba(246, 242, 233, .64); }
.button { display: inline-flex; align-items: center; justify-content: center; gap: 13px; min-height: 51px; padding: 0 23px; border: 1px solid transparent; font-family: var(--serif); font-size: 14px; transition: transform .3s var(--ease), background .3s ease, color .3s ease, border-color .3s ease; }
.button span { font-size: 18px; line-height: 1; transition: transform .3s var(--ease); }
.button:hover { transform: translateY(-3px); }
.button:hover span { transform: translate(2px, -2px); }
.button-primary { background: var(--cinnabar); color: #fff8ee; box-shadow: 0 15px 30px rgba(145, 60, 47, .17); }
.button-primary:hover { background: var(--cinnabar-dark); }
.button-ghost { border-color: var(--line); color: var(--ink-soft); }
.button-ghost:hover { border-color: var(--ink); color: var(--ink); }
.button-light { background: var(--paper-light); color: var(--ink); }
.button-light:hover { background: #fffdf8; }

/* Hero */
.hero { min-height: min(920px, 100vh); padding-top: 166px; padding-bottom: 95px; display: flex; align-items: center; }
.hero-grid { display: grid; grid-template-columns: minmax(0, .94fr) minmax(470px, .9fr); align-items: center; gap: clamp(48px, 7vw, 110px); min-width: 0; }
.hero-copy { position: relative; z-index: 2; min-width: 0; }
.hero-lede { max-width: 470px; margin-bottom: 35px; color: var(--ink-soft); font-family: var(--serif); font-size: 17px; line-height: 2; }
.hero-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 13px; }
.platform-proof { display: flex; align-items: center; flex-wrap: wrap; gap: 14px; margin-top: 51px; color: var(--ink-faint); font-family: var(--serif); font-size: 12px; }
.proof-label { color: var(--ink-soft); }
.proof-divider { width: 1px; height: 17px; background: var(--line); }
.platform-name { color: var(--ink); }
.hero-ink { position: absolute; pointer-events: none; filter: blur(.2px); opacity: .18; }
.hero-ink-left { top: 20%; left: -10%; width: 400px; height: 600px; background: radial-gradient(ellipse at center, rgba(41, 50, 45, .33), transparent 68%); transform: rotate(18deg); }
.hero-ink-right { right: -11%; bottom: 2%; width: 480px; height: 500px; background: radial-gradient(ellipse at center, rgba(185, 81, 61, .18), transparent 65%); transform: rotate(-25deg); }
.hero-stage { position: relative; min-height: 535px; display: flex; align-items: center; justify-content: center; min-width: 0; }
.stage-aura { position: absolute; width: 88%; aspect-ratio: 1; border-radius: 50%; background: radial-gradient(circle, rgba(66, 100, 93, .18), transparent 67%); filter: blur(3px); }
.stage-card { position: relative; width: min(100%, 510px); padding: 15px; background: rgba(32, 36, 33, .93); border: 1px solid rgba(255, 251, 240, .2); box-shadow: 25px 35px 70px rgba(25, 30, 26, .24), inset 0 0 0 1px rgba(255,255,255,.035); transform: rotate(2.8deg); transition: transform .7s var(--ease); }
.hero-stage:hover .stage-card { transform: rotate(0deg) translateY(-5px); }
.stage-topbar, .stage-bottom { display: flex; align-items: center; justify-content: space-between; color: rgba(246, 242, 233, .7); font-family: var(--sans); font-size: 10px; letter-spacing: .05em; }
.stage-topbar { min-height: 26px; padding: 0 3px 12px; }
.stage-brandline { display: flex; align-items: center; gap: 7px; }
.status-dot { width: 8px; height: 4px; display: inline-block; background: #c86a51; border-radius: 42% 58% 54% 46%; transform: rotate(-10deg); filter: blur(.15px); animation: breathe 2.2s ease-in-out infinite; }
.stage-time { font-variant-numeric: tabular-nums; opacity: .65; }
.stage-screen { position: relative; min-height: 356px; overflow: hidden; background: #78857a; }
.screen-wash { position: absolute; border-radius: 52% 48% 60% 40%; filter: blur(17px); opacity: .62; }
.wash-one { width: 77%; height: 90%; top: -12%; left: -10%; background: #aeb5a4; transform: rotate(-14deg); }
.wash-two { width: 74%; height: 84%; right: -8%; bottom: -23%; background: #4d6257; transform: rotate(34deg); opacity: .8; }
.screen-grid { position: absolute; inset: 0; opacity: .25; background: linear-gradient(90deg, transparent 49.8%, rgba(245, 239, 224, .4) 50%, transparent 50.2%), linear-gradient(0deg, transparent 49.8%, rgba(245, 239, 224, .4) 50%, transparent 50.2%); background-size: 33.33% 33.33%; }
.screen-copy { position: absolute; left: 10%; bottom: 15%; z-index: 2; color: #f3eedf; }
.screen-kicker { display: block; margin-bottom: 13px; font-size: 10px; letter-spacing: .14em; opacity: .86; }
.screen-copy strong { display: block; font-family: var(--serif); font-size: clamp(2rem, 4vw, 3.25rem); font-weight: 600; letter-spacing: -.08em; line-height: 1.15; text-shadow: 0 3px 20px rgba(25, 36, 31, .2); }
.screen-sub { display: block; margin-top: 18px; font-size: 10px; letter-spacing: .1em; opacity: .8; }
.screen-seal { position: absolute; top: 12%; right: 13%; z-index: 2; width: 53px; height: 53px; display: grid; place-items: center; border: 1px solid rgba(185,81,61,.76); color: rgba(185,81,61,.9); font-family: var(--brush); font-size: 29px; line-height: 1; transform: rotate(8deg); }
.stage-bottom { min-height: 34px; padding: 13px 3px 0; }
.stage-metric { display: flex; align-items: baseline; gap: 8px; }
.stage-metric span { opacity: .57; }
.stage-metric strong { color: #efe8d9; font-family: var(--serif); font-size: 14px; font-weight: 500; }
.stage-metric-right { flex-direction: row-reverse; }
.waveform { display: flex; align-items: center; gap: 3px; height: 21px; opacity: .64; }
.waveform i { width: 2px; height: 7px; display: block; background: #d2a08b; animation: wave 1.2s ease-in-out infinite alternate; }
.waveform i:nth-child(2n) { height: 15px; animation-delay: -.3s; }.waveform i:nth-child(3n) { height: 10px; animation-delay: -.6s; }.waveform i:nth-child(4n) { height: 19px; animation-delay: -.9s; }
.stage-float { position: absolute; z-index: 3; display: flex; align-items: center; gap: 10px; min-width: 133px; padding: 11px 13px; background: rgba(246, 242, 233, .9); border: 1px solid rgba(32,36,33,.15); box-shadow: 0 17px 32px rgba(32,36,33,.14); backdrop-filter: blur(8px); transform: rotate(-4deg); }
.stage-float-top { top: 13%; left: 1%; }.stage-float-bottom { right: -1%; bottom: 10%; transform: rotate(3deg); }
.float-icon { width: 27px; height: 27px; display: grid; place-items: center; background: var(--pine); color: var(--paper-light); font-family: var(--brush); font-size: 17px; }
.float-icon-red { background: var(--cinnabar); font-family: var(--sans); font-size: 14px; }
.stage-float small, .stage-float b { display: block; font-family: var(--sans); line-height: 1.25; }.stage-float small { color: var(--ink-faint); font-size: 9px; }.stage-float b { margin-top: 2px; color: var(--ink); font-size: 11px; font-weight: 600; }
.stage-brush { position: absolute; right: 0; top: 0; z-index: -1; width: 125%; height: 100%; opacity: .22; background: repeating-linear-gradient(97deg, transparent 0 12px, rgba(54,63,58,.18) 14px 17px, transparent 19px 29px); transform: rotate(-8deg); mask-image: radial-gradient(ellipse at center, #000 35%, transparent 70%); }
.scroll-cue { position: absolute; left: 48px; bottom: 25px; display: flex; align-items: center; gap: 10px; color: var(--ink-faint); font-size: 10px; letter-spacing: .2em; writing-mode: vertical-rl; }.scroll-cue span { width: 1px; height: 42px; background: var(--cinnabar); }

/* Manifesto */
.manifesto-grid { display: grid; grid-template-columns: .86fr 1.14fr; gap: clamp(60px, 11vw, 180px); align-items: end; }
.manifesto-body { padding-bottom: 7px; }.large-copy { max-width: 510px; margin-bottom: 50px; color: var(--ink-soft); font-family: var(--serif); font-size: clamp(1.15rem, 2vw, 1.42rem); line-height: 2; }
.stat-row { display: flex; gap: clamp(35px, 6vw, 80px); }.stat-item { display: flex; flex-direction: column; gap: 7px; }.stat-item strong { color: var(--cinnabar); font-family: var(--serif); font-size: clamp(2.5rem, 4vw, 4rem); font-weight: 500; letter-spacing: -.08em; line-height: 1; }.stat-item strong span { margin-left: 4px; color: var(--ink-faint); font-family: var(--sans); font-size: 13px; letter-spacing: .03em; }.stat-item > span { color: var(--ink-faint); font-size: 11px; }

/* Platforms */
.platforms { background: var(--paper); }.platform-layout { display: grid; grid-template-columns: .8fr 1.2fr; gap: clamp(45px, 8vw, 125px); align-items: stretch; }.platform-list { border-top: 1px solid var(--line); }.platform-tab { position: relative; width: 100%; min-height: 91px; display: grid; grid-template-columns: 48px 1fr auto; align-items: center; gap: 18px; padding: 15px 9px 15px 0; border: 0; border-bottom: 1px solid var(--line); background: transparent; color: var(--ink-soft); text-align: left; cursor: pointer; transition: color .25s ease, padding .35s var(--ease), background .3s ease; }.platform-tab::before { content: ""; position: absolute; left: -1px; top: 0; bottom: 0; width: 2px; background: var(--cinnabar); transform: scaleY(0); transform-origin: center; transition: transform .35s var(--ease); }.platform-tab:hover, .platform-tab.is-active { padding-left: 17px; color: var(--ink); background: rgba(255,255,255,.23); }.platform-tab.is-active::before { transform: scaleY(1); }.tab-num { color: var(--ink-faint); font-size: 11px; letter-spacing: .08em; }.platform-tab b, .platform-tab small { display: block; }.platform-tab b { font-family: var(--serif); font-size: 20px; font-weight: 500; }.platform-tab small { margin-top: 4px; color: var(--ink-faint); font-size: 11px; }.tab-arrow { color: var(--cinnabar); font-size: 18px; opacity: 0; transform: translate(-5px, 5px); transition: opacity .25s ease, transform .3s var(--ease); }.platform-tab:hover .tab-arrow, .platform-tab.is-active .tab-arrow { opacity: 1; transform: translate(0, 0); }
.platform-panel { position: relative; min-height: 404px; overflow: hidden; padding: clamp(34px, 5vw, 65px); background: var(--night-2); color: var(--paper-light); }.platform-panel::before { content: ""; position: absolute; inset: 0; background: radial-gradient(ellipse at 30% 15%, rgba(185,81,61,.22), transparent 38%), radial-gradient(ellipse at 90% 95%, rgba(66,100,93,.58), transparent 49%); opacity: .85; }.panel-label, .platform-panel h3, .platform-panel p, .panel-tags { position: relative; z-index: 1; }.panel-label { color: #d9967d; font-size: 10px; letter-spacing: .18em; }.panel-label span { color: rgba(246,242,233,.58); }.platform-panel h3 { max-width: 440px; margin: 55px 0 17px; font-size: clamp(2rem, 3.5vw, 3.45rem); letter-spacing: -.08em; line-height: 1.22; }.platform-panel p { max-width: 420px; margin-bottom: 28px; color: rgba(246,242,233,.65); font-family: var(--serif); font-size: 14px; line-height: 1.9; }.panel-tags { display: flex; flex-wrap: wrap; gap: 8px; }.panel-tags span { padding: 6px 10px; border: 1px solid rgba(246,242,233,.2); color: rgba(246,242,233,.66); font-size: 10px; }.panel-ink { position: absolute; right: -5%; bottom: -33%; width: 60%; height: 78%; border-radius: 50%; border: 1px solid rgba(225, 211, 186, .2); box-shadow: 0 0 0 24px rgba(225,211,186,.03), 0 0 0 48px rgba(225,211,186,.025); transform: rotate(19deg); }.panel-stamp { position: absolute; right: 11%; top: 17%; z-index: 1; width: 65px; height: 65px; display: grid; place-items: center; border: 1px solid rgba(214,139,117,.72); color: rgba(214,139,117,.85); font-family: var(--brush); font-size: 27px; line-height: .8; transform: rotate(9deg); }.panel-stamp small { font-family: var(--sans); font-size: 7px; letter-spacing: .14em; }

/* Capability */
.capability { isolation: isolate; }.ink-line { position: absolute; z-index: -1; height: 42%; border-radius: 50%; border: 1px solid rgba(246,242,233,.08); transform: rotate(-16deg); }.ink-line-one { left: -16%; top: 10%; width: 80%; }.ink-line-two { right: -25%; bottom: -5%; width: 84%; transform: rotate(22deg); }.capability-heading { max-width: 680px; }.capability-heading .section-intro { margin: 0; }.capability-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1px; margin-top: 70px; border-top: 1px solid var(--line-light); border-bottom: 1px solid var(--line-light); }.capability-card { min-height: 345px; position: relative; padding: 32px 30px 35px; border-right: 1px solid var(--line-light); transition: background .35s ease, transform .35s var(--ease); }.capability-card:last-child { border-right: 0; }.capability-card:hover { background: rgba(246,242,233,.055); transform: translateY(-6px); }.capability-card-featured { background: rgba(246,242,233,.075); }.capability-index { color: rgba(246,242,233,.42); font-size: 11px; letter-spacing: .1em; }.capability-mark { position: absolute; top: 25px; right: 30px; color: rgba(217,150,125,.7); font-family: var(--brush); font-size: 41px; line-height: 1; }.capability-card h3 { margin: 62px 0 13px; font-size: 27px; letter-spacing: -.05em; }.capability-card p { max-width: 280px; min-height: 78px; color: rgba(246,242,233,.62); font-family: var(--serif); font-size: 13px; line-height: 1.95; }.text-link { display: inline-flex; align-items: center; gap: 9px; color: #d9967d; font-family: var(--serif); font-size: 12px; }.text-link span { font-family: var(--sans); font-size: 16px; transition: transform .25s var(--ease); }.text-link:hover span { transform: translate(3px, -3px); }

/* Process & quote */
.process-track { position: relative; display: grid; grid-template-columns: repeat(3, 1fr); gap: 0; margin-top: 68px; border-top: 1px solid var(--line); }.process-track::before { content: ""; position: absolute; top: -1px; left: 0; width: 33.33%; height: 2px; background: var(--cinnabar); }.process-step { position: relative; display: grid; grid-template-columns: 52px 1fr; gap: 17px; min-height: 191px; padding: 37px 38px 0 0; border-right: 1px solid var(--line); }.process-step:not(:first-child) { padding-left: 38px; }.process-step:last-child { border-right: 0; }.process-no { color: var(--cinnabar); font-family: var(--brush); font-size: 38px; line-height: 1; }.process-step h3 { margin: 0 0 11px; font-size: 21px; letter-spacing: -.04em; }.process-step p { max-width: 230px; margin: 0; color: var(--ink-faint); font-family: var(--serif); font-size: 13px; line-height: 1.9; }.quote-grid { display: grid; grid-template-columns: 90px 1fr 220px; gap: 20px; align-items: center; }.quote-mark { color: var(--cinnabar); font-family: Georgia, serif; font-size: 106px; line-height: .7; }.quote-grid blockquote { max-width: 720px; margin: 0; font-size: clamp(1.8rem, 3.4vw, 3.25rem); letter-spacing: -.07em; line-height: 1.35; }.quote-meta { display: flex; align-items: center; gap: 12px; justify-self: end; color: var(--ink-faint); font-family: var(--serif); font-size: 12px; white-space: nowrap; }.quote-line { display: block; width: 35px; height: 1px; background: var(--cinnabar); }

/* Contact & footer */
.contact { min-height: 355px; display: flex; align-items: center; background: var(--cinnabar); color: #fff8ee; }.contact-wash { position: absolute; inset: 0; opacity: .32; background: radial-gradient(ellipse at 17% 28%, rgba(255,232,203,.18), transparent 34%), radial-gradient(ellipse at 91% 80%, rgba(55, 38, 28, .25), transparent 36%); }.contact-inner { display: flex; align-items: end; justify-content: space-between; gap: 45px; }.contact .eyebrow { color: rgba(255,248,238,.65); }.contact h2 { margin-bottom: 15px; }.contact h2 em { color: #f5d4ac; }.contact-copy { max-width: 510px; margin: 0; color: rgba(255,248,238,.78); font-family: var(--serif); font-size: 14px; line-height: 1.9; }.site-footer { background: var(--night); color: var(--paper-light); }.footer-inner { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 30px; min-height: 105px; }.footer-brand { display: flex; align-items: center; gap: 17px; }.footer-brand img { width: 136px; height: 35px; object-fit: contain; filter: invert(1) brightness(2); }.footer-brand span { color: rgba(246,242,233,.47); font-family: var(--serif); font-size: 11px; }.footer-links { display: flex; gap: 26px; color: rgba(246,242,233,.63); font-family: var(--serif); font-size: 12px; }.footer-links a:hover { color: var(--paper-light); }.footer-copy { justify-self: end; color: rgba(246,242,233,.35); font-size: 10px; letter-spacing: .05em; }

/* Motion */
.reveal { opacity: 0; transform: translateY(25px); transition: opacity .8s var(--ease), transform .8s var(--ease); }.reveal-delay { transition-delay: .13s; }.reveal-delay-2 { transition-delay: .24s; }.reveal.is-visible { opacity: 1; transform: translateY(0); }
@keyframes breathe { 0%, 100% { opacity: .55; transform: scale(.85); } 50% { opacity: 1; transform: scale(1.15); } }
@keyframes wave { from { transform: scaleY(.55); } to { transform: scaleY(1.2); } }

@media (max-width: 1050px) {
  .container, .header-inner { width: min(var(--container), calc(100% - 56px)); }
  .primary-nav { gap: 18px; }.nav-link { font-size: 13px; }.hero-grid { grid-template-columns: minmax(0, 1fr) minmax(390px, .82fr); gap: 42px; }.stage-float-top { left: -5%; }.stage-float-bottom { right: -7%; }
  .manifesto-grid { gap: 60px; }.platform-layout { gap: 50px; }.footer-inner { grid-template-columns: 1fr auto; }.footer-copy { grid-column: 1 / -1; justify-self: start; padding-bottom: 20px; }
}
@media (max-width: 820px) {
  .header-inner { height: 75px; }.primary-nav, .header-cta { display: none; }.nav-toggle { display: block; }.mobile-nav { position: absolute; left: 0; right: 0; top: 75px; display: flex; flex-direction: column; padding: 8px 28px 23px; background: rgba(237,233,223,.97); border-bottom: 1px solid var(--line); transform: translateY(-13px); opacity: 0; visibility: hidden; transition: opacity .3s ease, transform .3s var(--ease), visibility .3s; }.mobile-nav.is-open { opacity: 1; visibility: visible; transform: translateY(0); }.mobile-nav a { padding: 13px 0; border-bottom: 1px solid var(--line); font-family: var(--serif); font-size: 15px; }.mobile-nav a:last-child { border-bottom: 0; }.hero { padding-top: 130px; min-height: auto; }.hero-grid { width: calc(100% - 40px); max-width: none; grid-template-columns: minmax(0, 1fr); }.hero-copy { width: 100%; max-width: 680px; }.hero-lede { width: 100%; }.hero-stage { min-height: 510px; max-width: 620px; margin: 12px auto 0; width: 100%; }.manifesto-grid { grid-template-columns: 1fr; gap: 20px; }.platform-layout { grid-template-columns: 1fr; }.platform-panel { min-height: 365px; }.capability-grid { grid-template-columns: 1fr; }.capability-card { min-height: 280px; border-right: 0; border-bottom: 1px solid var(--line-light); }.capability-card:last-child { border-bottom: 0; }.capability-card p { min-height: auto; max-width: 520px; }.process-track { grid-template-columns: 1fr; }.process-track::before { width: 100%; }.process-step, .process-step:not(:first-child) { min-height: auto; padding: 28px 0; border-right: 0; border-bottom: 1px solid var(--line); }.process-step:last-child { border-bottom: 0; }.quote-grid { grid-template-columns: 58px 1fr; }.quote-meta { grid-column: 2; justify-self: start; }.quote-mark { font-size: 80px; }.contact-inner { align-items: flex-start; flex-direction: column; }.footer-inner { grid-template-columns: 1fr; padding: 30px 0; gap: 18px; }.footer-copy { grid-column: auto; padding: 0; }
}
@media (max-width: 560px) {
  .container, .header-inner { width: calc(100% - 40px); }.brand-logo-wrap, .brand-logo { width: 142px; height: 37px; }.brand-caption { font-size: 8px; letter-spacing: .13em; }.section { padding: 76px 0; }.hero { padding-top: 122px; padding-bottom: 72px; }.hero h1 { font-size: clamp(3.1rem, 15vw, 4.9rem); }.hero-lede { font-size: 15px; line-height: 1.9; }.hero-actions { align-items: stretch; flex-direction: column; }.button { width: 100%; }.platform-proof { margin-top: 35px; gap: 11px; }.proof-divider { display: none; }.hero-stage { min-height: 383px; margin-top: 25px; }.stage-card { padding: 10px; transform: rotate(1.8deg); }.stage-screen { min-height: 255px; }.screen-copy strong { font-size: 2.3rem; }.screen-sub { margin-top: 12px; font-size: 8px; }.screen-seal { width: 43px; height: 43px; font-size: 23px; }.stage-float { min-width: 115px; padding: 9px; }.stage-float-top { top: 3%; left: -4%; }.stage-float-bottom { bottom: 3%; right: -4%; }.float-icon { width: 23px; height: 23px; font-size: 14px; }.stage-float small { font-size: 8px; }.stage-float b { font-size: 9px; }.scroll-cue { display: none; }.large-copy { margin-bottom: 35px; font-size: 1.1rem; }.stat-row { justify-content: space-between; gap: 10px; }.stat-item strong { font-size: 2.6rem; }.stat-item > span { font-size: 10px; }.section-heading.centered { margin-bottom: 43px; }.platform-panel { min-height: 380px; padding: 31px 26px; }.platform-panel h3 { margin-top: 40px; font-size: 2.25rem; }.panel-stamp { right: 9%; top: 15%; width: 53px; height: 53px; font-size: 22px; }.capability-grid { margin-top: 48px; }.capability-card { padding: 26px 22px 31px; }.capability-mark { right: 22px; }.quote-grid { gap: 12px; }.quote-grid blockquote { font-size: 1.8rem; }.quote-meta { font-size: 10px; }.quote-line { width: 22px; }.contact h2 { font-size: 2.8rem; }.footer-links { gap: 18px; flex-wrap: wrap; }.footer-brand { flex-direction: column; align-items: flex-start; gap: 7px; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: .001ms !important; animation-iteration-count: 1 !important; transition-duration: .001ms !important; }
  .reveal { opacity: 1; transform: none; }
}

/* Solution page */
.subpage-hero { min-height: 640px; display: flex; align-items: end; padding-top: 160px; padding-bottom: 105px; }.subpage-brush { position: absolute; right: -12%; top: 14%; width: 55%; height: 72%; opacity: .19; border-radius: 50%; background: radial-gradient(ellipse at center, rgba(66,100,93,.35), transparent 65%); filter: blur(5px); transform: rotate(-17deg); }.subpage-hero-inner { max-width: 730px; margin-left: max(48px, calc((100% - var(--container)) / 2)); }.subpage-hero h1 { margin-bottom: 25px; }.subpage-hero-inner > p:last-child { max-width: 490px; color: var(--ink-soft); font-family: var(--serif); font-size: 16px; line-height: 2; }.solution-section { background: var(--paper); }.solution-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 22px; }.solution-card { position: relative; min-height: 492px; padding: 36px 38px 34px; border: 1px solid var(--line); background: rgba(246,242,233,.7); transition: transform .35s var(--ease), box-shadow .35s ease, background .35s ease; }.solution-card:hover { transform: translateY(-7px); background: #faf7ef; box-shadow: 0 24px 45px rgba(32,36,33,.1); }.solution-card-dark { background: var(--night-2); color: var(--paper-light); border-color: transparent; }.solution-card-dark:hover { background: #283833; }.solution-card-line { background: transparent; }.solution-no { position: absolute; top: 38px; right: 38px; color: var(--ink-faint); font-size: 11px; letter-spacing: .1em; }.solution-card-dark .solution-no { color: rgba(246,242,233,.38); }.solution-symbol { color: var(--pine); font-family: var(--brush); font-size: 58px; line-height: 1; }.solution-symbol-red { color: var(--cinnabar); }.solution-kicker { margin: 28px 0 7px; color: var(--cinnabar); font-size: 10px; font-weight: 700; letter-spacing: .18em; }.solution-card-dark .solution-kicker { color: #d9967d; }.solution-card h2 { margin-bottom: 15px; font-size: 2.45rem; }.solution-desc { max-width: 440px; min-height: 75px; color: var(--ink-soft); font-family: var(--serif); font-size: 14px; line-height: 1.9; }.solution-card-dark .solution-desc { color: rgba(246,242,233,.65); }.solution-card ul { display: grid; gap: 7px; min-height: 95px; margin: 21px 0 25px; padding: 0; list-style: none; color: var(--ink-faint); font-size: 12px; }.solution-card-dark ul { color: rgba(246,242,233,.58); }.solution-card li { position: relative; padding-left: 16px; }.solution-card li::before { content: ""; position: absolute; left: 0; top: .67em; width: 5px; height: 1px; background: var(--cinnabar); }.solution-band { min-height: 420px; display: flex; align-items: center; }.solution-band-inner { max-width: 760px; }.solution-band h2 { margin-bottom: 19px; }.solution-band p:not(.eyebrow) { max-width: 500px; margin-bottom: 30px; color: rgba(246,242,233,.65); font-family: var(--serif); font-size: 14px; line-height: 1.9; }
.platform-panel.is-switching h3, .platform-panel.is-switching p, .platform-panel.is-switching .panel-tags { opacity: .18; transform: translateY(7px); }.platform-panel h3, .platform-panel p, .platform-panel .panel-tags { transition: opacity .18s ease, transform .18s var(--ease); }

@media (max-width: 820px) {
  .subpage-hero { min-height: 540px; padding-bottom: 75px; }.subpage-hero-inner { margin-left: 0; }.solution-grid { grid-template-columns: 1fr; }.solution-card { min-height: auto; }.solution-desc { min-height: auto; }.solution-card ul { min-height: auto; }
}
@media (max-width: 560px) {
  .subpage-hero { min-height: 490px; padding-top: 125px; }.subpage-hero h1 { font-size: 3.25rem; }.solution-card { padding: 29px 24px 28px; }.solution-no { top: 30px; right: 24px; }.solution-card h2 { font-size: 2.15rem; }.solution-band h2 { font-size: 2.8rem; }
}

/* Ultimate gu feng direction */
:root {
  --ink: #1e241f;
  --ink-soft: #4f554c;
  --ink-faint: #7e7a6e;
  --paper: #e7dfd0;
  --paper-light: #f4ede1;
  --paper-deep: #d7c8b4;
  --night: #14211d;
  --night-2: #20332c;
  --cinnabar: #a83d2f;
  --cinnabar-dark: #7d2c25;
  --pine: #3f6258;
  --gold: #ad8b5f;
  --line: rgba(62, 49, 34, .12);
  --line-light: rgba(246, 239, 226, .14);
}

body {
  background-color: var(--paper);
  background-image:
    radial-gradient(ellipse at 11% 12%, rgba(72, 92, 76, .13), transparent 25%),
    radial-gradient(ellipse at 88% 22%, rgba(168, 61, 47, .07), transparent 24%),
    radial-gradient(ellipse at 55% 100%, rgba(183, 157, 116, .14), transparent 36%);
}
body::before {
  content: "";
  position: fixed;
  z-index: -1;
  inset: 0;
  pointer-events: none;
  background: url("assets/ink-wash.svg") center 8% / min(1120px, 92vw) auto no-repeat;
  opacity: .08;
  mix-blend-mode: multiply;
}
.grain { opacity: .2; }

.site-header {
  background: linear-gradient(180deg, rgba(231, 223, 208, .9), rgba(231, 223, 208, .35) 75%, transparent);
  backdrop-filter: blur(2px);
}
.site-header::after {
  content: "";
  position: absolute;
  left: max(28px, calc((100% - var(--container)) / 2));
  right: max(28px, calc((100% - var(--container)) / 2));
  bottom: 0;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(69, 52, 35, .22) 16%, rgba(69, 52, 35, .08) 84%, transparent);
}
.site-header.is-scrolled {
  background: rgba(231, 223, 208, .92);
  box-shadow: 0 10px 25px rgba(59, 45, 29, .06);
}
.brand-logo { filter: sepia(.16) contrast(1.04); }
.brand-caption { font-family: var(--serif); letter-spacing: .25em; }
.nav-link { font-family: var(--serif); letter-spacing: .08em; }
.nav-link::after {
  left: 50%;
  right: auto;
  bottom: -12px;
  width: 22px;
  height: 5px;
  border-radius: 58% 42% 52% 48%;
  clip-path: polygon(0 44%, 18% 16%, 54% 26%, 100% 0, 85% 66%, 36% 100%);
  transform: translateX(-50%) scaleX(0);
  transform-origin: center;
  transition: transform .35s var(--ease);
}
.nav-link:hover::after, .nav-link.is-active::after { right: auto; transform: translateX(-50%) scaleX(1); }
.header-cta {
  border: 0;
  border-bottom: 1px solid var(--cinnabar);
  padding: 10px 4px 8px 9px;
  background: transparent;
  color: var(--ink);
}
.header-cta:hover { background: transparent; color: var(--cinnabar); transform: translateY(-2px); }
.header-cta::before { content: ""; width: 5px; height: 5px; margin-right: 2px; background: var(--cinnabar); border-radius: 58% 42% 50% 50%; transform: rotate(20deg); }

h1, h2, h3, blockquote { font-family: var(--serif); }
h1, h2 { font-family: var(--brush); font-weight: 400; letter-spacing: .015em; }
h1 { font-size: clamp(4rem, 7.5vw, 7.4rem); line-height: 1.08; text-shadow: 0 1px 0 rgba(255, 250, 240, .28); }
h2 { font-size: clamp(3rem, 5.2vw, 5rem); line-height: 1.18; }
h1 em, h2 em { color: var(--cinnabar); text-shadow: 1px 1px 0 rgba(117, 37, 29, .08); }
.eyebrow { font-family: var(--serif); letter-spacing: .18em; }
.section-heading h2::after {
  width: 55px;
  height: 8px;
  margin-top: 19px;
  border-radius: 64% 36% 48% 52%;
  clip-path: polygon(0 44%, 19% 8%, 53% 25%, 100% 0, 80% 69%, 32% 100%);
  background: var(--cinnabar);
  filter: blur(.2px);
  opacity: .42;
}

.button { font-family: var(--serif); letter-spacing: .05em; }
.button-primary {
  background: var(--cinnabar);
  box-shadow: 0 14px 28px rgba(125, 44, 37, .16);
  clip-path: polygon(1% 9%, 18% 3%, 57% 6%, 99% 0, 97% 86%, 74% 95%, 29% 92%, 0 100%);
}
.button-primary:hover { background: var(--cinnabar-dark); }
.button-ghost { border: 0; border-bottom: 1px solid rgba(54, 48, 38, .3); background: rgba(244, 237, 225, .2); }
.button-ghost:hover { border-color: var(--cinnabar); color: var(--cinnabar); background: rgba(244, 237, 225, .42); }

.hero { isolation: isolate; background: linear-gradient(180deg, rgba(244, 237, 225, .12), transparent 72%); }
.hero::after {
  content: "福";
  position: absolute;
  z-index: 0;
  right: 7%;
  top: 14%;
  color: rgba(168, 61, 47, .055);
  font-family: var(--brush);
  font-size: clamp(180px, 25vw, 370px);
  line-height: 1;
  transform: rotate(9deg);
  pointer-events: none;
}
.hero-ink { opacity: .42; }
.hero-ink-left { background: radial-gradient(ellipse at center, rgba(48, 73, 59, .4), transparent 68%); }
.hero-ink-right { background: radial-gradient(ellipse at center, rgba(168, 61, 47, .24), transparent 65%); }
.hero-stage::after { background: radial-gradient(ellipse 38% 29% at var(--spot-x, 50%) var(--spot-y, 50%), rgba(168, 61, 47, .12), transparent 72%); }

.stage-aura {
  width: 93%;
  border-radius: 57% 43% 49% 51%;
  background: radial-gradient(ellipse at center, rgba(63, 98, 85, .2), transparent 69%);
  transform: rotate(-9deg);
}
.stage-card {
  width: min(100%, 510px);
  padding: 14px;
  background: #17231f;
  border: 0;
  border-radius: 2px 4px 3px 1px;
  box-shadow: 23px 32px 66px rgba(32, 37, 31, .23), inset 0 0 0 1px rgba(249, 238, 214, .14);
  transform: rotate(2.2deg);
}
.stage-card::before {
  content: "";
  position: absolute;
  inset: 6px;
  border: 1px solid rgba(249, 238, 214, .14);
  pointer-events: none;
}
.stage-topbar, .stage-bottom { font-family: var(--serif); letter-spacing: .09em; }
.stage-screen {
  background: #647467;
  border-radius: 1px;
  box-shadow: inset 0 0 0 1px rgba(248, 241, 226, .12);
}
.stage-screen::before {
  content: "";
  position: absolute;
  inset: -8% -12%;
  background: url("assets/ink-wash.svg") center / 130% auto no-repeat;
  opacity: .28;
  mix-blend-mode: screen;
  pointer-events: none;
}
.screen-grid { opacity: .12; background: radial-gradient(ellipse at 50% 38%, rgba(244, 237, 225, .3), transparent 55%); background-size: auto; }
.screen-copy strong { font-family: var(--brush); font-weight: 400; letter-spacing: .02em; }
.screen-seal {
  width: 58px;
  height: 58px;
  border: 0;
  background: rgba(168, 61, 47, .16);
  clip-path: polygon(7% 13%, 87% 0, 100% 84%, 16% 100%);
  color: #dda18e;
}
.stage-float {
  border: 0;
  border-left: 3px solid var(--cinnabar);
  border-radius: 0;
  clip-path: polygon(0 7%, 94% 0, 100% 86%, 8% 100%);
  box-shadow: 0 17px 31px rgba(47, 38, 28, .15);
}
.float-icon { clip-path: polygon(6% 8%, 91% 0, 100% 89%, 8% 100%); }
.panel-stamp, .screen-seal { font-family: var(--brush); }

.section-paper {
  background-color: var(--paper-light);
  background-image: radial-gradient(ellipse at 16% 28%, rgba(65, 82, 65, .045), transparent 34%), radial-gradient(ellipse at 82% 75%, rgba(168, 61, 47, .04), transparent 30%);
}
.manifesto::before {
  content: "福";
  left: auto;
  right: 4%;
  top: 5%;
  width: 320px;
  height: 340px;
  color: rgba(63, 98, 85, .06);
  background: transparent;
  filter: none;
  font-family: var(--brush);
  font-size: 320px;
  line-height: 1;
  transform: rotate(7deg);
  z-index: -1;
}
.platforms { background-color: var(--paper); }
.platform-list { border-top: 0; }
.platform-tab { box-shadow: inset 0 -1px 0 rgba(59, 47, 33, .11); }
.platform-tab::before {
  left: 0;
  top: 50%;
  bottom: auto;
  width: 17px;
  height: 5px;
  border-radius: 62% 38% 54% 46%;
  clip-path: polygon(0 45%, 22% 14%, 57% 27%, 100% 0, 84% 78%, 31% 100%);
  transform: translateY(-50%) scaleX(0);
}
.platform-tab:hover, .platform-tab.is-active { padding-left: 21px; background: transparent; }
.platform-tab.is-active::before { transform: translateY(-50%) scaleX(1); }
.platform-panel {
  background-color: var(--night-2);
  background-image: url("assets/ink-wash.svg"), radial-gradient(ellipse at 24% 14%, rgba(168, 61, 47, .24), transparent 39%), radial-gradient(ellipse at 92% 92%, rgba(63, 98, 85, .64), transparent 48%);
  background-size: 150% auto, auto, auto;
  background-position: 58% 38%, center, center;
  border-radius: 1px 2px 34% 1px;
  box-shadow: 0 28px 54px rgba(44, 36, 26, .16);
}
.panel-ink { border: 0; box-shadow: none; background: url("assets/ink-wash.svg") center / 130% auto no-repeat; opacity: .2; }
.panel-tags span { border: 0; background: rgba(244, 237, 225, .1); clip-path: polygon(3% 10%, 94% 0, 100% 82%, 8% 100%); }
.panel-stamp {
  border: 0;
  background: var(--cinnabar);
  color: #f2d4b1;
  clip-path: polygon(6% 10%, 91% 0, 100% 88%, 10% 100%);
  transform: rotate(8deg);
}

.capability { background: #14221e; }
.ink-line { border: 0; background: radial-gradient(ellipse at center, rgba(219, 184, 135, .08), transparent 67%); filter: blur(12px); }
.capability-card::after { width: 54px; height: 5px; clip-path: polygon(0 45%, 20% 14%, 56% 27%, 100% 0, 82% 78%, 30% 100%); }
.capability-mark { font-family: var(--brush); color: rgba(217, 150, 125, .82); }
.process-track::before { height: 5px; border-radius: 60% 40% 58% 42%; clip-path: polygon(0 45%, 18% 10%, 53% 34%, 100% 0, 87% 80%, 30% 100%); filter: blur(.4px); }
.process-step::after { width: 3px; border-radius: 60% 40% 55% 45%; filter: blur(.4px); }
.quote-mark { font-family: var(--brush); }
.quote-grid blockquote { font-family: var(--brush); letter-spacing: .02em; }

.contact { background: var(--night); }
.contact-wash { background: url("assets/ink-wash.svg") center / 120% auto no-repeat, radial-gradient(ellipse at 16% 28%, rgba(255, 232, 203, .2), transparent 34%), radial-gradient(ellipse at 91% 80%, rgba(55, 38, 28, .32), transparent 36%); opacity: .3; mix-blend-mode: screen; }
.contact h2 { font-family: var(--brush); }
.contact h2 em { color: #d9967d; }
.contact .button-light { background: var(--cinnabar); color: #fff2df; clip-path: polygon(1% 9%, 18% 3%, 57% 6%, 99% 0, 97% 86%, 74% 95%, 29% 92%, 0 100%); }
.contact .button-light:hover { background: var(--cinnabar-dark); }

@media (max-width: 820px) {
  .site-header::after { left: 20px; right: 20px; }
  .mobile-nav { background: rgba(231, 223, 208, .97); border-bottom: 0; box-shadow: 0 16px 28px rgba(59, 45, 29, .08); }
  .mobile-nav a { font-family: var(--serif); border-bottom: 1px solid rgba(62, 49, 34, .1); }
  .hero::after { right: -9%; top: 18%; font-size: 230px; opacity: .7; }
  h1 { font-size: clamp(3.5rem, 15vw, 5.6rem); }
  h2 { font-size: clamp(2.8rem, 12vw, 4.3rem); }
  .stage-card { transform: rotate(1.3deg); }
}

@media (max-width: 560px) {
  .brand-caption { letter-spacing: .16em; }
  .hero::after { right: -17%; top: 21%; font-size: 190px; }
  .manifesto::before { right: -17%; top: 12%; font-size: 220px; }
  .stage-float { border-left-width: 2px; }
}

@media (min-width: 821px) {
  .hero h1 { font-size: clamp(3.8rem, 6.2vw, 6.35rem); }
}

/* Scroll performance */
.reveal, .reveal.is-visible {
  filter: none;
  transition: opacity .72s var(--ease), transform .72s var(--ease);
}
.scroll-progress { transition: none; }
.site-header.is-scrolled { backdrop-filter: none; }

/* Business content expansion */
.service-map {
  padding-top: clamp(120px, 13vw, 185px);
  padding-bottom: clamp(125px, 14vw, 200px);
}
.service-map .section-heading { max-width: 790px; }
.service-map-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin-top: 70px;
  border-top: 1px solid rgba(62, 49, 34, .14);
}
.service-tile {
  position: relative;
  min-height: 285px;
  padding: 32px 32px 34px;
  border-bottom: 1px solid rgba(62, 49, 34, .14);
  border-right: 1px solid rgba(62, 49, 34, .1);
  background: rgba(244, 237, 225, .24);
  transition: transform .35s var(--ease), background .35s ease;
}
.service-tile:nth-child(3n) { border-right: 0; }
.service-tile:hover { background: rgba(244, 237, 225, .62); transform: translateY(-6px); }
.service-tile-index {
  display: block;
  color: var(--cinnabar);
  font-family: var(--serif);
  font-size: 11px;
  letter-spacing: .14em;
}
.service-tile-mark {
  position: absolute;
  top: 23px;
  right: 27px;
  color: rgba(63, 98, 85, .22);
  font-family: var(--brush);
  font-size: 62px;
  line-height: 1;
  transform: rotate(8deg);
}
.service-tile h3 { margin: 47px 0 12px; font-family: var(--brush); font-size: 30px; font-weight: 400; }
.service-tile p { max-width: 310px; min-height: 79px; margin-bottom: 21px; color: var(--ink-soft); font-family: var(--serif); font-size: 13px; line-height: 1.9; }
.service-tile .text-link { color: var(--cinnabar); }

.efficiency { padding-top: clamp(120px, 14vw, 190px); padding-bottom: clamp(120px, 14vw, 190px); overflow: hidden; }
.efficiency-grid { display: grid; grid-template-columns: .82fr 1.18fr; gap: clamp(60px, 10vw, 150px); align-items: center; }
.efficiency-copy { max-width: 530px; }
.efficiency-copy h2 { margin-bottom: 21px; }
.efficiency-copy > p:not(.eyebrow) { max-width: 460px; margin-bottom: 31px; color: rgba(246, 242, 233, .7); font-family: var(--serif); font-size: 15px; line-height: 1.95; }
.efficiency-loop { position: relative; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 42px; }
.efficiency-loop::before { content: ""; position: absolute; left: 22px; top: 25px; bottom: 25px; width: 1px; background: linear-gradient(var(--cinnabar), rgba(217, 150, 125, .08), var(--cinnabar)); opacity: .65; }
.efficiency-step { position: relative; z-index: 1; display: grid; grid-template-columns: 45px 1fr; gap: 13px; min-height: 128px; padding: 24px 0 20px; border-top: 1px solid rgba(246, 242, 233, .14); }
.efficiency-step:nth-child(-n + 2) { border-top: 0; }
.efficiency-step > span { display: grid; place-items: center; width: 45px; height: 45px; color: #f0d4ae; background: var(--cinnabar); clip-path: polygon(7% 10%, 89% 0, 100% 86%, 12% 100%); font-family: var(--brush); font-size: 25px; }
.efficiency-step b { display: block; margin: 4px 0 8px; color: var(--paper-light); font-family: var(--serif); font-size: 19px; font-weight: 500; }
.efficiency-step small { display: block; color: rgba(246, 242, 233, .56); font-family: var(--serif); font-size: 12px; line-height: 1.8; }

.capability-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: clamp(22px, 3.5vw, 52px); }
.capability-card p { max-width: 260px; }
.process-track { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.process-step:not(:first-child) { padding-left: 36px; }
.process-step p { max-width: 250px; }
.stat-row { flex-wrap: wrap; row-gap: 26px; }
.stat-item { min-width: 86px; }
.solution-band-notes { display: flex; flex-wrap: wrap; gap: 9px; margin: 0 0 29px; }
.solution-band-notes span { padding: 7px 13px; color: rgba(246, 242, 233, .7); background: rgba(246, 242, 233, .08); clip-path: polygon(3% 10%, 94% 0, 100% 82%, 8% 100%); font-family: var(--serif); font-size: 11px; }
.subpage-hero { min-height: 600px; padding-top: 150px; padding-bottom: 90px; }
.subpage-hero-inner > p:last-child { max-width: 600px; }
.subpage-hero-meta { display: flex; flex-wrap: wrap; gap: 22px; margin-top: 27px; color: var(--ink-faint); font-family: var(--serif); font-size: 12px; }
.subpage-hero-meta span { display: inline-flex; align-items: baseline; gap: 6px; }
.subpage-hero-meta b { color: var(--cinnabar); font-family: var(--brush); font-size: 30px; font-weight: 400; line-height: 1; }
.solution-section { padding-top: clamp(100px, 11vw, 155px); }

@media (max-width: 1050px) {
  .primary-nav { gap: 14px; }
  .service-map-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .service-tile:nth-child(3n) { border-right: 1px solid rgba(62, 49, 34, .1); }
  .service-tile:nth-child(2n) { border-right: 0; }
  .efficiency-grid { gap: 55px; }
  .capability-grid, .process-track { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .process-step:not(:first-child) { padding-left: 30px; }
}

@media (max-width: 820px) {
  .service-map { padding-top: 100px; padding-bottom: 110px; }
  .service-map-grid { margin-top: 52px; grid-template-columns: 1fr; }
  .service-tile, .service-tile:nth-child(2n), .service-tile:nth-child(3n) { min-height: 245px; border-right: 0; }
  .service-tile p { min-height: auto; max-width: 520px; }
  .efficiency-grid { grid-template-columns: 1fr; gap: 55px; }
  .efficiency-loop { grid-template-columns: 1fr; }
  .efficiency-step:nth-child(2) { border-top: 1px solid rgba(246, 242, 233, .14); }
  .efficiency-loop::before { bottom: 25px; }
  .capability-grid, .process-track { grid-template-columns: 1fr; }
  .process-step:not(:first-child) { padding-left: 0; }
  .subpage-hero { min-height: 545px; padding-top: 135px; padding-bottom: 75px; }
  .subpage-hero-meta { gap: 15px; }
}

/* Ink-space refinement */
:root {
  --line: rgba(32, 36, 33, 0.09);
  --line-light: rgba(246, 242, 233, 0.1);
}

body {
  background:
    radial-gradient(ellipse at 8% 18%, rgba(66, 100, 93, .08), transparent 24%),
    radial-gradient(ellipse at 92% 44%, rgba(185, 81, 61, .045), transparent 25%),
    var(--paper);
}
.grain { opacity: .15; }
.ink-canvas { opacity: .58; filter: saturate(.82) contrast(.95); }
.section { padding-top: clamp(120px, 14vw, 210px); padding-bottom: clamp(120px, 14vw, 210px); }

.hero { min-height: min(980px, 100vh); padding-top: 190px; padding-bottom: 145px; }
.hero-grid { gap: clamp(70px, 9vw, 145px); }
.hero-ink { opacity: .3; filter: blur(.1px); }
.hero-ink::before, .hero-ink::after { content: ""; position: absolute; display: block; border-radius: 57% 43% 51% 49%; filter: blur(19px); mix-blend-mode: multiply; }
.hero-ink::before { inset: 7% 19% 11% 3%; background: rgba(42, 60, 53, .16); transform: rotate(18deg); }
.hero-ink::after { inset: 24% 3% 4% 38%; background: rgba(185, 81, 61, .1); transform: rotate(-22deg); }
.hero-ink-left { width: 500px; height: 700px; background: radial-gradient(ellipse at center, rgba(41, 50, 45, .36), transparent 68%); }
.hero-ink-right { width: 600px; height: 620px; background: radial-gradient(ellipse at center, rgba(185, 81, 61, .2), transparent 65%); }
.stage-card { border: 0; box-shadow: 26px 40px 80px rgba(25, 30, 26, .2), inset 0 0 0 1px rgba(255,255,255,.035); }
.stage-float { border: 0; box-shadow: 0 20px 42px rgba(32,36,33,.12); }
.stage-brush { opacity: .34; }

.section-heading h2 { position: relative; }
.section-heading h2::after { content: ""; display: block; width: 88px; height: 8px; margin-top: 22px; border-radius: 56% 44% 48% 52%; background: var(--cinnabar); opacity: .23; filter: blur(3px); transform: rotate(-2deg); }
.section-heading.centered h2::after { margin-left: auto; margin-right: auto; }
.manifesto { isolation: isolate; }
.manifesto::before { content: ""; position: absolute; left: -15%; top: 4%; width: 68%; height: 80%; border-radius: 53% 47% 60% 40%; background: rgba(66, 100, 93, .045); filter: blur(34px); transform: rotate(-16deg); z-index: -1; }

.platforms { padding-top: clamp(140px, 16vw, 230px); padding-bottom: clamp(140px, 16vw, 230px); }
.platform-list { border-top: 0; }
.platform-tab { border-bottom: 0; box-shadow: inset 0 -1px 0 rgba(32,36,33,.075); min-height: 104px; }
.platform-tab::before { left: 0; width: 5px; border-radius: 50%; filter: blur(1.5px); }
.platform-tab:hover, .platform-tab.is-active { background: rgba(255,255,255,.12); }
.panel-tags span { border: 0; background: rgba(246,242,233,.08); }
.platform-panel { box-shadow: 0 28px 55px rgba(32,36,33,.11); }

.capability { padding-top: clamp(145px, 17vw, 245px); padding-bottom: clamp(150px, 17vw, 245px); }
.capability-grid { gap: clamp(35px, 6vw, 92px); margin-top: 105px; border: 0; }
.capability-card, .capability-card:last-child { border: 0; padding: 35px 0 43px; background: transparent; }
.capability-card::after { content: ""; position: absolute; left: 0; bottom: 0; width: 46px; height: 3px; border-radius: 70% 30% 60% 40%; background: #d9967d; opacity: .5; transform: rotate(-2deg); }
.capability-card-featured { background: transparent; }
.capability-card:hover { background: rgba(246,242,233,.035); transform: translateY(-8px); }

.process { padding-top: clamp(140px, 17vw, 240px); padding-bottom: clamp(140px, 17vw, 240px); }
.process-track { margin-top: 100px; border-top: 0; }
.process-track::before { top: -28px; width: 100%; height: 1px; opacity: .35; background: linear-gradient(90deg, var(--cinnabar), transparent 72%); }
.process-step, .process-step:not(:first-child) { min-height: 226px; padding-top: 52px; border: 0; }
.process-step:not(:first-child) { padding-left: 52px; }
.process-step::after { content: ""; position: absolute; left: 0; top: 59px; width: 1px; height: 84px; background: rgba(32,36,33,.1); }
.process-step:first-child::after { display: none; }

.quote-section { padding-top: clamp(155px, 18vw, 260px); padding-bottom: clamp(155px, 18vw, 260px); }
.quote-grid { gap: 30px; }
.quote-mark { opacity: .78; }
.contact { min-height: 430px; }

.solution-section { padding-top: clamp(135px, 15vw, 220px); padding-bottom: clamp(145px, 16vw, 235px); }
.solution-grid { gap: clamp(42px, 6vw, 88px); }
.solution-card { border: 0; background: rgba(246,242,233,.38); padding: 50px 40px 45px; }
.solution-card:hover { background: rgba(250,247,239,.72); box-shadow: 0 30px 60px rgba(32,36,33,.09); }
.solution-card-dark { background: rgba(32, 53, 47, .96); }
.solution-card-dark:hover { background: rgba(40, 61, 54, .98); }
.solution-card-line { background: rgba(246,242,233,.24); }
.subpage-hero { min-height: 720px; padding-top: 195px; padding-bottom: 145px; }
.subpage-brush { opacity: .32; width: 65%; height: 82%; right: -18%; }

@media (max-width: 820px) {
  .section { padding-top: 105px; padding-bottom: 105px; }
  .hero { padding-top: 145px; padding-bottom: 105px; }
  .hero-grid { gap: 55px; }
  .platforms, .capability, .process, .quote-section { padding-top: 115px; padding-bottom: 115px; }
  .capability-grid { gap: 22px; margin-top: 70px; }
  .capability-card, .capability-card:last-child { padding: 28px 0 34px; }
  .process-track { margin-top: 70px; }
  .process-step, .process-step:not(:first-child) { min-height: auto; padding-top: 36px; padding-bottom: 36px; }
  .process-step:not(:first-child) { padding-left: 0; }
  .process-step::after { display: none; }
  .subpage-hero { min-height: 590px; padding-top: 150px; padding-bottom: 100px; }
  .solution-section { padding-top: 110px; padding-bottom: 120px; }
  .solution-card { padding: 37px 28px 36px; }
}

@media (max-width: 560px) {
  .hero { padding-top: 130px; }
  .section-heading h2::after { width: 68px; height: 6px; margin-top: 16px; }
  .platforms, .capability, .process, .quote-section { padding-top: 90px; padding-bottom: 90px; }
  .platform-tab { min-height: 92px; }
  .subpage-hero { min-height: 520px; padding-top: 130px; padding-bottom: 78px; }
  .solution-section { padding-top: 88px; padding-bottom: 100px; }
}

/* Brush texture */
.hero::before {
  content: "";
  position: absolute;
  z-index: 0;
  left: -16%;
  top: 13%;
  width: 86%;
  height: 72%;
  background: url("assets/ink-wash.svg") center / 100% 100% no-repeat;
  opacity: .76;
  mix-blend-mode: multiply;
  pointer-events: none;
  transform: rotate(-7deg);
}
.manifesto::after {
  content: "";
  position: absolute;
  z-index: -1;
  right: -24%;
  top: 14%;
  width: 82%;
  height: 88%;
  background: url("assets/ink-wash.svg") center / 100% 100% no-repeat;
  opacity: .28;
  mix-blend-mode: multiply;
  transform: rotate(166deg) scaleX(-1);
}
.section-dark::after {
  content: "";
  position: absolute;
  z-index: -1;
  left: 35%;
  top: 8%;
  width: 90%;
  height: 82%;
  background: url("assets/ink-wash.svg") center / 100% 100% no-repeat;
  opacity: .24;
  filter: invert(1);
  transform: rotate(-11deg);
  pointer-events: none;
}
.platform-panel { background-image: url("assets/ink-wash.svg"); background-size: 150% 150%; background-position: 64% 44%; background-blend-mode: soft-light; }
.subpage-brush { background: url("assets/ink-wash.svg") center / 100% 100% no-repeat; filter: none; }

@media (max-width: 820px) {
  .hero::before { left: -45%; top: 17%; width: 150%; height: 56%; opacity: .58; }
  .manifesto::after { right: -42%; width: 130%; opacity: .22; }
  .section-dark::after { left: -4%; width: 145%; opacity: .2; }
}

/* Interactive ink layer */
.scroll-progress { position: fixed; z-index: 50; top: 0; left: 0; width: 100%; height: 3px; background: var(--cinnabar); box-shadow: 0 0 14px rgba(185,81,61,.5); transform: scaleX(0); transform-origin: left center; transition: transform .18s ease-out; pointer-events: none; }
.ink-ripple { display: none; }
.hero-stage::after { content: ""; position: absolute; inset: 2% 3%; z-index: 0; pointer-events: none; background: radial-gradient(ellipse 38% 29% at var(--spot-x, 50%) var(--spot-y, 50%), rgba(185,81,61,.14), transparent 70%); opacity: .6; transition: background-position .1s linear; }
.hero-stage.is-tilting .stage-card { transform: perspective(900px) rotateX(var(--tilt-y, 0deg)) rotateY(var(--tilt-x, 0deg)) rotate(1deg) translateY(-8px); }
.stage-aura { animation: auraPulse 7s ease-in-out infinite; }
.stage-screen { animation: screenBreathe 8s ease-in-out infinite alternate; }
.screen-wash { animation: washDrift 9s ease-in-out infinite alternate; }
.wash-two { animation-delay: -3s; }
.panel-ink { animation: ringDrift 12s ease-in-out infinite alternate; }
.hero-ink-left { animation: inkFloatLeft 15s ease-in-out infinite alternate; }
.hero-ink-right { animation: inkFloatRight 18s ease-in-out infinite alternate; }
.hero::before { animation: brushSlide 18s ease-in-out infinite alternate; }
.manifesto::after { animation: brushSlideReverse 22s ease-in-out infinite alternate; }
.ink-line-one { animation: lineFloat 17s ease-in-out infinite alternate; }
.ink-line-two { animation: lineFloatReverse 20s ease-in-out infinite alternate; }
.platform-panel { animation: panelBreath 11s ease-in-out infinite alternate; }
.reveal { filter: blur(7px); }
.reveal.is-visible { filter: blur(0); }
.platform-panel.is-switching { opacity: .5; transform: scale(.975) translateY(8px); filter: blur(3px); }
.platform-panel { transition: opacity .32s var(--ease), transform .42s var(--ease), filter .32s ease; }

/* Demo booking form, ready to be wired to the API later. */
.contact-dialog { width: min(520px, calc(100% - 32px)); padding: 48px 44px 42px; border: 0; border-radius: 0; background: var(--paper-light); color: var(--ink); box-shadow: 0 30px 100px rgba(25,30,26,.3); overflow: hidden; }
.contact-dialog::backdrop { background: rgba(23,32,30,.55); backdrop-filter: blur(7px); }
.dialog-wash { position: absolute; right: -25%; top: -20%; width: 75%; height: 75%; background: url("assets/ink-wash.svg") center / 100% 100% no-repeat; opacity: .2; transform: rotate(18deg); pointer-events: none; }
.dialog-close { position: absolute; z-index: 2; top: 16px; right: 17px; width: 38px; height: 38px; border: 0; background: transparent; color: var(--ink-soft); font-size: 25px; line-height: 1; cursor: pointer; }.dialog-close:hover { color: var(--cinnabar); transform: rotate(8deg); }
.dialog-kicker { position: relative; z-index: 1; margin-bottom: 20px; color: var(--cinnabar); font-size: 10px; font-weight: 700; letter-spacing: .18em; }.contact-dialog h2 { position: relative; z-index: 1; margin-bottom: 13px; font-size: clamp(2.2rem, 6vw, 3.5rem); }.contact-dialog h2 em { color: var(--cinnabar); font-style: normal; }.dialog-intro { position: relative; z-index: 1; margin-bottom: 27px; color: var(--ink-faint); font-family: var(--serif); font-size: 14px; }
.contact-dialog form { position: relative; z-index: 1; display: grid; gap: 14px; }.contact-dialog label { display: grid; gap: 7px; color: var(--ink-soft); font-size: 11px; }.contact-dialog input, .contact-dialog select { width: 100%; min-height: 46px; padding: 0 13px; border: 0; border-bottom: 1px solid rgba(32,36,33,.22); border-radius: 0; outline: 0; background: rgba(255,255,255,.4); color: var(--ink); font-family: var(--serif); font-size: 14px; transition: border-color .25s ease, background .25s ease; }.contact-dialog input:focus, .contact-dialog select:focus { border-color: var(--cinnabar); background: rgba(255,255,255,.76); }.dialog-submit { width: 100%; margin-top: 9px; }.dialog-status { min-height: 20px; margin: 2px 0 0; color: var(--ink-faint); font-size: 11px; text-align: center; }.dialog-status.is-success { color: var(--pine); }

@keyframes inkRipple { 0% { opacity: .8; transform: translate(-50%, -50%) rotate(-8deg) scale(.4); } 70% { opacity: .32; } 100% { opacity: 0; transform: translate(-50%, -50%) rotate(14deg) scale(10); } }
@keyframes auraPulse { 0%, 100% { opacity: .64; transform: scale(.96); } 50% { opacity: 1; transform: scale(1.08); } }
@keyframes screenBreathe { 0% { filter: saturate(.92) contrast(.98); } 100% { filter: saturate(1.12) contrast(1.04); } }
@keyframes washDrift { 0% { transform: translate3d(-2%, -1%, 0) rotate(-14deg) scale(1); } 100% { transform: translate3d(5%, 3%, 0) rotate(-7deg) scale(1.08); } }
@keyframes ringDrift { 0% { transform: rotate(15deg) translate3d(-1%, 0, 0); opacity: .5; } 100% { transform: rotate(24deg) translate3d(5%, -3%, 0); opacity: .9; } }
@keyframes inkFloatLeft { 0% { transform: translate3d(-1%, -1%, 0) rotate(16deg); } 100% { transform: translate3d(5%, 4%, 0) rotate(24deg); } }
@keyframes inkFloatRight { 0% { transform: translate3d(1%, 2%, 0) rotate(-25deg); } 100% { transform: translate3d(-4%, -4%, 0) rotate(-17deg); } }
@keyframes brushSlide { 0% { transform: translate3d(-2%, 0, 0) rotate(-7deg) scale(1); } 100% { transform: translate3d(5%, 3%, 0) rotate(-2deg) scale(1.07); } }
@keyframes brushSlideReverse { 0% { transform: rotate(166deg) scaleX(-1) translate3d(0, 0, 0); } 100% { transform: rotate(174deg) scaleX(-1) translate3d(-4%, 3%, 0); } }
@keyframes lineFloat { 0% { transform: rotate(-16deg) translateX(0); } 100% { transform: rotate(-12deg) translateX(4%); } }
@keyframes lineFloatReverse { 0% { transform: rotate(22deg) translateX(0); } 100% { transform: rotate(16deg) translateX(-4%); } }
@keyframes panelBreath { 0% { background-position: 64% 44%; } 100% { background-position: 57% 51%; } }

@media (prefers-reduced-motion: reduce) {
  .hero-ink-left, .hero-ink-right, .hero::before, .manifesto::after, .ink-line-one, .ink-line-two, .stage-aura, .stage-screen, .screen-wash, .panel-ink, .platform-panel { animation: none; }
  .reveal { filter: none; }
}

/* Content density pass: more useful information, lighter visual weight. */
.hero { min-height: min(860px, 100vh); padding-top: 158px; padding-bottom: 102px; }
.hero-snapshot { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; max-width: 610px; margin-top: 32px; padding-top: 15px; border-top: 1px solid rgba(62, 49, 34, .17); }
.hero-snapshot div { display: grid; grid-template-columns: 26px 1fr; column-gap: 7px; align-items: baseline; }
.hero-snapshot b { grid-row: 1 / span 2; color: var(--cinnabar); font: 400 15px/1 var(--brush); }
.hero-snapshot span { color: var(--ink); font: 500 13px/1.4 var(--serif); }
.hero-snapshot small { grid-column: 2; color: var(--ink-faint); font: 10px/1.55 var(--serif); white-space: nowrap; }
.manifesto-notes { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; margin-top: 30px; padding-top: 18px; border-top: 1px solid rgba(62, 49, 34, .13); }
.manifesto-notes div { display: grid; gap: 4px; }
.manifesto-notes b { color: var(--cinnabar); font: 500 12px/1.4 var(--serif); }
.manifesto-notes span { color: var(--ink-faint); font: 11px/1.7 var(--serif); }
.service-tile-tags, .capability-tools { display: flex; flex-wrap: wrap; gap: 7px; }
.service-tile-tags { margin: -4px 0 18px; }
.service-tile-tags span, .capability-tools span { color: var(--ink-faint); font: 10px/1 var(--serif); }
.service-tile-tags span::before, .capability-tools span::before { content: "·"; margin-right: 5px; color: var(--cinnabar); }
.service-tile .text-link { margin-top: auto; }
.service-tile { display: flex; flex-direction: column; }
.efficiency-proof { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; max-width: 460px; margin: 0 0 30px; padding: 17px 0 15px; border-top: 1px solid rgba(246, 242, 233, .14); border-bottom: 1px solid rgba(246, 242, 233, .14); }
.efficiency-proof span { display: grid; gap: 4px; }
.efficiency-proof b { color: #f0d4ae; font: 500 16px/1.2 var(--serif); }
.efficiency-proof small { color: rgba(246, 242, 233, .52); font: 10px/1.5 var(--serif); }
.panel-facts { position: absolute; z-index: 1; left: clamp(34px, 5vw, 65px); right: clamp(34px, 5vw, 65px); bottom: 31px; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 15px; padding-top: 15px; border-top: 1px solid rgba(246, 242, 233, .17); }
.panel-facts span { display: grid; gap: 2px; }
.panel-facts b { color: #f0d4ae; font: 500 17px/1.2 var(--serif); }
.panel-facts small { color: rgba(246, 242, 233, .5); font: 10px/1.5 var(--serif); }
.capability-tools { margin: 0 0 20px; }
.capability-tools span { color: rgba(246, 242, 233, .46); }
.process-output { display: block; margin-top: 13px; color: var(--cinnabar); font: 10px/1.7 var(--serif); }
.contact-promises { display: flex; flex-wrap: wrap; gap: 8px 18px; margin-top: 23px; color: rgba(246, 242, 233, .56); font: 11px/1.5 var(--serif); }
.contact-promises span::before { content: "·"; margin-right: 6px; color: #d9967d; }

.subpage-hero { min-height: 585px; padding-top: 150px; padding-bottom: 86px; }
.subpage-hero-steps { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 17px; max-width: 650px; margin-top: 30px; padding-top: 16px; border-top: 1px solid rgba(62, 49, 34, .14); }
.subpage-hero-steps span { display: grid; gap: 4px; color: var(--ink-faint); font: 11px/1.6 var(--serif); }
.subpage-hero-steps b { color: var(--ink); font: 500 13px/1.3 var(--serif); }
.subpage-hero-aside { position: absolute; right: max(48px, calc((100% - var(--container)) / 2)); bottom: 105px; width: 220px; padding: 20px 0 18px 23px; border-left: 1px solid rgba(168, 61, 47, .42); color: var(--ink); }
.subpage-hero-aside p { margin: 0 0 24px; color: var(--cinnabar); font: 700 9px/1.4 var(--sans); letter-spacing: .16em; }
.subpage-hero-aside b { display: block; color: var(--ink); font: 400 29px/1.15 var(--brush); }
.subpage-hero-aside > span { display: block; margin-top: 7px; color: var(--ink-faint); font: 12px/1.7 var(--serif); }
.subpage-hero-aside i { display: block; width: 42px; height: 5px; margin: 20px 0 14px; background: var(--cinnabar); clip-path: polygon(0 44%, 21% 10%, 55% 28%, 100% 0, 84% 78%, 31% 100%); }
.subpage-hero-aside small { color: var(--ink-faint); font: 10px/1.6 var(--serif); }
.solution-section { padding-top: 112px; padding-bottom: 135px; }
.solution-card { display: flex; flex-direction: column; min-height: 495px; }
.solution-card ul { margin-bottom: 21px; }
.solution-tags { display: flex; flex-wrap: wrap; gap: 7px; margin: 0 0 13px; }
.solution-tags span { padding: 5px 9px; background: rgba(168, 61, 47, .08); color: var(--cinnabar); clip-path: polygon(3% 10%, 94% 0, 100% 82%, 8% 100%); font: 10px/1.2 var(--serif); }
.solution-card-dark .solution-tags span { background: rgba(246, 242, 233, .1); color: #d9967d; }
.solution-result { display: grid; gap: 3px; margin: auto 0 17px; padding-top: 13px; border-top: 1px solid rgba(62, 49, 34, .12); }
.solution-card-dark .solution-result { border-color: rgba(246, 242, 233, .14); }
.solution-result small { color: var(--ink-faint); font: 10px/1.55 var(--serif); }
.solution-card-dark .solution-result small { color: rgba(246, 242, 233, .5); }
.solution-result b { color: var(--ink-soft); font: 500 13px/1.6 var(--serif); }
.solution-card-dark .solution-result b { color: rgba(246, 242, 233, .8); }
.solution-band-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 22px; margin: 0 0 29px; max-width: 760px; }
.solution-band-grid div { display: grid; gap: 5px; padding-top: 12px; border-top: 1px solid rgba(246, 242, 233, .16); }
.solution-band-grid b { color: #f0d4ae; font: 500 12px/1.4 var(--serif); }
.solution-band-grid span { color: rgba(246, 242, 233, .52); font: 10px/1.7 var(--serif); }

@media (max-width: 1050px) {
  .subpage-hero-aside { right: 28px; }
  .hero-snapshot { max-width: 540px; }
}

@media (max-width: 820px) {
  .hero { min-height: auto; padding-top: 130px; padding-bottom: 82px; }
  .hero-snapshot { max-width: none; margin-top: 27px; }
  .manifesto-notes { grid-template-columns: 1fr; gap: 11px; }
  .efficiency-proof { max-width: 520px; }
  .panel-facts { left: 26px; right: 26px; }
  .subpage-hero { display: block; min-height: 540px; padding-top: 132px; padding-bottom: 70px; }
  .subpage-hero-inner { width: calc(100% - 40px); margin-left: auto; margin-right: auto; }
  .subpage-hero-aside { position: relative; right: auto; bottom: auto; width: min(calc(100% - 40px), 420px); margin: 28px auto 0; padding-top: 15px; padding-bottom: 0; }
  .subpage-hero-aside p { margin-bottom: 14px; }
  .subpage-hero-aside i { margin: 13px 0 8px; }
  .subpage-hero-steps { max-width: none; }
  .solution-band-grid { grid-template-columns: 1fr; gap: 12px; }
}

@media (max-width: 560px) {
  .hero { padding-top: 120px; padding-bottom: 68px; }
  .hero-snapshot { gap: 9px; }
  .hero-snapshot div { grid-template-columns: 21px 1fr; column-gap: 4px; }
  .hero-snapshot b { font-size: 13px; }
  .hero-snapshot span { font-size: 11px; }
  .hero-snapshot small { font-size: 9px; white-space: normal; }
  .efficiency-proof { gap: 10px; }
  .efficiency-proof b { font-size: 14px; }
  .panel-facts { left: 26px; right: 26px; bottom: 24px; gap: 8px; }
  .panel-facts b { font-size: 15px; }
  .subpage-hero { min-height: 520px; padding-top: 120px; padding-bottom: 64px; }
  .subpage-hero-steps { gap: 9px; }
  .subpage-hero-steps span { font-size: 10px; }
  .subpage-hero-steps b { font-size: 12px; }
  .subpage-hero-aside { width: calc(100% - 40px); margin: 23px auto 0; }
  .solution-card { min-height: 0; }
  .solution-band-grid { gap: 10px; }
}

/* Keep scrolling visually continuous: reveal never blanks a section and canvas
   yields its composite layer while the browser is moving the document. */
.reveal, .reveal.is-visible { filter: none !important; }
html.is-scrolling .ink-canvas { opacity: 0; }
html.is-scrolling .reveal,
html.is-scrolling .reveal:not(.is-visible) {
  opacity: 1 !important;
  transform: none !important;
  filter: none !important;
  transition: none !important;
}