/* =====================================================================
   BOMBA DIGITAL STUDIOS — Design system
   01 Tokens / 02 Base / 03 Navigation / 04 Hero / 05 Sections / 06 Forms
   07 Footer / 08 Motion / 09 Responsive / 10 Accessibility & print
   System fonts only: no CDN, tracking, font downloads or external assets.
   ===================================================================== */
:root {
  --bg: #08090e;
  --surface: #0e1018;
  --surface-raised: #131620;
  --text: #f3f4f9;
  --muted: #9b9dac;
  --dim: #737888;
  --line: rgba(192, 200, 255, .12);
  --blue: #4b8bff;
  --purple: #a17aff;
  --gradient: linear-gradient(110deg, #68a2ff 0%, #8c86ff 48%, #b58cff 100%);
  --button-gradient: linear-gradient(110deg, #456af0 0%, #7152e7 65%, #8255eb 100%);
  --font: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  --mono: 'SFMono-Regular', Consolas, 'Liberation Mono', monospace;
  --max-width: 1280px;
  --header-height: 88px;
  --radius: 18px;
  --ease: cubic-bezier(.22, 1, .36, 1);
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: calc(var(--header-height) + 24px); }
body { margin: 0; background: var(--bg); color: var(--text); font-family: var(--font); -webkit-font-smoothing: antialiased; font-size: 16px; line-height: 1.65; }
body.menu-open { overflow: hidden; }
::selection { color: #fff; background: #5e47a6; }
a { color: inherit; text-decoration: none; }
button, input, select, textarea { font: inherit; }
button, a, input, textarea, select { -webkit-tap-highlight-color: transparent; }
button { color: inherit; cursor: pointer; }
button, input, select, textarea { border-radius: 0; }
button { background: none; border: 0; }
button:disabled { cursor: default; }
a, button { touch-action: manipulation; }
img, svg { display: block; }
img { max-width: 100%; height: auto; }
svg { flex-shrink: 0; }
h1, h2, h3, p, figure { margin: 0; }
h1, h2, h3 { font-weight: 600; }
h2 { font-size: clamp(38px, 4vw, 56px); letter-spacing: -.048em; line-height: 1.13; }
[hidden] { display: none !important; }
:focus-visible { outline: 2px solid #a59cff; outline-offset: 5px; border-radius: 4px; }
.container { width: min(var(--max-width), calc(100% - 112px)); margin-inline: auto; }
.section-space { padding-block: 112px; }
.section-anchor { scroll-margin-top: 24px; }
.icon { width: 22px; height: 22px; }
.mono { font-family: var(--mono); }
.gradient-text { background: var(--gradient); background-clip: text; -webkit-background-clip: text; -webkit-text-fill-color: transparent; }
.muted-title { color: var(--muted); }
.eyebrow { display: flex; align-items: center; gap: 12px; font-size: 11px; font-weight: 500; letter-spacing: .15em; text-transform: uppercase; margin-bottom: 26px; color: #b7b3d0; }
.eyebrow-dot { width: 6px; height: 6px; border-radius: 50%; background: #b49aff; box-shadow: 0 0 13px #8c6bf980; }
.section-index { font-family: var(--mono); font-size: 11px; letter-spacing: 0; color: #aaa2d5; border: 1px solid #a591ff30; border-radius: 5px; padding: 2px 6px; }
.button { display: inline-flex; gap: 20px; justify-content: center; align-items: center; min-height: 54px; border: 1px solid transparent; border-radius: 9px; font-size: 13px; font-weight: 550; line-height: 1.3; padding: 16px 22px; transition: transform .3s var(--ease), box-shadow .3s ease, background .3s ease, border-color .3s ease; }
.button .icon { width: 17px; height: 17px; transition: transform .3s var(--ease); }
.button--primary { background: var(--button-gradient); color: #fff; box-shadow: inset 0 1px 0 #ffffff26, 0 5px 25px #4531ca1c; }
.button--ghost { color: #d4d5e0; background: #ffffff02; border-color: #d7d9fb23; }
.button--small { border-color: #b3a1f440; background: #7d64d00c; min-height: 43px; font-size: 12px; padding: 11px 17px; gap: 20px; }
.button--text { padding: 12px 0; color: #c0b7f5; gap: 30px; justify-content: flex-start; border-radius: 0; }
.button--light { background: #f6f4ff; color: #171222; box-shadow: 0 4px 22px #110b4720; }
.button--outline { border-color: #d8cfff4a; background: #ffffff04; }
@media (hover: hover) {
  .button:hover { transform: translateY(-3px); }
  .button--primary:hover { box-shadow: 0 9px 34px #7350f448, inset 0 1px 0 #ffffff30; }
  .button--ghost:hover, .button--small:hover, .button--outline:hover { background: #a18cff10; border-color: #b6a1ff70; }
  .button:hover .icon { transform: translate(2px, -2px); }
  .button--text:hover { color: #fff; }
}
.button:active { transform: translateY(0) scale(.985); }
.skip-link { position: fixed; z-index: 150; top: 10px; left: 10px; padding: 10px 18px; background: #fff; color: #171222; border-radius: 8px; transform: translateY(-160%); }
.skip-link:focus { transform: translateY(0); }

/* Navigation */
.site-header { position: fixed; top: 0; left: 0; right: 0; z-index: 80; height: var(--header-height); border-bottom: 1px solid #ffffff08; background: rgba(8,9,14,.76); backdrop-filter: blur(22px); -webkit-backdrop-filter: blur(22px); transition: background .25s ease, border-color .25s ease; }
.site-header.is-scrolled { background: rgba(8,9,14,.93); border-bottom-color: var(--line); }
.header-inner { display: flex; height: var(--header-height); align-items: center; justify-content: space-between; gap: 28px; }
.brand { display: inline-flex; align-items: center; gap: 13px; flex-shrink: 0; line-height: 1; }
.brand-monogram { position: relative; font-size: 41px; font-weight: 800; letter-spacing: -.105em; padding-right: 7px; }
.brand-point { position: absolute; width: 6px; height: 6px; background: #9276ff; right: -1px; bottom: 4px; }
.brand-type { font-size: 10px; letter-spacing: .18em; line-height: 1.46; font-weight: 600; border-left: 1px solid #ffffff20; padding-left: 13px; }
.brand-image { width: 176px; max-height: 65px; object-fit: contain; }
.desktop-nav { display: flex; align-items: center; gap: 31px; }
.desktop-nav a { position: relative; display: inline-flex; min-height: 44px; align-items: center; font-size: 12px; color: #a6a7b5; transition: color .2s; }
.desktop-nav a::after { content: ''; position: absolute; width: 3px; height: 3px; border-radius: 50%; background: #a995ff; bottom: 4px; left: calc(50% - 2px); opacity: 0; transform: translateY(2px); transition: .2s; }
.desktop-nav a:hover, .desktop-nav a[aria-current] { color: #faf9ff; }
.desktop-nav a[aria-current]::after { opacity: 1; transform: none; }
.header-actions { display: flex; align-items: center; gap: 12px; }
.menu-toggle { display: none; width: 44px; height: 44px; border: 1px solid var(--line); border-radius: 8px; position: relative; }
.menu-toggle span { position: absolute; width: 18px; height: 1.5px; background: #dedbef; left: 12px; transition: transform .25s, top .25s; }
.menu-toggle span:first-child { top: 16px; }.menu-toggle span:last-child { top: 24px; }
.menu-toggle[aria-expanded="true"] span:first-child { top: 20px; transform: rotate(45deg); }
.menu-toggle[aria-expanded="true"] span:last-child { top: 20px; transform: rotate(-45deg); }
.mobile-menu { border-top: 1px solid var(--line); padding: 30px 0 24px; background: #0c0d15; max-height: calc(100dvh - var(--header-height)); overflow: auto; }
.mobile-menu-label { display: block; font-size: 10px; letter-spacing: .15em; color: #9d8fcb; margin-bottom: 15px; }
.mobile-menu a:not(.mobile-email) { display: flex; align-items: center; gap: 15px; font-size: 26px; line-height: 1.3; padding: 18px 0; border-bottom: 1px solid var(--line); }
.mobile-menu a .mono { font-size: 11px; color: #867baf; }
.mobile-menu a .icon { margin-left: auto; width: 18px; }
.mobile-email { display: block; padding-top: 24px; font-size: 13px; color: #c5baff; }
.menu-backdrop { position: fixed; inset: var(--header-height) 0 0; z-index: 70; background: #0009; backdrop-filter: blur(5px); }

/* Hero */
.hero { position: relative; overflow: hidden; padding-top: var(--header-height); background: radial-gradient(ellipse at 92% 38%, #27204822, transparent 53%), var(--bg); }
.hero-grid-bg { position: absolute; inset: 0; pointer-events: none; background-image: linear-gradient(#8b88c208 1px, transparent 1px), linear-gradient(90deg, #8b88c208 1px, transparent 1px); background-size: 72px 72px; mask-image: linear-gradient(90deg, transparent 30%, #000 82%, transparent); }
.hero-glow { pointer-events: none; position: absolute; width: 650px; height: 620px; right: -200px; top: 180px; background: radial-gradient(ellipse, #5e36941f, transparent 67%); }
.hero-grid { display: grid; grid-template-columns: 1.04fr 1fr; min-height: 696px; align-items: center; gap: 8px; padding-block: 63px 55px; position: relative; }
.hero-copy { position: relative; z-index: 3; }
.hero-copy .eyebrow { margin-bottom: 28px; font-size: 10px; letter-spacing: .16em; }
h1 { font-size: clamp(54px, 5.3vw, 77px); line-height: 1.045; letter-spacing: -.058em; font-weight: 600; }
.hero-description { color: var(--muted); max-width: 505px; margin-top: 26px; font-size: 15px; line-height: 1.9; }
.hero-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 30px; }
.hero-note { display: flex; align-items: center; gap: 9px; margin-top: 22px; font-size: 10px; color: #858996; letter-spacing: .01em; }
.tiny-line { width: 16px; height: 1px; background: #8170ba; flex-shrink: 0; }
.hero-end { position: relative; display: flex; justify-content: space-between; align-items: center; min-height: 79px; border-top: 1px solid #c7c6ef13; font-family: var(--mono); font-size: 9px; letter-spacing: .06em; color: #767b8e; }
.hero-end a { display: flex; align-items: center; gap: 20px; min-height: 44px; color: #b0abc8; }
.hero-end .icon { width: 16px; height: 16px; }
.hero-visual { position: relative; width: 100%; height: 525px; isolation: isolate; margin-top: 1px; }
.visual-orbit { position: absolute; border: 1px solid #9587c012; border-radius: 50%; z-index: -1; }
.orbit-one { width: 590px; height: 590px; top: -30px; left: -10px; transform: rotateX(22deg) rotateZ(-25deg); }
.orbit-two { width: 445px; height: 445px; top: 42px; left: 66px; border-color: #9587c019; }
.visual-cross { position: absolute; color: #8981a577; font-size: 16px; font-family: var(--mono); }.cross-one { right: 18px; top: 42px; }.cross-two { left: 28px; bottom: 0; }
.visual-top-label { display: flex; align-items: center; gap: 8px; position: absolute; top: 28px; left: 50px; font-family: var(--mono); font-size: 8px; letter-spacing: .1em; color: #8f87a9; }
.mini-dot { width: 5px; height: 5px; background: #a38bdf; box-shadow: 0 0 9px #a183ff40; border-radius: 50%; }
.ecosystem { position: absolute; width: 94%; height: 327px; top: 97px; left: 3%; border: 1px solid #afa2f038; border-radius: 14px; background: linear-gradient(135deg, #171926e8, #11101ce8 75%); box-shadow: 0 40px 110px #020207a6, 0 0 75px #7150ed0c, inset 0 1px 0 #ffffff07; transform: perspective(1100px) rotateY(-9deg) rotateX(4deg) rotateZ(-4deg); }
.ecosystem-head { height: 46px; border-bottom: 1px solid #b1a9e51a; padding: 0 16px; display: flex; align-items: center; gap: 9px; font-size: 9px; color: #aea8c4; }
.mini-brand { font-size: 21px; letter-spacing: -.13em; color: #f0edff; font-weight: 750; margin-right: 2px; }.mini-brand span { color: #a58aff; }
.preview-tag { margin-left: auto; font-family: var(--mono); font-size: 7px; color: #938aaa; padding: 3px 6px; border: 1px solid #b5a2eb26; border-radius: 3px; }
.connections { width: 100%; height: 245px; position: absolute; inset: 40px 0 auto; }
.wire-base { stroke: url(#wire); stroke-width: 1.1; opacity: .3; }
.wire-flow { stroke: url(#wire); stroke-width: 1.5; stroke-dasharray: 10 150; opacity: .9; animation: wire-travel 11s linear infinite; }
.ecosystem-core { position: absolute; width: 86px; height: 86px; left: calc(50% - 43px); top: 118px; border: 1px solid #b19bed55; border-radius: 23px; background: linear-gradient(135deg, #8d75c927, #9584dd0c); padding: 9px; box-shadow: 0 0 52px #9565ff28; }
.ecosystem-core::before { content: ''; position: absolute; inset: -10px; border: 1px solid #b3a0e012; border-radius: 31px; }
.core-inner { height: 100%; border-radius: 17px; border: 1px solid #cfbfff66; background: linear-gradient(140deg, #8460e7, #523291); box-shadow: inset 0 1px 9px #ffffff1a; display: flex; align-items: center; justify-content: center; font-size: 33px; font-weight: 750; letter-spacing: -.08em; text-shadow: 0 2px 15px #ffffff22; }.core-inner span { color: #ded1ff; }
.core-caption { white-space: nowrap; font-size: 6px; letter-spacing: .1em; color: #b4aaca; position: absolute; top: calc(100% + 13px); left: 50%; transform: translateX(-50%); }
.system-node { position: absolute; display: flex; align-items: center; gap: 8px; border: 1px solid #b8c0fe26; border-radius: 7px; padding: 10px 11px; min-width: 144px; background: #171b29ed; box-shadow: 0 6px 18px #0003; }
.system-node>.icon { width: 20px; height: 20px; color: #9b9eff; }.system-node strong { display: block; font-size: 8px; line-height: 1.5; font-weight: 550; color: #d3d2e6; }.system-node span { display: block; font-size: 6px; margin-top: 2px; color: #87879e; }
.node-web { left: 5%; top: 77px; }.node-app { right: 4%; top: 73px; min-width: 130px; }.node-data { left: 6%; bottom: 54px; }.node-auto { right: 4%; bottom: 54px; min-width: 130px; }
.node-app, .node-auto { background: #1c172beb; }.node-app>.icon, .node-auto>.icon { color: #ad94ef; }
.ecosystem-bottom { position: absolute; inset: auto 0 0; height: 31px; border-top: 1px solid #b1a9e512; padding: 0 16px; display: flex; align-items: center; justify-content: space-between; color: #858099; font-size: 7px; }.ecosystem-bottom span { display: flex; align-items: center; gap: 5px; }.ecosystem-bottom i { width: 3px; height: 3px; background: #8b78bd; border-radius: 50%; }.ecosystem-bottom>.icon { width: 13px; height: 13px; }
.floating-code { position: absolute; left: -7%; bottom: 8px; width: 224px; border: 1px solid #b3a6e737; border-radius: 11px; background: linear-gradient(145deg, #141925f5, #11121cf7); box-shadow: 0 18px 55px #0007; transform: rotate(-5deg); animation: float-code 9s ease-in-out infinite; }
.code-heading { display: flex; align-items: center; justify-content: space-between; gap: 10px; height: 32px; border-bottom: 1px solid #ffffff08; padding: 0 10px; font-family: var(--mono); font-size: 6px; color: #9494a5; }
.code-heading .icon { width: 12px; height: 12px; }
.code-dots { display: flex; gap: 3px; }.code-dots i { width: 4px; height: 4px; border-radius: 50%; background: #6a628d; }.code-dots i:nth-child(2) { background: #8b82aa; }.code-dots i:nth-child(3) { background: #a4a0ba; }
.floating-code code { display: block; padding: 14px 17px 16px; font-size: 10px; line-height: 1.85; font-family: var(--mono); color: #c8c5db; }.syntax-purple { color: #b998fc; }.syntax-blue { color: #81b5ed; }
.floating-design { position: absolute; right: 0; top: 57px; display: flex; align-items: center; gap: 10px; padding: 12px 16px; border: 1px solid #c4b1fd40; border-radius: 11px; background: linear-gradient(115deg, #211a31f7, #1b182af2); box-shadow: 0 12px 40px #0005; transform: rotate(5deg); animation: float-design 10s ease-in-out infinite; }
.design-symbol { display: grid; place-items: center; width: 34px; height: 34px; border-radius: 8px; background: #a784fb16; border: 1px solid #a784fb30; color: #bf9dff; }.design-symbol .icon { width: 20px; height: 20px; }
.floating-design div>span { font-family: var(--mono); font-size: 6px; letter-spacing: .1em; color: #a99ac5; display: block; }.floating-design strong { font-size: 10px; color: #e3dcf4; font-weight: 500; }
.hero-visual figcaption { position: absolute; bottom: 11px; right: 0; font-size: 7px; font-family: var(--mono); letter-spacing: .06em; color: #79728c; }
.capability-strip { border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); background: #0c0d13; }
.capability-strip .container { min-height: 84px; display: flex; align-items: center; justify-content: space-between; gap: 22px; }
.capability-strip span { white-space: nowrap; font-size: 10px; font-weight: 550; letter-spacing: .105em; color: #9594aa; }
.capability-strip .icon { width: 13px; height: 13px; color: #746094; }.capability-strip .icon:last-child { display: none; }

/* Service cards */
.section-heading { margin-bottom: 48px; }
.section-heading--split { display: flex; align-items: flex-end; justify-content: space-between; gap: 70px; }
.section-heading--split>p { max-width: 385px; padding-bottom: 4px; color: var(--muted); font-size: 14px; line-height: 1.9; }
.services-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; }
.service-card { position: relative; border: 1px solid var(--line); border-radius: 13px; padding: 25px 23px 15px; min-height: 360px; display: flex; flex-direction: column; background: radial-gradient(ellipse at 0 0, #1e243011, transparent 65%), #0e1017; transition: border-color .35s, transform .35s var(--ease), box-shadow .35s; }
.service-card::after { content: ''; position: absolute; left: 25px; right: 25px; top: -1px; height: 1px; background: linear-gradient(90deg, transparent, #b49cff, transparent); opacity: 0; transition: opacity .35s; }
.service-top { display: flex; align-items: center; justify-content: space-between; margin-bottom: 26px; }
.service-icon { width: 43px; height: 43px; display: grid; place-items: center; background: linear-gradient(135deg, #6585ed0f, #a78af10a); color: #a193e8; border: 1px solid #9d98f024; border-radius: 10px; }.service-icon .icon { width: 23px; height: 23px; }
.service-number { font-size: 10px; color: #8b89a2; font-family: var(--mono); align-self: flex-start; margin-top: 5px; }
.service-card h3 { font-size: 16px; font-weight: 580; line-height: 1.45; letter-spacing: -.02em; margin-bottom: 12px; }
.service-lead { font-size: 14px; line-height: 1.75; color: #bfbecd; margin-bottom: 12px; }
.service-description { font-size: 13px; line-height: 1.9; color: #9699a9; margin-bottom: 19px; }
.service-bottom { margin-top: auto; border-top: 1px solid #b7bcff0c; display: flex; align-items: center; justify-content: space-between; gap: 3px; padding-top: 7px; }
.service-bottom>span { font-family: var(--mono); font-size: 7px; letter-spacing: .04em; color: #9291a9; }
.round-link { width: 44px; height: 44px; display: grid; place-items: center; border-radius: 50%; flex-shrink: 0; color: #a19aac; transition: background .25s, color .25s; }.round-link .icon { width: 17px; height: 17px; }
@media (hover: hover) {
  .service-card:hover, .can-reveal .service-card.is-visible:hover { transform: translateY(-5px); border-color: #a68bfd48; box-shadow: 0 10px 36px #05050870; }
  .service-card:hover::after { opacity: .8; }.service-card:hover .round-link { color: #d9caff; background: #9672f017; }
}
.service-card:focus-within { border-color: #ad91fb66; }
.services-footnote { display: flex; justify-content: center; gap: 10px; flex-wrap: wrap; font-size: 11px; color: #8d8b9f; margin-top: 32px; }
.services-footnote a { color: #c0b6e3; display: inline-flex; align-items: center; gap: 8px; }.services-footnote a .icon { width: 14px; height: 14px; }

/* Solutions interactive concept */
.solutions-section { position: relative; background: #0b0c13; border-block: 1px solid #c0b4ff0b; }
.solutions-grid { display: grid; grid-template-columns: .92fr 1.08fr; align-items: center; gap: 84px; }
.section-intro { color: var(--muted); font-size: 14px; line-height: 1.9; margin-top: 27px; }
.solution-options { display: flex; flex-wrap: wrap; gap: 9px; margin-block: 31px 22px; max-width: 490px; }
.solution-pill { display: inline-flex; align-items: center; gap: 8px; border: 1px solid #b6b7e924; background: #14141f60; min-height: 42px; font-size: 11px; color: #a5a2b6; padding: 10px 12px; border-radius: 7px; transition: background .25s, border-color .25s, color .25s; }
.solution-pill .icon { width: 15px; height: 15px; }
.solution-pill.is-active { background: #8970db1a; color: #d9cbff; border-color: #ac8dff77; }
.solution-pill:hover { color: #e8e2f6; border-color: #ac8dff66; }
.solution-stage { border: 1px solid #b8a4ec30; border-radius: 17px; overflow: hidden; background: radial-gradient(ellipse at 45% 40%, #5e46812b, transparent 80%), #10111c; box-shadow: 0 20px 80px #0003; }
.solution-stage-top { display: flex; align-items: center; gap: 9px; padding: 19px 22px; font-family: var(--mono); font-size: 8px; letter-spacing: .1em; color: #c0b4da; border-bottom: 1px solid #c7c0e313; }
.stage-concept { margin-left: auto; color: #8e839f; font-size: 7px; }
.preview-canvas { height: 325px; position: relative; perspective: 1300px; }
.browser-preview { position: absolute; left: 26px; top: 43px; width: 83%; height: 242px; border: 1px solid #c2adfb3d; border-radius: 9px; overflow: hidden; box-shadow: 0 13px 35px #0008; transform: rotateY(-7deg) rotateZ(-3deg); background: #111220; }
.browser-toolbar { height: 24px; background: #222033; display: flex; align-items: center; justify-content: space-between; gap: 10px; padding-inline: 9px; border-bottom: 1px solid #d3c4ff10; }.browser-toolbar .icon { width: 8px; height: 8px; color: #8d85a5; }.browser-url { font-size: 6px; font-family: var(--mono); color: #8d85a5; }
.browser-page { padding: 16px 21px; background: radial-gradient(at 90% 70%, #27203b, transparent 80%); height: calc(100% - 24px); }
.mock-nav { display: flex; align-items: center; justify-content: space-between; gap: 10px; }.mock-wordmark { font-size: 10px; font-weight: 600; letter-spacing: -.035em; }.mock-wordmark span { font-size: 5px; vertical-align: top; margin-left: 1px; }
.mock-nav-lines { display: flex; gap: 7px; margin-left: auto; }.mock-nav-lines i { background: #9791b132; width: 20px; height: 2px; }.mock-nav b { background: #7e60ce; padding: 3px; border-radius: 3px; }.mock-nav b .icon { width: 8px; height: 8px; }
.mock-page-body { display: grid; grid-template-columns: 1fr 1fr; margin-top: 25px; align-items: center; gap: 5px; }
.mock-text>span { display: block; color: #b394ed; font-size: 4px; letter-spacing: .15em; margin-bottom: 8px; }.mock-text strong { font-size: 22px; font-weight: 550; letter-spacing: -.04em; line-height: 1.12; display: block; }.mock-text em { font-style: normal; color: #b69eec; }
.mock-lines { margin-top: 10px; display: flex; flex-direction: column; gap: 4px; }.mock-lines i { height: 2px; width: 93%; background: #a39cbd29; }.mock-lines i:last-child { width: 72%; }
.mock-cta { display: inline-flex; align-items: center; gap: 15px; font-size: 4px; background: #8a6ec3; color: white; padding: 6px 8px; border-radius: 3px; margin-top: 13px; }.mock-cta .icon { width: 6px; height: 6px; }
.abstract-object { position: relative; height: 140px; perspective: 600px; margin-left: -6px; }
.object-ring { position: absolute; width: 116px; height: 116px; border-radius: 50%; border: 10px solid #9072d9; left: 10px; top: 11px; box-shadow: inset 0 0 10px #a98ddd, 1px 2px 0 #3b285c, 2px 5px 0 #271b45, 4px 7px 14px #0005, 0 0 18px #a37fed19; }
.r1 { transform: rotateY(55deg) rotateX(-20deg) rotateZ(-35deg); }.r2 { transform: rotateY(55deg) rotateX(40deg) rotateZ(25deg); border-color: #b293ec; }.r3 { transform: rotateY(-50deg) rotateX(15deg) rotateZ(30deg); border-color: #6d67bf; }.object-spark { position: absolute; left: 58px; top: 60px; color: #ece1ff; }.object-spark .icon { width: 20px; height: 20px; }
.phone-preview { position: absolute; top: 109px; right: 20px; width: 101px; height: 199px; background: #0b0c14; border: 3px solid #4f4861; border-radius: 19px; box-shadow: 0 9px 30px #0008; transform: rotate(5deg); overflow: hidden; }
.phone-notch { width: 36px; height: 8px; border-radius: 0 0 6px 6px; background: #05060b; position: absolute; left: 50%; top: 0; transform: translateX(-50%); z-index: 1; }
.phone-content { padding: 17px 10px 8px; height: 100%; background: radial-gradient(at 100% 60%, #42305688, transparent); }
.phone-logo { font-size: 10px; font-weight: 700; }.phone-label { display: block; font-size: 4px; color: #b09bcf; margin-top: 9px; margin-bottom: 4px; }.phone-content strong { font-size: 16px; line-height: 1.1; letter-spacing: -.04em; display: block; }.phone-content em { color: #b29ada; font-style: normal; }
.phone-art { position: absolute; right: 8px; top: 98px; color: #a88bdf; transform: rotate(12deg); }.phone-art .icon { width: 40px; height: 40px; stroke-width: 1.5; }
.phone-lines { display: grid; gap: 4px; margin-top: 43px; }.phone-lines i { height: 2px; background: #a48cce50; width: 33px; }.phone-lines i:last-child { width: 23px; }.phone-cta { display: grid; place-items: center; background: #8c6dc4; border-radius: 50%; height: 16px; width: 16px; margin-top: 9px; }.phone-cta .icon { width: 8px; height: 8px; }.phone-bottom-line { width: 32px; height: 2px; border-radius: 1px; background: #7c708f; position: absolute; bottom: 5px; left: calc(50% - 16px); }
.responsive-badge { position: absolute; bottom: 7px; left: 24px; display: inline-flex; align-items: center; gap: 6px; background: #181b2a; padding: 6px 10px; border: 1px solid #a699d23f; border-radius: 5px; color: #b6adc9; font-size: 7px; }.responsive-badge .icon { color: #aaa0da; width: 11px; height: 11px; }
.solution-description { display: flex; gap: 13px; align-items: flex-start; padding: 25px 24px 26px; min-height: 128px; border-top: 1px solid #b2a3df16; background: #11121db0; }
.solution-icon { display: grid; place-items: center; border: 1px solid #b2a0ea33; background: #9b7dec13; border-radius: 9px; color: #bdacf0; width: 38px; height: 38px; flex-shrink: 0; }.solution-icon .icon { width: 18px; height: 18px; }
.solution-description h3 { font-size: 14px; line-height: 1.4; margin-bottom: 7px; }.solution-description p { font-size: 11px; line-height: 1.7; color: #9691aa; }
.solution-stage[data-view="app"] .phone-preview { transform: rotate(0) scale(1.08); }
.solution-stage[data-view="app"] .browser-preview { opacity: .7; }
.solution-stage[data-view="automation"] .object-ring, .solution-stage[data-view="odoo"] .object-ring { border-color: #6991de; }
.solution-stage[data-view="software"] .object-ring, .solution-stage[data-view="dashboard"] .object-ring { border-color: #6d8aaa; }
.solution-stage[data-view="shopify"] .object-ring, .solution-stage[data-view="commerce"] .object-ring { border-color: #9d8cde; }
.phone-preview, .browser-preview, .object-ring { transition: transform .5s var(--ease), opacity .4s, border-color .4s; }

/* Method */
.process-section { background: #080a10; }
.process-grid { display: grid; grid-template-columns: repeat(4, 1fr); list-style: none; margin: 60px 0 0; padding: 0; gap: 35px; }
.process-track { display: flex; align-items: center; gap: 15px; margin-bottom: 27px; }.process-track>span { font-family: var(--mono); font-size: 12px; color: #b6a4e3; }.process-track>div { height: 1px; flex-grow: 1; background: linear-gradient(90deg, #9d88ca4d, #9d88ca10); }.process-track .icon { width: 20px; height: 20px; color: #a49abf; }
.process-step h3 { font-size: 17px; letter-spacing: -.025em; margin-bottom: 12px; }.process-step p { max-width: 245px; font-size: 12px; color: #9998a9; line-height: 1.85; min-height: 67px; }.process-sub { display: block; color: #9d8fbb; font-size: 10px; margin-top: 22px; }

/* Difference / studio */
.values-section { border-top: 1px solid #c8bdff0e; background: radial-gradient(ellipse at 50% 0, #3c254a16, transparent 70%), #0b0c13; }
.values-intro { position: relative; }
.values-intro .eyebrow { margin-bottom: 27px; }
.values-intro h2 { font-size: 14px; letter-spacing: 0; color: #a5a1b6; font-weight: 450; line-height: 1.8; margin-bottom: 26px; }
.statement { font-size: clamp(40px, 4.5vw, 65px); letter-spacing: -.053em; font-weight: 530; line-height: 1.17; }
.statement-star { position: absolute; right: 54px; top: 130px; color: #a596ce; transform: rotate(10deg); }.statement-star .icon { width: 100px; height: 100px; stroke-width: .65; }
.values-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0; margin-top: 64px; border-block: 1px solid var(--line); }
.value-card { padding: 29px 30px 29px; border-left: 1px solid var(--line); }.value-card:first-child { padding-left: 0; border: 0; }.value-card:last-child { padding-right: 0; }
.value-card>.icon { color: #a696d9; width: 22px; height: 22px; margin-bottom: 20px; }.value-card h3 { font-size: 16px; letter-spacing: -.03em; margin-bottom: 8px; }.value-card p { font-size: 12px; color: #9793a8; line-height: 1.9; }

/* Technology */
.technology-section { padding: 66px 0 79px; background: #0b0c13; }
.technology-heading { display: flex; align-items: flex-end; justify-content: space-between; gap: 30px; margin-bottom: 30px; }
.technology-heading h2 { font-size: 24px; line-height: 1.2; letter-spacing: -.04em; }.technology-heading h2 span { color: #9692a6; }.technology-heading p { font-size: 12px; color: #9893aa; }
.technology-badges { list-style: none; padding: 0; margin: 0; display: flex; flex-wrap: wrap; gap: 10px; }
.technology-badge { min-height: 52px; border: 1px solid #bdb3e11c; background: #d7ceff03; border-radius: 8px; display: flex; justify-content: center; align-items: center; padding: 12px 20px; font-size: 14px; color: #c0bacc; font-weight: 550; flex: 1 0 auto; letter-spacing: -.015em; }.technology-badge--odoo { font-size: 21px; font-weight: 500; letter-spacing: -.04em; }
.technology-note { font-size: 9px; color: #8e889e; margin-top: 17px; }

/* Large project CTA */
.cta-section { padding: 28px 0 56px; background: #0b0c13; }
.cta-panel { position: relative; overflow: hidden; border: 1px solid #bb9df350; border-radius: 20px; background: radial-gradient(ellipse at 83% 20%, #926cf72b, transparent 63%), linear-gradient(115deg, #221a38, #161026 60%, #241738); min-height: 404px; padding: 65px 68px; }
.cta-panel::after { content: ''; pointer-events: none; position: absolute; height: 1px; top: 0; left: 15%; right: 15%; background: linear-gradient(90deg, transparent, #d6b8ff80, transparent); }
.cta-content { position: relative; z-index: 2; }
.cta-content .eyebrow { font-size: 9px; color: #c1afdf; margin-bottom: 25px; }.cta-content h2 { font-size: clamp(38px, 4vw, 58px); letter-spacing: -.055em; line-height: 1.13; }.cta-content h2 span { color: #c7a9fa; }
.cta-content>p { max-width: 550px; font-size: 13px; line-height: 1.9; color: #b7a8c9; margin-top: 24px; }.cta-actions { display: flex; align-items: center; gap: 14px; margin-top: 28px; }
.cta-decoration { position: absolute; width: 500px; height: 500px; right: -75px; top: -30px; transform: rotate(-28deg); }
.cta-decoration>span { position: absolute; inset: 0; border: 1px solid #c9a7ff17; border-radius: 50%; }.cta-decoration>span:nth-child(2) { inset: 55px; border-color: #c9a7ff27; }.cta-decoration>span:nth-child(3) { inset: 115px; border-color: #c9a7ff3a; }.cta-decoration>.icon { position: absolute; width: 80px; height: 80px; color: #d0aff090; top: 198px; left: 200px; stroke-width: .75; }

/* Contact form */
.contact-section { padding-top: 106px; padding-bottom: 112px; background: #090a10; }
.contact-grid { display: grid; grid-template-columns: .84fr 1.16fr; gap: 106px; align-items: start; }
.contact-copy { padding-top: 9px; }.contact-copy h2 { font-size: 54px; letter-spacing: -.05em; }.contact-copy>p { font-size: 14px; line-height: 1.9; color: #a29aad; margin-top: 27px; max-width: 355px; }
.contact-email { display: flex; align-items: center; gap: 12px; margin-top: 40px; }
.contact-email-icon { flex-shrink: 0; width: 41px; height: 41px; display: grid; place-items: center; border: 1px solid #a998d331; background: #9c78d30d; border-radius: 9px; color: #b9a6dd; }.contact-email-icon .icon { width: 18px; height: 18px; }
.contact-email small { display: block; font-size: 8px; letter-spacing: .11em; color: #9b8fac; }.contact-email strong { display: block; font-size: 12px; font-weight: 450; color: #d6c9ea; margin-top: 2px; }.contact-email>.icon { width: 15px; height: 15px; color: #a294bb; margin-left: 2px; }
.contact-note { display: flex; align-items: flex-start; gap: 12px; border-top: 1px solid #b7a8d821; padding-top: 27px; margin-top: 36px; max-width: 345px; }.contact-note>.icon { width: 16px; height: 16px; margin-top: 3px; color: #9a88b5; }.contact-note p { font-size: 11px; color: #93879f; line-height: 1.9; }
.contact-form-wrap { border: 1px solid #b5a6d826; background: #11111b; border-radius: 16px; padding: 29px 30px 24px; }
.form-title { display: flex; justify-content: space-between; align-items: center; gap: 15px; margin-bottom: 4px; }.form-title h3 { font-size: 17px; letter-spacing: -.035em; font-weight: 550; }.form-title>span { font-family: var(--mono); font-size: 7px; color: #a293b2; letter-spacing: .04em; display: flex; align-items: center; gap: 10px; white-space: nowrap; }.form-title>span .icon { width: 13px; height: 13px; }
.form-help { font-size: 10px; color: #92859f; margin-bottom: 25px; }
.form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 20px 18px; }
.form-field { min-width: 0; }.form-field--wide { grid-column: 1 / -1; }
.form-field label { display: block; font-size: 11px; line-height: 1.5; margin-bottom: 8px; color: #d4c9df; }.form-field label>span:not(.optional) { color: #be9ef3; }.optional { font-size: 9px; color: #9b8aa7; font-weight: 400; }
.form-field input, .form-field select, .form-field textarea { appearance: none; -webkit-appearance: none; width: 100%; background: #0c0c15; border: 1px solid #b5a4cd28; border-radius: 7px; color: #ebe2f6; padding: 12px 13px; min-height: 46px; outline: 0; font-size: 14px; line-height: 1.55; transition: border-color .2s, box-shadow .2s; }
.form-field textarea { resize: vertical; min-height: 119px; }.form-field input::placeholder, .form-field textarea::placeholder { color: #95869f; opacity: 1; }
.form-field input:focus, .form-field select:focus, .form-field textarea:focus { border-color: #af8eeb88; box-shadow: 0 0 0 3px #9773d717; }
.form-field [aria-invalid="true"] { border-color: #e28f9b; }
.form-field input:autofill { box-shadow: 0 0 0 1000px #191526 inset; -webkit-text-fill-color: #ebe2f6; }
.select-wrap { position: relative; }.select-wrap select { padding-right: 36px; }.select-wrap>.icon { position: absolute; right: 13px; top: 16px; width: 15px; height: 15px; color: #a48dbd; pointer-events: none; }
select:invalid { color: #95869f; }select option { background: #11121a; color: #eee7f6; }
.privacy-checkbox { display: flex; align-items: flex-start; gap: 9px; color: #a395ae; font-size: 10px; line-height: 1.9; margin-top: 20px; cursor: pointer; }.privacy-checkbox input { accent-color: #8965d9; width: 15px; height: 15px; flex-shrink: 0; margin: 3px 0 0; cursor: pointer; }.privacy-checkbox a { color: #c5afe7; text-decoration: underline; text-underline-offset: 3px; }
.form-submit { width: 100%; margin-top: 22px; min-height: 50px; justify-content: space-between; font-size: 12px; }.form-submit:disabled { opacity: .75; transform: none; box-shadow: none; }
.form-status { font-size: 12px; line-height: 1.8; padding: 14px 15px; margin-top: 16px; background: #5f4b8120; color: #d4bfdc; border: 1px solid #a180ba3d; border-radius: 7px; overflow-wrap: anywhere; }
.form-status[data-kind="error"] { background: #8a344615; color: #e3b3bc; border-color: #b4667140; }.form-status[data-kind="success"] { background: #43877317; color: #b4d4cb; border-color: #71b9a63d; }
.form-reassurance { display: flex; align-items: center; justify-content: center; gap: 6px; font-size: 9px; color: #9b8aa6; margin-top: 14px; }.form-reassurance .icon { width: 11px; height: 11px; }
.button-spinner { width: 17px; height: 17px; border: 2px solid #ffffff44; border-top-color: #fff; border-radius: 50%; animation: spin .7s linear infinite; }
.hp-field { position: absolute; left: -10000px; width: 1px; height: 1px; overflow: hidden; }
.no-js-form { font-size: 12px; padding-top: 15px; color: #bda2da; }

/* Footer */
.site-footer { background: #09090f; border-top: 1px solid #b7a4d521; overflow: hidden; padding-top: 62px; }
.footer-top { display: grid; grid-template-columns: 1.4fr 1fr .8fr .9fr 1.22fr; gap: 30px; padding-bottom: 48px; }
.footer-brand .brand-monogram { font-size: 36px; }.footer-brand .brand-type { font-size: 8px; }.footer-brand>p { font-size: 11px; color: #aaa0b6; margin-top: 22px; }.footer-brand>span { font-size: 9px; color: #887990; display: block; margin-top: 6px; }
.footer-column { display: flex; flex-direction: column; align-items: flex-start; }.footer-column h3 { font-size: 10px; font-weight: 600; color: #d7cbe1; margin-bottom: 19px; }.footer-column>a { display: inline-flex; align-items: center; min-height: 28px; font-size: 10px; color: #9f90a9; transition: color .2s; }.footer-column>a:hover { color: #e0c6fa; }
.footer-contact>a { font-size: 10px; overflow-wrap: anywhere; }.social-links { display: flex; flex-direction: column; align-items: flex-start; gap: 2px; margin-top: 13px; }.social-links>a, .social-unconfigured { display: inline-flex; min-height: 27px; align-items: center; gap: 9px; font-size: 10px; color: #a693b0; }.social-links .icon { width: 10px; height: 10px; }.social-unconfigured { color: #91809e; cursor: default; }
.footer-bottom { display: flex; align-items: center; justify-content: space-between; gap: 25px; border-top: 1px solid #baa9d321; padding-block: 20px; }.footer-bottom>p { font-size: 9px; color: #927f9e; }.footer-bottom>div { display: flex; align-items: center; gap: 24px; }.footer-bottom a, .footer-bottom button { display: inline-flex; align-items: center; gap: 6px; font-size: 9px; color: #a18aa9; min-height: 44px; padding: 0; }.footer-bottom .icon { width: 12px; height: 12px; }.footer-bottom a:hover, .footer-bottom button:hover { color: #e4cefa; }
.footer-signature { display: flex; align-items: flex-start; justify-content: space-between; white-space: nowrap; font-size: clamp(55px, 9.2vw, 132px); font-weight: 650; line-height: .93; letter-spacing: -.065em; padding-top: 29px; padding-bottom: 10px; background: linear-gradient(#9980b53a, #9980b506); background-clip: text; -webkit-background-clip: text; color: transparent; user-select: none; }.footer-signature>span { font-size: .2em; letter-spacing: -.06em; padding-top: .1em; }

/* Motion (progressive enhancement: readable when JS is absent or fails) */
.can-reveal .reveal:not(.is-visible) { opacity: 0; transform: translateY(20px); }
.reveal { transition: opacity .65s var(--ease), transform .65s var(--ease); }
.can-reveal .reveal.is-visible { opacity: 1; transform: translateY(0); }
.services-grid .reveal:nth-child(4n+2), .process-grid .reveal:nth-child(2), .values-grid .reveal:nth-child(2) { transition-delay: 50ms; }
.services-grid .reveal:nth-child(4n+3), .process-grid .reveal:nth-child(3), .values-grid .reveal:nth-child(3) { transition-delay: 100ms; }
.services-grid .reveal:nth-child(4n+4), .process-grid .reveal:nth-child(4), .values-grid .reveal:nth-child(4) { transition-delay: 150ms; }
@keyframes wire-travel { to { stroke-dashoffset: -320; } }
@keyframes float-code { 0%, 100% { transform: translateY(0) rotate(-5deg); } 50% { transform: translateY(-8px) rotate(-4deg); } }
@keyframes float-design { 0%, 100% { transform: translateY(0) rotate(5deg); } 50% { transform: translateY(8px) rotate(4deg); } }
@keyframes spin { to { transform: rotate(360deg); } }
html[data-motion="off"] { scroll-behavior: auto; }
html[data-motion="off"] *, html[data-motion="off"] *::before, html[data-motion="off"] *::after { animation-play-state: paused !important; transition-duration: .01ms !important; }
html[data-motion="off"] .reveal { opacity: 1 !important; transform: none !important; }

/* Privacy placeholder */
.privacy-header { display: flex; align-items: center; justify-content: space-between; min-height: 100px; gap: 20px; }
.privacy-main { max-width: 820px; padding-block: 55px 100px; }.privacy-main h1 { font-size: 53px; margin-bottom: 25px; }.privacy-main h2 { font-size: 26px; margin-top: 35px; margin-bottom: 15px; }.privacy-main p { font-size: 15px; color: #b0a5bb; margin-top: 20px; }.privacy-main a { text-decoration: underline; color: #c9b1f4; }.privacy-main code { font-size: 13px; color: #dbc7f3; overflow-wrap: anywhere; }.privacy-draft-banner { border: 1px solid #c3967455; border-radius: 8px; background: #a7764e16; padding: 15px 20px; font-size: 11px; letter-spacing: .05em; color: #e5be9f; }.privacy-main .privacy-last-note { padding-top: 30px; border-top: 1px solid var(--line); font-size: 12px; }

/* Responsive */
@media (min-width: 1600px) {
  .hero-grid { min-height: 760px; }.hero-visual { transform: scale(1.03); }
}
@media (max-width: 1200px) {
  .container { width: calc(100% - 80px); }.desktop-nav { gap: 25px; }
  .hero-grid { min-height: 680px; grid-template-columns: 1.02fr 1fr; gap: 12px; }
  h1 { font-size: clamp(49px, 5.4vw, 67px); }.hero-description { font-size: 13px; max-width: 450px; }.hero-actions .button { padding: 14px 16px; font-size: 11px; gap: 15px; }.hero-note { font-size: 9px; }
  .hero-visual { height: 490px; }.ecosystem { height: 305px; top: 100px; }.ecosystem-core { top: 118px; width: 72px; height: 72px; left: calc(50% - 36px); border-radius: 19px; }.core-inner { border-radius: 13px; font-size: 29px; }.connections { height: 235px; }.system-node { min-width: 122px; padding: 9px 8px; gap: 6px; }.system-node>.icon { width: 16px; height: 16px; }.system-node strong { font-size: 7px; }.system-node span { font-size: 5px; }.node-web { left: 4%; top: 80px; }.node-app { right: 3%; top: 78px; min-width: 108px; }.node-data { bottom: 50px; left: 4%; }.node-auto { right: 3%; bottom: 50px; min-width: 108px; }.floating-code { width: 190px; bottom: 0; left: -8%; }.floating-code code { font-size: 8px; }.floating-design { right: -5px; top: 65px; padding: 10px 12px; }.floating-design strong { font-size: 9px; }.floating-design div>span { font-size: 5px; }.hero-visual figcaption { font-size: 5.5px; bottom: 2px; }
  .service-card { padding: 22px 18px 13px; min-height: 355px; }.service-card h3 { font-size: 14px; }.service-description { font-size: 11px; }.service-lead { font-size: 12px; }.service-bottom>span { font-size: 6px; }
  .solutions-grid { gap: 48px; }.browser-page { padding: 14px 15px; }.mock-page-body { margin-top: 30px; }.mock-text strong { font-size: 20px; }.object-ring { width: 100px; height: 100px; border-width: 8px; left: 3px; top: 18px; }.object-spark { left: 43px; }.phone-preview { right: 13px; }
  .contact-grid { gap: 65px; }.contact-copy h2 { font-size: 49px; }.contact-form-wrap { padding-inline: 25px; }.form-title>span { font-size: 6px; }.footer-top { gap: 22px; }.footer-column>a, .social-links>a, .social-unconfigured { font-size: 9px; }
}
@media (max-width: 1000px) {
  .container { width: calc(100% - 64px); }:root { --header-height: 78px; }.section-space { padding-block: 90px; }
  .header-inner { gap: 15px; }.desktop-nav { gap: 20px; }.desktop-nav a { font-size: 11px; }.brand-monogram { font-size: 36px; }.brand-type { font-size: 9px; }.header-actions .button { font-size: 11px; padding: 10px 13px; gap: 13px; }
  .hero-grid { min-height: 649px; gap: 0; padding-block: 65px; }.hero-copy .eyebrow { font-size: 8px; gap: 8px; }.hero-description { font-size: 12px; padding-right: 12px; }.hero-actions { gap: 10px; }.hero-actions .button { font-size: 10px; padding: 13px; min-height: 48px; gap: 8px; }.hero-actions .icon { width: 14px; }.hero-note { font-size: 8px; line-height: 1.8; }.hero-visual { width: 115%; margin-left: -4%; transform: scale(.89); transform-origin: left center; }.hero-end { font-size: 7px; }
  .capability-strip .container { gap: 15px; min-height: 70px; }.capability-strip span { font-size: 8px; }.capability-strip .icon { width: 10px; height: 10px; }
  .services-grid { grid-template-columns: repeat(2, 1fr); gap: 16px; }.service-card { min-height: 318px; padding: 25px 25px 15px; }.service-card h3 { font-size: 16px; }.service-lead { font-size: 13px; }.service-description { font-size: 12px; }.service-bottom>span { font-size: 8px; }.service-top { margin-bottom: 20px; }
  .section-heading--split { gap: 40px; }.section-heading--split>p { font-size: 12px; max-width: 310px; }.solutions-grid { gap: 30px; }.solutions-copy h2 { font-size: 42px; }.section-intro { font-size: 12px; }.solution-pill { font-size: 10px; padding: 9px 10px; gap: 6px; }.solution-pill .icon { width: 13px; height: 13px; }.solution-options { gap: 7px; }
  .preview-canvas { height: 310px; }.browser-preview { left: 16px; top: 53px; height: 210px; width: 85%; }.browser-page { padding: 12px; }.mock-page-body { margin-top: 22px; }.mock-text strong { font-size: 17px; }.abstract-object { height: 116px; }.object-ring { width: 82px; height: 82px; border-width: 7px; top: 22px; left: -5px; }.object-spark { left: 27px; top: 53px; }.object-spark .icon { width: 17px; height: 17px; }.phone-preview { top: 111px; right: 7px; transform: rotate(4deg) scale(.86); transform-origin: right center; }.responsive-badge { left: 16px; bottom: 12px; font-size: 6px; }.solution-description { padding: 20px 18px; min-height: 139px; }.solution-description h3 { font-size: 12px; }.solution-description p { font-size: 10px; }
  .process-grid { gap: 23px; }.process-step h3 { font-size: 15px; }.process-step p { font-size: 11px; min-height: 84px; }.process-sub { font-size: 9px; }.statement-star { right: 0; top: 133px; }.statement-star .icon { width: 65px; height: 65px; }.value-card { padding-inline: 22px; }.value-card p { font-size: 11px; }
  .technology-badge { padding-inline: 14px; font-size: 12px; }.technology-badge--odoo { font-size: 17px; }.technology-heading p { font-size: 11px; }
  .cta-panel { padding: 54px 45px; }.cta-decoration { right: -190px; }.cta-content>p { max-width: 425px; }
  .contact-grid { gap: 38px; grid-template-columns: .82fr 1.18fr; }.contact-copy h2 { font-size: 41px; }.contact-copy>p { font-size: 12px; }.contact-email { gap: 9px; }.contact-email strong { font-size: 10px; }.contact-email>.icon { display: none; }.contact-email-icon { width: 34px; height: 34px; }.contact-note p { font-size: 10px; }.contact-form-wrap { padding: 26px 22px; }.form-title>span { display: none; }.form-title h3 { font-size: 16px; }.form-field label { font-size: 10px; }.optional { font-size: 8px; }.form-field input, .form-field select, .form-field textarea { font-size: 11px; }.form-grid { gap: 16px 12px; }
  .footer-top { grid-template-columns: 1.2fr 1fr .9fr; gap: 35px; }.footer-column>a, .social-links>a, .social-unconfigured { font-size: 11px; min-height: 31px; }.footer-column h3 { font-size: 11px; }.footer-contact { grid-column: 2 / 4; }.social-links { flex-direction: row; gap: 20px; }.footer-signature { font-size: 9vw; }
}
@media (max-width: 760px) {
  :root { --header-height: 74px; }.container { width: calc(100% - 40px); }.section-space { padding-block: 76px; }
  .desktop-nav { display: none; }.menu-toggle { display: inline-block; }.header-actions .button { min-height: 40px; padding: 10px 12px; font-size: 10px; gap: 13px; }.header-actions .button .icon { width: 13px; height: 13px; }.header-inner { gap: 12px; }.brand { gap: 11px; }.brand-monogram { font-size: 34px; }.brand-type { font-size: 8px; padding-left: 10px; }
  .hero-grid { grid-template-columns: 1fr; gap: 0; padding-block: 48px 15px; min-height: auto; }
  .hero-copy .eyebrow { font-size: 9px; margin-bottom: 25px; letter-spacing: .12em; }.hero-copy { max-width: 530px; }h1 { font-size: clamp(46px, 8.3vw, 65px); line-height: 1.055; letter-spacing: -.055em; }
  .hero-description { font-size: 13px; line-height: 1.9; margin-top: 25px; max-width: 510px; padding: 0; }.hero-actions { margin-top: 25px; gap: 10px; }.hero-actions .button { font-size: 11px; min-height: 50px; padding: 15px 16px; gap: 15px; }.hero-note { font-size: 8px; margin-top: 18px; }
  .hero-visual { width: 100%; max-width: 570px; height: 475px; margin: 12px auto 0; transform: none; }.ecosystem { width: 88%; left: 6%; height: 316px; top: 78px; }.visual-top-label { top: 32px; left: 35px; font-size: 6px; }.floating-design { top: 43px; right: 0; }.floating-code { left: 0; bottom: 9px; width: 190px; }.floating-code code { font-size: 8px; }.hero-visual figcaption { bottom: 15px; font-size: 5.5px; right: 2px; }.visual-cross.cross-one { top: 16px; right: 8px; }.visual-cross.cross-two { bottom: -6px; left: 5px; }.orbit-one { width: 510px; height: 510px; top: -5px; left: calc(50% - 255px); }.orbit-two { width: 390px; height: 390px; top: 55px; left: calc(50% - 195px); }.node-app { right: 4%; }.node-auto { right: 4%; }.connections { height: 241px; }.ecosystem-core { top: 122px; }
  .hero-end { min-height: 70px; font-size: 7px; }.hero-end>span { display: none; }.hero-end a { margin-left: auto; gap: 13px; }
  .capability-strip .container { display: grid; grid-template-columns: 1fr auto 1fr auto 1fr; gap: 14px; padding-block: 20px; text-align: center; }.capability-strip span { font-size: 7px; }.capability-strip .icon:nth-of-type(3) { display: none; }.capability-strip .icon { width: 10px; height: 10px; }
  h2 { font-size: 40px; }.eyebrow { font-size: 9px; margin-bottom: 22px; }.section-heading { margin-bottom: 32px; }.section-heading--split { display: block; }.section-heading--split>p { margin-top: 22px; font-size: 13px; line-height: 1.9; max-width: 480px; }
  .services-grid { gap: 12px; }.service-card { padding: 21px 18px 13px; min-height: 340px; }.service-card h3 { font-size: 14px; }.service-lead { font-size: 12px; }.service-description { font-size: 11px; }.service-bottom>span { font-size: 6px; }.service-icon { height: 38px; width: 38px; }.service-number { font-size: 9px; }.services-footnote { font-size: 10px; gap: 5px; text-align: center; margin-top: 27px; }.services-footnote a { min-height: 34px; }
  .solutions-grid { grid-template-columns: 1fr; gap: 35px; }.solutions-copy { max-width: 530px; }.solutions-copy h2 { font-size: 44px; }.section-intro { font-size: 13px; margin-top: 24px; }.solution-options { margin-block: 25px 17px; gap: 8px; }.solution-pill { min-height: 43px; font-size: 11px; padding: 10px 13px; gap: 8px; }.solution-pill .icon { width: 15px; height: 15px; }.solution-stage { max-width: 580px; width: 100%; }.solution-stage-top { padding: 18px; }.preview-canvas { height: 326px; }.browser-preview { left: 24px; top: 45px; width: 83%; height: 235px; }.browser-page { padding: 16px 18px; }.mock-page-body { margin-top: 23px; }.mock-text strong { font-size: 22px; }.object-ring { width: 116px; height: 116px; border-width: 10px; top: 0; left: 5px; }.object-spark { top: 49px; left: 52px; }.phone-preview { transform: rotate(5deg); right: 22px; top: 111px; }.responsive-badge { left: 24px; bottom: 8px; font-size: 7px; }.solution-description { padding: 25px 23px; min-height: 117px; }.solution-description h3 { font-size: 14px; }.solution-description p { font-size: 11px; }
  .process-grid { grid-template-columns: 1fr 1fr; gap: 38px 30px; margin-top: 42px; }.process-track { margin-bottom: 20px; }.process-step h3 { font-size: 17px; }.process-step p { font-size: 12px; min-height: 69px; }.process-sub { font-size: 9px; margin-top: 17px; }
  .values-intro h2 { font-size: 12px; margin-bottom: 24px; }.statement { font-size: clamp(31px, 6vw, 46px); line-height: 1.2; }.statement-star { display: none; }.values-grid { margin-top: 39px; grid-template-columns: 1fr 1fr; }.value-card { padding: 25px 20px; }.value-card:nth-child(odd) { padding-left: 0; border-left: 0; }.value-card:nth-child(2) { padding-right: 0; }.value-card:nth-child(n+3) { border-top: 1px solid var(--line); }.value-card>.icon { margin-bottom: 15px; }.value-card h3 { font-size: 15px; }.value-card p { font-size: 12px; }
  .technology-section { padding-block: 20px 65px; }.technology-heading { display: block; }.technology-heading h2 { font-size: 26px; }.technology-heading p { margin-top: 17px; font-size: 12px; }.technology-badges { gap: 8px; }.technology-badge { min-height: 45px; font-size: 12px; padding: 10px 17px; flex-basis: calc(33.333% - 8px); }.technology-badge--odoo { font-size: 17px; }.technology-note { font-size: 9px; line-height: 1.8; }
  .cta-section { padding: 0 0 20px; }.cta-panel { min-height: auto; padding: 40px 28px; border-radius: 16px; }.cta-content h2 { font-size: clamp(30px, 6.3vw, 46px); }.cta-content>p { font-size: 12px; margin-top: 23px; }.cta-content .eyebrow { font-size: 8px; margin-bottom: 23px; }.cta-actions { gap: 10px; margin-top: 27px; }.cta-actions .button { font-size: 11px; min-height: 49px; padding: 14px; gap: 12px; }.cta-decoration { right: -300px; opacity: .55; }
  .contact-grid { grid-template-columns: 1fr; gap: 36px; }.contact-copy h2 { font-size: 44px; }.contact-copy>p { font-size: 13px; max-width: 450px; }.contact-email { margin-top: 28px; }.contact-email strong { font-size: 12px; }.contact-email small { font-size: 8px; }.contact-email-icon { width: 40px; height: 40px; }.contact-email>.icon { display: block; }.contact-note { display: none; }.contact-form-wrap { padding: 28px 23px 23px; }.form-title h3 { font-size: 18px; }.form-help { font-size: 10px; }.form-grid { gap: 20px 14px; }.form-field label { font-size: 11px; }.optional { font-size: 9px; }.form-field input, .form-field select, .form-field textarea { font-size: 16px; padding: 12px; min-height: 50px; }.form-field textarea { min-height: 140px; }.select-wrap>.icon { top: 18px; }.privacy-checkbox { font-size: 10px; }.form-submit { min-height: 52px; font-size: 12px; }
  .site-footer { padding-top: 48px; }.footer-top { grid-template-columns: 1fr 1fr; gap: 33px 24px; padding-bottom: 32px; }.footer-brand { grid-column: 1 / -1; }.footer-brand>p { margin-top: 15px; font-size: 12px; }.footer-brand>span { font-size: 10px; }.footer-contact { grid-column: auto; }.footer-column h3 { font-size: 11px; margin-bottom: 14px; }.footer-column>a { min-height: 33px; font-size: 11px; }.footer-contact>a { font-size: 9px; }.social-links { flex-direction: column; gap: 0; margin-top: 9px; }.social-unconfigured { min-height: 30px; font-size: 10px; }
  .footer-bottom { flex-direction: column; align-items: flex-start; gap: 8px; padding-top: 25px; }.footer-bottom>p { font-size: 9px; }.footer-bottom>div { width: 100%; gap: 20px; }.footer-bottom a, .footer-bottom button { font-size: 9px; }.back-top { margin-left: auto; }.footer-signature { padding-top: 17px; font-size: 8.9vw; padding-bottom: 8px; }
  .privacy-main { padding-top: 30px; }.privacy-main h1 { font-size: 39px; }.privacy-main p { font-size: 14px; }.privacy-header .button { font-size: 11px; padding-inline: 12px; }.privacy-main h2 { font-size: 25px; }
  .no-js .site-header { position: relative; height: auto; }.no-js .hero { padding-top: 0; }.no-js .desktop-nav { display: flex; flex-wrap: wrap; gap: 7px 18px; }.no-js .header-inner { flex-wrap: wrap; height: auto; padding-block: 20px; }.no-js .header-actions { display: none; }
}
@media (max-width: 420px) {
  .container { width: calc(100% - 36px); }.header-actions { gap: 8px; }.header-actions .button { font-size: 9px; gap: 8px; padding: 10px; }.header-actions .button .icon { width: 12px; }.brand-type { font-size: 7px; }.brand-monogram { font-size: 32px; }.brand { gap: 9px; }
  h1 { font-size: clamp(41px, 11.9vw, 50px); }.hero-copy .eyebrow { font-size: 8px; }.hero-description { font-size: 12px; }.hero-actions { flex-wrap: nowrap; }.hero-actions .button { padding: 14px 12px; font-size: 10px; gap: 9px; }.hero-note { font-size: 7px; gap: 6px; }.hero-note .tiny-line { width: 10px; }
  .hero-visual { height: 430px; }.ecosystem { width: 95%; left: 2.5%; top: 77px; height: 283px; }.ecosystem-head { height: 39px; font-size: 7px; gap: 7px; padding-inline: 11px; }.mini-brand { font-size: 18px; }.preview-tag { font-size: 5px; }.ecosystem-core { width: 63px; height: 63px; left: calc(50% - 31.5px); top: 111px; padding: 7px; border-radius: 16px; }.core-inner { font-size: 26px; border-radius: 11px; }.core-caption { font-size: 5px; top: calc(100% + 10px); }.system-node { min-width: 103px; padding: 8px 6px; gap: 5px; }.system-node strong { font-size: 6px; }.system-node span { font-size: 4.5px; }.system-node>.icon { width: 14px; height: 14px; }.node-web { top: 69px; left: 4%; }.node-app { top: 65px; right: 4%; min-width: 96px; }.node-data { bottom: 52px; }.node-auto { bottom: 52px; min-width: 96px; }.connections { inset: 35px 0 auto; height: 220px; }.floating-code { width: 172px; bottom: 8px; left: 0; }.floating-code code { font-size: 7px; padding: 10px 13px; }.code-heading { height: 28px; font-size: 5px; }.floating-design { top: 40px; padding: 9px 10px; }.floating-design strong { font-size: 8px; }.design-symbol { width: 29px; height: 29px; }.design-symbol .icon { width: 17px; height: 17px; }.hero-visual figcaption { font-size: 4px; right: 0; bottom: 14px; }.visual-top-label { top: 20px; left: 15px; font-size: 5px; }.visual-cross.cross-one { top: 0; }
  .services-grid { grid-template-columns: 1fr; gap: 14px; }.service-card { min-height: 0; padding: 24px 24px 15px; }.service-top { margin-bottom: 20px; }.service-card h3 { font-size: 18px; }.service-lead { font-size: 14px; margin-bottom: 10px; }.service-description { font-size: 12px; margin-bottom: 20px; }.service-bottom>span { font-size: 8px; }.service-icon { width: 43px; height: 43px; }
  .section-heading h2, .solutions-copy h2 { font-size: 39px; }.solution-pill { font-size: 10px; padding: 9px 10px; gap: 7px; }
  .browser-preview { left: 18px; width: 86%; height: 212px; }.browser-page { padding: 14px; }.mock-text strong { font-size: 18px; }.mock-page-body { margin-top: 20px; }.object-ring { width: 88px; height: 88px; border-width: 7px; left: -2px; top: 14px; }.object-spark { left: 34px; top: 50px; }.phone-preview { top: 107px; right: 10px; transform: rotate(5deg) scale(.87); transform-origin: right center; }.preview-canvas { height: 302px; }.responsive-badge { left: 17px; bottom: 7px; font-size: 6px; }.solution-description { padding: 23px 18px; gap: 11px; }.solution-description h3 { font-size: 13px; }.solution-description p { font-size: 11px; }
  .process-grid { column-gap: 22px; }.process-step h3 { font-size: 15px; }.process-step p { font-size: 11px; min-height: 83px; }.process-sub { font-size: 8px; }.statement { font-size: 32px; }.values-intro h2 { max-width: 280px; }.value-card p { font-size: 11px; }
  .technology-badge { font-size: 11px; padding-inline: 10px; }.technology-badge--odoo { font-size: 16px; }.cta-panel { padding: 37px 22px; }.cta-content h2 { font-size: 32px; }.cta-content .eyebrow { font-size: 7px; gap: 8px; }.cta-actions .button { font-size: 10px; padding-inline: 12px; gap: 10px; }.cta-actions .icon { width: 14px; }
  .contact-copy h2 { font-size: 42px; }.contact-form-wrap { padding: 25px 20px 21px; }.form-grid { grid-template-columns: 1fr; gap: 18px; }.form-title h3 { font-size: 17px; }.form-field label { font-size: 12px; }.privacy-checkbox { font-size: 10px; }.form-help { margin-bottom: 23px; }.form-reassurance { font-size: 8px; }
  .footer-bottom>div { gap: 16px; }.footer-bottom a, .footer-bottom button { font-size: 8px; }.footer-contact>a { font-size: 8px; }
}
@media (max-width: 350px) {
  .header-actions .button { display: none; }.hero-actions { flex-direction: column; align-items: stretch; }.hero-actions .button { font-size: 12px; }.hero-note { font-size: 6.5px; }h1 { font-size: 40px; }.system-node { min-width: 93px; }.node-app, .node-auto { min-width: 88px; }.system-node>.icon { width: 11px; }.system-node strong { font-size: 5.5px; }.hero-visual figcaption { display: none; }.statement { font-size: 28px; }.cta-actions { align-items: stretch; flex-direction: column; }.cta-content h2 { font-size: 30px; }.solution-pill { font-size: 9px; }.contact-copy h2 { font-size: 38px; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
  .can-reveal .reveal { opacity: 1 !important; transform: none !important; }
}
@media (forced-colors: active) {
  .gradient-text { background: none; -webkit-text-fill-color: CanvasText; }.button { border: 1px solid ButtonText; }.service-card, .contact-form-wrap { border: 1px solid CanvasText; }.hero-visual { display: none; }
}
@media print {
  .site-header, .hero-visual, .solution-stage, .menu-toggle, .menu-backdrop, .form-submit, .footer-signature, .cta-decoration, #motion-toggle { display: none !important; }
  body { background: white; color: black; }main { padding: 0; }.hero { padding-top: 0; }.container { width: 100%; }.hero-grid { grid-template-columns: 1fr; min-height: auto; }.section-space { padding-block: 30px; }.reveal { opacity: 1 !important; transform: none !important; }.gradient-text { background: none; color: black; -webkit-text-fill-color: black; }a { text-decoration: underline; }p, h2, h3 { color: black !important; }.services-grid { grid-template-columns: 1fr 1fr; }.service-card { break-inside: avoid; }.solutions-grid { grid-template-columns: 1fr; }
}
.preview-dialog { max-width: 540px; width: calc(100% - 40px); padding: 35px; background: #141220; border: 1px solid #ad93e466; border-radius: 16px; color: #f1e9fb; box-shadow: 0 30px 100px #0009; }
.preview-dialog::backdrop { background: #05040be6; backdrop-filter: blur(6px); }
.preview-dialog h2 { font-size: 30px; margin-bottom: 20px; }
.preview-dialog p { font-size: 14px; color: #b7a6c8; margin-bottom: 25px; }

/* =====================================================================
   BOMBA DIGITAL STUDIOS — electric-blue identity / approved visual direction
   Official transparent PNG is used unchanged; no white background or recoloring.
   ===================================================================== */
:root {
  --bg:#030914; --surface:#081324; --surface-raised:#0c1a30;
  --text:#f5f8ff; --muted:#a9b9d1; --dim:#7f95b3;
  --line:rgba(77,151,240,.25); --blue:#008cff; --purple:#8157ff;
  --gradient:linear-gradient(110deg,#10bfff 0%,#0089ff 65%,#6289ff 100%);
  --button-gradient:linear-gradient(105deg,#00aaff 0%,#0064ff 65%,#643eff 100%);
  --header-height:100px;
}
body {background:radial-gradient(ellipse at 95% 36%,#0932701f,transparent 30%),var(--bg);}
h1,h2,h3 {font-weight:650;}
h2 {font-size:clamp(30px,3vw,44px);letter-spacing:-.04em;}
.container {width:min(var(--max-width),calc(100% - 100px));}
.section-space {padding-block:68px;}
.eyebrow {color:#53baff;font-size:10px;letter-spacing:.2em;margin-bottom:17px;}
.eyebrow-dot {background:#03abff;box-shadow:0 0 12px #009bff;}
.section-index {border-color:#237bcb50;color:#59b8ff;}
.muted-title {color:var(--text);}
.button {border-radius:7px;min-height:48px;font-size:13px;}
.button--primary,.button--small,.button--light {background:var(--button-gradient);color:white;border:1px solid #36a8ff;box-shadow:inset 0 0 9px #87d3ff44,0 0 24px #005bff38;}
.button--small {min-height:44px;padding-inline:21px;}
.button--ghost,.button--outline {border-color:#2089e7;background:#05101eaa;box-shadow:inset 0 0 12px #0066ff13;}
.button--text {color:#66b9ff;}
.site-header {background:#030914df;border-bottom-color:#1e518b6b;}
.site-header.is-scrolled {background:#030914f5;border-bottom-color:#287eda88;}
.header-inner {gap:24px;}
.logo-window {position:relative;display:block;width:140px;aspect-ratio:2/1;overflow:visible;background:transparent;border:0;border-radius:0;box-shadow:none;}
.logo-window .brand-image {position:static;display:block;width:100%;height:auto;max-height:none;max-width:100%;object-fit:contain;transform:none;filter:drop-shadow(0 0 9px #008aff35);}
.desktop-nav {gap:32px;}
.desktop-nav a {font-size:13px;color:#b1c1d9;}
.desktop-nav a::after {width:32px;height:2px;left:calc(50% - 16px);bottom:3px;border-radius:1px;background:#009dff;box-shadow:0 0 9px #078aff;}
.header-actions {gap:14px;}
.hero {background:radial-gradient(ellipse at 80% 40%,#06276475,transparent 62%),#030914;}
.hero-grid-bg {background-image:linear-gradient(#2b77cc08 1px,transparent 1px),linear-gradient(90deg,#2b77cc08 1px,transparent 1px);background-size:55px 55px;}
.hero-glow {width:850px;height:580px;top:70px;right:-120px;background:radial-gradient(ellipse,#005fff23,transparent 68%);}
.hero-grid {grid-template-columns:1fr 1.13fr;gap:14px;min-height:640px;padding-block:42px 38px;}
.hero-copy .eyebrow {font-size:9px;margin-bottom:22px;}
h1 {font-size:clamp(42px,4.3vw,64px);line-height:1.08;letter-spacing:-.048em;}
.hero-description {font-size:14px;line-height:1.85;max-width:530px;color:#b5c6df;margin-top:24px;}
.hero-actions {gap:13px;margin-top:28px;}
.hero-actions .button {font-size:12px;padding-inline:19px;gap:14px;}
.hero-note {font-size:10px;line-height:1.7;color:#8caaca;margin-top:23px;}
.tiny-line {background:#00aaff;}
.hero-end {min-height:57px;border-color:#1a518347;color:#7b9cbf;}
.hero-end a {color:#75b5f0;}
.capability-strip {display:none;}
/* Decorative laptop and connected UI. Text is real markup, not an image. */
.studio-visual {height:548px;min-width:0;container-type:inline-size;isolation:isolate;}
.studio-ambient {position:absolute;inset:10% -5% 0;background:radial-gradient(ellipse at 60% 55%,#0638a53e,transparent 64%);}
.studio-wires {position:absolute;inset:0;width:100%;height:100%;overflow:visible;}
.light-orbit,.light-path {stroke:url(#wire);stroke-width:2;filter:drop-shadow(0 0 4px #009aff) drop-shadow(0 0 12px #175aff);}
.light-orbit {stroke-width:3;opacity:.85;}
.light-path {stroke-dasharray:40 580;animation:bds-current 12s linear infinite;}
.light-path-secondary {opacity:.45;stroke-width:1;stroke-dasharray:none;}
.studio-laptop {position:absolute;left:23%;top:18%;width:66%;height:67%;transform:perspective(900px) rotateY(-16deg) rotateZ(7deg);filter:drop-shadow(0 22px 23px #000b);}
.studio-screen {height:86%;background:linear-gradient(140deg,#081324,#020812);border:3px solid #345889;border-right-color:#16334f;border-bottom:7px solid #071426;border-radius:12px 12px 4px 4px;box-shadow:inset 0 0 0 4px #020912,0 0 0 1px #1586dc9c,0 0 26px #005cf637;overflow:hidden;}
.screen-toolbar {height:29px;border-bottom:1px solid #1c4879;background:#071429;display:flex;align-items:center;justify-content:space-between;gap:7px;padding:0 12px;color:#7598c4;font:5.8px var(--mono);letter-spacing:.06em;}
.screen-toolbar .icon {width:12px;height:12px;color:#008fff;}
.screen-toolbar .code-dots i {background:#2279be;}
.screen-body {display:flex;height:calc(100% - 29px);}
.screen-sidebar {width:37px;flex-shrink:0;border-right:1px solid #163354;display:flex;flex-direction:column;align-items:center;gap:17px;padding-top:20px;background:#04101f;}
.screen-sidebar .icon {width:13px;height:13px;color:#228fee;}
.screen-sidebar i {width:11px;height:2px;background:#174874;}
.screen-main {flex:1;min-width:0;display:flex;align-items:center;flex-direction:column;justify-content:center;padding:10px 12px;background:radial-gradient(ellipse,#0055bd30,transparent 65%);}
.screen-kicker {font:5.4px var(--mono);color:#5e9ad1;letter-spacing:.08em;margin-bottom:14px;}
.screen-logo.logo-window {width:66%;border-radius:0;flex-shrink:0;border:0;box-shadow:none;background:transparent;}
.screen-main>strong {font-size:10px;letter-spacing:.06em;font-weight:500;margin-top:13px;}
.screen-module-row {display:flex;align-items:center;gap:9px;margin-top:15px;}
.screen-module-row span {display:flex;align-items:center;gap:5px;font-size:6px;color:#a6bfdf;border:1px solid #244971;border-radius:4px;padding:6px;}
.screen-module-row .icon {width:10px;height:10px;color:#2caaff;}
.screen-flow {display:flex;align-items:center;justify-content:center;width:75%;margin-top:12px;}
.screen-flow i {height:3px;width:3px;background:#46c8ff;border-radius:50%;box-shadow:0 0 6px #008cff;}
.screen-flow b {height:1px;flex:1;background:linear-gradient(90deg,#198cd8,#24378f);}
.studio-keyboard {height:25%;background:linear-gradient(165deg,#326ea8,#08132a 40%,#102555 74%,#245996);border:1px solid #4b8fcc;clip-path:polygon(0 0,100% 0,119% 88%,86% 100%,-24% 83%);transform:perspective(600px) rotateX(52deg);transform-origin:top;box-shadow:0 0 20px #1746ff;position:relative;}
.keyboard-grid {position:absolute;inset:10% 10% 37%;border:1px solid #0d2840;background:repeating-linear-gradient(0deg,transparent 0px 9px,#17375b 9px 10px),repeating-linear-gradient(90deg,#041329 0px 18px,#2a4e71 18px 20px);transform:skewX(12deg);}
.trackpad {position:absolute;left:39%;bottom:9%;height:20%;width:22%;border:1px solid #4277a9;border-radius:4px;}
.studio-phone {position:absolute;z-index:5;right:3%;top:47%;width:22%;height:42%;background:linear-gradient(155deg,#0a2245,#020917 65%);border:3px solid #224777;border-right-color:#0e2842;border-radius:18px;transform:rotate(10deg);box-shadow:3px 5px 0 #02050e,0 10px 22px #000a,0 0 15px #006dff3f;padding:28px 12px 12px;overflow:hidden;}
.mobile-kicker {font:4.5px var(--mono);color:#64b5ff;letter-spacing:.06em;display:block;margin-bottom:12px;}
.studio-phone>strong {display:block;font-size:clamp(10px,2.5cqi,17px);line-height:1.28;letter-spacing:-.035em;}
.studio-phone em {color:#ceeaff;font-style:normal;}
.studio-phone>svg {width:100%;height:70px;margin-top:7px;}
.mobile-concept {font:4.5px var(--mono);color:#6592c4;letter-spacing:.12em;}
.studio-chip {position:absolute;z-index:6;display:flex;align-items:center;gap:9px;padding:13px 14px;border:1px solid #1268b4;border-top-color:#159aff;border-radius:9px;background:linear-gradient(135deg,#05214edb,#061020ed);box-shadow:inset 0 0 14px #0a52ca22,0 0 16px #0057ff26;backdrop-filter:blur(12px);animation:bds-float 7s ease-in-out infinite;}
.studio-chip>.icon {width:23px;height:23px;color:#56bdff;filter:drop-shadow(0 0 5px #006bff);}
.studio-chip strong {font-size:10px;font-weight:600;display:block;line-height:1.5;}
.studio-chip small {display:block;font-size:7px;color:#adbee0;}
.chip-web {left:8%;top:10%;}
.chip-strategy {right:-1%;top:5%;animation-delay:-2s;}
.chip-custom {right:-1%;bottom:4%;animation-delay:-4s;}
.studio-code {position:absolute;left:0;top:29%;z-index:6;width:32%;padding:14px 14px 17px;background:linear-gradient(125deg,#07182fef,#031024e3);border:1px solid #1c619d;border-radius:9px;transform:rotate(-4deg);box-shadow:0 8px 25px #0004,0 0 12px #1468ff16;}
.studio-code>.icon {width:25px;height:25px;color:#47b7ff;margin-bottom:9px;}
.studio-code code {font:6.7px/2.1 var(--mono);color:#8caacf;white-space:nowrap;}
.studio-code code>span {color:#6498c5;}
.studio-code b {color:#54c0ff;font-weight:400;}
.studio-flow-card {position:absolute;left:0;bottom:9%;z-index:6;width:32%;padding:16px;border:1px solid #1d72bf;border-top-color:#3ea7f7;background:linear-gradient(135deg,#072354f2,#050d1bee);border-radius:9px;box-shadow:0 0 18px #064bff27;transform:rotate(-4deg);}
.studio-flow-card>span {font:6px var(--mono);color:#42a5f0;letter-spacing:.12em;}
.studio-flow-card strong {font-size:12px;display:block;line-height:1.45;margin:8px 0 13px;}
.studio-flow-card>div {display:flex;align-items:center;gap:7px;}
.studio-flow-card .icon {width:19px;height:19px;color:#4eaeff;}
.studio-flow-card i {height:1px;flex:1;background:#1561c1;}
.studio-visual figcaption {font:6px var(--mono);color:#6c91c1;right:15%;bottom:1%;letter-spacing:.07em;}
/* Main sections / all supplied service descriptions remain visible. */
.services-section {background:linear-gradient(180deg,#06101e,#030914);border-top:1px solid #1d4a7b6b;}
.section-heading {margin-bottom:30px;}
.section-heading--split {align-items:flex-start;gap:35px;}
.section-heading--split>div {flex:1;}
.section-heading--split>p {max-width:415px;font-size:13px;line-height:1.85;padding-top:28px;}
.service-card {min-height:310px;padding:23px 22px 12px;border-color:#2352808c;background:radial-gradient(at 0 0,#06316542,transparent 80%),#06101e;border-radius:10px;}
.service-top {margin-bottom:17px;}
.service-icon {width:40px;height:40px;border:0;background:#0064ff0d;color:#45b1ff;filter:drop-shadow(0 0 5px #0874ff75);}
.service-icon .icon {width:29px;height:29px;}
.service-number {color:#379ded;}
.service-card h3 {font-size:15px;min-height:22px;margin-bottom:10px;}
.service-lead {font-size:12px;line-height:1.65;color:#c5d6ec;margin-bottom:10px;}
.service-description {font-size:11px;line-height:1.8;color:#91a8c8;margin-bottom:13px;}
.service-bottom {border-color:#244c6f45;}
.service-bottom>span {color:#6991bd;}
.round-link {color:#73bfff;}
.services-footnote {color:#7696bd;}
.services-footnote a {color:#70bbff;}
.solutions-section {background:radial-gradient(ellipse at 80% 50%,#07377824,transparent 55%),#040b16;border-color:#1946755c;}
.solutions-grid {grid-template-columns:1.15fr .85fr;gap:56px;}
.solutions-copy h2 {font-size:clamp(30px,3vw,43px);}
.section-intro {margin-top:18px;font-size:13px;}
.solution-options {max-width:630px;gap:10px;margin-block:26px 16px;}
.solution-pill {min-height:49px;gap:10px;color:#c1d6f2;border:1px solid #265781;background:linear-gradient(135deg,#061b33aa,#030c1c);padding:12px 13px;}
.solution-pill .icon {color:#51b6ff;width:20px;height:20px;filter:drop-shadow(0 0 4px #008cff64);}
.solution-pill.is-active {background:#0066ff20;border-color:#139dfb;box-shadow:0 0 14px #006aff1f;color:white;}
.solution-stage {border-color:#1e6bad99;background:radial-gradient(at 70% 40%,#0944824f,transparent),#06101d;box-shadow:0 0 30px #003cff10;}
.solution-stage-top {color:#6cabe2;border-color:#22497655;}
.solution-description {background:#051123;border-color:#1a437e;font-size:12px;}
.solution-description p {color:#9fb7d6;}
.solution-icon {color:#4dbbff;border-color:#1d64a0;background:#05234b;}
.browser-preview {border-color:#196abd;box-shadow:0 15px 30px #0008,0 0 12px #007fff24;}
.browser-toolbar {background:#0a213f;}
.browser-page {background:radial-gradient(at 90% 70%,#072c5c,#071020 80%);}
.mock-text em,.mock-text>span,.phone-content em {color:#38b3ff;}
.mock-nav b,.mock-cta,.phone-cta {background:#007dff;}
.object-ring {border-color:#1689ff;box-shadow:inset 0 0 10px #8fccff,1px 2px 0 #153b66,4px 7px 14px #0007,0 0 20px #007dff33;}
.r2 {border-color:#55bdff;}.r3 {border-color:#514ef9;}
.phone-content {background:radial-gradient(at 100% 60%,#153e7277,#050e1b);}
.responsive-badge {border-color:#236cb7;color:#a7d5ff;background:#09203c;}
.process-section {background:#030914;border-bottom:1px solid #1a46765c;}
.process-grid {margin-top:36px;gap:30px;}
.process-track>span {color:#4bb2fb;}
.process-track>div {background:linear-gradient(90deg,#0063c4,#194168);}
.process-track>.icon {color:#4bb1ff;filter:drop-shadow(0 0 4px #0577ff);}
.process-step h3 {font-size:18px;}
.process-step p {font-size:13px;color:#a8bedb;}
.process-sub {color:#739bc4;}
.values-section {background:#040b15;padding-block:60px;border-bottom:1px solid #173958;}
.values-intro h2 {color:#c4d7f0;font-size:17px;letter-spacing:-.02em;}
.statement {font-size:clamp(30px,3.2vw,44px);line-height:1.25;max-width:1040px;letter-spacing:-.035em;margin-top:12px;}
.statement-star {display:none;}
.values-grid {margin-top:39px;gap:30px;}
.value-card {border-color:#1e4670;}
.value-card>.icon {color:#44acff;filter:drop-shadow(0 0 6px #056dff);}
.value-card h3 {font-size:16px;}
.value-card p {font-size:13px;color:#a5bad8;}
.technology-section {padding-block:44px;background:#040b15;}
.technology-heading h2 {font-size:25px;}
.technology-heading h2 span {color:#a6c7e5;}
.technology-heading p,.technology-note {color:#85a1c2;}
.technology-badge {background:linear-gradient(140deg,#071b32,#050b16);border-color:#215787;font-size:13px;color:#c5dcf4;}
.technology-badge--odoo {font-size:20px;}
.cta-section {background:#040b15;padding-block:25px 30px;}
.cta-panel {background:radial-gradient(ellipse at 70% 100%,#007dff4b,transparent 60%),linear-gradient(115deg,#07142c,#0a1554 55%,#080f26);border:1px solid #694dff;border-top-color:#2283ff;box-shadow:inset 0 0 25px #3463ff1f,0 0 20px #2547ff18;min-height:0;padding:46px 50px;border-radius:16px;}
.cta-content {display:grid;grid-template-columns:1.2fr 1fr;column-gap:60px;align-items:center;}
.cta-content .eyebrow {grid-column:1/-1;font-size:8px;margin-bottom:18px;color:#71baff;}
.cta-content h2 {font-size:clamp(30px,3.2vw,43px);grid-row:2/4;}
.cta-content h2 span {color:#86caff;}
.cta-content>p {margin-top:0;color:#bed7f5;font-size:13px;}
.cta-actions {margin-top:23px;gap:12px;}
.cta-decoration {opacity:.5;}
.contact-section {background:radial-gradient(ellipse at 0 100%,#07397433,transparent 45%),#030a14;padding-block:66px;}
.contact-grid {gap:65px;grid-template-columns:.9fr 1.1fr;}
.contact-copy h2 {font-size:clamp(34px,3.7vw,48px);}
.contact-copy>p {color:#a6bbd7;font-size:14px;margin-top:20px;}
.contact-email {margin-top:32px;gap:11px;}
.contact-email-icon {border-color:#235888;background:#072448;color:#45b5ff;}
.contact-email strong {color:#56b6ff;font-size:13px;}
.contact-email small {color:#8aabd0;}
.contact-note {border-color:#234b78;}
.contact-note p,.contact-note>.icon {color:#7aa9d7;}
.contact-form-wrap {background:linear-gradient(135deg,#071629d9,#06101d);border:1px solid #26476a;border-radius:11px;padding:27px;}
.form-title>span,.form-help {color:#87a1c3;}
.form-field label {color:#c7d8ef;}
.form-field input,.form-field select,.form-field textarea {background:#06101d;border-color:#254363;color:#e8f2ff;font-size:16px;}
.form-field input::placeholder,.form-field textarea::placeholder,select:invalid {color:#7993b3;}
.form-field input:focus,.form-field select:focus,.form-field textarea:focus {border-color:#0798ff;box-shadow:0 0 0 3px #007fff20;}
.form-field label>span:not(.optional) {color:#63b9ff;}
.optional {color:#86a1c3;}
.privacy-checkbox {color:#9db6d7;font-size:11px;}
.privacy-checkbox a {color:#65baff;}
.privacy-checkbox input {accent-color:#008cff;}
.form-reassurance {color:#89a7cc;}
.site-footer {background:#030a13;border-color:#1c4d7d;padding-top:43px;}
.footer-top {padding-bottom:30px;gap:30px;}
.footer-brand .logo-window {width:166px;}
.footer-brand>p {margin-top:15px;color:#9bb5d3;}
.footer-brand>span {color:#7297be;}
.footer-column h3 {color:#c3d9f4;font-size:11px;margin-bottom:16px;}
.footer-column>a,.social-unconfigured,.social-links>a {color:#8faed2;font-size:11px;}
.footer-column>a {min-height:30px;}
.footer-bottom {border-color:#224569;padding-block:15px;}
.footer-bottom>p,.footer-bottom a,.footer-bottom button {color:#809fc6;font-size:10px;}
.footer-contact>a {overflow-wrap:anywhere;}
@keyframes bds-float {0%,100% {translate:0 0;}50% {translate:0 -6px;}}
@keyframes bds-current {to {stroke-dashoffset:-1240;}}
@media (hover:hover) {
  .button--primary:hover,.button--light:hover,.button--small:hover {box-shadow:0 0 32px #176aff65,inset 0 0 9px #a5deff40;}
  .service-card:hover,.can-reveal .service-card.is-visible:hover {border-color:#178feb;box-shadow:0 0 26px #0062ff19;}
  .solution-pill:hover {color:white;border-color:#158dea;box-shadow:0 0 16px #006aff19;}
}
@media (max-width:1200px) {
  .container {width:calc(100% - 72px);}
  .hero-grid {grid-template-columns:1fr 1.05fr;min-height:595px;}
  h1 {font-size:4.25vw;}
  .studio-visual {height:500px;}
  .studio-code code {font-size:5.8px;}
  .studio-flow-card {padding:12px;}
  .studio-flow-card strong {font-size:11px;}
  .studio-chip {padding:10px;gap:7px;}
  .studio-chip strong {font-size:8px;}.studio-chip small {font-size:6px;}
  .studio-chip>.icon {width:20px;height:20px;}
  .screen-main>strong {font-size:9px;}
  .screen-kicker {font-size:4.8px;}
  .hero-actions {gap:10px;}
  .hero-actions .button {font-size:11px;padding:14px 13px;gap:8px;}
  .hero-note {font-size:9px;}
  .contact-grid {gap:40px;}
  .services-grid {gap:12px;}
  .service-card {padding:20px 17px 10px;}
  .service-card h3 {font-size:14px;}
  .service-description {font-size:11px;}
  .solutions-grid {gap:40px;grid-template-columns:1fr 1fr;}
  .footer-top {gap:22px;grid-template-columns:1.15fr 1fr .8fr .9fr 1.25fr;}
  .footer-brand .logo-window {width:140px;}
  .footer-column>a,.social-unconfigured {font-size:10px;}
}
@media (max-width:1000px) and (min-width:761px) {
  .desktop-nav {gap:17px;}.desktop-nav a {font-size:12px;}
  .hero-grid {grid-template-columns:1fr;padding-block:43px 22px;}
  .hero-copy {max-width:780px;}
  h1 {font-size:clamp(49px,6.6vw,66px);}
  .hero-description {max-width:590px;}
  .studio-visual {max-width:660px;margin:0 auto;height:540px;}
  .hero-actions .button {font-size:13px;padding-inline:22px;}
  .hero-note {font-size:11px;}
  .services-grid {grid-template-columns:repeat(2,1fr);gap:18px;}
  .service-card {padding:25px;min-height:280px;}
  .service-card h3 {font-size:17px;}.service-lead {font-size:14px;}.service-description {font-size:13px;}
  .section-heading--split {display:block;}.section-heading--split>p {padding-top:15px;max-width:650px;}
  .solutions-grid {gap:32px;}.solutions-copy h2 {font-size:33px;}
  .solution-pill {font-size:10px;gap:8px;}
  .solution-stage-top {font-size:6px;}
  .process-grid {grid-template-columns:repeat(2,1fr);gap:32px;}
  .values-grid {grid-template-columns:repeat(2,1fr);}
  .cta-panel {padding:36px;}.cta-content {column-gap:28px;}
  .cta-actions .button {font-size:11px;padding-inline:12px;gap:9px;}
  .contact-grid {grid-template-columns:1fr;gap:32px;}
  .contact-copy>p {max-width:580px;}.contact-copy h2 br {display:none;}
  .contact-form-wrap {max-width:740px;}
  .footer-top {grid-template-columns:repeat(4,1fr);}
  .footer-brand {grid-column:1/-1;}.footer-brand .logo-window {width:155px;}
}
@media (max-width:760px) {
  :root {--header-height:88px;}
  .container {width:calc(100% - 40px);}
  .section-space {padding-block:48px;}
  .header-inner {gap:12px;}.brand .logo-window {width:120px;}
  .header-actions .button {min-height:42px;font-size:11px;padding-inline:12px;gap:8px;}
  .desktop-nav {display:none;}.menu-toggle {display:block;border-color:#245487;}
  .mobile-menu {background:#04101f;}
  .hero-grid {grid-template-columns:1fr;gap:12px;min-height:0;padding-block:37px 15px;}
  .hero-copy .eyebrow {font-size:8px;letter-spacing:.12em;margin-bottom:21px;}
  h1 {font-size:clamp(34px,7.85vw,56px);line-height:1.12;letter-spacing:-.047em;}
  .hero-description {font-size:14px;line-height:1.8;margin-top:21px;max-width:600px;}
  .hero-actions {margin-top:24px;gap:10px;}
  .hero-actions .button {font-size:12px;min-height:48px;padding-inline:14px;gap:9px;}
  .hero-note {font-size:10px;line-height:1.7;max-width:370px;}
  .hero-end {min-height:60px;font-size:7px;gap:15px;}
  .hero-end>span {max-width:230px;}
  .hero-end a {font-size:7px;gap:5px;}
  .studio-visual {height:auto;aspect-ratio:1.13;max-width:620px;width:100%;margin:5px auto;}
  .studio-laptop {left:23%;top:19%;height:65%;}
  .screen-toolbar {height:22px;padding-inline:6px;font-size:4px;}
  .screen-toolbar .code-dots {gap:2px;}.screen-toolbar .code-dots i {width:2px;height:2px;}
  .screen-toolbar .icon {width:8px;height:8px;}
  .screen-body {height:calc(100% - 22px);}
  .screen-sidebar {width:26px;gap:10px;padding-top:10px;}.screen-sidebar .icon {width:10px;height:10px;}
  .screen-main {padding:6px;}.screen-kicker {font-size:3.3px;margin-bottom:7px;}
  .screen-main>strong {font-size:6px;margin-top:7px;}
  .screen-logo.logo-window {width:71%;border-radius:3px;}
  .screen-module-row {gap:5px;margin-top:7px;}.screen-module-row span {font-size:4px;padding:3px;gap:3px;}.screen-module-row .icon {width:7px;height:7px;}
  .screen-flow {margin-top:6px;}
  .studio-chip {padding:8px;gap:5px;border-radius:6px;}
  .studio-chip>.icon {width:16px;height:16px;}.studio-chip strong {font-size:7px;}.studio-chip small {font-size:5px;}
  .chip-web {left:6%;top:8%;}.chip-strategy {right:0;top:3%;}.chip-custom {right:0;bottom:4%;}
  .studio-code {width:34%;padding:8px;left:0;top:27%;border-radius:6px;}
  .studio-code>.icon {width:18px;height:18px;margin-bottom:6px;}.studio-code code {font-size:4.5px;line-height:1.9;}
  .studio-phone {padding:19px 8px 7px;border-width:2px;border-radius:12px;top:47%;height:42%;}
  .studio-phone .phone-notch {width:25px;height:5px;}
  .mobile-kicker {font-size:3.5px;margin-bottom:8px;}.studio-phone>strong {font-size:2.6cqi;}
  .studio-phone>svg {height:40px;margin-top:7px;}.mobile-concept {font-size:3px;}
  .studio-flow-card {padding:10px;width:32%;left:0;bottom:8%;border-radius:7px;}
  .studio-flow-card>span {font-size:4px;}.studio-flow-card strong {font-size:8px;margin-block:5px 8px;}
  .studio-flow-card .icon {width:12px;height:12px;}.studio-flow-card>div {gap:4px;}
  .studio-visual figcaption {font-size:4px;right:12%;bottom:0;display:block;}
  .section-heading--split {display:block;}.section-heading--split>p {padding-top:17px;max-width:none;}
  h2,.section-heading h2,.solutions-copy h2 {font-size:32px;line-height:1.2;}
  .services-grid {grid-template-columns:repeat(2,1fr);gap:12px;}
  .service-card {min-height:0;padding:20px 16px 8px;}
  .service-card h3 {font-size:15px;}.service-lead {font-size:12px;}.service-description {font-size:11px;line-height:1.75;}
  .service-top {margin-bottom:17px;}.service-bottom>span {font-size:6px;}
  .services-footnote {font-size:10px;margin-top:25px;}
  .solutions-grid {grid-template-columns:1fr;gap:30px;}
  .solution-pill {font-size:12px;min-height:49px;}
  .solution-options {margin-block:23px 9px;}
  .solution-stage {max-width:580px;}
  .process-grid {grid-template-columns:repeat(2,1fr);gap:30px 24px;}
  .process-step h3 {font-size:17px;}.process-step p {font-size:12px;min-height:0;}.process-sub {font-size:9px;}
  .values-intro h2 {font-size:15px;max-width:none;}.statement {font-size:30px;}
  .values-grid {grid-template-columns:repeat(2,1fr);gap:27px;margin-top:32px;}
  .value-card h3 {font-size:17px;}.value-card p {font-size:13px;}
  .technology-section {padding-block:40px;}
  .technology-heading {align-items:flex-start;gap:17px;flex-direction:column;}
  .technology-heading h2 {font-size:26px;}.technology-heading p {font-size:12px;}
  .technology-badges {gap:8px;}.technology-badge {padding:12px 17px;font-size:12px;flex:1 0 auto;}.technology-badge--odoo {font-size:18px;}
  .technology-note {font-size:10px;line-height:1.7;}
  .cta-section {padding-block:10px 20px;}.cta-panel {padding:33px 25px;}
  .cta-content {display:block;}.cta-content h2 {font-size:34px;}.cta-content>p {margin-top:18px;font-size:13px;}
  .cta-actions .button {font-size:12px;padding-inline:14px;gap:10px;}
  .contact-section {padding-block:48px;}.contact-grid {grid-template-columns:1fr;gap:30px;}
  .contact-copy h2 {font-size:38px;}.contact-copy>p {max-width:570px;}
  .contact-email strong {font-size:13px;}.contact-note {margin-top:26px;padding-top:23px;}
  .contact-form-wrap {padding:26px 22px;}.form-title>span {font-size:6px;}
  .form-grid {grid-template-columns:1fr 1fr;gap:20px 16px;}
  .form-field input,.form-field select,.form-field textarea {font-size:16px;}
  .form-field label {font-size:12px;}.privacy-checkbox {font-size:11px;}
  .footer-top {grid-template-columns:1fr 1fr;gap:28px 22px;}
  .footer-brand {grid-column:1/-1;}.footer-brand .brand .logo-window {width:160px;}
  .footer-column h3 {font-size:12px;}.footer-column>a,.social-unconfigured {font-size:12px;min-height:34px;}
  .footer-bottom {flex-direction:column;align-items:flex-start;gap:5px;}
  .footer-bottom>div {flex-wrap:wrap;gap:18px;}
  .footer-bottom>p,.footer-bottom a,.footer-bottom button {font-size:10px;}
  .no-js .desktop-nav {display:flex;}
}
@media (max-width:480px) {
  .container {width:calc(100% - 34px);}
  :root {--header-height:83px;}
  .header-inner {gap:9px;}.brand .logo-window {width:107px;}
  .header-actions {gap:8px;}.header-actions .button {font-size:10px;padding:10px;gap:6px;min-height:40px;}
  .header-actions .button .icon {width:12px;height:12px;}.menu-toggle {width:40px;height:40px;}
  .menu-toggle span {left:10px;}.menu-toggle span:first-child {top:14px;}.menu-toggle span:last-child {top:22px;}
  .menu-toggle[aria-expanded="true"] span {top:18px;}
  .hero-grid {padding-top:32px;}.hero-copy .eyebrow {font-size:7px;letter-spacing:.12em;}
  h1 {font-size:clamp(29px,7.9vw,38px);line-height:1.12;}
  .hero-description {font-size:13px;line-height:1.9;}
  .hero-actions .button {font-size:10px;padding-inline:11px;gap:6px;min-height:45px;}.hero-actions .icon {width:13px;height:13px;}
  .hero-note {font-size:9px;gap:7px;}
  .hero-end>span {max-width:155px;font-size:6px;}
  .hero-end a {font-size:6px;}
  .services-grid {grid-template-columns:1fr;gap:14px;}
  .service-card {padding:23px 23px 11px;}.service-card h3 {font-size:18px;}.service-lead {font-size:14px;}.service-description {font-size:13px;line-height:1.8;}.service-bottom>span {font-size:8px;}
  .service-top {margin-bottom:18px;}.service-icon {width:38px;height:38px;}
  h2,.section-heading h2,.solutions-copy h2 {font-size:31px;}
  .solution-pill {font-size:11px;padding-inline:11px;gap:8px;}
  .process-grid {gap:28px 21px;}.process-step h3 {font-size:15px;}.process-step p {font-size:12px;}.process-sub {font-size:8px;}
  .statement {font-size:27px;}.values-intro h2 {font-size:14px;line-height:1.7;}
  .values-grid {gap:25px 22px;}.value-card h3 {font-size:15px;}.value-card p {font-size:12px;}
  .cta-content h2 {font-size:29px;}.cta-panel {padding:28px 22px;}.cta-actions .button {font-size:11px;gap:7px;padding-inline:11px;}
  .contact-copy h2 {font-size:35px;}.contact-form-wrap {padding:24px 19px;}
  .form-grid {grid-template-columns:1fr;gap:18px;}.form-title>span {display:none;}
  .footer-contact>a {font-size:11px;}
}
@media (max-width:350px) {
  .header-actions .button {display:none;}.hero-actions {flex-direction:column;align-items:stretch;}
  .hero-actions .button {font-size:12px;}.hero-note {font-size:8px;}
  .cta-actions {flex-direction:column;align-items:stretch;}
  .studio-code code {font-size:3.8px;}.studio-chip {padding:6px;}.studio-chip small {font-size:4px;}
  .screen-module-row {gap:3px;}.screen-module-row span {font-size:3px;padding:2px;}
  .studio-flow-card {padding:8px;}.studio-flow-card strong {font-size:7px;}
}
@media (prefers-reduced-motion:reduce) {
  .studio-chip,.light-path {animation:none;}
}
html[data-motion="off"] .studio-chip,html[data-motion="off"] .light-path {animation:none;}
@media (forced-colors:active) {.gradient-text {background:none;-webkit-text-fill-color:CanvasText;}.studio-visual {display:none;}}
@media print {
  .studio-visual {display:none!important;}body {background:white;color:black;}.button {box-shadow:none;}
  .hero-grid {grid-template-columns:1fr;}.contact-grid {grid-template-columns:1fr;}.cta-content {display:block;}
}

/* v1.2 — company details and completed privacy page. */
.footer-legal {display:flex;flex-wrap:wrap;align-items:baseline;gap:8px 24px;padding:22px 0;border-top:1px solid var(--line);color:#afbdd2;font-size:12px;line-height:1.8;}
.footer-legal strong {font-size:12px;color:#d5e4f7;font-weight:600;}
.footer-legal address {font-style:normal;}
.privacy-main {max-width:920px;}
.privacy-main .legal-controller {margin-top:28px;padding:24px;border:1px solid #2679c345;border-radius:12px;background:#08182b;font-size:15px;line-height:1.85;font-style:normal;}
.legal-controller strong {color:#e5f1ff;display:block;}
.privacy-main p,.privacy-main li {color:#b5c3d9;line-height:1.9;}
.privacy-main h2 {color:#eff6ff;font-size:25px;line-height:1.4;}
.privacy-main ul {padding-left:22px;margin-top:16px;}
.privacy-main li {font-size:15px;padding:4px 0;}
.privacy-main a {color:#72c6ff;overflow-wrap:anywhere;}
.privacy-meta {font-family:var(--mono);font-size:11px!important;color:#85aacd!important;}
.privacy-cookies {margin-top:22px;padding:22px;border:1px solid var(--line);border-radius:10px;}
.privacy-cookies p:first-child {margin-top:0;}
.privacy-footer {padding:25px 0 40px;border-top:1px solid var(--line);font-size:12px;color:#b5c3d9;line-height:1.9;}
.privacy-main code {color:#baddff;}
.preview-dialog {max-width:760px;max-height:85vh;overflow-y:auto;}
.preview-dialog .preview-privacy-content h2 {font-size:21px;line-height:1.4;margin-top:26px;}
.preview-dialog .preview-privacy-content p {font-size:14px;line-height:1.8;}
.preview-dialog .preview-privacy-content .legal-controller {font-style:normal;font-size:14px;line-height:1.9;}
.preview-dialog .preview-privacy-content a {text-decoration:underline;color:#8cd5ff;}
@media (max-width:768px) {.footer-legal {flex-direction:column;gap:4px;font-size:11px;}.privacy-main h2 {font-size:22px;}.privacy-header .brand .logo-window {width:110px;}.privacy-main .legal-controller {padding:18px;font-size:14px;}}

/* v1.3 — logo ufficiale con bordo bianco: proporzioni 1774×887, trasparenza conservata. */