:root { font-family: Inter, Arial, Helvetica, sans-serif; font-synthesis: none; font-weight: 400; --ink: #102a24; --muted: #5e706a; --paper: #f4f7f6; --accent: #0c6b4f; --line: #d9e1dd; --mint: #a8e3cd; --dark: #070f10; --radius: 16px; color: var(--ink); background: var(--paper); scroll-behavior: smooth; scroll-padding-top: 110px; }
* { box-sizing: border-box; }
body { margin: 0px; }
button, input, select { font: inherit; }
button, a, input, select { -webkit-tap-highlight-color: transparent; }
button, a { touch-action: manipulation; }
a { color: inherit; text-decoration: none; }
button { cursor: pointer; }
button:disabled { cursor: wait; }
button { color: inherit; }
button:focus-visible, a:focus-visible, summary:focus-visible { outline: rgb(229, 184, 84) solid 3px; outline-offset: 5px; }
input:focus-visible, select:focus-visible { outline: 2px solid var(--accent); outline-offset: 3px; }
svg { width: 24px; height: 24px; flex-shrink: 0; }
img { max-width: 100%; height: auto; }
p { line-height: 1.65; margin: 0px 0px 24px; }
h1, h2, h3 { margin: 0px; letter-spacing: -0.055em; font-weight: 500; }
h1 { font-size: clamp(52px, 5.7vw, 88px); line-height: 1.03; }
h2 { font-size: clamp(36px, 4vw, 60px); line-height: 1.08; }
h3 { font-size: 30px; line-height: 1.2; }
em { font-style: normal; }
button { border: 0px; }
small { font-size: 12px; line-height: 1.5; }
[hidden] { display: none !important; }
.container { width: min(1280px, 100% - 112px); margin-inline: auto; }
.section-pad { padding: 112px 0px; }
.eyebrow { display: block; font-size: 11px; font-weight: 600; letter-spacing: 0.14em; line-height: 1.6; margin-bottom: 28px; }
.muted { color: var(--muted); }
.button { display: inline-flex; align-items: center; justify-content: center; gap: 26px; min-height: 56px; padding: 17px 24px; border-radius: 8px; background: var(--accent); color: white; font-weight: 500; font-size: 14px; line-height: 1.4; border: 1px solid transparent; transition: background 0.2s, transform 0.2s, box-shadow 0.2s; }
.button > span { font-size: 21px; line-height: 1; }
.button:hover { background: rgb(8, 83, 62); transform: translateY(-2px); box-shadow: rgba(16, 42, 36, 0.063) 0px 6px 18px; }
.button:active { transform: translateY(0px); }
.button-small { min-height: 44px; font-size: 12px; padding: 12px 17px; gap: 20px; }
.button-outline { color: var(--ink); background: transparent; border-color: var(--line); }
.button-outline:hover { background: rgb(231, 239, 235); }
.full-width { width: 100%; }
.text-link { display: inline-flex; align-items: center; gap: 16px; background: none; padding: 8px 0px; min-height: 44px; font-size: 14px; font-weight: 500; text-align: left; border-bottom: 1px solid; }
.text-link > span { font-size: 20px; }
.text-link:hover { opacity: 0.75; }
.button-row { display: flex; gap: 24px; align-items: center; flex-wrap: wrap; }
.skip-link { position: fixed; top: 0px; left: 20px; background: white; padding: 20px; transform: translateY(-110%); z-index: 100; }
.skip-link:focus { transform: translateY(0px); }
.demo-bar { height: 32px; padding: 0px 30px; background: rgb(17, 27, 24); color: rgb(185, 200, 194); font-size: 10px; letter-spacing: 0.04em; display: flex; align-items: center; justify-content: space-between; }
.demo-bar a { display: flex; align-items: center; gap: 7px; height: 32px; }
.demo-bar a:hover { color: white; }
.demo-bar a span { font-size: 15px; }
.site-header { position: sticky; top: 0px; z-index: 20; background: rgba(11, 24, 22, 0.93); backdrop-filter: blur(16px); border-bottom: 1px solid rgba(255, 255, 255, 0.07); color: rgb(244, 247, 246); }
.nav-inner { display: flex; align-items: center; justify-content: space-between; gap: 30px; height: 88px; }
.wordmark { font-weight: 650; font-size: 27px; letter-spacing: -1.5px; display: inline-block; position: relative; white-space: nowrap; }
.wordmark > span { font-weight: 400; color: rgb(168, 227, 205); }
.wordmark i { display: block; width: 53px; height: 12px; border-top: 1px solid; position: absolute; top: -5px; left: 48px; border-radius: 50%; transform: rotate(-5deg); opacity: 0.65; }
.desktop-nav { display: flex; gap: 29px; font-size: 12px; color: rgb(193, 205, 199); }
.desktop-nav a { padding: 14px 0px; }
.desktop-nav a:hover { color: white; }
.nav-actions { display: flex; align-items: center; gap: 18px; }
.nav-telegram { display: grid; place-items: center; width: 44px; height: 44px; }
.menu-toggle { display: none; width: 44px; height: 44px; background: none; padding: 10px; }
.menu-toggle span { height: 1px; width: 24px; background: currentcolor; display: block; margin: 6px 0px; transition: transform 0.2s; }
.menu-toggle[aria-expanded="true"] span:first-child { transform: translateY(3.5px) rotate(45deg); }
.menu-toggle[aria-expanded="true"] span:last-child { transform: translateY(-3.5px) rotate(-45deg); }
.mobile-menu { background: var(--dark); padding: 22px 30px; display: flex; flex-direction: column; }
.mobile-menu a { padding: 14px; border-bottom: 1px solid rgba(255, 255, 255, 0.125); }
.hero { position: relative; overflow: hidden; }
.green-hero { background: var(--dark); color: rgb(244, 247, 246); padding: 82px 0px 0px; }
.hero-grid { display: grid; grid-template-columns: 1.1fr 1fr; min-height: 600px; align-items: center; }
.green-hero h1 { position: relative; z-index: 2; }
.green-hero em { color: var(--mint); }
.green-hero .eyebrow { font-size: 10px; color: rgb(169, 196, 185); display: flex; align-items: center; gap: 10px; margin-bottom: 34px; }
.live-dot { height: 5px; width: 5px; background: rgb(168, 227, 205); display: inline-block; border-radius: 50%; box-shadow: rgba(168, 227, 205, 0.082) 0px 0px 0px 4px; }
.hero-description { font-size: 16px; color: rgb(185, 200, 194); margin: 30px 0px 34px; line-height: 1.7; max-width: 430px; }
.green-hero .button { background: var(--mint); color: rgb(9, 42, 29); }
.green-hero .button:hover { background: rgb(193, 239, 221); }
.green-hero .text-link { font-size: 12px; border: 0px; color: rgb(212, 228, 220); }
.hero-proof { display: flex; gap: 26px; flex-wrap: wrap; margin-top: 36px; color: rgb(185, 200, 194); font-size: 11px; }
.hero-proof > span { display: flex; align-items: center; gap: 8px; }
.hero-proof svg { width: 18px; height: 18px; stroke: rgb(148, 191, 173); }
.green-art { position: relative; height: 560px; width: calc(100% + 50px); margin-left: -10px; isolation: isolate; }
.green-art::before { content: ""; position: absolute; inset: 0px -50px; background: radial-gradient(at 50% 52%, rgba(30, 101, 65, 0.28), transparent 65%); z-index: -1; }
.art-orbit { position: absolute; left: 50%; top: 46%; border: 1px solid rgba(136, 189, 158, 0.075); transform: translate(-50%, -50%) rotate(-18deg); border-radius: 50%; width: 490px; height: 490px; }
.orbit-two { width: 650px; height: 325px; transform: translate(-50%, -50%) rotate(-28deg); }
.car-art { position: absolute; top: 60px; left: -95px; max-width: none; width: calc(100% + 170px); filter: drop-shadow(rgba(0, 0, 0, 0.533) 0px 24px 40px); animation: 1.2s ease 0s 1 normal both running car-entry; }
.art-caption { display: flex; justify-content: space-between; font-size: 8px; letter-spacing: 0.12em; color: rgb(104, 143, 127); position: absolute; top: 38px; left: 15px; right: 15px; }
.hero-payment { position: absolute; bottom: 70px; right: 14px; display: flex; align-items: center; gap: 15px; border: 1px solid rgba(182, 212, 197, 0.17); border-radius: 12px; background: rgba(23, 49, 38, 0.533); backdrop-filter: blur(14px); padding: 20px 24px; box-shadow: rgba(0, 0, 0, 0.267) 0px 24px 60px; animation: 1s ease 0.2s 1 normal both running rise-in; }
.currency-mark { border: 1px solid rgba(168, 227, 205, 0.25); width: 43px; height: 43px; display: grid; place-items: center; border-radius: 50%; font-size: 23px; color: rgb(168, 227, 205); }
.hero-payment small { display: block; color: rgb(161, 184, 172); font-size: 10px; margin-bottom: 4px; }
.hero-payment strong { font-size: 13px; font-weight: 500; }
.payment-arrow { font-size: 25px; color: rgb(168, 227, 205); margin-left: 12px; }
.art-coordinates { position: absolute; bottom: 10px; left: 30px; font-size: 8px; letter-spacing: 0.16em; line-height: 2.2; color: rgb(97, 130, 117); }
.hero-bottom { border-top: 1px solid rgba(255, 255, 255, 0.09); padding: 25px 0px 30px; display: flex; justify-content: space-between; align-items: center; color: rgb(146, 168, 158); font-size: 10px; line-height: 1.6; margin-top: 18px; }
.scroll-cue { display: flex; gap: 45px; align-items: center; }
.scroll-cue span { font-size: 25px; color: rgb(213, 232, 223); }
.numbers { background: rgb(255, 255, 255); }
.numbers-layout { display: grid; grid-template-columns: 1.5fr 1fr 0.8fr; gap: 60px; align-items: center; }
.numbers h2 { font-size: 27px; line-height: 1.25; letter-spacing: -0.035em; }
.numbers .eyebrow { font-size: 9px; margin-bottom: 20px; }
.numbers .muted { font-size: 11px; margin-top: 18px; margin-bottom: 0px; }
.number-item { border-left: 1px solid var(--line); padding-left: 44px; }
.number-item strong { display: block; font-size: 100px; letter-spacing: -0.075em; line-height: 1; font-weight: 500; color: rgb(18, 63, 52); }
.number-item strong > span { font-size: 24px; vertical-align: top; display: inline-block; margin: 9px 0px 0px 8px; color: rgb(122, 153, 139); }
.number-item p { font-size: 13px; margin: 18px 0px 0px; color: var(--muted); }
.calc-layout { display: grid; grid-template-columns: 1fr 1fr; gap: 100px; align-items: center; }
.section-intro h2 { margin-bottom: 28px; }
.section-intro h2 em { color: var(--accent); }
.section-intro > p { max-width: 390px; color: var(--muted); font-size: 15px; }
.calc-note { display: flex; gap: 15px; align-items: center; margin-top: 52px; font-size: 12px; line-height: 1.6; color: rgb(82, 108, 95); }
.calc-note svg { width: 26px; height: 26px; }
.calculator-panel { background: rgb(255, 255, 255); border: 1px solid var(--line); padding: 36px; border-radius: 16px; box-shadow: rgba(21, 62, 40, 0.063) 0px 20px 70px; }
.panel-heading { display: flex; justify-content: space-between; align-items: center; font-size: 15px; margin-bottom: 28px; }
.panel-index { font-size: 10px; color: rgb(117, 136, 127); letter-spacing: 0.1em; }
.field-pair { display: grid; grid-template-columns: 1.4fr 1fr; gap: 18px; }
label { font-size: 12px; display: block; font-weight: 500; }
select, input:not([type="checkbox"]):not([type="radio"]) { width: 100%; min-width: 0px; min-height: 52px; border: 1px solid rgb(215, 224, 219); background: rgb(251, 252, 251); color: var(--ink); border-radius: 7px; padding: 14px; margin: 10px 0px 22px; line-height: 1.3; font-size: 15px; }
select { appearance: none; padding-right: 35px; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='none' stroke='%23576c60'%3E%3Cpath d='m5 8 5 5 5-5'/%3E%3C/svg%3E"); background-size: 20px auto; background-repeat: no-repeat; background-position: right 12px center; }
input::placeholder { color: rgb(129, 144, 135); }
.amount-wrap { position: relative; }
.amount-wrap input { letter-spacing: -0.03em; font-size: 26px !important; padding-right: 65px !important; min-height: 76px !important; margin-bottom: 0px !important; }
.amount-wrap > span { position: absolute; right: 18px; top: 37px; font-size: 12px; color: rgb(107, 127, 116); }
.field-error { min-height: 18px; color: rgb(172, 63, 51); font-size: 12px; margin: 6px 0px 16px; }
.rate-note { display: flex; align-items: flex-start; gap: 10px; color: rgb(98, 116, 107); font-size: 11px; margin-top: 20px; padding: 16px 0px; border-top: 1px solid rgb(229, 235, 231); line-height: 1.6; }
.rate-note svg { width: 17px; height: 17px; }
.rate-note small { font-size: 10px; }
.calculator-disclaimer { font-size: 10px; color: rgb(114, 132, 121); display: block; line-height: 1.7; }
.calc-result { padding: 18px; background: rgb(237, 246, 240); margin: 16px 0px; border-left: 2px solid var(--accent); border-radius: 0px 8px 8px 0px; }
.calc-result strong { font-size: 14px; }
.calc-result p { font-size: 13px; margin: 8px 0px; }
.calc-result .reference-result { font-size: 11px; }
.calc-result .text-link { font-size: 12px; }
.section-heading { display: flex; justify-content: space-between; gap: 50px; align-items: flex-end; margin-bottom: 60px; }
.section-heading > p { font-size: 14px; color: var(--muted); margin: 0px 0px 3px; max-width: 340px; }
.documents-section { background: rgb(233, 239, 235); }
.documents-section h2 em { color: var(--accent); }
.document-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 18px; }
.document-card { background: rgb(248, 250, 248); border: 1px solid rgb(212, 223, 215); padding: 22px; border-radius: 10px; text-align: left; transition: transform 0.25s, box-shadow 0.25s; display: flex; flex-direction: column; }
.document-card:hover { transform: translateY(-8px); box-shadow: rgba(19, 58, 37, 0.125) 0px 16px 40px; }
.document-top { display: flex; justify-content: space-between; align-items: center; font-size: 10px; color: rgb(101, 129, 113); width: 100%; }
.document-sheet { display: block; border: 1px solid rgb(207, 220, 211); background: rgb(255, 255, 255); width: 124px; height: 156px; margin: 28px auto 32px; padding: 23px 15px; transform: rotate(-6deg); box-shadow: rgba(39, 78, 44, 0.03) 5px 10px 20px; transition: transform 0.3s; }
.document-card:nth-child(2n) .document-sheet { transform: rotate(5deg); }
.document-card:hover .document-sheet { transform: rotate(0deg) translateY(-3px); }
.document-sheet i { display: block; height: 2px; background: rgb(221, 229, 223); margin-bottom: 6px; width: 100%; }
.document-sheet i:nth-child(2) { width: 65%; }
.document-sheet i:nth-child(3) { width: 80%; }
.document-sheet b { font-size: 16px; letter-spacing: 0.02em; color: rgb(55, 99, 74); display: block; margin: 13px 0px; }
.document-card > strong { font-size: 20px; font-weight: 500; letter-spacing: -0.025em; }
.document-description { font-size: 12px; line-height: 1.5; color: rgb(103, 125, 110); margin: 10px 0px 20px; min-height: 36px; }
.document-card > small { align-self: flex-start; font-size: 9px; letter-spacing: 0.05em; border: 1px solid rgb(216, 228, 219); border-radius: 4px; padding: 5px 8px; margin-top: auto; }
.documents-bottom { display: flex; align-items: center; justify-content: space-between; gap: 24px; margin-top: 32px; }
.documents-bottom p { font-size: 12px; display: flex; align-items: center; gap: 12px; margin: 0px; }
.documents-bottom .text-link { font-size: 12px; }
.process-section { background: var(--dark); color: rgb(232, 241, 236); }
.process-section .eyebrow { color: rgb(145, 177, 160); }
.process-section em { color: var(--mint); }
.process-section .section-heading > p { color: rgb(159, 180, 168); }
.process-layout { display: grid; grid-template-columns: 1fr 1fr; gap: 100px; align-items: start; }
.step-button { width: 100%; background: transparent; color: rgb(132, 157, 142); padding: 25px 0px; display: flex; gap: 25px; align-items: center; text-align: left; border-top: 1px solid rgba(189, 213, 194, 0.133); transition: color 0.2s; }
.step-button:last-child { border-bottom: 1px solid rgba(189, 213, 194, 0.133); }
.step-button.active { color: rgb(223, 240, 230); }
.step-number { font-size: 10px; letter-spacing: 0.08em; align-self: flex-start; margin-top: 6px; }
.step-label { flex: 1 1 0%; }
.step-label strong { display: block; font-size: 22px; letter-spacing: -0.025em; font-weight: 400; }
.step-label small { display: block; font-size: 10px; margin-top: 10px; color: rgb(123, 153, 137); }
.step-label small i { font-style: normal; padding: 0px 7px; }
.step-arrow { font-size: 25px; opacity: 0; transition: opacity 0.2s, transform 0.2s; transform: translate(-5px, 5px); }
.step-button.active .step-arrow { opacity: 1; transform: none; color: rgb(168, 227, 205); }
.step-button.active .step-number { color: rgb(168, 227, 205); }
.step-panel { padding: 0px 8px; }
.chat-window { background: rgb(19, 38, 30); border: 1px solid rgba(255, 255, 255, 0.098); border-radius: 16px; padding: 24px; box-shadow: rgba(0, 0, 0, 0.2) 0px 30px 70px; max-width: 480px; margin: 0px auto; }
.chat-head { display: flex; align-items: center; gap: 12px; padding-bottom: 20px; border-bottom: 1px solid rgba(255, 255, 255, 0.07); }
.chat-avatar { height: 42px; width: 42px; border-radius: 50%; border: 1px solid rgb(65, 99, 79); background: rgb(32, 62, 44); display: grid; place-items: center; font-size: 12px; letter-spacing: -1px; }
.chat-head strong { font-size: 12px; font-weight: 500; display: block; }
.chat-head small { display: block; font-size: 9px; color: rgb(146, 176, 156); margin-top: 5px; }
.chat-dots { margin-left: auto; font-size: 10px; letter-spacing: 2px; }
.chat-date { text-align: center; color: rgb(110, 147, 127); font-size: 9px; margin: 22px 0px; }
.chat-bubble { background: rgb(33, 60, 44); border: 1px solid rgba(145, 191, 156, 0.098); padding: 21px; border-radius: 12px 12px 12px 0px; margin-right: 25px; }
.chat-bubble > small { color: rgb(158, 201, 174); font-size: 9px; }
.chat-bubble h3 { font-size: 18px; letter-spacing: -0.02em; margin: 11px 0px; }
.chat-bubble p { font-size: 12px; line-height: 1.6; color: rgb(180, 202, 187); min-height: 58px; margin: 0px; }
.chat-time { display: flex; justify-content: flex-end; align-items: center; gap: 6px; font-size: 8px; color: rgb(125, 155, 135); margin-top: 14px; }
.chat-time svg { width: 12px; height: 12px; }
.chat-document { display: flex; align-items: center; gap: 12px; margin: 18px 25px 28px 0px; font-size: 11px; padding: 15px; border: 1px solid rgba(255, 255, 255, 0.08); border-radius: 9px; }
.chat-document > svg { color: rgb(168, 227, 205); }
.chat-document div { flex: 1 1 0%; }
.chat-document strong { font-weight: 500; font-size: 11px; }
.chat-document div span { display: block; font-size: 8px; color: rgb(134, 165, 144); margin-top: 5px; }
.chat-composer { display: flex; justify-content: space-between; align-items: center; background: rgb(13, 27, 21); border: 1px solid rgba(255, 255, 255, 0.043); border-radius: 8px; padding: 13px; font-size: 10px; color: rgb(121, 148, 130); }
.chat-composer svg { width: 17px; height: 17px; }
.step-explanation { max-width: 480px; margin: 26px auto 0px; display: grid; grid-template-columns: 50px 1fr; gap: 12px; }
.step-explanation > span { font-size: 9px; color: rgb(142, 175, 156); padding-top: 5px; }
.step-explanation > p { font-size: 13px; color: rgb(161, 185, 171); min-height: 65px; margin: 0px; }
.step-explanation .text-link { grid-column: 2; justify-self: start; font-size: 11px; color: rgb(198, 224, 208); }
.process-footnote { font-size: 10px; color: rgb(129, 156, 141); max-width: 570px; margin: 45px 0px 0px; }
.audience-section { background: rgb(255, 255, 255); }
.audience-heading { display: flex; align-items: flex-end; justify-content: space-between; gap: 30px; margin-bottom: 55px; }
.audience-tabs { display: flex; border-bottom: 1px solid var(--line); gap: 25px; }
.audience-tabs button { padding: 18px 0px; background: none; color: rgb(125, 139, 132); font-size: 12px; border-bottom: 2px solid transparent; white-space: nowrap; }
.audience-tabs button.active { border-color: var(--accent); color: var(--ink); }
.audience-panel { display: grid; grid-template-columns: 1fr 1fr; gap: 80px; align-items: center; }
.audience-art { height: 400px; background: rgb(234, 240, 235); position: relative; overflow: hidden; border-radius: 12px; color: rgb(18, 63, 52); }
.audience-big-number { font-size: 310px; font-weight: 400; letter-spacing: -0.11em; position: absolute; left: 35px; top: -35px; line-height: 1.2; color: rgb(201, 217, 205); }
.audience-art-line { position: absolute; left: -55px; right: -55px; height: 200px; border: 1px solid rgb(84, 129, 98); transform: rotate(-30deg); top: 80px; border-radius: 50%; }
.audience-art > span:not(.audience-art-symbol) { position: absolute; bottom: 35px; left: 35px; font-size: 10px; letter-spacing: 0.1em; }
.audience-art-symbol { position: absolute; bottom: 16px; right: 25px; font-size: 95px; font-weight: 300; }
.audience-copy h3 { font-size: 35px; }
.audience-copy > p { font-size: 14px; color: var(--muted); max-width: 420px; margin: 24px 0px; }
.audience-copy ul { list-style: none; padding: 0px; margin: 0px 0px 30px; }
.audience-copy li { display: flex; gap: 12px; align-items: center; font-size: 12px; padding: 9px 0px; }
.audience-copy li svg { width: 17px; height: 17px; color: var(--accent); }
.geography-section { background: rgb(18, 63, 52); color: rgb(229, 243, 236); }
.geo-layout { display: grid; grid-template-columns: 1fr 1fr; gap: 60px; align-items: center; }
.geography-section .eyebrow { color: rgb(155, 191, 175); }
.geography-section em { color: rgb(168, 227, 205); }
.geo-layout > div > p { color: rgb(165, 196, 180); max-width: 400px; font-size: 14px; margin-top: 26px; }
.geo-country-list { display: grid; grid-template-columns: repeat(2, 1fr); gap: 0px 20px; max-width: 420px; margin-top: 38px; }
.geo-country-list button { padding: 16px 0px; border-top: 1px solid rgba(168, 227, 205, 0.19); display: flex; justify-content: space-between; gap: 15px; background: none; text-align: left; font-size: 13px; color: rgb(167, 196, 181); }
.geo-country-list button.active { color: rgb(239, 252, 244); }
.geo-country-list button > span { opacity: 0; }
.geo-country-list button.active > span { opacity: 1; }
.geo-visual { position: relative; min-height: 480px; display: flex; align-items: flex-end; justify-content: flex-end; }
.geo-lines { position: absolute; width: 115%; height: auto; left: -8%; top: -20px; color: rgb(157, 214, 180); opacity: 0.6; }
.geo-route { stroke-dasharray: 440; stroke-dashoffset: 440; animation: 3s ease 0.4s 1 normal forwards running route-draw; }
.geo-country-card { position: relative; background: rgba(15, 48, 41, 0.92); backdrop-filter: blur(10px); border: 1px solid rgba(168, 227, 205, 0.19); border-radius: 12px; width: 340px; padding: 25px; box-shadow: rgba(4, 24, 13, 0.145) 0px 25px 50px; }
.geo-country-card .eyebrow { font-size: 8px; margin-bottom: 14px; }
.geo-country-card h3 { display: flex; justify-content: space-between; margin-bottom: 26px; font-size: 31px; }
.geo-country-card h3 span { color: rgb(168, 227, 205); }
.geo-country-card > div { display: flex; justify-content: space-between; border-top: 1px solid rgba(168, 227, 205, 0.145); padding: 15px 0px; font-size: 9px; gap: 15px; }
.geo-country-card > div > span { color: rgb(155, 188, 169); }
.geo-country-card strong { font-size: 10px; font-weight: 400; text-align: right; }
.geo-country-card .button { background: rgb(168, 227, 205); color: rgb(12, 48, 32); margin-top: 12px; font-size: 12px; min-height: 48px; }
.faq-section { background: rgb(248, 250, 248); }
.faq-layout { display: grid; grid-template-columns: 0.8fr 1.2fr; gap: 100px; }
.faq-layout > div > p { color: var(--muted); font-size: 14px; margin: 26px 0px 24px; }
.faq-list details { border-top: 1px solid rgb(213, 223, 215); }
.faq-list details:last-child { border-bottom: 1px solid rgb(213, 223, 215); }
.faq-list summary { list-style: none; display: flex; justify-content: space-between; align-items: center; gap: 20px; padding: 25px 0px; font-size: 16px; line-height: 1.4; cursor: pointer; letter-spacing: -0.02em; }
.faq-list summary::-webkit-details-marker { display: none; }
.faq-plus { width: 30px; height: 30px; background: rgb(232, 238, 234); border-radius: 50%; display: grid; place-items: center; flex-shrink: 0; }
.faq-plus svg { width: 15px; height: 15px; transition: transform 0.2s; }
.faq-list details[open] .faq-plus svg { transform: rotate(45deg); }
.faq-list details p { font-size: 13px; color: var(--muted); padding: 0px 45px 23px 0px; margin: 0px; line-height: 1.8; }
.contact-section { background: rgb(230, 238, 232); }
.contact-layout { display: grid; grid-template-columns: 1.1fr 1fr; gap: 100px; align-items: start; }
.contact-layout h2 { max-width: 580px; }
.contact-layout > div > p { font-size: 15px; color: var(--muted); margin: 30px 0px 35px; }
.contact-links { display: flex; flex-direction: column; align-items: flex-start; gap: 16px; }
.contact-links a { display: flex; align-items: center; gap: 10px; font-size: 16px; }
.contact-links > a > span { margin-left: 18px; }
.contact-links svg { width: 19px; height: 19px; }
.contact-links > span { font-size: 11px; color: rgb(102, 123, 107); margin-top: 4px; }
.contact-form-panel { background: rgb(255, 255, 255); border: 1px solid rgb(209, 222, 212); border-radius: 14px; padding: 36px; }
.contact-form-heading { display: flex; justify-content: space-between; gap: 20px; margin-bottom: 30px; align-items: flex-start; }
.contact-form-heading h3 { font-size: 27px; }
.contact-form-heading > span { font-size: 35px; color: rgb(116, 152, 126); }
.contact-form-panel input:not([type="checkbox"]):not([type="radio"]) { margin-bottom: 20px; }
.field-hint { display: block; font-size: 10px; color: rgb(117, 135, 122); margin-top: -12px; margin-bottom: 24px; }
.contact-method { padding: 0px; border: 0px; display: flex; gap: 25px; margin: 0px 0px 25px; }
.contact-method legend { font-size: 11px; margin-bottom: 12px; }
.contact-method label { display: flex; align-items: center; gap: 8px; font-size: 12px; min-height: 24px; }
.contact-method input { margin: 0px; accent-color: var(--accent); width: 16px; height: 16px; }
.checkbox-label { display: flex; align-items: flex-start; gap: 10px; font-size: 10px; line-height: 1.7; color: rgb(100, 120, 106); margin: 0px 0px 26px; }
.checkbox-label input { accent-color: var(--accent); margin: 2px 0px 0px; flex-shrink: 0; width: 16px; height: 16px; }
.checkbox-label a { border-bottom: 1px solid rgb(155, 180, 161); }
.form-demo-note { font-size: 9px; color: rgb(120, 139, 125); margin: 16px 0px 0px; line-height: 1.7; }
.invoice-summary { font-size: 12px; padding: 14px; background: rgb(237, 245, 238); border-radius: 6px; margin-bottom: 24px; }
.form-success { min-height: 480px; display: flex; flex-direction: column; justify-content: center; align-items: flex-start; }
.form-success > svg { width: 45px; height: 45px; border: 1px solid rgb(169, 200, 176); border-radius: 50%; padding: 10px; color: var(--accent); margin-bottom: 24px; }
.form-success .eyebrow { font-size: 9px; margin-bottom: 18px; }
.form-success h3 { font-size: 40px; margin-bottom: 24px; }
.form-success p { font-size: 13px; color: var(--muted); }
.form-success .text-link { margin-top: 15px; font-size: 11px; }
.site-footer { background: var(--dark); color: rgb(194, 210, 200); padding: 60px 0px 35px; }
.footer-top { display: flex; justify-content: space-between; gap: 50px; border-bottom: 1px solid rgba(168, 227, 205, 0.133); padding-bottom: 42px; }
.footer-top p { font-size: 11px; color: rgb(126, 156, 139); margin: 22px 0px 0px; }
.footer-nav { display: grid; grid-template-columns: 1fr 1fr; gap: 6px 70px; font-size: 12px; }
.footer-nav a { padding: 8px 0px; }
.footer-nav a:hover { color: white; }
.footer-bottom { display: flex; justify-content: space-between; align-items: center; gap: 25px; padding-top: 25px; font-size: 9px; color: rgb(130, 158, 141); }
.footer-bottom .text-link { font-size: 9px; border: 0px; }
.footer-fineprint { font-size: 8px; line-height: 1.8; color: rgb(121, 145, 129); margin: 20px 0px 0px; max-width: 850px; }
.mobile-sticky { display: none; }
.cookie-banner { position: fixed; z-index: 40; bottom: 20px; left: 24px; right: 24px; margin: auto; max-width: 990px; background: rgb(255, 255, 255); color: rgb(16, 42, 36); border: 1px solid rgb(203, 218, 208); border-radius: 12px; box-shadow: rgba(0, 0, 0, 0.133) 0px 12px 60px; padding: 22px 25px; display: flex; align-items: center; gap: 32px; }
.cookie-banner strong { font-size: 14px; font-weight: 500; }
.cookie-banner p { font-size: 10px; line-height: 1.6; color: rgb(99, 122, 107); margin: 7px 0px 0px; max-width: 350px; }
.cookie-actions { display: flex; gap: 10px; align-items: center; flex-shrink: 0; }
.cookie-actions .button { font-size: 10px; min-height: 40px; padding: 10px 14px; white-space: nowrap; }
.cookie-actions .text-link { font-size: 10px; border: 0px; padding-inline: 7px; }
dialog { color: var(--ink); background: rgb(255, 255, 255); border: 1px solid var(--line); border-radius: 16px; max-width: 590px; width: calc(100% - 32px); padding: 55px 42px 40px; max-height: calc(100dvh - 32px); }
dialog::backdrop { background: rgba(6, 17, 13, 0.733); backdrop-filter: blur(5px); }
dialog h2 { font-size: 38px; margin-bottom: 24px; }
dialog p { font-size: 14px; color: var(--muted); }
dialog .eyebrow { font-size: 9px; margin-bottom: 18px; }
.dialog-close { position: absolute; right: 14px; top: 12px; background: none; font-size: 28px; font-weight: 300; width: 44px; height: 44px; }
.cookie-setting-row { display: flex; justify-content: space-between; align-items: center; font-size: 12px; padding: 18px 0px; border-top: 1px solid var(--line); gap: 15px; }
.cookie-setting-row strong { font-size: 11px; }
.cookie-setting-row + button { margin-top: 24px; }
.reveal { opacity: 0; transform: translateY(24px); transition: opacity 0.7s, transform 0.7s; }
.reveal.in-view { opacity: 1; transform: none; }
.blue { --ink: #142344; --muted: #66738d; --paper: #f5f7fc; --accent: #173fe5; --line: #d8dfef; --dark: #0c1731; --radius: 3px; background: rgb(245, 247, 252); }
.blue .demo-bar { background: rgb(12, 23, 49); color: rgb(208, 216, 242); }
.blue .site-header { background: rgba(23, 63, 229, 0.96); color: white; border-color: rgba(255, 255, 255, 0.145); }
.blue .wordmark > span { color: rgb(211, 221, 255); }
.blue .desktop-nav { color: rgb(225, 231, 255); }
.blue .nav-inner { height: 82px; }
.blue .nav-actions > .button { background: rgb(255, 255, 255); color: rgb(23, 63, 229); }
.blue .nav-actions > .button:hover { background: rgb(225, 232, 255); }
.blue .button { border-radius: 3px; }
.blue .button:hover { background: rgb(16, 50, 193); }
.blue .mobile-menu { background: rgb(23, 63, 229); }
.blue .eyebrow { font-weight: 500; letter-spacing: 0.1em; }
.blue-hero { background: rgb(23, 63, 229); color: white; padding: 46px 0px 0px; overflow: visible; }
.blue-hero-top { display: flex; justify-content: space-between; gap: 30px; }
.blue-hero-top .eyebrow { font-size: 9px; color: rgb(209, 219, 255); margin: 0px; }
.hero-index { font-size: 9px; letter-spacing: 0.09em; color: rgb(196, 209, 255); }
.blue-hero h1 { font-size: clamp(56px, 7.4vw, 112px); font-weight: 400; letter-spacing: -0.065em; margin: 53px 0px 36px; line-height: 1.04; max-width: 1250px; }
.blue-title-last { position: relative; white-space: nowrap; color: rgb(216, 226, 255); }
.blue-title-last svg { position: absolute; width: 104%; height: 24px; left: 0px; bottom: -14px; fill: none; stroke: rgb(142, 170, 255); stroke-width: 2; stroke-dasharray: 310; stroke-dashoffset: 310; animation: 1.5s ease 0.4s 1 normal forwards running route-draw; }
.blue-hero-bottom { display: flex; gap: 75px; align-items: center; margin-bottom: 52px; }
.blue-hero-bottom > p { font-size: 13px; line-height: 1.75; color: rgb(211, 220, 255); margin: 0px; flex: 1 1 0%; }
.button-light { min-width: 240px; background: white !important; color: rgb(23, 63, 229) !important; }
.button-light:hover { background: rgb(228, 235, 255) !important; }
.blue-scroll { height: 52px; width: 52px; display: grid; place-items: center; border: 1px solid rgba(255, 255, 255, 0.333); border-radius: 50%; font-size: 25px; }
.payment-board { position: relative; background: rgb(255, 255, 255); color: rgb(18, 36, 72); border-width: 1px 1px 0px; border-style: solid solid none; border-color: rgb(215, 225, 244) rgb(215, 225, 244) currentcolor; border-image: none; padding: 25px 32px 20px; box-shadow: rgba(11, 35, 123, 0.082) 0px 35px 70px; z-index: 2; transform: translateY(34px); margin-top: -34px; border-radius: 4px; }
.board-label { display: flex; justify-content: space-between; font-size: 9px; letter-spacing: 0.09em; color: rgb(102, 123, 154); }
.board-demo { color: rgb(139, 152, 177); font-size: 8px; }
.route-visual { display: flex; align-items: center; gap: 20px; padding: 34px 12px; }
.route-endpoint { display: flex; align-items: center; gap: 18px; min-width: 190px; }
.route-symbol { font-size: 49px; letter-spacing: -0.06em; line-height: 1; background: rgb(237, 242, 255); width: 80px; height: 80px; display: grid; place-items: center; border-radius: 50%; color: rgb(23, 63, 229); font-weight: 400; }
.route-endpoint small { display: block; font-size: 7px; letter-spacing: 0.06em; color: rgb(122, 138, 166); margin-bottom: 9px; }
.route-endpoint strong { font-size: 23px; font-weight: 400; letter-spacing: -0.04em; }
.route-hub { display: flex; flex-direction: column; justify-content: center; align-items: center; min-width: 100px; height: 100px; background: rgb(23, 63, 229); color: white; border-radius: 22px; font-size: 40px; font-weight: 500; letter-spacing: -0.08em; box-shadow: rgba(23, 63, 229, 0.15) 0px 8px 25px; transition: transform 0.2s; }
.route-hub:hover { transform: rotate(-6deg) scale(1.05); }
.route-hub > span { font-size: 9px; letter-spacing: 0px; font-weight: 400; display: block; margin-top: 3px; }
.route-track { flex: 1 1 0%; position: relative; min-width: 20px; height: 1px; background: rgb(189, 204, 239); }
.route-track::after { content: "›"; color: rgb(23, 63, 229); position: absolute; right: -1px; top: -11px; font-size: 19px; }
.route-particle { position: absolute; width: 7px; height: 7px; background: rgb(23, 63, 229); top: -3px; left: 0px; border-radius: 50%; box-shadow: rgba(23, 63, 229, 0.063) 0px 0px 0px 5px; animation: 4s linear 0s infinite normal none running travel; }
.route-track:nth-of-type(3) .route-particle { animation-delay: 1.5s; }
.board-footer { display: flex; justify-content: space-between; align-items: center; gap: 20px; border-top: 1px solid rgb(227, 233, 246); padding-top: 16px; }
.board-footer > span { font-size: 9px; color: rgb(132, 145, 170); }
.country-pills { display: flex; gap: 5px; }
.country-pills button { background: transparent; color: rgb(113, 130, 162); border-radius: 3px; padding: 10px 15px; font-size: 10px; min-height: 36px; }
.country-pills button.active { color: rgb(23, 63, 229); background: rgb(237, 242, 255); }
.blue .calculator-section { padding-top: 140px; background: rgb(245, 247, 252); }
.blue .calc-layout { grid-template-columns: 0.9fr 1.1fr; gap: 130px; align-items: start; }
.blue .section-intro h2 { font-size: clamp(40px, 4.5vw, 67px); }
.blue .calculator-panel { border-radius: 4px; box-shadow: rgb(231, 236, 248) 8px 8px 0px; padding: 38px; }
.blue input:not([type="checkbox"]):not([type="radio"]), .blue select { border-radius: 3px; background: rgb(247, 249, 255); border-color: rgb(220, 227, 242); }
.blue .calc-note { color: rgb(105, 127, 164); }
.blue .calc-result { background: rgb(237, 242, 255); }
.blue .process-section { background: rgb(232, 238, 253); color: rgb(20, 35, 68); }
.blue .process-section .eyebrow, .blue .process-section .section-heading > p { color: rgb(97, 117, 156); }
.blue .process-layout { grid-template-columns: 1fr 1.15fr; gap: 90px; }
.blue .step-button { border-color: rgb(200, 213, 241); color: rgb(120, 144, 184); }
.blue .step-button.active { color: rgb(23, 63, 229); }
.blue .step-number, .blue .step-button.active .step-number, .blue .step-button.active .step-arrow { color: rgb(23, 63, 229); }
.blue .step-label small { color: rgb(109, 131, 172); }
.blue .chat-window { border-radius: 4px; background: white; color: rgb(18, 36, 72); box-shadow: rgb(212, 222, 245) 10px 10px 0px; border: 1px solid rgb(196, 211, 240); }
.blue .chat-avatar { background: rgb(23, 63, 229); color: white; border-color: rgb(23, 63, 229); border-radius: 4px; }
.blue .chat-head { border-color: rgb(227, 233, 246); }
.blue .chat-head small, .blue .chat-date { color: rgb(131, 148, 177); }
.blue .chat-bubble { background: rgb(238, 243, 255); border-color: rgb(216, 227, 253); border-radius: 4px 4px 4px 0px; }
.blue .chat-bubble > small { color: rgb(23, 63, 229); }
.blue .chat-bubble p { color: rgb(98, 120, 157); }
.blue .chat-time, .blue .chat-document div span { color: rgb(123, 145, 178); }
.blue .chat-document { border-color: rgb(219, 228, 247); border-radius: 4px; }
.blue .chat-document > svg { color: rgb(23, 63, 229); }
.blue .chat-composer { background: rgb(245, 247, 252); border-color: rgb(226, 232, 244); border-radius: 3px; color: rgb(139, 155, 182); }
.blue .step-explanation > span, .blue .step-explanation > p, .blue .process-footnote { color: rgb(106, 128, 166); }
.blue .step-explanation .text-link { color: rgb(23, 63, 229); }
.blue .numbers { background: rgb(23, 63, 229); color: white; }
.blue .numbers .eyebrow { color: rgb(192, 207, 255); }
.blue .numbers-layout { grid-template-columns: 1.3fr 1fr 0.8fr; gap: 50px; }
.blue .numbers h2 { font-size: 35px; }
.blue .numbers .muted { color: rgb(192, 207, 255); }
.blue .number-item { border-color: rgba(255, 255, 255, 0.25); }
.blue .number-item strong { color: white; font-size: 110px; }
.blue .number-item strong > span { color: rgb(159, 180, 255); }
.blue .number-item p { color: rgb(207, 218, 255); }
.blue .documents-section { background: rgb(255, 255, 255); }
.blue .document-card { border-radius: 3px; background: rgb(245, 247, 252); border-color: rgb(217, 227, 244); padding: 24px; }
.blue .document-sheet { border-color: rgb(212, 223, 243); box-shadow: rgb(229, 234, 246) 6px 8px 0px; }
.blue .document-sheet i { background: rgb(224, 231, 245); }
.blue .document-sheet b { color: rgb(23, 63, 229); }
.blue .document-top, .blue .document-description { color: rgb(115, 133, 166); }
.blue .document-card > small { border-color: rgb(213, 223, 240); border-radius: 3px; }
.blue .audience-section { background: rgb(241, 244, 252); }
.blue .audience-panel { grid-template-columns: 0.75fr 1.25fr; gap: 110px; }
.blue .audience-art { border-radius: 3px; background: rgb(23, 63, 229); color: rgb(255, 255, 255); height: 380px; }
.blue .audience-big-number { color: rgba(255, 255, 255, 0.157); font-size: 330px; left: 5px; }
.blue .audience-art-line { border-color: rgb(122, 156, 255); height: 300px; width: 500px; left: -130px; transform: rotate(-55deg); }
.blue .audience-art-symbol { font-size: 105px; }
.blue .audience-copy h3 { font-size: 43px; }
.blue .geography-section { background: rgb(12, 23, 49); color: rgb(239, 243, 255); }
.blue .geography-section .eyebrow, .blue .geo-layout > div > p { color: rgb(154, 174, 209); }
.blue .geo-lines { color: rgb(131, 166, 255); }
.blue .geo-country-list button { border-color: rgba(141, 168, 231, 0.208); color: rgb(151, 172, 207); }
.blue .geo-country-list button.active { color: white; }
.blue .geo-country-card { background: rgba(20, 36, 66, 0.91); border-color: rgba(129, 158, 222, 0.267); border-radius: 4px; }
.blue .geo-country-card > div { border-color: rgba(141, 168, 231, 0.19); }
.blue .geo-country-card > div > span { color: rgb(142, 163, 202); }
.blue .geo-country-card h3 span { color: rgb(155, 182, 255); }
.blue .geo-country-card .button { background: rgb(227, 235, 255); color: rgb(23, 63, 229); }
.blue .faq-section { background: rgb(255, 255, 255); }
.blue .faq-layout { grid-template-columns: 1fr 1.3fr; gap: 130px; }
.blue .faq-list details { border-color: rgb(220, 227, 240); }
.blue .faq-plus { background: rgb(237, 242, 255); color: rgb(23, 63, 229); border-radius: 3px; }
.blue .contact-section { background: rgb(23, 63, 229); color: white; }
.blue .contact-layout { grid-template-columns: 1.1fr 1fr; gap: 110px; }
.blue .contact-layout h2 { font-size: clamp(40px, 4.5vw, 68px); }
.blue .contact-layout h2 em { color: rgb(185, 203, 255); }
.blue .contact-layout > div > p, .blue .contact-links > span { color: rgb(195, 210, 255); }
.blue .contact-form-panel { color: rgb(20, 35, 68); border-color: rgb(214, 224, 244); border-radius: 4px; padding: 38px; }
.blue .contact-form-heading > span { color: rgb(23, 63, 229); }
.blue .checkbox-label, .blue .form-demo-note, .blue .field-hint { color: rgb(116, 132, 161); }
.blue .invoice-summary { background: rgb(237, 242, 255); }
.blue .site-footer { background: rgb(12, 23, 49); }
.blue .footer-top { border-color: rgba(137, 164, 222, 0.208); }
.blue .footer-top p, .blue .footer-bottom, .blue .footer-fineprint { color: rgb(145, 165, 200); }
.blue .wordmark i { color: rgb(182, 202, 255); }
.showcase { background: rgb(16, 21, 17); color: rgb(241, 245, 239); }
.showcase-main { width: min(1280px, 100% - 100px); margin: auto; }
.showcase-top { height: 120px; display: flex; align-items: center; justify-content: space-between; border-bottom: 1px solid rgba(230, 242, 229, 0.11); }
.showcase-top > span { font-size: 10px; letter-spacing: 0.12em; color: rgb(158, 173, 160); }
.showcase-intro { padding: 68px 0px 60px; max-width: 780px; }
.showcase-intro .eyebrow { font-size: 10px; color: rgb(169, 191, 170); margin-bottom: 26px; }
.showcase-intro h1 { font-size: clamp(42px, 5.2vw, 72px); line-height: 1.08; letter-spacing: -0.055em; }
.showcase-intro p { font-size: 14px; color: rgb(160, 175, 162); max-width: 570px; margin: 26px 0px 0px; }
.concepts { display: grid; grid-template-columns: 1fr 1fr; gap: 28px; }
.concept-preview { border: 1px solid rgba(255, 255, 255, 0.137); border-radius: 10px; overflow: hidden; transition: transform 0.3s, border-color 0.3s; display: block; background: rgb(21, 29, 23); }
.concept-preview:hover { transform: translateY(-6px); border-color: rgba(255, 255, 255, 0.376); }
.preview-meta { display: flex; justify-content: space-between; align-items: center; padding: 22px 26px; font-size: 10px; letter-spacing: 0.1em; }
.round-arrow { border: 1px solid rgba(255, 255, 255, 0.2); border-radius: 50%; height: 32px; width: 32px; display: grid; place-items: center; font-size: 17px; }
.mini-green, .mini-blue { height: 350px; position: relative; overflow: hidden; margin: 0px 12px; border-radius: 5px; padding: 26px 30px; }
.mini-green { background: rgb(7, 15, 16); }
.mini-brand { font-size: 12px; font-weight: 600; letter-spacing: -0.4px; position: relative; z-index: 2; }
.mini-green h2 { font-size: 40px; line-height: 1.04; margin-top: 30px; position: relative; z-index: 2; }
.mini-green h2 em { color: rgb(168, 227, 205); }
.mini-green img { position: absolute; width: 95%; right: -65px; bottom: -15px; max-width: none; }
.mini-blue { background: rgb(23, 63, 229); }
.mini-blue h2 { font-size: 37px; line-height: 1.1; margin-top: 30px; }
.mini-blue h2 em { color: rgb(190, 208, 255); }
.mini-route { display: flex; align-items: center; justify-content: space-between; background: white; color: rgb(23, 63, 229); padding: 18px 25px; position: absolute; bottom: 24px; left: 30px; right: 30px; border-radius: 3px; }
.mini-route > span { font-size: 26px; font-weight: 500; }
.mini-route > i { font-size: 20px; font-style: normal; color: rgb(165, 185, 239); }
.preview-caption { padding: 30px 26px; }
.preview-caption h2 { font-size: 23px; font-weight: 400; letter-spacing: -0.03em; }
.preview-caption p { font-size: 12px; color: rgb(158, 173, 160); line-height: 1.75; margin: 16px 0px 23px; max-width: 420px; }
.preview-caption > span { display: flex; align-items: center; justify-content: space-between; font-size: 12px; }
.preview-caption b { font-size: 22px; font-weight: 400; }
.showcase-footer { display: flex; justify-content: space-between; gap: 25px; color: rgb(126, 146, 130); font-size: 10px; padding: 45px 0px 30px; }
@keyframes car-entry {
  0% { opacity: 0; transform: translateX(35px); }
  100% { opacity: 1; transform: none; }
}
@keyframes rise-in {
  0% { opacity: 0; transform: translateY(18px); }
  100% { opacity: 1; transform: none; }
}
@keyframes travel {
  0% { left: 0px; opacity: 0; }
  10% { opacity: 1; }
  85% { opacity: 1; }
  100% { left: 95%; opacity: 0; }
}
@keyframes route-draw {
  100% { stroke-dashoffset: 0; }
}
@media (min-width: 1600px) {
  .green-hero { padding-top: 100px; }
  .hero-grid { min-height: 650px; }
  .green-art { height: 600px; }
  .car-art { top: 80px; }
  .hero-payment { bottom: 90px; }
}
@media (max-width: 1200px) {
  .container { width: calc(100% - 72px); }
  .desktop-nav { gap: 20px; }
  .nav-inner { gap: 25px; }
  .nav-actions { gap: 10px; }
  .green-hero { padding-top: 60px; }
  .hero-grid { grid-template-columns: 1.1fr 1fr; min-height: 570px; }
  .green-art { width: calc(100% + 25px); margin-left: -25px; }
  .green-hero h1 { font-size: 68px; }
  .green-hero .button-row { gap: 15px; }
  .green-hero .button { padding-inline: 18px; }
  .green-hero .text-link { font-size: 11px; }
  .car-art { top: 100px; width: calc(100% + 180px); left: -90px; }
  .hero-payment { bottom: 75px; right: 0px; padding: 17px; gap: 10px; }
  .hero-payment strong { font-size: 11px; }
  .hero-payment small { font-size: 9px; }
  .art-caption { font-size: 7px; left: 20px; right: 0px; }
  .art-orbit { width: 400px; height: 400px; }
  .orbit-two { width: 520px; height: 300px; }
  .section-pad { padding: 90px 0px; }
  .calc-layout, .blue .calc-layout { gap: 65px; }
  .process-layout, .blue .process-layout { gap: 65px; }
  .contact-layout, .blue .contact-layout { gap: 65px; }
  .audience-panel, .blue .audience-panel { gap: 65px; }
  .faq-layout, .blue .faq-layout { gap: 65px; }
  .number-item { padding-left: 30px; }
  .number-item strong, .blue .number-item strong { font-size: 85px; }
  .numbers-layout, .blue .numbers-layout { gap: 35px; }
  .document-card { padding: 18px; }
  .blue .document-card { padding: 18px; }
  .document-sheet { width: 110px; height: 145px; }
  .document-card > strong { font-size: 19px; }
  .blue-hero h1 { font-size: 7.5vw; }
  .route-endpoint { min-width: 165px; }
  .route-symbol { width: 65px; height: 65px; font-size: 40px; }
  .route-hub { min-width: 85px; height: 85px; font-size: 33px; }
  .board-footer > span { font-size: 8px; }
  .audience-tabs { gap: 16px; }
  .audience-copy h3, .blue .audience-copy h3 { font-size: 33px; }
  .geo-layout { gap: 35px; }
  .cookie-banner { padding: 20px; gap: 20px; }
  .cookie-actions { gap: 6px; }
  .cookie-actions .button { padding-inline: 11px; }
}
@media (max-width: 960px) {
  .desktop-nav { display: none; }
  .menu-toggle { display: block; }
  .container { width: calc(100% - 56px); }
  .green-hero h1 { font-size: 60px; }
  .hero-grid { grid-template-columns: 1.05fr 1fr; min-height: 570px; }
  .green-art { height: 470px; }
  .car-art { top: 100px; left: -100px; width: calc(100% + 160px); }
  .hero-payment { right: -15px; bottom: 20px; }
  .currency-mark { width: 32px; height: 32px; font-size: 19px; }
  .hero-payment strong { font-size: 10px; }
  .hero-payment small { font-size: 8px; }
  .payment-arrow { font-size: 20px; margin-left: 0px; }
  .hero-proof { gap: 15px; font-size: 9px; }
  .hero-description { font-size: 14px; }
  .hero-proof svg { width: 15px; height: 15px; }
  .art-caption { top: 35px; left: 0px; right: 0px; font-size: 6px; gap: 12px; }
  .art-coordinates { display: none; }
  .green-hero .button-row { align-items: flex-start; flex-direction: column; gap: 8px; }
  .green-hero .button-row .text-link { font-size: 12px; }
  .hero-bottom { margin-top: 25px; }
  .numbers-layout, .blue .numbers-layout { grid-template-columns: 1.4fr 1fr 1fr; gap: 25px; }
  .numbers h2, .blue .numbers h2 { font-size: 24px; }
  .number-item strong, .blue .number-item strong { font-size: 72px; }
  .number-item { padding-left: 24px; }
  .number-item p { font-size: 11px; }
  .section-pad { padding: 75px 0px; }
  .calc-layout, .blue .calc-layout { gap: 45px; grid-template-columns: 1fr 1.1fr; }
  .calculator-panel, .blue .calculator-panel { padding: 25px; }
  .section-intro > p { font-size: 13px; }
  .section-intro h2, .blue .section-intro h2 { font-size: 41px; }
  .field-pair { gap: 12px; grid-template-columns: 1.2fr 1fr; }
  .panel-heading { font-size: 14px; }
  .section-heading { gap: 35px; margin-bottom: 40px; }
  .section-heading > p { font-size: 12px; max-width: 280px; }
  h2 { font-size: 43px; }
  .document-grid { gap: 12px; }
  .document-card, .blue .document-card { padding: 16px; }
  .document-card > strong { font-size: 18px; }
  .document-description { font-size: 10px; min-height: 34px; }
  .document-sheet { width: 92px; height: 125px; padding: 17px 13px; }
  .document-sheet b { font-size: 12px; }
  .document-sheet i { height: 1px; }
  .document-card > small { font-size: 8px; }
  .documents-bottom { gap: 18px; }
  .documents-bottom p, .documents-bottom .text-link { font-size: 10px; }
  .process-layout, .blue .process-layout { gap: 35px; }
  .step-button { gap: 18px; padding: 24px 0px; }
  .step-label strong { font-size: 19px; }
  .step-label small { font-size: 9px; }
  .chat-window { padding: 18px; }
  .chat-head { gap: 8px; }
  .chat-head strong { font-size: 10px; }
  .chat-head small { font-size: 8px; }
  .chat-dots { display: none; }
  .chat-bubble { padding: 16px; margin-right: 12px; }
  .chat-bubble h3 { font-size: 17px; }
  .chat-bubble p { font-size: 11px; }
  .chat-document { margin-right: 12px; }
  .chat-document div span { font-size: 7px; }
  .chat-document strong { font-size: 9px; }
  .audience-heading { display: block; }
  .audience-tabs { margin-top: 25px; display: inline-flex; gap: 25px; }
  .audience-panel, .blue .audience-panel { gap: 45px; }
  .audience-art, .blue .audience-art { height: 350px; }
  .audience-big-number, .blue .audience-big-number { font-size: 280px; left: 5px; top: -10px; }
  .audience-copy h3, .blue .audience-copy h3 { font-size: 30px; }
  .audience-copy > p { font-size: 12px; }
  .audience-copy li { font-size: 11px; }
  .audience-copy .button { font-size: 12px; gap: 20px; padding-inline: 18px; }
  .geo-layout { gap: 25px; grid-template-columns: 1fr 1fr; }
  .geo-visual { min-height: 430px; }
  .geo-country-card { width: 100%; padding: 22px; }
  .geo-country-list button { font-size: 12px; }
  .geo-country-list { gap: 0px 15px; }
  .faq-layout, .blue .faq-layout { gap: 45px; grid-template-columns: 0.85fr 1.15fr; }
  .faq-list summary { font-size: 14px; padding: 23px 0px; }
  .faq-list details p { font-size: 12px; padding-right: 25px; }
  .contact-layout, .blue .contact-layout { gap: 45px; grid-template-columns: 1fr 1.05fr; }
  .contact-layout h2, .blue .contact-layout h2 { font-size: 43px; }
  .contact-form-panel, .blue .contact-form-panel { padding: 25px; }
  .contact-form-heading h3 { font-size: 24px; }
  .contact-links a { font-size: 13px; }
  .blue-hero h1 { margin-top: 50px; font-size: 7.8vw; }
  .blue-hero-bottom { gap: 28px; }
  .blue-hero-bottom > p { font-size: 12px; }
  .blue-hero .button-light { min-width: 210px; font-size: 12px; }
  .blue-scroll { width: 44px; height: 44px; }
  .payment-board { padding: 25px; }
  .route-visual { gap: 15px; padding: 35px 0px; }
  .route-endpoint { gap: 12px; min-width: 140px; }
  .route-symbol { width: 56px; height: 56px; font-size: 32px; }
  .route-endpoint small { font-size: 6px; }
  .route-endpoint strong { font-size: 20px; }
  .route-hub { min-width: 72px; height: 72px; font-size: 30px; border-radius: 15px; }
  .route-hub span { font-size: 8px; }
  .route-track { min-width: 10px; }
  .board-footer > span { max-width: 180px; line-height: 1.6; }
  .country-pills button { padding: 8px 12px; }
  .blue .calculator-section { padding-top: 110px; }
  .cookie-banner { display: block; max-width: 540px; margin: 0px; left: 20px; right: 20px; padding: 20px; }
  .cookie-banner p { max-width: none; }
  .cookie-actions { margin-top: 15px; justify-content: flex-start; gap: 10px; }
  .cookie-actions .button { font-size: 10px; }
  .showcase-main { width: calc(100% - 60px); }
  .mini-green, .mini-blue { height: 310px; padding: 25px; }
  .mini-green h2 { font-size: 34px; }
  .mini-blue h2 { font-size: 29px; }
  .mini-route { left: 25px; right: 25px; }
  .preview-caption { padding: 25px; }
  .preview-caption h2 { font-size: 20px; }
  .preview-meta { padding: 20px; }
  .preview-meta > span:first-child { font-size: 8px; }
  .footer-nav { gap: 6px 40px; }
}
@media (max-width: 700px) {
  :root { scroll-padding-top: 85px; }
  .container { width: calc(100% - 40px); }
  .demo-bar { padding: 0px 20px; height: 30px; font-size: 8px; }
  .demo-bar a { height: 30px; }
  .nav-inner, .blue .nav-inner { height: 72px; gap: 12px; }
  .wordmark { font-size: 24px; }
  .wordmark i { width: 45px; left: 44px; }
  .nav-actions { gap: 3px; }
  .nav-telegram { display: none; }
  .nav-actions > .button { font-size: 10px; padding: 10px 12px; gap: 12px; min-height: 40px; }
  .nav-actions > .button > span { font-size: 17px; }
  .menu-toggle { width: 40px; height: 40px; padding: 8px; }
  .mobile-menu { padding: 8px 20px 20px; font-size: 14px; }
  .green-hero { padding-top: 42px; }
  .hero-grid { display: flex; flex-direction: column; align-items: stretch; min-height: 0px; }
  .green-hero .eyebrow { font-size: 8px; margin-bottom: 26px; letter-spacing: 0.12em; }
  .green-hero h1 { font-size: clamp(46px, 10.5vw, 72px); line-height: 1.04; letter-spacing: -0.055em; }
  .hero-description { font-size: 14px; margin: 25px 0px 26px; max-width: 400px; }
  .green-hero .button-row { flex-direction: row; align-items: center; gap: 16px; }
  .green-hero .button { padding: 15px 18px; min-height: 52px; font-size: 12px; gap: 23px; }
  .green-hero .button-row .text-link { font-size: 10px; gap: 8px; }
  .hero-proof { margin-top: 24px; gap: 18px; font-size: 9px; }
  .green-art { height: 330px; width: 100%; margin: 12px 0px 0px; }
  .car-art { width: calc(100% + 70px); left: -40px; top: 16px; max-width: none; }
  .art-orbit { width: 280px; height: 280px; top: 42%; }
  .orbit-two { width: 380px; height: 200px; }
  .art-caption { display: none; }
  .hero-payment { right: 0px; bottom: 14px; padding: 14px 18px; gap: 12px; max-width: 100%; }
  .hero-payment strong { font-size: 11px; }
  .hero-payment small { font-size: 9px; }
  .currency-mark { width: 36px; height: 36px; font-size: 20px; }
  .hero-bottom { padding: 20px 0px 23px; margin-top: 15px; font-size: 8px; gap: 20px; }
  .scroll-cue { font-size: 0px; gap: 0px; }
  .scroll-cue span { font-size: 23px; }
  .section-pad { padding: 60px 0px; }
  h2 { font-size: 36px; letter-spacing: -0.05em; }
  .eyebrow { font-size: 9px; margin-bottom: 23px; }
  .numbers-layout, .blue .numbers-layout { grid-template-columns: 1fr 1fr; gap: 35px 18px; }
  .numbers-layout > div:first-child { grid-column: 1 / -1; }
  .numbers h2, .blue .numbers h2 { font-size: 27px; }
  .numbers .eyebrow { font-size: 8px; margin-bottom: 17px; }
  .numbers .muted { font-size: 9px; margin-top: 16px; }
  .number-item { padding-left: 0px; border-left: 0px; border-top: 1px solid var(--line); padding-top: 22px; }
  .number-item strong, .blue .number-item strong { font-size: 78px; }
  .number-item strong > span { font-size: 19px; margin-top: 8px; }
  .number-item p { font-size: 12px; margin-top: 12px; }
  .calc-layout, .blue .calc-layout { display: block; }
  .section-intro h2, .blue .section-intro h2 { font-size: 39px; margin-bottom: 23px; }
  .section-intro > p { max-width: 400px; font-size: 14px; }
  .section-intro .text-link { font-size: 12px; }
  .calc-note { margin: 25px 0px 30px; font-size: 11px; }
  .calc-note br { display: none; }
  .calc-note svg { width: 22px; height: 22px; }
  .calculator-panel, .blue .calculator-panel { margin-top: 35px; padding: 24px 20px; border-radius: 9px; }
  .blue .calculator-panel { border-radius: 3px; box-shadow: rgb(231, 236, 248) 5px 5px 0px; }
  .panel-heading { font-size: 14px; margin-bottom: 25px; }
  .field-pair { gap: 14px; grid-template-columns: 1.2fr 1fr; }
  label { font-size: 11px; }
  select, input:not([type="checkbox"]):not([type="radio"]) { font-size: 16px; padding: 12px; min-height: 50px; margin-top: 9px; margin-bottom: 22px; }
  select { padding-right: 27px; background-position: right 6px center; background-size: 18px auto; }
  .amount-wrap input { min-height: 72px !important; font-size: 26px !important; }
  .amount-wrap > span { top: 34px; right: 16px; }
  .calculator-panel .button { font-size: 13px; min-height: 54px; }
  .rate-note { font-size: 10px; }
  .rate-note small { font-size: 9px; }
  .calculator-disclaimer { font-size: 9px; }
  .section-heading { display: block; margin-bottom: 35px; }
  .section-heading > p { font-size: 13px; line-height: 1.75; max-width: 370px; margin-top: 25px; }
  .document-grid { grid-template-columns: 1fr 1fr; gap: 12px; }
  .document-card, .blue .document-card { padding: 18px 15px; min-width: 0px; border-radius: 7px; }
  .blue .document-card { border-radius: 3px; }
  .document-sheet { width: 92px; height: 123px; margin: 24px auto 27px; }
  .document-card > strong { font-size: 19px; }
  .document-description { font-size: 11px; line-height: 1.6; margin: 9px 0px 18px; min-height: 36px; }
  .document-card > small { font-size: 8px; padding: 5px; }
  .document-top svg { width: 19px; height: 19px; }
  .document-top > span { font-size: 8px; }
  .documents-bottom { display: block; margin-top: 26px; }
  .documents-bottom p { font-size: 11px; gap: 10px; align-items: flex-start; line-height: 1.7; }
  .documents-bottom p svg { width: 20px; height: 20px; }
  .documents-bottom .text-link { font-size: 11px; margin-top: 17px; }
  .process-layout, .blue .process-layout { display: block; }
  .step-list { display: flex; gap: 7px; border-bottom: 1px solid rgba(168, 227, 205, 0.19); margin-bottom: 28px; padding-bottom: 12px; }
  .step-button { display: flex; flex-direction: column; align-items: flex-start; justify-content: flex-start; padding: 12px 3px; width: 20%; gap: 12px; border: 0px !important; }
  .step-number { align-self: auto; font-size: 10px; margin: 0px; border: 1px solid rgba(168, 227, 205, 0.19); border-radius: 50%; height: 32px; width: 32px; display: grid; place-items: center; }
  .step-button.active .step-number { background: rgb(168, 227, 205); border-color: rgb(168, 227, 205); color: rgb(10, 40, 24) !important; }
  .step-label strong { font-size: 10px; line-height: 1.5; letter-spacing: 0px; max-width: 70px; }
  .step-label small { display: none; }
  .step-arrow { display: none; }
  .step-panel { padding: 0px; }
  .chat-window { padding: 20px; max-width: 450px; }
  .chat-head strong { font-size: 11px; }
  .chat-head small { font-size: 9px; }
  .chat-avatar { height: 40px; width: 40px; }
  .chat-bubble { padding: 20px; margin-right: 20px; }
  .chat-bubble h3 { font-size: 18px; }
  .chat-bubble p { font-size: 12px; min-height: 55px; }
  .chat-document { margin-right: 20px; }
  .chat-document strong { font-size: 10px; }
  .chat-document div span { font-size: 8px; }
  .chat-composer { font-size: 10px; }
  .step-explanation { grid-template-columns: 40px 1fr; gap: 8px; margin-top: 24px; }
  .step-explanation > p { font-size: 12px; line-height: 1.8; min-height: 65px; }
  .process-footnote { font-size: 9px; margin-top: 30px; }
  .blue .step-list { border-color: rgb(203, 215, 238); }
  .blue .step-number { border-color: rgb(182, 201, 239); }
  .blue .step-button.active .step-number { background: rgb(23, 63, 229); border-color: rgb(23, 63, 229); color: white !important; }
  .blue .step-label strong { font-size: 10px; }
  .blue .chat-window { box-shadow: rgb(212, 222, 245) 5px 5px 0px; }
  .audience-heading { margin-bottom: 32px; }
  .audience-tabs { display: flex; overflow-x: auto; gap: 20px; margin-top: 24px; max-width: 100%; }
  .audience-tabs button { padding: 16px 0px; font-size: 11px; min-height: 49px; }
  .audience-panel, .blue .audience-panel { display: flex; flex-direction: column; align-items: stretch; gap: 28px; }
  .audience-art, .blue .audience-art { height: 200px; width: 100%; }
  .audience-big-number, .blue .audience-big-number { font-size: 235px; left: 25px; top: -61px; }
  .audience-art-line { top: 0px; height: 160px; width: 500px; left: -30px; }
  .blue .audience-art-line { top: -65px; left: 30px; transform: rotate(-35deg); width: 450px; height: 250px; }
  .audience-art > span:not(.audience-art-symbol) { left: 25px; bottom: 23px; font-size: 9px; }
  .audience-art-symbol, .blue .audience-art-symbol { font-size: 75px; right: 22px; bottom: 6px; }
  .audience-copy h3, .blue .audience-copy h3 { font-size: 33px; line-height: 1.15; }
  .audience-copy > p { font-size: 14px; margin: 23px 0px; }
  .audience-copy li { font-size: 12px; padding: 10px 0px; }
  .audience-copy ul { margin-bottom: 25px; }
  .audience-copy .button { font-size: 12px; padding-inline: 20px; min-height: 52px; }
  .geo-layout { display: block; }
  .geo-layout > div > p { font-size: 13px; max-width: 400px; margin-top: 23px; }
  .geo-country-list { max-width: none; margin-top: 28px; gap: 0px 25px; }
  .geo-country-list button { padding: 17px 0px; font-size: 13px; }
  .geo-visual { min-height: 400px; max-width: 450px; margin: 30px auto 0px; justify-content: center; }
  .geo-lines { width: 115%; max-width: none; left: -7.5%; top: 0px; }
  .geo-country-card { width: calc(100% - 25px); padding: 24px; margin-top: 130px; }
  .geo-country-card > div { font-size: 10px; }
  .geo-country-card strong { font-size: 11px; }
  .geo-country-card .eyebrow { font-size: 8px; }
  .geo-country-card h3 { font-size: 30px; }
  .geo-country-card .button { min-height: 48px; }
  .faq-layout, .blue .faq-layout { display: block; }
  .faq-layout > div > p { font-size: 13px; margin: 24px 0px 15px; }
  .faq-layout .text-link { font-size: 12px; }
  .faq-list { margin-top: 32px; }
  .faq-list summary { font-size: 15px; line-height: 1.5; padding: 22px 0px; gap: 15px; }
  .faq-list details p { font-size: 13px; padding: 0px 20px 23px 0px; }
  .faq-plus { height: 28px; width: 28px; }
  .contact-layout, .blue .contact-layout { display: block; }
  .contact-layout h2, .blue .contact-layout h2 { font-size: 41px; }
  .contact-layout > div > p { font-size: 14px; margin-top: 26px; }
  .contact-links a { font-size: 15px; }
  .contact-links > span { font-size: 10px; }
  .contact-form-panel, .blue .contact-form-panel { padding: 26px 20px; margin-top: 38px; border-radius: 9px; }
  .blue .contact-form-panel { border-radius: 3px; }
  .contact-form-heading h3 { font-size: 27px; }
  .contact-form-heading { margin-bottom: 28px; }
  .contact-form-panel .button { font-size: 13px; min-height: 54px; }
  .contact-method label { font-size: 13px; min-height: 34px; }
  .contact-method { margin-top: 28px; }
  .checkbox-label { font-size: 11px; line-height: 1.7; min-height: 44px; margin-top: 12px; }
  .form-demo-note { font-size: 10px; }
  .field-hint { font-size: 10px; }
  .form-success { min-height: 430px; }
  .form-success h3 { font-size: 38px; }
  .site-footer { padding: 45px 0px 105px; }
  .footer-top { display: block; padding-bottom: 26px; }
  .footer-top p { font-size: 11px; line-height: 1.8; margin-top: 20px; }
  .footer-nav { margin-top: 30px; gap: 4px 20px; font-size: 12px; }
  .footer-nav a { min-height: 44px; display: flex; align-items: center; }
  .footer-bottom { flex-wrap: wrap; justify-content: flex-start; gap: 5px 22px; font-size: 9px; padding-top: 20px; }
  .footer-bottom > span { width: 100%; margin-bottom: 5px; }
  .footer-bottom > a { min-height: 44px; display: flex; align-items: center; }
  .footer-fineprint { font-size: 9px; line-height: 1.8; margin-top: 15px; }
  .mobile-sticky { display: flex; align-items: center; gap: 18px; padding: 10px 20px max(10px,env(safe-area-inset-bottom)); background: rgba(255, 255, 255, 0.96); border-top: 1px solid rgb(211, 223, 213); backdrop-filter: blur(12px); position: fixed; bottom: 0px; left: 0px; right: 0px; z-index: 25; color: var(--ink); }
  .mobile-sticky > .button { min-height: 44px; padding: 11px 18px; font-size: 12px; flex: 1 1 0%; gap: 30px; }
  .mobile-sticky > a:last-child { font-size: 12px; display: flex; align-items: center; justify-content: center; gap: 7px; min-height: 44px; flex: 1 1 0%; }
  .mobile-sticky svg { width: 18px; height: 18px; }
  .cookie-banner { left: 12px; right: 12px; bottom: 80px; padding: 18px; border-radius: 9px; max-width: none; }
  .cookie-banner strong { font-size: 13px; }
  .cookie-banner p { font-size: 10px; line-height: 1.6; }
  .cookie-actions { gap: 8px; flex-wrap: wrap; margin-top: 15px; }
  .cookie-actions .button { min-height: 42px; font-size: 10px; padding: 10px 12px; flex: 1 1 0%; }
  .cookie-actions .text-link { font-size: 11px; min-height: 38px; }
  .blue-hero { padding-top: 30px; overflow: hidden; }
  .blue-hero-top { display: block; }
  .blue-hero-top .eyebrow { font-size: 8px; line-height: 1.7; max-width: 220px; }
  .hero-index { display: none; }
  .blue-hero h1 { font-size: clamp(42px, 8.7vw, 65px); line-height: 1.12; margin: 34px 0px 28px; letter-spacing: -0.06em; }
  .blue-title-last svg { bottom: -7px; height: 15px; }
  .blue-hero-bottom { display: flex; flex-wrap: wrap; gap: 25px; margin-bottom: 32px; }
  .blue-hero-bottom > p { font-size: 12px; flex: 1 1 auto; width: 100%; line-height: 1.8; }
  .blue-hero-bottom > p br { display: none; }
  .blue-hero .button-light { min-width: 0px; flex: 1 1 0%; min-height: 52px; font-size: 12px; padding: 15px 18px; gap: 18px; }
  .blue-scroll { height: 48px; width: 48px; font-size: 23px; }
  .payment-board { transform: none; margin: 0px -20px; padding: 23px 20px 20px; border: 0px; border-radius: 0px; }
  .board-label { font-size: 7px; line-height: 1.6; letter-spacing: 0.07em; gap: 15px; }
  .board-demo { font-size: 6px; white-space: nowrap; }
  .route-visual { padding: 28px 0px; gap: 10px; justify-content: space-between; }
  .route-endpoint { min-width: 0px; flex-direction: column; gap: 10px; width: 75px; text-align: center; }
  .route-symbol { height: 50px; width: 50px; font-size: 31px; }
  .route-endpoint small { display: none; }
  .route-endpoint strong { font-size: 15px; line-height: 1.3; }
  .route-hub { min-width: 64px; height: 64px; border-radius: 13px; font-size: 27px; margin-top: -26px; }
  .route-hub span { font-size: 7px; margin-top: 2px; }
  .route-track { margin-top: -26px; min-width: 15px; }
  .board-footer { display: block; padding-top: 14px; }
  .country-pills { gap: 8px; justify-content: center; }
  .country-pills button { font-size: 11px; min-height: 44px; padding: 10px 20px; }
  .board-footer > span { display: block; max-width: none; text-align: center; font-size: 8px; margin-top: 12px; }
  .blue .calculator-section { padding-top: 60px; }
  .blue .numbers { padding: 58px 0px; }
  .blue .numbers-layout { gap: 32px 20px; }
  .blue .number-item { border-top-color: rgba(255, 255, 255, 0.314); }
  .blue .number-item p { font-size: 12px; }
  .showcase-main { width: calc(100% - 40px); }
  .showcase-top { height: 90px; }
  .showcase-top > span { font-size: 7px; max-width: 130px; text-align: right; line-height: 1.7; }
  .showcase-intro { padding: 45px 0px 35px; }
  .showcase-intro .eyebrow { font-size: 8px; margin-bottom: 22px; }
  .showcase-intro h1 { font-size: 41px; }
  .showcase-intro p { font-size: 13px; margin-top: 24px; }
  .concepts { grid-template-columns: 1fr; gap: 26px; }
  .preview-meta { padding: 20px; }
  .preview-meta > span:first-child { font-size: 9px; }
  .mini-green, .mini-blue { height: 325px; padding: 25px 28px; }
  .mini-green h2 { font-size: 37px; }
  .mini-blue h2 { font-size: 33px; }
  .mini-green img { width: 105%; right: -60px; bottom: -20px; }
  .mini-route { left: 28px; right: 28px; bottom: 25px; padding: 15px 25px; }
  .preview-caption { padding: 26px 22px; }
  .preview-caption h2 { font-size: 23px; }
  .preview-caption p { font-size: 12px; }
  .preview-caption > span { font-size: 12px; }
  .showcase-footer { display: block; font-size: 9px; line-height: 1.8; padding: 30px 0px; }
  .showcase-footer > span { display: block; margin-bottom: 7px; }
  dialog { padding: 55px 25px 30px; }
  dialog h2 { font-size: 33px; }
  dialog .button { font-size: 12px; padding: 15px 18px; }
  dialog p { font-size: 13px; }
}
@media (max-width: 370px) {
  .container { width: calc(100% - 32px); }
  .green-hero h1 { font-size: 45px; }
  .green-hero .button-row { gap: 10px; }
  .green-hero .button-row .text-link { font-size: 9px; }
  .green-hero .button { font-size: 11px; gap: 15px; padding-inline: 15px; }
  .hero-proof { gap: 11px; font-size: 8px; }
  .green-art { height: 290px; }
  .car-art { top: 20px; }
  .hero-payment { bottom: 5px; }
  .audience-tabs { gap: 15px; }
  .audience-tabs button { font-size: 10px; }
  .contact-layout h2, .blue .contact-layout h2 { font-size: 37px; }
  .cookie-actions .button { font-size: 9px; padding-inline: 9px; }
  .board-demo { display: none; }
  .blue-hero h1 { font-size: 39px; }
  .demo-bar { padding-inline: 16px; }
  .mini-blue h2 { font-size: 29px; }
  .showcase-intro h1 { font-size: 36px; }
}
@media (prefers-reduced-motion: reduce) {
  :root { scroll-behavior: auto; }
  *, ::before, ::after { animation: auto ease 0s 1 normal none running none !important; transition: none !important; scroll-behavior: auto !important; }
  .reveal { opacity: 1; transform: none; }
  .geo-route, .blue-title-last svg { stroke-dashoffset: 0; }
  .route-particle { left: 50%; }
}
.preview-blue .mini-blue { background: rgb(245, 245, 240); color: rgb(23, 62, 144); }
.preview-blue .mini-blue h2 { font-size: 34px; position: relative; z-index: 2; }
.preview-blue .mini-blue h2 em { color: rgb(108, 134, 175); }
.mini-sculpture { position: absolute; width: 220px; max-width: none; right: -15px; bottom: -38px; background: rgb(23, 63, 229); border-radius: 50%; padding: 15px; }
.showcase-motion-link { margin-top: 28px; border: 1px solid rgba(255, 255, 255, 0.137); border-radius: 8px; }
.showcase-motion-link > a { display: flex; justify-content: space-between; gap: 25px; align-items: center; padding: 24px 26px; font-size: 13px; }
.showcase-motion-link span { font-size: 10px; color: rgb(158, 173, 160); }
.showcase-motion-link > a:hover { background: rgba(255, 255, 255, 0.02); }
@media (max-width: 960px) {
  .preview-blue .mini-blue h2 { font-size: 28px; }
  .mini-sculpture { width: 190px; right: -32px; bottom: -38px; }
}
@media (max-width: 700px) {
  .preview-blue .mini-blue h2 { font-size: 32px; }
  .mini-sculpture { width: 215px; right: -15px; bottom: -40px; }
  .showcase-motion-link > a { display: block; font-size: 12px; padding: 22px; }
  .showcase-motion-link span { display: block; font-size: 9px; margin-top: 12px; }
}
@media (max-width: 1200px) {
  .desktop-nav { display: none; }
  .menu-toggle { display: block; }
}
.nav-actions { gap: 18px; flex-shrink: 0; }
.nav-actions .nav-contact { display: inline-flex; align-items: center; justify-content: center; gap: 8px; width: auto; min-height: 44px; font-size: 11px; white-space: nowrap; }
.nav-contact svg { width: 21px; height: 21px; }
.nav-contact:hover { opacity: 0.75; }
.nav-actions .nav-calc > span { font-size: 12px; line-height: 1.4; }
.nav-actions .nav-calc-label-short { display: none; }
@media (max-width: 1360px) {
  .desktop-nav { display: none; }
  .menu-toggle { display: block; }
  .nav-actions { gap: 16px; }
}
@media (max-width: 700px) {
  .nav-inner { gap: 8px; }
  .nav-inner .wordmark { font-size: 20px; }
  .nav-inner .wordmark i { left: 37px; width: 40px; }
  .nav-actions { gap: 0px; }
  .nav-actions .nav-contact { width: 44px; height: 44px; min-width: 44px; }
  .nav-actions .nav-contact > span { display: none; }
  .nav-contact svg { width: 22px; height: 22px; }
  .nav-actions .menu-toggle { width: 44px; height: 44px; min-width: 44px; }
  .nav-actions .nav-calc { min-height: 44px; padding: 10px 13px; margin-right: 3px; }
  .nav-actions .nav-calc-label-full { display: none; }
  .nav-actions .nav-calc-label-short { display: inline; font-size: 11px; }
}
@media (max-width: 370px) {
  .nav-inner { gap: 6px; }
  .nav-inner .wordmark { font-size: 17px; }
  .nav-inner .wordmark i { left: 31px; width: 32px; }
  .nav-actions .nav-calc { padding-inline: 10px; margin-right: 0px; }
  .nav-actions .nav-calc-label-short { font-size: 10px; }
}