/* bundle-cga-v4.css: ChatGPT and AI Ads v4, all page styles in the original order (v3 bundle plus the mobile-menu styles that were inline), with rules for v1 and old AI Ads markup this page never uses removed. Loaded without blocking; the critical nav and hero rules are inlined in the page. */
.nav-inner { position: relative; }
.nav-links > .nav-dd.mx-on { position: static; }
.mx-panel { position: absolute; left: 0px; right: 0px; top: 100%; z-index: 120; opacity: 0; visibility: hidden; transform: translateY(-6px); transition: opacity 0.18s, transform 0.18s, visibility linear 0.18s; pointer-events: none; }
.nav-dd.mx-on:hover:not(.is-closed) .mx-panel, .nav-dd.mx-on:focus-within:not(.is-closed) .mx-panel, .nav-dd.mx-on.is-open .mx-panel { opacity: 1; visibility: visible; transform: none; pointer-events: auto; transition: opacity 0.18s, transform 0.18s, visibility; }
.nav-dd.mx-on:hover:not(.is-closed) > a .nav-dd-caret, .nav-dd.mx-on:focus-within:not(.is-closed) > a .nav-dd-caret { transform: rotate(180deg); }
.mx-in { display: grid; grid-template-columns: repeat(4, minmax(0px, 1fr)) minmax(220px, 264px); gap: 4px; padding: 12px; border: 1px solid var(--border-strong,#323944); border-radius: 14px; background: rgba(9, 13, 24, 0.97); backdrop-filter: blur(18px); box-shadow: rgba(0, 0, 0, 0.5) 0px 28px 70px; }
.mx-col { min-width: 0px; padding: 8px 4px; }
.mx-h { margin: 0px 8px 6px; padding: 2px 0px 10px; border-bottom: 1px solid var(--border-2,#232935); font: 500 11px/1.2 var(--font-mono,ui-monospace,monospace); letter-spacing: 0.12em; text-transform: uppercase; color: var(--fg-3,#8C98AB); }
.mx-col ul { list-style: none; margin: 0px; padding: 0px; display: flex; flex-direction: column; gap: 2px; }
.nav .mx-panel a.mx-it { display: flex; align-items: flex-start; gap: 11px; min-height: 44px; padding: 8px; border-radius: 8px; color: var(--fg-1); text-decoration: none; white-space: normal; font-size: inherit; box-shadow: none !important; }
.nav .mx-panel a.mx-it:hover, .nav .mx-panel a.mx-it:focus-visible { background: rgba(127, 140, 160, 0.12); padding-bottom: 8px; }
.nav .mx-panel a.mx-it:focus-visible { outline: 2px solid var(--signal); outline-offset: -2px; }
.mx-ico { width: 32px; height: 32px; flex: 0 0 auto; display: grid; place-items: center; border: 1px solid var(--border-2,#232935); border-radius: 8px; background: rgba(58, 160, 210, 0.08); color: var(--signal); transition: border-color 0.18s, background 0.18s; }
.mx-ico svg { width: 17px; height: 17px; }
.mx-it:hover .mx-ico { border-color: var(--signal); background: rgba(58, 160, 210, 0.16); }
.mx-tx { display: flex; flex-direction: column; gap: 3px; min-width: 0px; }
.mx-tx b { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; font: 600 13.5px/1.25 var(--font-sans); color: var(--fg-1); letter-spacing: -0.005em; }
.mx-tx small { font: 400 12px/1.35 var(--font-sans); color: var(--fg-3); }
.mx-it[aria-current="page"] b { color: var(--signal); }
.mx-new { font-variant-ligatures: ; font-variant-caps: ; font-variant-numeric: ; font-variant-east-asian: ; font-variant-alternates: ; font-variant-position: ; font-variant-emoji: ; font-weight: ; font-stretch: ; font-size: ; line-height: ; font-family: ; font-optical-sizing: ; font-size-adjust: ; font-kerning: ; font-feature-settings: ; font-variation-settings: ; font-language-override: ; font-style: normal; letter-spacing: 0.08em; text-transform: uppercase; color: rgb(5, 19, 29); background: var(--brand-sun,#F5B83D); padding: 3px 5px; border-radius: 4px; }
.mx-feat { display: flex; flex-direction: column; gap: 12px; margin: 4px; padding: 18px; border: 1px solid var(--border-2,#232935); border-radius: 10px; background: linear-gradient(rgba(58, 160, 210, 0.12), rgba(58, 160, 210, 0.02) 70%); }
.mx-feat .mx-h { margin: 0px; border: 0px; padding: 0px; }
.mx-feat h3 { margin: 0px; font: 800 19px/1.08 var(--font-display); letter-spacing: -0.025em; text-transform: uppercase; color: var(--fg-1); }
.mx-feat p { margin: 0px; font-size: 13px; line-height: 1.5; color: var(--fg-2); }
.mx-cap { display: inline-flex; align-items: center; gap: 8px; align-self: flex-start; padding: 6px 10px; border: 1px solid var(--border-strong); border-radius: 999px; font: 500 11.5px/1.3 var(--font-mono,monospace); color: var(--fg-1); }
.mx-cap i { width: 7px; height: 7px; flex: 0 0 auto; border-radius: 50%; background: rgb(61, 220, 151); box-shadow: rgba(61, 220, 151, 0.18) 0px 0px 0px 3px; }
.nav .mx-panel a.mx-book { display: flex; align-items: center; justify-content: center; gap: 8px; min-height: 44px; margin-top: auto; padding: 12px 14px; border-radius: var(--radius-sm,8px); background: var(--signal); color: rgb(5, 19, 29); font-weight: 600; font-size: 13.5px; text-decoration: none; box-shadow: none !important; }
.nav .mx-panel a.mx-book:hover { background: var(--blue-300,#7FC4EA); padding-bottom: 12px; }
.nav .mx-panel a.mx-book svg, .mx-sheet .mx-book svg { width: 14px; height: 14px; }
.nav .mx-panel a.mx-all { display: inline-flex; align-items: center; min-height: 36px; font-size: 13px; color: var(--fg-2); padding: 0px; box-shadow: none !important; }
.nav .mx-panel a.mx-all:hover { color: var(--fg-1); padding-bottom: 0px; }
@media (max-width: 1280px){
.mx-in { grid-template-columns: repeat(4, minmax(0px, 1fr)) 210px; }
.mx-tx small { font-size: 11.5px; }
.mx-feat { padding: 14px; }
}
[data-theme="light"] .mx-in { background: rgba(250, 252, 254, 0.98); box-shadow: rgba(12, 20, 36, 0.16) 0px 28px 70px; }
.mx-sheet { position: fixed; inset: 0px; z-index: 400; display: flex; flex-direction: column; background: rgba(7, 9, 13, 0.984); backdrop-filter: blur(16px); color: var(--fg-1); font-family: var(--font-sans); }
.mx-sheet[hidden] { display: none; }
.mx-sh-top { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 10px clamp(16px, 5vw, 28px); border-bottom: 1px solid var(--border-2); }
.mx-sh-top img { height: 52px; width: auto; display: block; }
.mx-x { width: 44px; height: 44px; display: grid; place-items: center; border: 1px solid var(--border-strong); border-radius: var(--radius-sm,8px); background: transparent; color: var(--fg-1); cursor: pointer; }
.mx-x svg { width: 18px; height: 18px; }
.mx-sh-body { flex: 1 1 0%; overflow-y: auto; overscroll-behavior: contain; width: 100%; max-width: 640px; margin: 0px auto; padding: 16px clamp(16px, 5vw, 28px) 20px; display: flex; flex-direction: column; gap: 16px; }
.mx-seg { display: grid; grid-template-columns: repeat(4, minmax(0px, 1fr)); gap: 4px; padding: 4px; border: 1px solid var(--border-strong); border-radius: 12px; background: rgba(255, 255, 255, 0.02); }
.mx-seg button { min-height: 44px; padding: 0px 4px; border: 0px; border-radius: 8px; background: transparent; color: var(--fg-2); font: 600 13px/1 var(--font-sans); cursor: pointer; transition: background 0.18s, color 0.18s; }
.mx-seg button[aria-selected="true"] { background: var(--signal); color: rgb(5, 19, 29); }
.mx-seg button:focus-visible { outline: 2px solid var(--signal); outline-offset: 2px; }
.mx-grid { display: grid; grid-template-columns: repeat(2, minmax(0px, 1fr)); gap: 8px; }
.mx-tile { display: flex; flex-direction: column; justify-content: space-between; gap: 10px; min-height: 84px; padding: 12px; border: 1px solid var(--border-2); border-radius: 10px; background: rgba(255, 255, 255, 0.024); color: var(--fg-1); text-decoration: none; font: 600 13.5px/1.25 var(--font-sans); animation-duration: 0.32s; animation-timing-function: cubic-bezier(0.2, 0.8, 0.2, 1); animation-iteration-count: 1; animation-direction: normal; animation-fill-mode: both; animation-play-state: running; animation-name: mxIn; animation-timeline: auto; animation-range: normal; animation-delay: calc(var(--i,0) * 35ms); }
.mx-tile .mx-ico { width: 30px; height: 30px; }
.mx-tile span.mx-nm { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; }
.mx-tile[aria-current="page"] { border-color: var(--signal); }
.mx-tile:active { background: rgba(58, 160, 210, 0.12); }
@keyframes mxIn { 
  0% { opacity: 0; transform: translateY(8px); }
  100% { opacity: 1; transform: none; }
}
.mx-sheet a.mx-all { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; align-self: flex-start; color: var(--fg-2); font-size: 14px; text-decoration: none; }
.mx-sheet a.mx-all svg { width: 14px; height: 14px; }
.mx-chips { display: flex; flex-wrap: wrap; gap: 8px; }
.mx-chips a { display: inline-flex; align-items: center; min-height: 44px; padding: 0px 18px; border: 1px solid var(--border-strong); border-radius: 999px; color: var(--fg-1); text-decoration: none; font: 500 14px/1 var(--font-sans); }
.mx-chips a[aria-current="page"] { border-color: var(--signal); color: var(--signal); }
.mx-util { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; padding-top: 4px; }
.mx-langs { display: flex; border: 1px solid var(--border-strong); border-radius: var(--radius-sm,8px); overflow: hidden; }
.mx-langs button { min-width: 52px; min-height: 44px; border-top: 0px; border-bottom: 0px; border-left: 0px; border-image: none; border-right: 1px solid var(--border-strong); background: transparent; color: var(--fg-3); font: 500 12px/1 var(--font-mono,monospace); letter-spacing: 0.1em; cursor: pointer; }
.mx-langs button:last-child { border-right: 0px; }
.mx-langs button.is-on { background: rgba(58, 160, 210, 0.14); color: var(--signal); }
.mx-theme { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; padding: 0px 14px; border: 1px solid var(--border-strong); border-radius: var(--radius-sm,8px); background: transparent; color: var(--fg-1); font: 500 14px/1 var(--font-sans); cursor: pointer; }
.mx-theme svg { width: 16px; height: 16px; }
.mx-sh-foot { display: flex; gap: 8px; width: 100%; max-width: 640px; margin: 0px auto; padding: 12px clamp(16px,5vw,28px) calc(12px + env(safe-area-inset-bottom)); border-top: 1px solid var(--border-2); }
.mx-sheet a.mx-book { flex: 1 1 0%; display: flex; align-items: center; justify-content: center; gap: 8px; min-height: 52px; border-radius: 10px; background: var(--signal); color: rgb(5, 19, 29); font: 600 15px/1 var(--font-sans); text-decoration: none; }
.mx-sheet a.mx-wa { width: 52px; min-height: 52px; flex: 0 0 auto; display: grid; place-items: center; border: 1px solid var(--border-strong); border-radius: 10px; color: var(--fg-1); }
.mx-sheet a.mx-wa svg { width: 20px; height: 20px; }
[data-theme="light"] .mx-sheet { background: rgba(250, 252, 254, 0.99); }
[data-theme="light"] .mx-tile, [data-theme="light"] .mx-seg { background: rgb(255, 255, 255); }
@media (prefers-reduced-motion: reduce){
.mx-panel, .mx-tile, .mx-seg button { transition: none !important; animation: auto ease 0s 1 normal none running none !important; }
}
.nav-links .nav-ind { display: inline-flex; align-items: center; gap: 6px; padding: 0px; border: 0px; background: none; color: var(--fg-2); font: 500 14px/inherit var(--font-sans); cursor: pointer; transition: color var(--dur-base,.2s) var(--ease-out,ease); }
.nav-links .nav-ind:hover, .nav-links .nav-ind.is-active { color: var(--fg-1); box-shadow: inset 0 -2px 0 var(--brand-sun); padding-bottom: 2px; }
.nav-links .nav-ind.is-active { color: var(--signal); }
.nav-links .nav-ind:focus-visible { outline: 2px solid var(--signal); outline-offset: 4px; border-radius: 4px; }
.nav-ind .nav-dd-caret { width: 10px; height: 10px; transition: transform 0.18s; }
.nav-dd.mx6:hover:not(.is-closed) > .nav-ind .nav-dd-caret, .nav-dd.mx6:focus-within:not(.is-closed) > .nav-ind .nav-dd-caret { transform: rotate(180deg); }
.nav-dd.mx6 .mx-in.mx-in--svc { grid-template-columns: repeat(3, minmax(0px, 1fr)) minmax(240px, 280px); }
.nav-dd.mx6 .mx-in.mx-in--ind { grid-template-columns: minmax(0px, 1.35fr) minmax(260px, 1fr); max-width: 860px; }
.nav-dd.mx6 .mx-in--ind .mx-col ul { gap: 4px; }
.nav-dd.mx6 .mx-in--ind a.mx-it { padding: 12px 10px; }
.nav-dd.mx6 .mx-in--ind .mx-tx b { font-size: 14.5px; }
.nav-dd.mx6 .mx-in--ind .mx-tx small { font-size: 12.5px; }
.nav-dd.mx6 .mx-feat--ind { background: linear-gradient(rgba(245, 184, 61, 0.12), rgba(245, 184, 61, 0.02) 70%); }
@media (max-width: 1280px){
.nav-dd.mx6 .mx-in.mx-in--svc { grid-template-columns: repeat(3, minmax(0px, 1fr)) 220px; }
}
.mx6-sheet .mx6-lbls { display: grid; grid-template-columns: 3fr 1fr; gap: 12px; margin: 0px 0px -8px; padding: 0px 6px; font: 500 11px/1 var(--font-mono,monospace); letter-spacing: 0.12em; text-transform: uppercase; color: var(--fg-3); }
.mx6-sheet .mx6-lbls span + span { text-align: center; }
.mx6-sheet .mx-seg.mx6-seg { grid-template-columns: repeat(3, minmax(0px, 1fr)) 1px minmax(0px, 1.15fr); }
.mx6-sheet .mx6-seg button.is-ind { grid-column: 5; position: relative; }
.mx6-sheet .mx6-seg::after { content: ""; grid-area: 1 / 4; align-self: stretch; margin: 6px 0px; background: var(--border-strong); }
.mx6-sheet .mx-grid.is-ind { grid-template-columns: 1fr; }
.mx6-sheet .mx-tile--wide { flex-direction: row; align-items: center; justify-content: flex-start; gap: 14px; min-height: 72px; }
.mx6-sheet .mx-tile--wide .mx-nm { flex-direction: column; align-items: flex-start; gap: 4px; }
.mx6-sheet .mx-tile--wide small { font: 400 12.5px/1.35 var(--font-sans); color: var(--fg-3); }
.nav-dd.mx6 .mx-in.mx-in--agn { grid-template-columns: minmax(0px, 1fr) minmax(260px, 300px); max-width: 980px; margin-left: auto; }
.mx-agn-grid { grid-template-columns: repeat(2, minmax(0px, 1fr)); display: grid !important; gap: 4px 8px !important; }
.nav-dd.mx6 .mx-in--agn a.mx-it { padding: 11px 10px; }
.nav-dd.mx6 .mx-feat--agn { background: linear-gradient(rgba(255, 92, 122, 0.13), rgba(255, 92, 122, 0.02) 70%); }
.nav .mx-panel a.mx-all.mx-tel { min-height: 30px; margin-top: -6px; font-family: var(--font-mono,monospace); font-size: 12px; color: var(--fg-3); }
@media (min-width: 1081px) and (max-width: 1460px){
.nav-tools .ck-phone .num { display: none !important; }
.nav-tools .ck-phone { width: auto !important; padding-left: 4px !important; padding-right: 4px !important; }
}
@media (min-width: 1361px) and (max-width: 1460px){
.nav-inner { gap: 20px !important; }
.nav-links { gap: 18px !important; }
.nav-links a, .nav-links .nav-ind { font-size: 13.5px !important; }
.nav-auth span { display: none !important; }
.nav-logo .logo-img { height: 76px !important; }
}
@media (min-width: 1081px) and (max-width: 1360px){
.nav-inner { gap: 16px !important; }
.nav-links { gap: 15px !important; }
.nav-links a, .nav-links .nav-ind { font-size: 13px !important; }
.nav .nav-cta { display: none !important; }
.nav-auth span { display: none !important; }
.nav-tools .lang-switch { display: none !important; }
.nav-logo .logo-img { height: 64px !important; }
.nav-links > li:first-child { display: none !important; }
}
@media (min-width: 1081px) and (max-width: 1220px){
.nav-links { gap: 12px !important; }
.nav-links a, .nav-links .nav-ind { font-size: 12.5px !important; }
.nav-logo .logo-img { height: 56px !important; }
.nav-tools .nav-auth { display: none !important; }
}
.mx7-sheet, .mx6-sheet .mx-seg.mx7-seg { grid-template-columns: repeat(3, minmax(0px, 1fr)) 1px minmax(0px, 1.15fr) minmax(0px, 1.05fr); }
.mx6-sheet .mx7-seg button { font-size: 12.5px; padding: 0px 2px; }
.mx6-sheet .mx7-seg button.is-agn { grid-column: 6; }
.mx6-sheet .mx6-lbls.mx7-lbls { grid-template-columns: repeat(3, minmax(0px, 1fr)) 1px minmax(0px, 1.15fr) minmax(0px, 1.05fr); gap: 4px; padding: 0px 4px; }
.mx6-sheet .mx7-lbls span:first-child { grid-column: 1 / 4; }
.mx6-sheet .mx7-lbls span:nth-child(2) { grid-column: 5; text-align: center; }
.mx6-sheet .mx7-lbls span:nth-child(3) { grid-column: 6; text-align: center; }
.mx6-sheet .mx7-seg button.is-agn[aria-selected="true"] { background: rgb(255, 92, 122); color: rgb(26, 6, 16); }
a[href*="Sign In"], a[href*="Sign%20In"], a[aria-label="Sign in"] { display: none !important; }
.lang-switch { overflow: visible; }
.lang-switch button { position: relative; }
.lang-switch button:first-child { border-radius: var(--radius-sm,8px) 0 0 var(--radius-sm,8px); }
.lang-switch button:last-child { border-radius: 0 var(--radius-sm,8px) var(--radius-sm,8px) 0; }
.theme-toggle, .nav-auth, .nav-burger, .nav-tools .ck-phone { position: relative; }
.lang-switch button::after, .theme-toggle::after, .nav-auth::after, .nav-burger::after, .nav-tools .ck-phone::after { content: ""; position: absolute; left: 50%; top: 50%; width: max(100%, 44px); height: max(100%, 44px); transform: translate(-50%, -50%); }
.mx-panel { opacity: 0; visibility: hidden; }
.mx-sheet[hidden] { display: none; }
.nav-links a.nav-hot { position: relative; }
.sh-hot { position: relative; display: inline-block; width: 8px; height: 11px; margin-left: 3px; vertical-align: super; line-height: 0; pointer-events: none; }
.nav-hot > .sh-hot { position: absolute; top: -6px; left: calc(100% + 1px); margin: 0px; vertical-align: baseline; }
.sh-hot svg { position: absolute; display: block; overflow: visible; }
.sh-flame { left: 0px; top: 0px; width: 8px; height: 11px; filter: drop-shadow(rgba(252, 185, 19, 0.55) 0px 0px 4px); transform-origin: 50% 100%; animation: 1.6s ease-in-out 0s infinite normal none running shFlick; }
.sh-spark { left: 7px; top: -3px; width: 5px; height: 5px; opacity: 0; transform-origin: 50% 50%; animation: 2.8s ease-in-out 0.4s infinite normal none running shTwink; }
.mx-tile .sh-hot, .mx-it .sh-hot { width: 7px; height: 10px; margin-left: 5px; vertical-align: 2px; }
.mx-tile .sh-flame, .mx-it .sh-flame { width: 7px; height: 10px; }
.nav-sr { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0px; overflow: hidden; clip: rect(0px, 0px, 0px, 0px); white-space: nowrap; border: 0px; }
@keyframes shFlick { 
  0%, 100% { transform: scale(0.95); }
  50% { transform: scale(1.05); }
}
@keyframes shTwink { 
  0%, 55%, 100% { opacity: 0; transform: scale(0.4) rotate(0deg); }
  70% { opacity: 1; transform: scale(1) rotate(45deg); }
  85% { opacity: 0; transform: scale(0.5) rotate(90deg); }
}
@media (prefers-reduced-motion: reduce){
.sh-flame { animation: auto ease 0s 1 normal none running none; }
.sh-spark { display: none; }
}
:root { --brand-lochmara: #0080C3; --brand-lochmara-dark: #016095; --brand-green-haze: #00A551; --brand-green-dark: #007E3B; --brand-sun: #FCB913; --brand-sun-dark: #B8890D; --blue-50: #EBF6FC; --blue-100: #D2EAF6; --blue-200: #A6D5ED; --blue-300: #6FBBE0; --blue-400: #3AA0D2; --blue-500: #0080C3; --blue-600: #016095; --blue-700: #064A74; --blue-800: #0A3955; --blue-900: #0B2838; --blue-950: #071A27; --ink-0: #FFFFFF; --ink-50: #F7F8FA; --ink-100: #EEF0F3; --ink-200: #DDE1E7; --ink-300: #C2C8D1; --ink-400: #8E95A1; --ink-500: #6B7280; --ink-600: #4A5260; --ink-700: #323944; --ink-800: #1F242C; --ink-900: #12151B; --ink-950: #0A0C11; --success: #00A551; --warning: #FCB913; --danger: #D64545; --info: #0080C3; --bg: var(--ink-0); --bg-subtle: var(--ink-50); --bg-muted: var(--ink-100); --bg-inverse: var(--ink-950); --surface: var(--ink-0); --surface-raised: var(--ink-0); --surface-sunken: var(--ink-50); --fg-1: var(--ink-950); --fg-2: var(--ink-700); --fg-3: var(--ink-500); --fg-4: var(--ink-400); --fg-inverse: var(--ink-0); --dim: #74839D; --border-1: var(--ink-200); --border-2: var(--ink-100); --border-strong: var(--ink-300); --border-focus: var(--blue-500); --accent: var(--blue-500); --accent-hover: var(--blue-600); --accent-press: var(--blue-700); --accent-soft: var(--blue-50); --accent-fg: var(--ink-0); --font-display: "Satoshi", ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif; --font-sans: "Instrument Sans", ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif; --structural: var(--brand-sun); --verified: var(--brand-green-haze); --font-mono: "JetBrains Mono", "IBM Plex Mono", ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; --fs-xs: 12px; --fs-sm: 13px; --fs-base: 15px; --fs-md: 17px; --fs-lg: 20px; --fs-xl: 24px; --fs-2xl: 32px; --fs-3xl: 44px; --fs-4xl: 60px; --fs-5xl: 80px; --fs-6xl: 112px; --lh-tight: 1.05; --lh-snug: 1.2; --lh-normal: 1.45; --lh-relaxed: 1.6; --fw-regular: 400; --fw-medium: 500; --fw-semibold: 600; --fw-bold: 700; --tracking-tight: -0.02em; --tracking-tighter: -0.035em; --tracking-normal: 0; --tracking-wide: 0.06em; --tracking-caps: 0.12em; --space-0: 0; --space-1: 4px; --space-2: 8px; --space-3: 12px; --space-4: 16px; --space-5: 20px; --space-6: 24px; --space-8: 32px; --space-10: 40px; --space-12: 48px; --space-16: 64px; --space-20: 80px; --space-24: 96px; --space-32: 128px; --radius-xs: 2px; --radius-sm: 4px; --radius-md: 6px; --radius-lg: 10px; --radius-xl: 14px; --radius-2xl: 20px; --radius-full: 9999px; --shadow-xs: 0 1px 2px rgba(10, 12, 17, 0.04); --shadow-sm: 0 1px 2px rgba(10, 12, 17, 0.06), 0 1px 3px rgba(10, 12, 17, 0.04); --shadow-md: 0 4px 8px -2px rgba(10, 12, 17, 0.06), 0 2px 4px -2px rgba(10, 12, 17, 0.04); --shadow-lg: 0 12px 24px -8px rgba(10, 12, 17, 0.10), 0 4px 8px -4px rgba(10, 12, 17, 0.06); --shadow-xl: 0 24px 48px -12px rgba(10, 12, 17, 0.18); --ring-focus: 0 0 0 3px rgba(0, 128, 195, 0.28); --inset-line: inset 0 0 0 1px rgba(10, 12, 17, 0.06); --ease-out: cubic-bezier(0.16, 1, 0.3, 1); --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1); --ease-standard: cubic-bezier(0.2, 0, 0, 1); --dur-fast: 120ms; --dur-base: 200ms; --dur-slow: 360ms; --container-max: 1280px; --container-pad: clamp(20px, 4vw, 48px); --grid-gutter: 24px; }
[data-theme="dark"], .theme-dark { --bg: var(--ink-950); --bg-subtle: #0D1017; --bg-muted: #141821; --bg-inverse: var(--ink-0); --surface: #0F131A; --surface-raised: #161B24; --surface-sunken: #0A0C11; --fg-1: #F2F4F7; --fg-2: #BCC3CF; --fg-3: #8C94A2; --fg-4: #5D6471; --fg-inverse: var(--ink-950); --border-1: #232935; --border-2: #1A1F28; --border-strong: #323944; --border-focus: var(--blue-400); --accent: var(--blue-400); --accent-hover: var(--blue-300); --accent-press: var(--blue-500); --accent-soft: rgba(58, 160, 210, 0.12); --accent-fg: var(--ink-950); --shadow-xs: 0 1px 2px rgba(0, 0, 0, 0.5); --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.5), 0 1px 3px rgba(0, 0, 0, 0.35); --shadow-md: 0 4px 8px -2px rgba(0, 0, 0, 0.55), 0 2px 4px -2px rgba(0, 0, 0, 0.4); --shadow-lg: 0 12px 24px -8px rgba(0, 0, 0, 0.6), 0 4px 8px -4px rgba(0, 0, 0, 0.4); --shadow-xl: 0 24px 48px -12px rgba(0, 0, 0, 0.7); --ring-focus: 0 0 0 3px rgba(58, 160, 210, 0.32); --inset-line: inset 0 0 0 1px rgba(255, 255, 255, 0.04); }
.t-mono { font-family: var(--font-mono); font-size: var(--fs-sm); color: var(--fg-2); }
html { -webkit-font-smoothing: antialiased; text-rendering: optimizelegibility; }
body { font-family: var(--font-sans); font-size: var(--fs-base); line-height: var(--lh-normal); color: var(--fg-1); background: var(--bg); }
h1 { font: 500 var(--fs-4xl)/1.02 var(--font-display); letter-spacing: var(--tracking-tight); color: var(--fg-1); }
h2 { font: 500 var(--fs-3xl)/1.06 var(--font-display); letter-spacing: var(--tracking-tight); color: var(--fg-1); }
h3 { font: 600 var(--fs-2xl)/1.15 var(--font-display); letter-spacing: var(--tracking-tight); color: var(--fg-1); }
h4 { font: 600 var(--fs-xl)/1.2  var(--font-display); color: var(--fg-1); }
h5 { font: 600 var(--fs-lg)/1.25 var(--font-sans); color: var(--fg-1); }
h6 { font: 600 var(--fs-md)/1.3  var(--font-sans); color: var(--fg-1); }
p { color: var(--fg-2); line-height: var(--lh-normal); }
a { color: var(--accent); text-decoration: none; text-underline-offset: 3px; }
a:hover { text-decoration: underline; }
code, pre { font-family: var(--font-mono); }
pre { background: var(--bg-muted); padding: var(--space-4); border-radius: var(--radius-md); border: 1px solid var(--border-1); overflow-x: auto; }
hr { border-right: 0px; border-bottom: 0px; border-left: 0px; border-image: none; border-top: 1px solid var(--border-1); }
::selection { background: var(--blue-500); color: white; }
:root { --ck-sig: var(--signal,#3AA0D2); --ck-sig-hover: var(--blue-300,#6FBBE0); --ck-on: #05131D; --ck-err: #FF9A8F; --ck-panel: color-mix(in srgb,var(--surface) 72%,transparent); --ck-panel-solid: var(--surface-raised); }
[data-theme="light"] { --ck-sig: #016095; --ck-sig-hover: #064A74; --ck-on: #FFFFFF; --ck-err: #B42318; --ck-panel: color-mix(in srgb,var(--surface) 88%,transparent); }
[data-ck] [hidden], .ck-overlay [hidden], .ck-demo [hidden] { display: none !important; }
.ck-sr { width: 1px; height: 1px; padding: 0px; margin: -1px; overflow: hidden; clip: rect(0px, 0px, 0px, 0px); white-space: nowrap; border: 0px; position: absolute !important; }
.ck-hp { left: -9999px; width: 1px; height: 1px; overflow: hidden; position: absolute !important; }
.ck-eyebrow { font-family: var(--font-mono); font-size: 11px; text-transform: uppercase; letter-spacing: var(--tracking-caps); color: var(--fg-3); display: inline-flex; align-items: center; gap: 10px; margin: 0px; }
.ck-eyebrow::before { content: ""; width: 24px; height: 1px; background: currentcolor; }
.ck-eyebrow--sig { color: var(--ck-sig); }
.ck-h2 { font-family: var(--font-display); font-weight: 800; font-size: clamp(32px, 4.6vw, 64px); line-height: 0.98; letter-spacing: -0.035em; text-transform: uppercase; color: var(--fg-1); margin: 0px; text-wrap: balance; }
.ck-lede { color: var(--fg-2); font-size: clamp(15px, 1.2vw, 17px); line-height: 1.6; max-width: 56ch; margin: 0px; text-wrap: pretty; }
.ck :focus-visible, .ck-btn:focus-visible, .ck-phone:focus-visible, .ck-mbar a:focus-visible, .ck-chip:has(input:focus-visible), .ck-demo button:focus-visible { outline: 2px solid var(--ck-sig); outline-offset: 3px; }
.ck-btn { display: inline-flex; align-items: center; justify-content: center; gap: 10px; min-height: 48px; padding: 14px 22px; border-radius: var(--radius-sm); border: 1px solid transparent; font-family: var(--font-sans); font-size: 14px; font-weight: 600; line-height: 1.2; text-decoration: none; cursor: pointer; transition: background var(--dur-base) var(--ease-out),border-color var(--dur-base) var(--ease-out),color var(--dur-base) var(--ease-out); text-align: center; }
body[style*="cursor: none"] .ck-btn, body.ck-nocursor .ck-btn { cursor: none; }
.ck-btn:hover { text-decoration: none; }
.ck-btn--primary { background: var(--ck-sig); border-color: var(--ck-sig); color: var(--ck-on); }
.ck-btn--primary:hover { background: var(--ck-sig-hover); border-color: var(--ck-sig-hover); color: var(--ck-on); }
.ck-btn--ghost { background: transparent; border-color: var(--border-strong); color: var(--fg-1); }
.ck-btn--ghost:hover { border-color: var(--fg-1); color: var(--fg-1); }
.ck-btn--link { background: none; border: 0px; padding: 12px 2px; color: var(--ck-sig); text-decoration: underline; text-underline-offset: 4px; min-height: 44px; font-weight: 500; }
.ck-btn--link:hover { color: var(--fg-1); }
.ck-btn[disabled] { opacity: 0.7; cursor: progress; }
.ck-btn svg { width: 16px; height: 16px; flex: 0 0 auto; }
.ck-wa-ico { width: 18px; height: 18px; flex: 0 0 auto; background: currentcolor; mask: url("/assets/si/whatsapp.svg") center center / contain no-repeat; }
.ck-spin { width: 16px; height: 16px; border-radius: 50%; border-width: 2px; border-style: solid; border-color: currentcolor transparent currentcolor currentcolor; border-image: none; animation: 0.8s linear 0s infinite normal none running ckspin; flex: 0 0 auto; }
@keyframes ckspin { 
  100% { transform: rotate(360deg); }
}
.ck-ctas { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; }
.ck-under { display: flex; flex-direction: column; align-items: flex-start; gap: 10px; margin-top: 18px; min-width: 0px; }
.ck-capacity { display: inline-flex; align-items: center; gap: 9px; height: 36px; margin: 0px; padding: 0px 16px 0px 13px; border-radius: 999px; border: 1px solid rgba(255, 255, 255, 0.08); background: rgba(10, 14, 26, 0.55); backdrop-filter: blur(12px) saturate(1.2); font-family: var(--font-sans); font-size: 13.5px; font-weight: 500; line-height: 1; color: rgb(238, 242, 248); white-space: nowrap; }
.ck-cap-dot { position: relative; width: 7px; height: 7px; border-radius: 50%; background: rgb(45, 212, 191); flex: 0 0 auto; }
.ck-cap-dot::after { content: ""; position: absolute; inset: 0px; border-radius: 50%; background: rgb(45, 212, 191); opacity: 0.55; animation: 2.4s ease-out 0s infinite normal none running ckpulse; }
@keyframes ckpulse { 
  0% { transform: scale(1); opacity: 0.55; }
  70%, 100% { transform: scale(2.6); opacity: 0; }
}
.ck-cap-note { margin: 0px; font-family: var(--font-sans); font-size: 14px; line-height: 1.45; color: rgba(255, 255, 255, 0.72); text-wrap: pretty; text-shadow: rgba(5, 7, 11, 0.55) 0px 1px 2px; }
.ck-trust-wrap { overflow: hidden; max-width: 100%; }
.ck-trust { list-style: none; margin: 0px 0px 0px -11px; padding: 0px; display: flex; flex-wrap: wrap; row-gap: 6px; font-family: var(--font-sans); font-size: 13px; line-height: 1.3; color: rgba(255, 255, 255, 0.78); text-shadow: rgba(5, 7, 11, 0.55) 0px 1px 2px; }
.ck-trust li { display: inline-flex; align-items: center; gap: 6px; padding: 0px 10px; border-left: 1px solid rgba(255, 255, 255, 0.22); white-space: nowrap; }
.ck-tick { width: 13px; height: 13px; flex: 0 0 auto; color: rgb(45, 212, 191); }
[data-theme="light"] .ck-capacity { background: rgba(255, 255, 255, 0.78); border-color: rgba(10, 14, 26, 0.1); color: var(--fg-1); }
[data-theme="light"] .ck-cap-note { color: var(--fg-2); text-shadow: none; }
[data-theme="light"] .ck-trust { color: var(--fg-2); text-shadow: none; }
[data-theme="light"] .ck-trust li { border-left-color: var(--border-strong); }
[data-theme="light"] .ck-tick { color: rgb(15, 143, 128); }
.ck-final .ck-cap-note, .ck-aside .ck-cap-note { color: var(--fg-2); text-shadow: none; }
.ck-final .ck-trust, .ck-aside .ck-trust { color: var(--fg-2); text-shadow: none; }
.ck-final .ck-capacity, .ck-aside .ck-capacity { background: color-mix(in srgb,var(--surface) 70%,transparent); border-color: var(--border-1); color: var(--fg-1); }
.hero .ck-under, .ck-on-photo .ck-under { position: relative; isolation: isolate; }
.hero .ck-under::before, .ck-on-photo .ck-under::before { content: ""; position: absolute; inset: -44px -56px -44px -52px; z-index: -1; background: rgba(5, 7, 11, 0.8); filter: blur(22px); border-radius: 48px; pointer-events: none; }
[data-theme="light"] .hero .ck-under::before, [data-theme="light"] .ck-on-photo .ck-under::before { background: rgba(255, 255, 255, 0.84); }
@media (prefers-reduced-motion: reduce){
.ck-cap-dot::after { animation: auto ease 0s 1 normal none running none; opacity: 0; }
}
.ck-panel { border: 1px solid var(--border-1); background: var(--ck-panel); backdrop-filter: blur(14px) saturate(1.2); border-radius: var(--radius-md); padding: clamp(20px, 2.6vw, 32px); }
.ck-deliver h2, .ck-deliver h3 { font-family: var(--font-display); font-weight: 700; font-size: clamp(20px, 1.8vw, 24px); letter-spacing: -0.02em; line-height: 1.15; color: var(--fg-1); margin: 0px 0px 18px; }
.ck-deliver ol { list-style: none; margin: 0px; padding: 0px; display: flex; flex-direction: column; gap: 14px; counter-reset: ckd 0; }
.ck-deliver li { counter-increment: ckd 1; display: grid; grid-template-columns: 28px minmax(0px, 1fr); gap: 12px; color: var(--fg-2); font-size: 15px; line-height: 1.55; }
.ck-deliver li::before { content: counter(ckd, decimal-leading-zero); font-family: var(--font-mono); font-size: 11px; color: var(--ck-sig); padding-top: 4px; }
.ck-deliver li b { color: var(--fg-1); font-weight: 600; }
.ck-deliver-foot { margin: 20px 0px 0px; padding-top: 16px; border-top: 1px dashed var(--border-1); font-family: var(--font-mono); font-size: 11px; letter-spacing: 0.06em; text-transform: uppercase; color: var(--fg-3); }
.ck-form { display: flex; flex-direction: column; gap: 18px; }
.ck-row { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 220px), 1fr)); gap: 16px; align-items: start; }
.ck-field { display: flex; flex-direction: column; gap: 8px; min-width: 0px; }
.ck-field > label, .ck-label { font-size: 14px; font-weight: 600; color: var(--fg-1); }
.ck-label .opt, .ck-field > label .opt { font-weight: 400; color: var(--fg-3); }
.ck-input { width: 100%; min-height: 48px; padding: 12px 14px; border: 1px solid var(--border-strong); border-radius: var(--radius-sm); background: var(--surface-sunken); color: var(--fg-1); font-family: var(--font-sans); font-size: 16px; line-height: 1.4; }
textarea.ck-input { min-height: 96px; resize: vertical; }
.ck-input:focus { outline: none; border-color: var(--ck-sig); box-shadow: var(--ring-focus); }
.ck-input[aria-invalid="true"] { border-color: var(--ck-err); }
.ck-input:disabled { opacity: 0.5; }
.ck-help { margin: 0px; font-size: 13px; line-height: 1.5; color: var(--fg-3); }
.ck-err { margin: 0px; font-size: 13px; line-height: 1.45; color: var(--ck-err); font-weight: 500; display: flex; gap: 6px; }
.ck-err::before { content: "!"; font-family: var(--font-mono); font-weight: 700; }
.ck-err[hidden] { display: none; }
.ck-count { font-family: var(--font-mono); font-size: 11px; color: var(--fg-3); align-self: flex-end; }
.ck-check { display: inline-flex; align-items: center; gap: 12px; min-height: 44px; font-size: 14px; color: var(--fg-2); cursor: pointer; }
.ck-check input { width: 20px; height: 20px; accent-color: var(--ck-sig); margin: 0px; flex: 0 0 auto; }
.ck-consent { margin: 0px; font-size: 12.5px; line-height: 1.5; color: var(--fg-3); }
.ck-consent a { color: var(--fg-2); text-decoration: underline; }
.ck-submit-row { display: flex; flex-direction: column; gap: 10px; align-items: flex-start; }
.ck-alert { border: 1px solid var(--border-strong); border-radius: var(--radius-sm); padding: 16px 18px; display: flex; flex-direction: column; gap: 12px; font-size: 14.5px; line-height: 1.5; color: var(--fg-1); background: var(--surface-sunken); }
.ck-alert[hidden] { display: none; }
.ck-alert--err { border-color: var(--ck-err); }
.ck-alert--ok { border-color: var(--ck-sig); }
.ck-alert p { margin: 0px; color: var(--fg-1); }
.ck-chips { display: flex; flex-wrap: wrap; gap: 10px; }
.ck-chip { position: relative; display: inline-flex; align-items: center; gap: 10px; min-height: 48px; padding: 12px 16px; border: 1px solid var(--border-strong); border-radius: var(--radius-sm); background: transparent; color: var(--fg-1); font-family: var(--font-sans); font-size: 15px; font-weight: 500; cursor: pointer; text-align: left; transition: border-color var(--dur-fast),background var(--dur-fast); }
.ck-chip:hover { border-color: var(--fg-2); }
.ck-chip input { position: absolute; opacity: 0; inset: 0px; margin: 0px; cursor: pointer; }
.ck-chip .box { width: 18px; height: 18px; border: 1.5px solid var(--fg-3); border-radius: var(--radius-xs); flex: 0 0 auto; display: grid; place-items: center; }
.ck-chip--radio .box { border-radius: 50%; }
.ck-chip[aria-pressed="true"], .ck-chip:has(input:checked) { border-color: var(--ck-sig); background: color-mix(in srgb,var(--ck-sig) 12%,transparent); }
.ck-chip[aria-pressed="true"] .box, .ck-chip:has(input:checked) .box { border-color: var(--ck-sig); background: var(--ck-sig); }
.ck-chip[aria-pressed="true"] .box::after { content: ""; width: 9px; height: 5px; border-left: 2px solid var(--ck-on); border-bottom: 2px solid var(--ck-on); transform: translateY(-1px) rotate(-45deg); }
.ck-chip:has(input:checked) .box::after { content: ""; width: 6px; height: 6px; border-radius: 50%; background: var(--ck-on); }
.ck-chips--col { flex-direction: column; align-items: stretch; }
@media (min-width: 640px){
.ck-chips--col { flex-direction: row; align-items: center; }
}
.ck-apply { display: grid; grid-template-columns: minmax(0px, 1.35fr) minmax(0px, 0.9fr); gap: clamp(24px, 4vw, 56px); align-items: start; }
@media (max-width: 960px){
.ck-apply { grid-template-columns: minmax(0px, 1fr); }
}
.ck-app { padding: clamp(20px, 3vw, 40px); min-height: 460px; display: flex; flex-direction: column; gap: 24px; }
.ck-prog { display: flex; flex-direction: column; gap: 10px; }
.ck-prog-t { margin: 0px; font-family: var(--font-mono); font-size: 12px; letter-spacing: 0.08em; text-transform: uppercase; color: var(--fg-2); }
.ck-prog-bar { height: 3px; background: var(--border-1); border-radius: 3px; overflow: hidden; }
.ck-prog-bar i { display: block; height: 100%; background: var(--ck-sig); transition: width var(--dur-slow) var(--ease-out); }
.ck-step { display: flex; flex-direction: column; gap: 18px; }
.ck-step[hidden] { display: none; }
.ck-step-h { font-family: var(--font-display); font-weight: 700; font-size: clamp(24px, 2.6vw, 34px); line-height: 1.12; letter-spacing: -0.025em; color: var(--fg-1); margin: 0px; text-wrap: balance; }
.ck-step-h:focus { outline: none; }
.ck-step-h:focus-visible { outline: 2px solid var(--ck-sig); outline-offset: 6px; }
.ck-step-h .opt { font-weight: 500; color: var(--fg-3); font-size: 0.7em; letter-spacing: 0px; }
.ck-app-nav { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; margin-top: auto; padding-top: 8px; }
.ck-app-nav .ck-btn--primary { min-width: 160px; }
.ck-screen { display: flex; flex-direction: column; gap: 18px; }
.ck-screen[hidden] { display: none; }
.ck-proc { display: flex; align-items: center; gap: 14px; font-family: var(--font-display); font-size: clamp(22px, 2.4vw, 30px); font-weight: 700; color: var(--fg-1); }
.ck-proc .ck-spin { width: 24px; height: 24px; }
.ck-cal { border: 1px solid var(--border-1); border-radius: var(--radius-sm); overflow: hidden; background: var(--surface-sunken); }
.ck-cal iframe { display: block; width: 100%; height: 680px; border: 0px; }
.ck-cal-empty { padding: 28px; display: flex; flex-direction: column; gap: 12px; align-items: flex-start; border: 1px dashed var(--border-strong); border-radius: var(--radius-sm); }
.ck-cal-empty .t { font-family: var(--font-display); font-weight: 700; font-size: 20px; color: var(--fg-1); margin: 0px; }
.ck-cal-empty p { margin: 0px; color: var(--fg-2); font-size: 14.5px; line-height: 1.55; max-width: 52ch; }
.ck-aside { display: flex; flex-direction: column; gap: 20px; position: sticky; top: 120px; }
@media (max-width: 960px){
.ck-aside { position: static; }
}
.ck-aside .ck-under { margin-top: 0px; padding: 0px 4px; }
.ck-risk { display: flex; flex-direction: column; gap: clamp(28px, 4vw, 48px); }
.ck-risk-grid { list-style: none; margin: 0px; padding: 0px; display: grid; grid-template-columns: repeat(4, minmax(0px, 1fr)); border-top: 1px solid var(--border-1); }
@media (max-width: 1100px){
.ck-risk-grid { grid-template-columns: repeat(2, minmax(0px, 1fr)); }
}
@media (max-width: 620px){
.ck-risk-grid { grid-template-columns: minmax(0px, 1fr); }
}
.ck-risk-grid li { padding: 24px 24px 24px 0px; display: flex; flex-direction: column; gap: 10px; border-bottom: 1px solid var(--border-2); }
@media (min-width: 621px){
.ck-risk-grid li + li { padding-left: 24px; border-left: 1px solid var(--border-2); }
.ck-risk-grid li:nth-child(3) { border-left: 0px; padding-left: 0px; }
}
@media (min-width: 1101px){
.ck-risk-grid li:nth-child(3) { border-left: 1px solid var(--border-2); padding-left: 24px; }
}
.ck-risk-grid .n { font-family: var(--font-mono); font-size: 11px; color: var(--ck-sig); letter-spacing: 0.08em; }
.ck-risk-grid b { font-family: var(--font-display); font-size: 18px; line-height: 1.25; font-weight: 700; color: var(--fg-1); letter-spacing: -0.01em; }
.ck-risk-grid p { margin: 0px; font-size: 14.5px; line-height: 1.55; color: var(--fg-2); }
.ck-vis { display: grid; grid-template-columns: minmax(0px, 0.9fr) minmax(0px, 1.1fr); gap: clamp(24px, 4vw, 56px); align-items: start; }
@media (max-width: 900px){
.ck-vis { grid-template-columns: minmax(0px, 1fr); }
}
.ck-vis-copy { display: flex; flex-direction: column; gap: 16px; }
.ck-vis-t { font-family: var(--font-display); font-weight: 800; font-size: clamp(26px, 3vw, 40px); line-height: 1.02; letter-spacing: -0.03em; text-transform: uppercase; color: var(--fg-1); margin: 0px; text-wrap: balance; }
.ck-vis--compact { grid-template-columns: minmax(0px, 1fr); gap: 16px; }
.ck-vis--compact .ck-vis-t { font-size: clamp(20px, 2vw, 24px); text-transform: none; letter-spacing: -0.02em; font-weight: 700; }
.ck-overlay { position: fixed; inset: 0px; z-index: 10001; background: rgba(5, 7, 11, 0.72); display: grid; place-items: center; padding: 20px; }
.ck-overlay[hidden] { display: none; }
.ck-dialog { width: min(560px, 100%); max-height: calc(-40px + 100vh); overflow: auto; background: var(--ck-panel-solid); border: 1px solid var(--border-strong); border-radius: var(--radius-md); padding: clamp(22px, 3vw, 32px); box-shadow: var(--shadow-xl); display: flex; flex-direction: column; gap: 16px; }
.ck-dialog h2 { font-family: var(--font-display); font-weight: 800; font-size: clamp(24px, 2.6vw, 32px); text-transform: uppercase; letter-spacing: -0.03em; line-height: 1; margin: 0px; color: var(--fg-1); }
.ck-dialog h2:focus { outline: none; }
.ck-dialog-close { align-self: flex-start; }
.ck-phone { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; min-width: 44px; justify-content: center; padding: 0px 8px; color: var(--fg-2); font-family: var(--font-mono); font-size: 12.5px; letter-spacing: 0.02em; text-decoration: none; white-space: nowrap; border-radius: var(--radius-sm); }
.ck-phone:hover { color: var(--ck-sig); text-decoration: none; }
.ck-phone svg { width: 16px; height: 16px; flex: 0 0 auto; }
@media (max-width: 1279px){
.ck-phone .num { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0px, 0px, 0px, 0px); }
}
.ck-mbar { display: none; position: fixed; left: 0px; right: 0px; bottom: 0px; z-index: 97; padding-bottom: env(safe-area-inset-bottom); grid-template-columns: 1fr 1fr; border-top: 1px solid var(--border-strong); background: color-mix(in srgb,var(--bg) 94%,transparent); backdrop-filter: blur(12px); }
.ck-mbar a { display: flex; align-items: center; justify-content: center; gap: 8px; min-height: 52px; padding: 12px; font-size: 14px; font-weight: 600; text-decoration: none; color: var(--fg-1); }
.ck-mbar .apply { background: var(--ck-sig); color: var(--ck-on); }
.ck-mbar--solo { grid-template-columns: 1fr; }
@media (max-width: 767px){
.ck-mbar { display: grid; }
body.ck-has-mbar { padding-bottom: calc(56px + env(safe-area-inset-bottom)); }
body.ck-app-open .ck-mbar { display: none; }
body.ck-app-open.ck-has-mbar { padding-bottom: 0px; }
}
.ck-faq { max-width: 860px; border-top: 1px solid var(--border-1); }
.ck-faq-item { border-bottom: 1px solid var(--border-1); }
.ck-faq-q { margin: 0px; font: inherit; }
.ck-faq-q button { width: 100%; display: flex; justify-content: space-between; align-items: center; gap: 16px; min-height: 56px; padding: 18px 2px; background: none; border: 0px; color: var(--fg-1); font-family: var(--font-display); font-weight: 700; font-size: clamp(16px, 1.5vw, 20px); letter-spacing: -0.01em; text-align: left; cursor: pointer; }
.ck-faq-q button:hover { color: var(--ck-sig); }
.ck-faq-q .ico { font-family: var(--font-mono); color: var(--ck-sig); font-size: 20px; flex: 0 0 auto; width: 20px; text-align: center; }
.ck-faq-a { padding: 0px 2px 22px; color: var(--fg-2); font-size: 15px; line-height: 1.6; max-width: 64ch; }
.ck-faq-a p { margin: 0px; }
.ck-faq-a[hidden] { display: none; }
.ck-testi { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 320px), 1fr)); gap: 14px; }
.ck-testi figure { margin: 0px; display: flex; flex-direction: column; gap: 14px; }
.ck-testi blockquote { margin: 0px; font-size: 16.5px; line-height: 1.55; color: var(--fg-1); }
.ck-testi figcaption { font-size: 13px; color: var(--fg-3); display: flex; flex-direction: column; gap: 3px; }
.ck-testi figcaption strong { color: var(--fg-1); }
.ck-testi .res { font-family: var(--font-mono); font-size: 11px; letter-spacing: 0.06em; text-transform: uppercase; color: var(--fg-2); }
.ck-inline { margin: 40px 0px; padding: clamp(20px, 2.6vw, 28px); }
.ck-inline-t { margin: 0px 0px 14px; font-family: var(--font-display); font-weight: 700; font-size: 20px; line-height: 1.25; color: var(--fg-1); }
.ck-inline .ck-ctas { margin-top: 14px; }
.ck-final { display: grid; grid-template-columns: minmax(0px, 1.2fr) minmax(0px, 0.8fr); gap: clamp(28px, 5vw, 72px); align-items: center; }
@media (max-width: 960px){
.ck-final { grid-template-columns: minmax(0px, 1fr); }
}
.ck-final-copy { display: flex; flex-direction: column; gap: 20px; }
.ck-final .ck-h2 .sig { color: var(--ck-sig); }
.ck-demo { position: fixed; right: 16px; bottom: 16px; z-index: 10002; display: flex; flex-direction: column-reverse; align-items: flex-end; gap: 8px; }
@media (max-width: 767px){
.ck-demo { bottom: calc(16px + env(safe-area-inset-bottom)); }
body.ck-has-mbar:not(.ck-app-open) .ck-demo { bottom: 72px; }
}
.ck-demo > button { min-height: 44px; padding: 10px 14px; border: 1px dashed var(--border-strong); border-radius: var(--radius-sm); background: var(--ck-panel-solid); color: var(--fg-2); font-family: var(--font-mono); font-size: 11px; letter-spacing: 0.1em; text-transform: uppercase; cursor: pointer; }
.ck-demo-menu { display: flex; flex-direction: column; gap: 4px; padding: 6px; background: var(--ck-panel-solid); border: 1px solid var(--border-strong); border-radius: var(--radius-sm); box-shadow: var(--shadow-lg); }
.ck-demo-menu[hidden] { display: none; }
.ck-demo-menu button { min-height: 44px; padding: 8px 14px; text-align: left; background: none; border: 0px; border-radius: var(--radius-xs); color: var(--fg-1); font-family: var(--font-sans); font-size: 14px; cursor: pointer; }
.ck-demo-menu button:hover { background: var(--bg-muted); }
@media (prefers-reduced-motion: reduce){
.ck-spin { animation-duration: 2.4s; }
.ck-prog-bar i, .ck-btn, .ck-chip { transition: none; }
}
.ck-band { padding: clamp(64px, 8vw, 128px) 0px; border-top: 1px solid var(--border-2); }
.ck-rail { display: none; }
@media (min-width: 1280px){
.ck-rail { display: block; position: sticky; top: 104px; align-self: start; }
}
.ck-rail-card { opacity: 0; visibility: hidden; transform: translateY(8px); transition: opacity var(--dur-base) var(--ease-out),transform var(--dur-base) var(--ease-out),visibility 0s linear var(--dur-base); padding: 20px; }
.ck-rail-card.is-on { opacity: 1; visibility: visible; transform: none; transition-delay: 0s; }
.ck-rail-card .ck-inline-t { font-size: 17px; margin-bottom: 14px; }
.ck-ctas--col { flex-direction: column; align-items: stretch; }
.ck-ctas--col .ck-btn { width: 100%; }
@media (prefers-reduced-motion: reduce){
.ck-rail-card { transition: none; transform: none; }
}
.prose .ck-inline h2.ck-vis-t, .prose .ck-inline .ck-inline-t { margin: 0px 0px 6px; font-size: clamp(20px, 2vw, 24px); line-height: 1.2; }
.prose .ck-inline p { margin: 0px 0px 12px; }
.prose .ck-inline .ck-vis { gap: 12px; }
.prose .ck-inline .ck-form { gap: 14px; }
.ck-mburger { display: none; width: 44px; height: 44px; border: 1px solid var(--border-strong); border-radius: var(--radius-sm); background: transparent; flex-direction: column; align-items: center; justify-content: center; gap: 4px; cursor: pointer; }
.ck-mburger span { display: block; width: 18px; height: 1.5px; background: var(--fg-1); }
.ck-mburger:focus-visible { outline: 2px solid var(--ck-sig); outline-offset: 3px; }
@media (max-width: 1080px){
.ck-mburger { display: inline-flex; }
}
.ck-mmenu { position: fixed; left: 0px; right: 0px; top: 84px; z-index: 99; padding: 16px clamp(20px, 4vw, 48px) 24px; background: var(--ck-panel-solid); border-bottom: 1px solid var(--border-strong); display: flex; flex-direction: column; gap: 16px; }
.ck-mmenu[hidden] { display: none; }
.ck-mmenu ul { list-style: none; margin: 0px; padding: 0px; display: flex; flex-direction: column; }
.ck-mmenu li a { display: flex; align-items: center; min-height: 48px; color: var(--fg-1); font-size: 17px; font-weight: 500; text-decoration: none; border-bottom: 1px solid var(--border-2); }
.ck-mmenu li a[aria-current] { color: var(--ck-sig); }
.nav-links a[aria-current="page"], .m-menu a[aria-current="page"] { color: var(--ck-sig); }
.cc-banner, .cc-dlg, .cc-gate { --cc-fg: var(--fg-1,#F2F5F9); --cc-fg2: var(--fg-2,#C4CCD6); --cc-bd: var(--border-strong,#3A4250); --cc-sig: var(--ck-sig,#3AA0D2); font-family: var(--font-sans,system-ui,sans-serif); color: var(--cc-fg); }
.cc-banner { position: fixed; left: 16px; bottom: 16px; z-index: 9990; width: min(440px, -32px + 100vw); padding: 22px 22px 20px; display: flex; flex-direction: column; gap: 12px; border: 1px solid var(--cc-bd); border-radius: var(--radius-md,14px); background: color-mix(in srgb,var(--surface,#11151C) 90%,transparent); backdrop-filter: blur(16px) saturate(1.2); box-shadow: rgba(0, 0, 0, 0.4) 0px 18px 50px; }
.cc-banner[hidden], .cc-dlg-wrap[hidden] { display: none !important; }
.cc-title { margin: 0px; font-family: var(--font-display,inherit); font-weight: 700; font-size: 19px; letter-spacing: -0.01em; line-height: 1.25; color: var(--cc-fg); }
.cc-body { margin: 0px; font-size: 15px; line-height: 1.55; color: var(--cc-fg2); }
.cc-body a, .cc-links a { color: var(--cc-fg); text-decoration: underline; text-underline-offset: 3px; }
.cc-body a:hover, .cc-links a:hover { color: var(--cc-sig); }
.cc-links { margin: 0px; display: flex; flex-wrap: wrap; gap: 6px 18px; font-size: 14px; }
.cc-gpc { margin: 0px; padding: 8px 12px; border-radius: 8px; border: 1px solid color-mix(in srgb,var(--cc-sig) 50%,transparent); font-size: 14px; line-height: 1.45; color: var(--cc-fg); }
.cc-btns { display: grid; grid-template-columns: repeat(3, minmax(0px, 1fr)); gap: 8px; margin-top: 4px; }
.cc-btn { min-height: 46px; padding: 10px 12px; border: 1px solid var(--cc-fg2); border-radius: var(--radius-sm,10px); background: var(--surface-sunken,rgba(255,255,255,.04)); color: var(--cc-fg); font: 600 14.5px/1.2 var(--font-sans,system-ui,sans-serif); cursor: pointer; transition: border-color 0.15s, background 0.15s; }
.cc-btn:hover { border-color: var(--cc-fg); background: color-mix(in srgb,var(--cc-fg) 8%,transparent); }
.cc-btn:focus-visible, .cc-sw:focus-visible, .cc-see:focus-visible, .cc-x:focus-visible, .cc-links a:focus-visible, .cc-body a:focus-visible, .cc-gate-link:focus-visible { outline: 2px solid var(--cc-sig); outline-offset: 3px; }
.cc-btn--sig { background: var(--cc-sig); border-color: var(--cc-sig); color: var(--ck-on,#05131D); }
.cc-btn--sig:hover { background: var(--ck-sig-hover,var(--cc-sig)); border-color: var(--ck-sig-hover,var(--cc-sig)); }
@media (max-width: 767px){
.cc-banner { left: 0px; right: 0px; bottom: 0px; width: 100%; border-radius: 16px 16px 0px 0px; border-left: 0px; border-right: 0px; border-bottom: 0px; padding: 18px 18px calc(16px + env(safe-area-inset-bottom)); }
body.cc-open .ck-mbar { bottom: var(--cc-h,0px); }
.cc-btns { grid-template-columns: 1fr 1fr 1fr; }
.cc-btn { font-size: 14px; padding: 10px 6px; }
}
.cc-dlg-wrap { position: fixed; inset: 0px; z-index: 10010; display: flex; align-items: center; justify-content: center; padding: 16px; }
.cc-scrim { position: absolute; inset: 0px; background: rgba(5, 8, 14, 0.55); }
.cc-dlg { position: relative; width: min(620px, 100%); max-height: min(88vh, 860px); overflow: auto; padding: 24px; display: flex; flex-direction: column; gap: 14px; border: 1px solid var(--cc-bd); border-radius: var(--radius-md,14px); background: var(--surface,#11151C); box-shadow: rgba(0, 0, 0, 0.5) 0px 24px 70px; }
.cc-dlg:focus { outline: none; }
.cc-dlg-h { display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.cc-dlg-h h2 { margin: 0px; font-family: var(--font-display,inherit); font-weight: 700; font-size: 22px; color: var(--cc-fg); }
.cc-x { flex: 0 0 auto; width: 44px; height: 44px; display: grid; place-items: center; border: 1px solid var(--cc-bd); border-radius: var(--radius-sm,10px); background: transparent; color: var(--cc-fg); cursor: pointer; }
.cc-x svg { width: 16px; height: 16px; }
.cc-rows { display: flex; flex-direction: column; }
.cc-row { padding: 14px 0px; border-top: 1px solid var(--border-1,#262C36); display: flex; flex-direction: column; gap: 6px; }
.cc-row-t { display: flex; align-items: center; gap: 12px; }
.cc-row-t h3 { margin: 0px; flex: 1 1 0%; font-size: 16px; font-weight: 600; color: var(--cc-fg); }
.cc-row p { margin: 0px; font-size: 14.5px; line-height: 1.5; color: var(--cc-fg2); }
.cc-always { font: 500 12.5px var(--font-mono,ui-monospace,monospace); color: var(--cc-fg2); }
.cc-sw { position: relative; flex: 0 0 auto; width: 52px; height: 30px; margin: 7px 0px; border: 1px solid var(--cc-fg2); border-radius: 99px; background: var(--surface-sunken,rgba(255,255,255,.04)); cursor: pointer; padding: 0px; }
.cc-sw::before { content: ""; position: absolute; inset: -8px -4px; }
.cc-sw .k { position: absolute; left: 3px; top: 3px; width: 22px; height: 22px; border-radius: 50%; background: var(--cc-fg2); transition: transform 0.18s, background 0.18s; }
.cc-sw[aria-checked="true"] { background: var(--cc-sig); border-color: var(--cc-sig); }
.cc-sw[aria-checked="true"] .k { transform: translateX(22px); background: var(--ck-on,#05131D); }
.cc-sw:disabled { cursor: not-allowed; opacity: 0.75; }
.cc-see { align-self: flex-start; min-height: 44px; padding: 0px; border: 0px; background: none; color: var(--cc-fg); font: 600 14px var(--font-sans,system-ui,sans-serif); text-decoration: underline; text-underline-offset: 3px; cursor: pointer; }
.cc-list ul { margin: 0px; padding: 0px; list-style: none; display: flex; flex-direction: column; gap: 8px; }
.cc-list li { display: flex; flex-direction: column; gap: 2px; padding: 8px 12px; border-radius: 8px; background: var(--surface-sunken,rgba(255,255,255,.04)); font-size: 14px; line-height: 1.45; color: var(--cc-fg2); }
.cc-list b { font: 500 13.5px var(--font-mono,ui-monospace,monospace); color: var(--cc-fg); word-break: break-word; }
.cc-none { font-size: 14px; color: var(--cc-fg2); }
body.cc-dlg-open { overflow: hidden; }
@media (max-width: 520px){
.cc-dlg { padding: 18px; }
.cc-dlg .cc-btns { grid-template-columns: 1fr; }
}
.cc-gate { display: flex; flex-direction: column; gap: 12px; padding: 20px; border: 1px solid var(--cc-bd); border-radius: var(--radius-md,14px); background: var(--ck-panel,color-mix(in srgb,var(--surface,#11151C) 72%,transparent)); backdrop-filter: blur(14px); }
.cc-gate p { margin: 0px; font-size: 15.5px; line-height: 1.5; color: var(--cc-fg); }
.cc-gate-a { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 18px; }
.cc-gate-a .cc-btn { min-width: 150px; }
.cc-gate-link { color: var(--cc-fg); font-size: 14.5px; text-decoration: underline; text-underline-offset: 3px; }
.cc-gate--ask { margin-bottom: 12px; }
.fc-opt { display: flex; align-items: flex-start; gap: 12px; min-height: 44px; padding: 6px 0px; font-size: 14.5px; line-height: 1.5; color: var(--fg-2,#C4CCD6); cursor: pointer; }
.fc-opt input { flex: 0 0 auto; width: 20px; height: 20px; margin: 1px 0px 0px; accent-color: var(--ck-sig,#3AA0D2); cursor: pointer; }
.fc-opt input:focus-visible { outline: 2px solid var(--ck-sig,#3AA0D2); outline-offset: 3px; }
.ck-consent a { color: var(--fg-1,#F2F5F9); }
@media print{
.cc-banner, .cc-dlg-wrap { display: none !important; }
}
@media (prefers-reduced-motion: reduce){
.cc-sw .k, .cc-btn { transition: none; }
}
:root { --font-display: "Satoshi",ui-sans-serif,system-ui,sans-serif; --signal: var(--blue-400); --signal-strong: var(--blue-500); --grain-opacity: 0.06; }
* { box-sizing: border-box; margin: 0px; padding: 0px; }
html, body { overflow-x: clip; scroll-behavior: smooth; }
body { background: var(--bg); color: var(--fg-1); font-family: var(--font-sans); cursor: none; }
@media (hover: none){
body { cursor: auto; }
.cursor, .cursor-ring { display: none !important; }
}
@media (prefers-reduced-motion: reduce){
body { cursor: auto; }
.cursor, .cursor-ring { display: none !important; }
* { animation-duration: 0.01ms !important; transition-duration: 0.01ms !important; }
}
::selection { background: var(--brand-sun); color: rgb(10, 12, 17); }
a, button, [data-magnetic] { cursor: none; }
.grain { position: fixed; inset: 0px; pointer-events: none; z-index: 2; opacity: var(--grain-opacity); mix-blend-mode: overlay; background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='240' height='240'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 1  0 0 0 0 1  0 0 0 0 1  0 0 0 0.6 0'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>"); }
.cursor { border-radius: 50%; position: fixed; width: 22px; height: 22px; background: url("assets/favicon-ounternet-64.webp") center center / contain no-repeat; top: 0px; left: 0px; pointer-events: none; z-index: 9999; transform: translate(-50%, -50%); transition: transform var(--dur-fast) var(--ease-out),width var(--dur-base) var(--ease-out),height var(--dur-base) var(--ease-out); }
.cursor-ring { display: none; position: fixed; width: 32px; height: 32px; border-radius: 50%; border: 1px solid var(--fg-3); top: 0px; left: 0px; pointer-events: none; z-index: 9998; transform: translate(-50%, -50%); transition: width var(--dur-slow) var(--ease-out),height var(--dur-slow) var(--ease-out),border-color var(--dur-base) var(--ease-out),background var(--dur-base) var(--ease-out); mix-blend-mode: difference; }
.cursor.is-hover { width: 30px; height: 30px; border-radius: 50%; }
.cursor-ring.is-hover { width: 64px; height: 64px; border-color: var(--signal); background: rgba(58, 160, 210, 0.06); }
.loader { position: fixed; inset: 0px; z-index: 10000; background: var(--bg); display: flex; align-items: center; justify-content: center; transition: opacity 500ms var(--ease-out),visibility 500ms var(--ease-out); }
.loader img { width: 56px; height: 56px; object-fit: contain; animation: 1.1s ease-in-out 0s infinite normal none running loaderPulse; }
.loader.is-done { opacity: 0; visibility: hidden; }
@keyframes loaderPulse { 
  0%, 100% { transform: scale(1); opacity: 1; }
  50% { transform: scale(0.85); opacity: 0.5; }
}
.container { width: 100%; max-width: 1440px; margin: 0px auto; padding: 0px clamp(20px, 4vw, 48px); position: relative; }
.section { position: relative; padding: clamp(72px, 9vw, 120px) 0px; border-top: 1px solid var(--border-2); }
.eyebrow { font-family: var(--font-mono); font-size: 11px; text-transform: uppercase; letter-spacing: var(--tracking-caps); color: var(--fg-3); display: inline-flex; align-items: center; gap: 10px; }
.eyebrow::before { content: ""; width: 24px; height: 1px; background: var(--fg-3); display: inline-block; }
.eyebrow--signal { color: var(--brand-sun); }
.eyebrow--signal::before { background: var(--brand-sun); }
.sec-head { display: grid; grid-template-columns: minmax(0px, 1.1fr) minmax(0px, 0.9fr); gap: clamp(24px, 4vw, 64px); align-items: end; margin-bottom: clamp(40px, 5vw, 64px); }
@media (max-width: 900px){
.sec-head { grid-template-columns: 1fr; gap: 20px; }
}
.sec-head h2 { font-family: var(--font-display); font-weight: 800; font-size: clamp(28px, 3.4vw, 48px); line-height: 1; letter-spacing: -0.035em; text-transform: uppercase; margin-top: 20px; max-width: 20ch; }
.sec-head h2 .signal { color: var(--signal); }
.sec-head p { color: var(--fg-2); font-size: 17px; line-height: 1.6; max-width: 62ch; }
@media (max-width: 640px){
.sec-head p { font-size: 15.5px; }
}
.note { font-family: var(--font-mono); font-size: 11px; line-height: 1.7; color: var(--fg-4); letter-spacing: 0.02em; max-width: 74ch; }
.nav { position: fixed; top: 0px; left: 0px; right: 0px; z-index: 100; padding: 20px 0px; backdrop-filter: blur(14px) saturate(1.2); background: rgba(10, 12, 17, 0.55); border-bottom: 1px solid rgba(35, 41, 53, 0); transition: border-color var(--dur-slow) var(--ease-out),background var(--dur-slow) var(--ease-out); }
.nav.is-scrolled { border-bottom-color: var(--border-1); background: rgba(10, 12, 17, 0.85); }
.nav-inner { display: flex; align-items: center; justify-content: space-between; gap: 40px; }
.nav-logo { display: flex; align-items: center; gap: 10px; font-family: var(--font-display); font-weight: 800; font-size: 18px; letter-spacing: -0.02em; color: var(--fg-1); text-decoration: none; }
.nav-logo .logo-img { height: 84px; width: auto; display: block; filter: drop-shadow(rgba(0, 0, 0, 0.4) 0px 1px 10px) brightness(1.2) saturate(1.05); }
@media (max-width: 640px){
.nav-logo .logo-img { height: 68px; }
}
.nav-links { display: flex; gap: 28px; list-style: none; }
.nav-links a { color: var(--fg-2); text-decoration: none; font-size: 14px; font-weight: 500; display: inline-flex; align-items: center; gap: 6px; transition: color var(--dur-base) var(--ease-out); }
.nav-links a:hover { color: var(--fg-1); box-shadow: inset 0 -2px 0 var(--brand-sun); padding-bottom: 2px; }
.nav-links a.is-active { color: var(--signal); box-shadow: inset 0 -2px 0 var(--brand-sun); padding-bottom: 2px; }
.nav-cta { display: inline-flex; align-items: center; gap: 8px; padding: 10px 16px; border: 1px solid var(--border-strong); border-radius: var(--radius-sm); font-size: 13px; font-weight: 500; color: var(--fg-1); text-decoration: none; background: transparent; transition: all var(--dur-base) var(--ease-out); }
.nav-cta:hover { border-color: var(--signal); color: var(--signal); }
.nav-cta .arrow { width: 14px; height: 14px; }
.nav-auth { display: inline-flex; align-items: center; gap: 7px; font-size: 13px; font-weight: 500; color: var(--fg-2); text-decoration: none; transition: color var(--dur-base) var(--ease-out); }
.nav-auth:hover { color: var(--signal); }
.nav-auth svg { width: 16px; height: 16px; flex: 0 0 auto; }
@media (max-width: 560px){
.nav-auth span { display: none; }
}
@media (max-width: 1080px){
.nav-links { display: none; }
}
.btn { display: inline-flex; align-items: center; gap: 10px; padding: 16px 24px; border-radius: var(--radius-sm); font-family: var(--font-sans); font-size: 14px; font-weight: 500; text-decoration: none; cursor: none; border: 1px solid transparent; transition: background var(--dur-base) var(--ease-out),color var(--dur-base) var(--ease-out),border-color var(--dur-base) var(--ease-out),transform var(--dur-base) var(--ease-out); white-space: nowrap; min-height: 44px; }
.btn--primary { background: var(--signal); color: rgb(5, 19, 29); border-color: var(--signal); }
.btn--primary:hover { background: var(--blue-300); border-color: var(--blue-300); }
.btn--ghost { background: transparent; color: var(--fg-1); border-color: var(--border-strong); }
.btn--ghost:hover { border-color: var(--fg-1); }
.btn .arrow { width: 16px; height: 16px; transition: transform var(--dur-base) var(--ease-out); }
.btn:hover .arrow { transform: translate(2px, -2px); }
html.js-reveal .rv:not(.is-in) { opacity: 0; transform: translateY(14px); transition-behavior: normal, normal; transition-duration: 500ms, 500ms; transition-timing-function: cubic-bezier(0.2, 0.8, 0.2, 1), cubic-bezier(0.2, 0.8, 0.2, 1); transition-property: opacity, transform; transition-delay: var(--d,0ms); }
.rv.is-in { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce){
.rv { opacity: 1; transform: none; }
}
.hero { position: relative; padding: calc(120px + clamp(28px, 5vw, 64px)) 0px clamp(64px, 8vw, 104px); overflow: hidden; }
.hero::before { content: ""; position: absolute; left: 50%; top: -10%; width: min(1100px, 120vw); height: min(1100px, 120vw); transform: translateX(-50%); background: radial-gradient(circle, rgba(58, 160, 210, 0.16), rgba(58, 160, 210, 0.04) 42%, transparent 66%); pointer-events: none; }
.hero h1 { font-family: var(--font-display); font-weight: 800; font-size: clamp(44px, 7vw, 104px); line-height: 0.95; letter-spacing: -0.03em; text-transform: uppercase; max-width: 15ch; }
@keyframes pulse { 
  0%, 100% { opacity: 1; transform: scale(1); }
  50% { opacity: 0.4; transform: scale(0.85); }
}
.scene { position: relative; min-width: 0px; display: flex; flex-direction: column; }
.hc { position: relative; z-index: 2; width: 100%; border: 1px solid rgba(58, 160, 210, 0.25); border-radius: 16px; background: linear-gradient(168deg, rgba(18, 23, 31, 0.9), rgba(10, 13, 18, 0.94)); backdrop-filter: blur(18px) saturate(1.15); box-shadow: rgba(58, 160, 210, 0.2) 0px 0px 90px, rgba(0, 0, 0, 0.55) 0px 30px 80px; display: flex; flex-direction: column; overflow: hidden; }
@keyframes hcBlink { 
  0%, 100% { opacity: 0.25; transform: scale(0.82); }
  50% { opacity: 1; transform: scale(1); }
}
@keyframes hcCaret { 
  0%, 49% { opacity: 0.9; }
  50%, 100% { opacity: 0; }
}
.hc-src { display: flex; align-items: center; gap: 11px; padding-top: 13px; border-top: 1px solid var(--border-2); opacity: 0; transition: opacity 300ms var(--ease-out); }
.hc-src.is-in { opacity: 1; }
.submit { margin-top: 22px; width: 100%; padding: 15px 22px; border: 1px solid var(--signal); border-radius: var(--radius-sm); background: var(--signal); color: rgb(5, 19, 29); font-family: var(--font-sans); font-size: 14px; font-weight: 600; min-height: 48px; cursor: none; transition: background var(--dur-base) var(--ease-out); }
.submit:hover { background: var(--blue-300); }
.submit[disabled] { opacity: 0.55; }
.scan { border: 1px solid var(--border-1); border-radius: var(--radius-md); background: linear-gradient(rgb(12, 16, 23), rgb(10, 12, 17)); min-height: 440px; padding: clamp(18px, 2.2vw, 26px); position: relative; overflow: hidden; display: flex; flex-direction: column; }
@keyframes blink { 
  0%, 49% { opacity: 0.9; }
  50%, 100% { opacity: 0; }
}
.tl { display: grid; grid-template-columns: 16px minmax(0px, 1fr); gap: 10px; align-items: start; font-family: var(--font-mono); font-size: 11px; line-height: 1.5; color: var(--fg-4); opacity: 0; transform: translateY(6px); transition: opacity 260ms cubic-bezier(0.2, 0.8, 0.2, 1), transform 260ms cubic-bezier(0.2, 0.8, 0.2, 1); }
.tl.is-in { opacity: 1; transform: none; }
.tl.is-done { color: var(--fg-3); }
@keyframes sp { 
  100% { transform: rotate(360deg); }
}
.proof { display: grid; grid-template-columns: repeat(4, minmax(0px, 1fr)); border-top: 1px solid var(--border-1); border-bottom: 1px solid var(--border-1); }
@media (max-width: 900px){
.proof { grid-template-columns: repeat(2, minmax(0px, 1fr)); }
}
@media (max-width: 480px){
.proof { grid-template-columns: 1fr; }
}
.pf { padding: clamp(26px, 3vw, 40px) clamp(18px, 2vw, 28px); border-right: 1px solid var(--border-1); display: flex; flex-direction: column; gap: 12px; }
.pf:last-child { border-right: 0px; }
@media (max-width: 900px){
.pf:nth-child(2) { border-right: 0px; }
.pf:nth-child(1), .pf:nth-child(2) { border-bottom: 1px solid var(--border-1); }
}
@media (max-width: 480px){
.pf { border-right: 0px; border-bottom: 1px solid var(--border-1); }
.pf:last-child { border-bottom: 0px; }
}
.pf .fig { font-family: var(--font-display); font-weight: 800; font-size: clamp(44px, 5vw, 72px); line-height: 0.9; letter-spacing: -0.05em; font-variant-numeric: tabular-nums; white-space: nowrap; }
.pf .fig .unit { color: var(--signal); }
.pf .cap { font-size: 14px; line-height: 1.5; color: var(--fg-2); max-width: 26ch; }
.pf .src { font-family: var(--font-mono); font-size: 9.5px; text-transform: uppercase; letter-spacing: var(--tracking-caps); color: var(--fg-4); margin-top: auto; padding-top: 18px; }
.plat { background: rgb(11, 14, 20); padding: clamp(22px, 2.5vw, 32px); display: flex; flex-direction: column; gap: 16px; transition: transform 160ms var(--ease-out),background 160ms var(--ease-out),box-shadow 160ms var(--ease-out); }
.plat:hover { transform: translateY(-2px); background: rgb(13, 18, 25); box-shadow: inset 0 0 0 1px var(--signal); }
.status { font-family: var(--font-mono); font-size: 9.5px; letter-spacing: 0.1em; text-transform: uppercase; padding: 5px 9px; border-radius: var(--radius-xs); border: 1px solid; white-space: nowrap; }
.status.live { color: var(--signal); border-color: rgba(58, 160, 210, 0.5); background: rgba(58, 160, 210, 0.08); }
.status.soon { color: var(--fg-3); border-color: var(--border-strong); }
.plat p { font-size: 14.5px; line-height: 1.62; color: var(--fg-2); max-width: 44ch; }
.plat .how { font-family: var(--font-mono); font-size: 10.5px; color: var(--fg-4); letter-spacing: 0.04em; text-transform: uppercase; margin-top: auto; padding-top: 16px; border-top: 1px solid var(--border-2); }
.steps { display: grid; grid-template-columns: repeat(4, minmax(0px, 1fr)); gap: 1px; background: var(--border-1); border-top: 1px solid var(--border-1); border-bottom: 1px solid var(--border-1); }
@media (max-width: 900px){
.steps { grid-template-columns: repeat(2, minmax(0px, 1fr)); }
}
@media (max-width: 560px){
.steps { grid-template-columns: 1fr; }
}
.step { background: var(--bg); padding: clamp(24px, 2.6vw, 34px) clamp(18px, 2vw, 26px); display: flex; flex-direction: column; gap: 14px; }
.step h3 { font-family: var(--font-display); font-weight: 800; font-size: 24px; text-transform: uppercase; letter-spacing: -0.025em; }
.step p { font-size: 14.5px; line-height: 1.6; color: var(--fg-2); }
.step ul { list-style: none; display: flex; flex-direction: column; gap: 8px; margin-top: 2px; }
.step li { font-family: var(--font-mono); font-size: 10.5px; color: var(--fg-3); letter-spacing: 0.03em; display: flex; gap: 9px; line-height: 1.5; }
.step li::before { content: ""; width: 5px; height: 5px; background: var(--signal); flex: 0 0 auto; margin-top: 5px; }
.chart { background: rgb(11, 14, 20); padding: clamp(20px, 2.3vw, 28px); display: flex; flex-direction: column; gap: 14px; }
.chart svg { width: 100%; height: auto; display: block; }
.chart text { font-family: "JetBrains Mono", monospace; }
.chart .draw { stroke-dasharray: var(--len,600); stroke-dashoffset: var(--len,600); transition: stroke-dashoffset 1400ms cubic-bezier(0.2, 0.8, 0.2, 1); }
.chart.is-in .draw { stroke-dashoffset: 0; }
.chart .bar { transform: scaleY(0); transform-origin: center bottom; transform-box: fill-box; transition: transform 900ms cubic-bezier(0.2, 0.8, 0.2, 1); }
.chart.is-in .bar { transform: scaleY(1); }
.chart .bar:nth-of-type(2) { transition-delay: 80ms; }
.chart .bar:nth-of-type(3) { transition-delay: 160ms; }
.chart .bar:nth-of-type(4) { transition-delay: 240ms; }
.chart .bar:nth-of-type(5) { transition-delay: 320ms; }
@media (prefers-reduced-motion: reduce){
.chart .draw { stroke-dashoffset: 0; }
.chart .bar { transform: none; }
}
.chart .foot { font-family: var(--font-mono); font-size: 9.5px; color: var(--fg-4); letter-spacing: 0.05em; text-transform: uppercase; margin-top: auto; padding-top: 14px; border-top: 1px solid var(--border-2); line-height: 1.6; }
.price-grid { display: grid; grid-template-columns: repeat(5, minmax(0px, 1fr)); gap: 12px; align-items: stretch; }
@media (max-width: 1280px){
.price-grid { grid-template-columns: repeat(3, minmax(0px, 1fr)); }
}
@media (max-width: 860px){
.price-grid { grid-template-columns: repeat(2, minmax(0px, 1fr)); }
}
@media (max-width: 560px){
.price-grid { grid-template-columns: 1fr; }
}
.tier { display: flex; flex-direction: column; border: 1px solid var(--border-1); border-radius: var(--radius-md); padding: 24px 20px; background: rgb(11, 14, 20); transition: transform 160ms var(--ease-out),border-color 160ms var(--ease-out); position: relative; }
.tier:hover { transform: translateY(-2px); border-color: var(--signal); }
.tier .nm { font-family: var(--font-display); font-weight: 800; font-size: 16px; text-transform: uppercase; letter-spacing: -0.01em; line-height: 1.15; min-height: 2.3em; }
.tier .amt { font-family: var(--font-display); font-weight: 800; font-size: clamp(30px, 3vw, 40px); letter-spacing: -0.045em; font-variant-numeric: tabular-nums; margin-top: 14px; line-height: 1; }
.tier .per { font-family: var(--font-mono); font-size: 10.5px; color: var(--fg-3); text-transform: uppercase; letter-spacing: 0.08em; margin-top: 8px; }
.tier p { font-size: 13.5px; line-height: 1.6; color: var(--fg-2); margin-top: 16px; }
.tier ul { list-style: none; display: flex; flex-direction: column; gap: 9px; margin-top: 16px; }
.tier li { font-size: 13px; line-height: 1.5; color: var(--fg-2); display: flex; gap: 9px; }
.tier li::before { content: ""; width: 5px; height: 5px; background: var(--signal); flex: 0 0 auto; margin-top: 6px; }
.tier .tier-cta { margin-top: auto; padding-top: 20px; }
.tier .tier-cta a { display: flex; align-items: center; justify-content: center; min-height: 44px; padding: 12px 14px; border: 1px solid var(--border-strong); border-radius: var(--radius-sm); color: var(--fg-1); font-size: 13px; font-weight: 600; text-decoration: none; transition: all 160ms var(--ease-out); }
.tier .tier-cta a:hover { border-color: var(--signal); color: var(--signal); }
.tier.is-rec { border-color: var(--signal); background: linear-gradient(rgba(58, 160, 210, 0.08), rgb(11, 14, 20) 55%); box-shadow: rgba(58, 160, 210, 0.1) 0px 0px 40px; }
@media (min-width: 1281px){
.tier.is-rec { transform: translateY(-14px); }
.tier.is-rec:hover { transform: translateY(-17px); }
}
.tier.is-rec { padding-top: 40px; }
.tier.is-rec .tier-cta a { background: var(--signal); border-color: var(--signal); color: rgb(5, 19, 29); }
.tier.is-rec .tier-cta a:hover { background: var(--blue-300); color: rgb(5, 19, 29); }
.faq { border-top: 1px solid var(--border-1); }
.faq details { border-bottom: 1px solid var(--border-1); }
.faq summary { list-style: none; cursor: none; padding: 24px 40px 24px 0px; position: relative; font-family: var(--font-display); font-weight: 700; font-size: clamp(17px, 1.7vw, 21px); letter-spacing: -0.015em; color: var(--fg-1); transition: color 160ms var(--ease-out); }
.faq summary::-webkit-details-marker { display: none; }
.faq summary:hover { color: var(--signal); }
.faq summary::after { content: ""; position: absolute; right: 6px; top: 50%; width: 11px; height: 11px; margin-top: -6px; border-right: 1.5px solid var(--fg-3); border-bottom: 1.5px solid var(--fg-3); transform: rotate(45deg); transition: transform 200ms var(--ease-out); }
.faq details[open] summary::after { transform: rotate(-135deg); }
.faq .a { padding: 0px clamp(0px, 6vw, 80px) 26px 0px; font-size: 16px; line-height: 1.7; color: var(--fg-2); max-width: 68ch; }
.faq .a strong { color: var(--fg-1); font-weight: 600; }
.faq .a p + p { margin-top: 12px; }
.lf-card { position: relative; border: 1px solid var(--border-1); border-radius: var(--radius-lg); background: linear-gradient(165deg, rgba(58, 160, 210, 0.06), rgba(15, 19, 26, 0.62)); backdrop-filter: blur(14px); padding: clamp(22px, 3vw, 34px); box-shadow: rgba(58, 160, 210, 0.07) 0px 0px 50px; }
.lf-steps { position: relative; min-height: 290px; }
.lf-step { display: none; opacity: 1; transform: none; transition: opacity 260ms cubic-bezier(0.2, 0.8, 0.2, 1), transform 260ms cubic-bezier(0.2, 0.8, 0.2, 1); }
.lf-step.is-on { display: block; }
.lf-step h4 { font-family: var(--font-display); font-weight: 800; font-size: 22px; text-transform: uppercase; letter-spacing: -0.02em; line-height: 1.1; }
.lf-step .sub { color: var(--fg-3); font-size: 13.5px; margin-top: 8px; line-height: 1.6; max-width: 52ch; }
.opts { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 10px; margin-top: 16px; }
.opt { position: relative; }
.opt input { position: absolute; opacity: 0; inset: 0px; width: 100%; height: 100%; margin: 0px; }
.opt span { display: flex; align-items: center; justify-content: center; text-align: center; min-height: 52px; padding: 12px; border: 1px solid var(--border-strong); border-radius: var(--radius-sm); font-size: 13.5px; font-weight: 500; color: var(--fg-2); transition: all 160ms var(--ease-out); }
.opt input:checked + span { border-color: var(--signal); color: var(--signal); background: rgba(58, 160, 210, 0.08); }
.lf-nav { display: flex; gap: 12px; align-items: center; margin-top: 26px; flex-wrap: wrap; }
.lf-nav button { min-height: 46px; padding: 13px 22px; border-radius: var(--radius-sm); font-family: var(--font-sans); font-size: 14px; font-weight: 600; cursor: none; border: 1px solid var(--border-strong); background: transparent; color: var(--fg-1); transition: all 160ms var(--ease-out); }
.lf-nav button.pri { background: var(--signal); border-color: var(--signal); color: rgb(5, 19, 29); }
.lf-nav button.pri:hover { background: var(--blue-300); }
.lf-nav button.pri[disabled] { background: transparent; color: var(--fg-4); border-color: var(--border-1); }
.trust { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 20px; }
.trust span, .trust a { font-family: var(--font-mono); font-size: 10px; letter-spacing: 0.06em; text-transform: uppercase; color: var(--fg-3); border: 1px solid var(--border-1); padding: 7px 11px; border-radius: 999px; text-decoration: none; }
.trust a { display: inline-flex; align-items: center; gap: 7px; transition: color var(--dur-base) var(--ease-out),border-color var(--dur-base) var(--ease-out); }
.trust a:hover { color: var(--signal); border-color: var(--signal); text-decoration: none; }
.trust a b { color: var(--signal); font-weight: 600; }
.case { position: relative; border: 1px solid var(--border-1); border-radius: var(--radius-md); background: rgb(11, 14, 20); padding: clamp(22px, 2.6vw, 34px); display: flex; flex-direction: column; gap: 18px; }
.person { display: flex; flex-direction: column; gap: 14px; min-width: 0px; }
@media (max-width: 768px){
.person { flex: 0 0 calc(33.333% - 14px); align-items: center; text-align: center; }
}
@media (max-width: 360px){
.person { flex: 0 0 calc(50% - 10px); }
}
.cred { display: flex; align-items: center; gap: 14px; padding: 18px; border: 1px solid var(--border-1); border-radius: 12px; background: var(--surface); transition: transform 200ms var(--ease-out),border-color 200ms var(--ease-out),background 200ms var(--ease-out); }
.cred:hover { transform: translateY(-2px); border-color: var(--border-strong); background: var(--surface-raised); }
@media (min-width: 1260px){
.cred { flex: 1 1 0px; min-width: 210px; }
}
@media (prefers-reduced-motion: reduce){
.cred, .cred-tile { transition: none; }
.cred:hover { transform: none; }
}
@media (max-width: 768px){
.cred { flex: 1 1 calc(50% - 5px); }
}
@media (max-width: 360px){
.cred { flex: 1 1 100%; }
}
.shift { position: relative; border: 1px solid var(--border-1); border-radius: var(--radius-md); background: linear-gradient(rgb(11, 14, 20), rgb(10, 12, 17)); padding: clamp(14px, 2vw, 26px); overflow: hidden; }
.shift::before { content: ""; position: absolute; left: 62%; top: 50%; width: min(620px, 70%); height: 300px; transform: translate(-50%, -50%); background: radial-gradient(rgba(58, 160, 210, 0.12), transparent 70%); pointer-events: none; }
.shift svg { position: relative; width: 100%; height: auto; display: block; }
.shift text { font-family: "JetBrains Mono", monospace; }
@media (max-width: 400px){
.scene .hc { border-radius: 14px; }
.hero h1 { font-size: clamp(34px, 10.5vw, 44px); letter-spacing: -0.025em; }
.lf-card, .lf-done { padding: 18px 16px; }
.check-panel, .scan { padding: 18px 16px; }
.case { padding: 20px 16px; }
.tier { padding: 20px 16px; }
.tier.is-rec { padding-top: 38px; }
.shift { padding: 12px 10px; }
}
@media (max-width: 560px){
.price-grid { grid-template-columns: 1fr; }
.sec-head h2 { font-size: clamp(26px, 8vw, 34px); }
}
.slim { position: fixed; top: 0px; left: 0px; right: 0px; z-index: 99; transform: translateY(-100%); transition: transform 320ms cubic-bezier(0.2, 0.8, 0.2, 1); background: rgba(8, 10, 15, 0.94); backdrop-filter: blur(12px); border-bottom: 1px solid var(--border-1); }
.slim.is-on { transform: none; }
.slim-inner { display: flex; align-items: center; gap: 16px; padding: 11px 0px; }
.slim .txt { flex: 1 1 0%; }
.slim-mark { flex: 0 0 auto; display: flex; align-items: center; }
.slim-mark img { width: 22px; height: 22px; object-fit: contain; display: block; }
.slim .txt { font-family: var(--font-mono); font-size: 10.5px; text-transform: uppercase; letter-spacing: 0.1em; color: var(--fg-3); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.slim .txt b { color: var(--fg-1); font-weight: 500; }
.slim .acts { display: flex; gap: 10px; flex: 0 0 auto; }
.slim a { display: inline-flex; align-items: center; min-height: 36px; padding: 8px 15px; border-radius: var(--radius-sm); font-size: 12.5px; font-weight: 600; text-decoration: none; border: 1px solid var(--border-strong); color: var(--fg-1); }
.slim a.pri { background: var(--signal); border-color: var(--signal); color: rgb(5, 19, 29); }
@media (max-width: 1080px){
.slim { display: none; }
}
.om-sticky { display: none; position: fixed; left: 0px; right: 0px; bottom: 0px; z-index: 97; grid-template-columns: 1fr 1fr; border-top: 1px solid var(--border-strong); background: rgba(10, 12, 17, 0.96); backdrop-filter: blur(12px); transform: translateY(100%); transition: transform 320ms cubic-bezier(0.2, 0.8, 0.2, 1); }
.om-sticky.is-on { transform: none; }
.om-sticky a { display: flex; align-items: center; justify-content: center; gap: 8px; padding: 15px 10px; font-size: 14px; font-weight: 600; text-decoration: none; min-height: 44px; }
.om-sticky .call { background: var(--signal); color: rgb(5, 19, 29); }
.om-sticky .wa { color: var(--fg-1); }
@media (max-width: 768px){
.om-sticky { display: grid; }
body { padding-bottom: 56px; }
}
.nav-tools { display: flex; align-items: center; gap: 10px; flex: 0 0 auto; }
@media (max-width: 1000px){
.nav-inner { gap: 20px; }
.nav-cta { display: none; }
}
.lang-switch { display: flex; flex: 0 0 auto; border: 1px solid var(--border-strong); border-radius: var(--radius-sm); overflow: hidden; }
.lang-switch button { background: transparent; border-top: 0px; border-bottom: 0px; border-left: 0px; border-image: none; border-right: 1px solid var(--border-strong); color: var(--fg-3); font-family: var(--font-mono); font-size: 11px; letter-spacing: var(--tracking-caps); padding: 9px 12px; cursor: pointer; transition: color var(--dur-base) var(--ease-out), background var(--dur-base) var(--ease-out); }
.lang-switch button:last-child { border-right: 0px; }
.lang-switch button:hover { color: var(--fg-1); }
.lang-switch button.is-on { background: rgba(58, 160, 210, 0.12); color: var(--signal); }
.theme-toggle { width: 36px; height: 36px; border: 1px solid var(--border-strong); border-radius: var(--radius-sm); background: transparent; color: var(--fg-2); display: inline-flex; align-items: center; justify-content: center; cursor: pointer; transition: border-color var(--dur-base) var(--ease-out), color var(--dur-base) var(--ease-out); flex: 0 0 auto; }
.theme-toggle:hover { border-color: var(--signal); color: var(--signal); }
.theme-toggle svg { width: 16px; height: 16px; }
.theme-toggle .ico-moon { display: none; }
[data-theme="light"] .theme-toggle .ico-sun { display: none; }
[data-theme="light"] .theme-toggle .ico-moon { display: block; }
@media (max-width: 640px){
.lang-switch button { padding: 9px; }
}
.footer { position: relative; padding: 80px 0px 40px; background: rgb(5, 7, 11); border-top: 1px solid var(--border-1); overflow: hidden; }
.footer::before { content: ""; position: absolute; inset: 0px; background-image: radial-gradient(circle at 1px 1px, rgba(255, 255, 255, 0.06) 1px, transparent 0px); background-size: 24px 24px; opacity: 0.5; pointer-events: none; }
.subscribe { display: flex; gap: 8px; max-width: 400px; padding: 6px; border: 1px solid var(--border-strong); border-radius: var(--radius-sm); background: rgba(10, 12, 17, 0.6); transition: border-color var(--dur-base) var(--ease-out); }
.subscribe:focus-within { border-color: var(--signal); box-shadow: var(--ring-focus); }
.subscribe input { flex: 1 1 0%; background: transparent; border: 0px; outline: 0px; color: var(--fg-1); font-family: var(--font-sans); font-size: 14px; padding: 10px 12px; }
.subscribe input::placeholder { color: var(--fg-4); }
.subscribe button { background: var(--signal); color: rgb(5, 19, 29); border: 0px; padding: 10px 20px; border-radius: var(--radius-sm); font-family: var(--font-sans); font-weight: 500; font-size: 13px; cursor: none; transition: background var(--dur-base) var(--ease-out); }
.subscribe button:hover { background: var(--blue-300); }
[data-theme="light"] .footer { background: var(--ink-100); }
[data-theme="light"] .footer::before { background-image: radial-gradient(circle at 1px 1px, rgba(10, 12, 17, 0.1) 1px, transparent 0px); }
@media (max-width: 1080px){
.nav-links { display: none !important; }
.nav .nav-cta { display: none !important; }
.nav-burger { display: inline-flex !important; }
}
.nav-links { gap: 22px; }
@media (max-width: 1320px){
.nav-links { gap: 18px; }
.nav-links a { font-size: 13.5px; }
}
@media (max-width: 1180px){
.nav-links { gap: 14px; }
.nav-links a { font-size: 13px; }
.nav-cta { padding: 10px 13px; font-size: 12.5px; }
}
.nav-links a { white-space: nowrap; }
.nav-links a .out { width: 10px; height: 10px; opacity: 0.5; flex: 0 0 auto; }
.nav-links a:hover .out { opacity: 1; }
[data-theme="light"] .nav { background: color-mix(in srgb, var(--surface) 92%, transparent); border-bottom: 1px solid var(--border-1); }
[data-theme="light"] .nav.is-scrolled { background: color-mix(in srgb, var(--surface) 92%, transparent); border-bottom-color: var(--border-1); }
[data-theme="light"] .clutch-badge b, [data-theme="light"] .trust a b, [data-theme="light"] .testi-stars .score { color: var(--blue-600); }
.lg { position: relative; display: inline-grid; place-items: center; width: 40px; height: 40px; flex: 0 0 auto; border-radius: var(--radius-xs); background: rgba(58, 160, 210, 0.14); box-shadow: inset 0 0 0 1px var(--border-1); overflow: hidden; }
.lg i { font-style: normal; font-family: var(--font-mono); font-size: 13px; font-weight: 600; letter-spacing: 0.04em; color: var(--signal); }
.lg img { position: absolute; inset: 0px; width: 100%; height: 100%; object-fit: contain; padding: 6px; background: rgba(255, 255, 255, 0.92); }
.strip { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 12px; }
.eng { display: grid; grid-template-columns: 30px minmax(0px, 1fr) auto; gap: 12px; align-items: center; padding: 12px 14px; border: 1px solid var(--border-1); border-radius: var(--radius-sm); background: rgba(10, 12, 17, 0.45); opacity: 0; transform: translateY(6px); transition: opacity 300ms var(--ease-out) var(--d,0ms),transform 300ms var(--ease-out) var(--d,0ms); }
.eng.is-in { opacity: 1; transform: none; }
.eng .wrap { display: flex; flex-direction: column; gap: 5px; min-width: 0px; }
.eng .nm { font-size: 14px; font-weight: 600; color: var(--fg-1); }
@keyframes gateIn { 
  0% { opacity: 0; transform: translateY(10px); }
  100% { opacity: 1; transform: none; }
}
.submit[disabled] { cursor: not-allowed; background: transparent; color: var(--fg-4); border-color: var(--border-strong); }
.submit[disabled]:hover { background: transparent; }
[data-theme="light"] .scan { background: linear-gradient(180deg,var(--surface-raised),var(--surface)); }
[data-theme="light"] .lg img { background: rgb(255, 255, 255); }
[data-theme="light"] .eng, [data-theme="light"] .strip-wrap, [data-theme="light"] .tr-input { background: var(--surface-raised); }
[data-theme="light"] .plat { background: var(--surface-raised); }
[data-theme="light"] .plat:hover { background: var(--surface); }
[data-theme="light"] .cred:hover { background: var(--surface-sunken); }
.nav-dd { position: relative; display: flex; align-items: center; }
.nav-dd > a .nav-dd-caret { width: 9px; height: 9px; flex: 0 0 auto; opacity: 0.7; transition: transform 0.18s; }
.nav-dd:hover:not(.is-closed) > a .nav-dd-caret, .nav-dd:focus-within:not(.is-closed) > a .nav-dd-caret { transform: rotate(180deg); }
.nav-dd-menu { position: absolute; top: 100%; left: -16px; z-index: 60; min-width: 210px; margin: 0px; padding: 12px 0px 0px; list-style: none; opacity: 0; visibility: hidden; transform: translateY(-4px); transition: opacity 0.16s, transform 0.16s, visibility linear 0.16s; }
.nav-dd-menu::before { content: ""; position: absolute; inset: 12px 0px 0px; z-index: -1; border: 1px solid var(--border-strong,#323944); border-radius: var(--radius-sm,10px); background: rgba(10, 14, 26, 0.94); backdrop-filter: blur(14px); box-shadow: rgba(0, 0, 0, 0.35) 0px 18px 40px; }
[data-theme="light"] .nav-dd-menu::before { background: rgba(250, 252, 254, 0.96); box-shadow: rgba(12, 20, 36, 0.12) 0px 18px 40px; }
.nav-dd:hover:not(.is-closed) .nav-dd-menu, .nav-dd:focus-within:not(.is-closed) .nav-dd-menu { opacity: 1; visibility: visible; transform: none; transition: opacity 0.16s, transform 0.16s, visibility; }
.nav-dd-menu li { display: block; padding: 0px 6px; }
.nav-dd-menu li:first-child { padding-top: 6px; }
.nav-dd-menu li:last-child { padding-bottom: 6px; }
.nav-links .nav-dd-menu a { display: flex; align-items: center; min-height: 44px; padding: 10px 12px; border-radius: 6px; white-space: nowrap; color: var(--fg-2); box-shadow: none !important; }
.nav-links .nav-dd-menu a:hover, .nav-links .nav-dd-menu a:focus-visible { background: rgba(127, 140, 160, 0.12); color: var(--fg-1); padding-bottom: 10px; }
.nav-links .nav-dd-menu a[aria-current="page"] { color: var(--signal,#4A9EFF); }
.nav-dd-menu li.nav-dd-grp { padding: 8px 6px 0px; }
.nav-dd-grp span { display: block; padding: 10px 12px 4px; border-top: 1px solid var(--border-1,#262C36); font: 500 12px/1.4 var(--font-mono,ui-monospace,monospace); letter-spacing: 0.12em; text-transform: uppercase; color: var(--fg-3,#8C98AB); white-space: nowrap; }
@media (prefers-reduced-motion: reduce){
.nav-dd-menu, .nav-dd > a .nav-dd-caret { transition: none !important; }
}
:root { --kc-blue: #4A9EFF; --kc-teal: #2DD4BF; --kc-amber: #F5A524; }
:is(.nf-node, .da-src, .da-chip, .da-pn, .pr-chip, .pr2-chip, .hc-chip, .hc-src, .hc-q-src, .sc-chip, .sc-float, .bd-chip, .in-chip, .in-ringlbl, .mk-f, .pm-ring, .mv-live, .mv-final figcaption, .aia-clock, .aia-chip, .wd-chip, .stk-tab, .ck-capacity, .ck-chip, .mb-att-chip, .mv-tag, .in-src, .aia-tools li, .ix-chip, .ae-chip, .kc) { --kc-c: #7FB8FF; --kc-edge: #1B3F72; --kc-glow: rgba(74,158,255,.42); }
:is(.mk-f, .wd-chip, .mv-live, .aia-clock, .ck-capacity, .mv-final figcaption, .mv-tag, .aia-tools li, .ix-chip, .kc-teal, .t):is(.nf-node, .da-src, .da-chip, .da-pn, .pr-chip, .pr2-chip, .hc-chip, .hc-src, .hc-q-src, .sc-chip, .sc-float, .bd-chip, .in-chip, .in-ringlbl, .mk-f, .pm-ring, .mv-live, .mv-final figcaption, .aia-clock, .aia-chip, .wd-chip, .stk-tab, .ck-capacity, .ck-chip, .mb-att-chip, .mv-tag, .in-src, .aia-tools li, .ix-chip, .ae-chip, .kc) { --kc-c: #5EEAD4; --kc-edge: #0E5550; --kc-glow: rgba(45,212,191,.38); }
:is(.a, .rev, .is-you, .kc-amber, [aria-current="true"], [aria-current="step"], [aria-current="page"], [aria-selected="true"], [aria-pressed="true"], .is-active, .is-cur, :has(> input:checked), :has(> .kc-face > input:checked)):is(.nf-node, .da-src, .da-chip, .da-pn, .pr-chip, .pr2-chip, .hc-chip, .hc-src, .hc-q-src, .sc-chip, .sc-float, .bd-chip, .in-chip, .in-ringlbl, .mk-f, .pm-ring, .mv-live, .mv-final figcaption, .aia-clock, .aia-chip, .wd-chip, .stk-tab, .ck-capacity, .ck-chip, .mb-att-chip, .mv-tag, .in-src, .aia-tools li, .ix-chip, .ae-chip, .kc) { --kc-c: #FFC768; --kc-edge: #7A4D06; --kc-glow: rgba(245,165,36,.5); }
:is(.nf-node, .da-src, .da-chip, .da-pn, .pr-chip, .pr2-chip, .hc-chip, .hc-src, .hc-q-src, .sc-chip, .sc-float, .bd-chip, .in-chip, .in-ringlbl, .mk-f, .pm-ring, .mv-live, .mv-final figcaption, .aia-clock, .aia-chip, .wd-chip, .stk-tab, .ck-capacity, .ck-chip, .mb-att-chip, .mv-tag, .in-src, .aia-tools li, .ix-chip, .ae-chip):not(.kc-on) { color: rgb(238, 243, 250); border-radius: 12px !important; border: 1px solid rgba(170, 196, 232, 0.3) !important; background: linear-gradient(rgba(44, 60, 92, 0.97), rgba(20, 29, 49, 0.97)) !important; box-shadow: 0 5px 0 0 var(--kc-edge),0 12px 24px -10px var(--kc-glow),inset 0 1px 0 rgba(255,255,255,.16) !important; backdrop-filter: none !important; }
.kc-on.kc-on.kc-on { isolation: isolate; padding: 0px !important; border: 0px !important; background: none !important; box-shadow: none !important; border-radius: 12px !important; min-height: 0px !important; height: auto !important; overflow: visible !important; backdrop-filter: none !important; gap: 0px !important; line-height: 1 !important; flex-shrink: 0 !important; }
.kc-on.kc-rel { position: relative; }
.kc-on::after { pointer-events: none; transition: background 0.25s; content: "" !important; display: block !important; position: absolute !important; left: 0px !important; right: 0px !important; top: var(--kc-depth,5px) !important; bottom: calc(var(--kc-depth,5px) * -1) !important; width: auto !important; height: auto !important; margin: 0px !important; border: 0px !important; border-radius: 12px !important; background: linear-gradient(180deg,var(--kc-edge),color-mix(in srgb,var(--kc-edge) 62%,#000)) !important; box-shadow: 0 12px 24px -10px var(--kc-glow),inset 0 -1px 0 rgba(0,0,0,.35) !important; z-index: -1 !important; opacity: 1 !important; transform: none !important; translate: none !important; animation: auto ease 0s 1 normal none running none !important; }
.kc-on::before { display: none !important; }
.kc-inline { --kc-depth: 2px; }
.kc-inline.kc-on::after { box-shadow: 0 8px 14px -10px var(--kc-glow),inset 0 -1px 0 rgba(0,0,0,.35) !important; }
.kc-face { position: relative; z-index: 1; box-sizing: border-box; width: 100%; display: inline-flex; align-items: center; gap: 10px; min-height: var(--kc-h,44px); padding: 0px 16px 0px 8px; border-radius: 12px; border: 1px solid rgba(170, 196, 232, 0.3); background: linear-gradient(rgba(46, 62, 96, 0.95), rgba(19, 28, 48, 0.95)); box-shadow: rgba(255, 255, 255, 0.16) 0px 1px 0px inset, rgba(0, 0, 0, 0.25) 0px -1px 0px inset; color: rgb(238, 243, 250); font: 600 14px/1.2 var(--font-sans,"Instrument Sans",system-ui,sans-serif); letter-spacing: 0px; text-transform: none; text-align: left; white-space: nowrap; overflow: hidden; transform: perspective(600px) rotateX(var(--kc-rx,0deg)) rotateY(var(--kc-ry,0deg)) translateY(var(--kc-y,0px)); transition: transform 0.18s cubic-bezier(0.2, 0.8, 0.2, 1), border-color 0.2s, background 0.2s, color 0.2s; }
.kc-nowell > .kc-face { padding: 0px 16px; }
.kc-mono > .kc-face { font: 600 13px/1.2 var(--font-mono,"JetBrains Mono",ui-monospace,monospace); letter-spacing: 0.02em; }
.kc-compact { --kc-h: 36px; }
.kc-compact > .kc-face { gap: 8px; padding: 0px 12px 0px 5px; font-size: 13px; }
.kc-compact .kc-well { width: 24px; height: 24px; }
@media (max-height: 760px){
.aia-clock.kc-on { right: clamp(200px, 23vw, 240px) !important; }
}
.pm-ring.kc-on { --kc-h: 30px; --kc-depth: 4px; }
.pm-ring.kc-on > .kc-face { gap: 6px; padding: 0px 10px 0px 4px; font-size: 12px; }
.pm-ring.kc-on .kc-well { width: 22px; height: 22px; }
@media (max-width: 1180px){
.pm-ring.kc-on .kc-well { display: none; }
.pm-ring.kc-on > .kc-face { padding: 0px 10px; }
}
.kc-face::after { content: ""; position: absolute; inset: 0px; border-radius: inherit; background: radial-gradient(110px circle at var(--kc-mx,50%) var(--kc-my,0%),rgba(255,255,255,.2),rgba(255,255,255,0) 62%); opacity: 0; transition: opacity 0.2s; pointer-events: none; }
.kc-face > :is(i:empty, .ck-cap-dot, .sw) { display: none !important; }
.kc-face b, .kc-face strong { font-weight: inherit; }
.kc-face .kc-t { min-width: 0px; overflow: hidden; text-overflow: ellipsis; }
.kc-well { flex: 0 0 auto; display: grid; place-items: center; width: 28px; height: 28px; border-radius: 50%; background: rgba(6, 10, 20, 0.78); box-shadow: rgba(0, 0, 0, 0.65) 0px 2px 4px inset, rgba(255, 255, 255, 0.08) 0px -1px 0px inset, rgba(255, 255, 255, 0.05) 0px 0px 0px 1px; color: var(--kc-c); transition: box-shadow 0.25s, color 0.25s; }
.kc-well svg { display: block; width: 14px; height: 14px; fill: none; stroke: currentcolor; stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; }
.kc-node:is(:hover, :focus-visible, :focus-within) > .kc-face { --kc-y: -2px; border-color: rgba(200, 220, 245, 0.5); }
.kc-inline:is(:hover, :focus-visible, :focus-within) > .kc-face { --kc-y: -1px; border-color: rgba(200, 220, 245, 0.5); }
.kc-on:hover > .kc-face::after, .kc-on.kc-hot > .kc-face::after { opacity: 1; }
.kc-node.kc-press > .kc-face { --kc-y: 4px; transition-duration: 0.06s; }
.kc-inline.kc-press > .kc-face { --kc-y: 1px; transition-duration: 0.06s; }
.kc-on:focus-visible, .kc-on:has(input:focus-visible) { border-radius: 12px; outline: rgb(245, 165, 36) solid 2px !important; outline-offset: 4px !important; }
.kc-on:is(.is-you, [aria-current="true"], [aria-current="step"], [aria-current="page"], [aria-selected="true"], [aria-pressed="true"], .is-active, .is-cur, .kc-act) .kc-well, .kc-on:has(input:checked) .kc-well { color: rgb(255, 199, 104); box-shadow: rgba(0, 0, 0, 0.6) 0px 2px 4px inset, rgba(245, 165, 36, 0.65) 0px 0px 0px 1px, rgba(245, 165, 36, 0.55) 0px 0px 14px; animation: 0.9s ease-out 0s 1 normal none running kcPulse; }
@keyframes kcPulse { 
  0% { transform: scale(1); }
  35% { transform: scale(1.14); }
  100% { transform: scale(1); }
}
.kc-inline:is([aria-pressed="true"], [aria-selected="true"], :has(input:checked)) > .kc-face { --kc-y: 1px; background: linear-gradient(rgba(245, 165, 36, 0.34), rgba(122, 77, 6, 0.62)); border-color: rgb(245, 165, 36); color: rgb(255, 246, 230); }
.kc-inline:is([aria-pressed="true"], :has(input:checked)) > .kc-face .box { border-color: rgb(255, 199, 104) !important; background: rgb(245, 165, 36) !important; }
.kc-node > .kc-face { animation: kcFloat 7s ease-in-out var(--kc-d,0s) infinite; }
@keyframes kcFloat { 
  0%, 100% { translate: 0px; }
  50% { translate: 0px -1.5px; }
}
.kc-on[data-port]::before { left: auto; right: auto; bottom: auto; transition: background 0.25s, box-shadow 0.25s; content: "" !important; display: block !important; position: absolute !important; z-index: 3 !important; width: 6px !important; height: 6px !important; margin: 0px !important; border-radius: 50% !important; background: rgb(10, 14, 26) !important; border: 0px !important; box-shadow: 0 0 0 1.5px var(--kc-c),0 0 0 3.5px rgba(10,14,26,.92) !important; top: calc(50% - 3px) !important; opacity: 1 !important; transform: none !important; translate: none !important; animation: auto ease 0s 1 normal none running none !important; }
.kc-on[data-port="r"]::before { right: -3px !important; left: auto !important; }
.kc-on[data-port="l"]::before { left: -3px !important; right: auto !important; }
.kc-on[data-port="t"]::before { top: -3px !important; left: calc(50% - 3px) !important; }
.kc-on[data-port="b"]::before { top: auto !important; bottom: -8px !important; left: calc(50% - 3px) !important; }
[data-theme="light"] .kc-inline:is([aria-pressed="true"], :has(input:checked)):not(:is(.mv, .nf-hero, .ty-hero, [data-kc-dark]) *) > .kc-face { background: linear-gradient(rgb(255, 243, 220), rgb(251, 226, 180)); border-color: rgb(201, 130, 16); color: rgb(61, 38, 0); }
[data-theme="light"] .kc-inline:is([aria-pressed="true"], :has(input:checked)):not(:is(.mv, .nf-hero, .ty-hero, [data-kc-dark]) *) { --kc-edge: #D9A54A; }
@media (prefers-reduced-motion: reduce){
.kc-face, .kc-well, .kc-on::after { transition: none !important; }
.kc-node > .kc-face { animation: auto ease 0s 1 normal none running none; }
.kc-on .kc-well { animation: auto ease 0s 1 normal none running none !important; }
}
.cap { --cap-c: #5EEAD4; --cap-edge: #0E5550; --cap-glow: rgba(45,212,191,.38); }
.cap[data-state="last"] { --cap-c: #FFC768; --cap-edge: #7A4D06; --cap-glow: rgba(245,165,36,.45); }
.cap[data-state="full"] { --cap-c: #9AA6B8; --cap-edge: #2A3140; --cap-glow: rgba(154,166,184,0); }
.cap-dot { position: relative; flex: 0 0 auto; width: 8px; height: 8px; border-radius: 50%; background: var(--cap-c); box-shadow: 0 0 0 3px color-mix(in srgb,var(--cap-c) 22%,transparent); }
.cap[data-state="full"] .cap-dot { background: transparent; box-shadow: inset 0 0 0 1.5px var(--cap-c); }
.cap:not([data-state="full"]) .cap-dot::after { content: ""; position: absolute; inset: -4px; border-radius: 50%; border: 1px solid var(--cap-c); opacity: 0; animation: 2.4s cubic-bezier(0.2, 0.8, 0.2, 1) 0s 2 normal none running capPing; }
@keyframes capPing { 
  0% { transform: scale(0.6); opacity: 0.7; }
  70%, 100% { transform: scale(1.8); opacity: 0; }
}
.cap-pill { display: inline-flex; align-items: center; gap: 10px; min-height: 36px; padding: 8px 14px 8px 12px; border: 1px solid var(--border-strong,rgba(170,196,232,.3)); background: color-mix(in srgb,var(--surface,#10141C) 70%,transparent); color: var(--fg-1,#EEF3FA); font: 500 13px/1.3 var(--font-sans,"Instrument Sans",system-ui,sans-serif); letter-spacing: 0px; margin: 0px; max-width: 100%; border-radius: 20px; text-wrap: pretty; }
@media (min-width: 421px){
.cap[data-state="open"] .cap-pill, .cap[data-state="last"] .cap-pill { white-space: nowrap; border-radius: 999px; }
}
@media (min-width: 641px){
.cap[data-state="full"] .cap-pill { white-space: nowrap; border-radius: 999px; }
.cap[data-state="full"] .cap-pill .cap-dot { align-self: center; margin-top: 0px; }
}
.cap-pill .cap-dot { align-self: flex-start; margin-top: 5px; }
.cap-pill .cap-t { min-width: 0px; }
.cap-panel { display: grid; grid-template-columns: minmax(0px, 1fr) minmax(0px, 1fr); gap: clamp(32px, 5vw, 80px); align-items: center; }
@media (max-width: 900px){
.cap-panel { grid-template-columns: 1fr; gap: 36px; }
}
.cap-eyebrow { font-family: var(--font-mono); font-size: 11px; text-transform: uppercase; letter-spacing: var(--tracking-caps,.14em); color: var(--brand-sun,#F5A524); display: inline-flex; align-items: center; gap: 10px; margin: 0px; }
.cap-eyebrow::before { content: ""; width: 24px; height: 1px; background: currentcolor; }
.cap-h { font-size: clamp(30px, 3.6vw, 52px); line-height: 1.02; letter-spacing: -0.025em; margin: 18px 0px 0px; max-width: 16ch; text-wrap: balance; color: var(--fg-1); }
.cap-body { color: var(--fg-2); font-size: 17px; line-height: 1.6; max-width: 48ch; margin: 20px 0px 0px; text-wrap: pretty; }
.cap-board { display: flex; flex-direction: column; gap: 26px; align-items: flex-start; }
.cap-slots { list-style: none; margin: 0px; padding: 0px 0px 6px; display: flex; flex-wrap: wrap; gap: clamp(10px, 1.4vw, 16px); width: 100%; }
.cap-slot { position: relative; isolation: isolate; flex: 1 1 0px; min-width: 84px; max-width: 150px; width: clamp(112px, 10vw, 150px); }
.cap-slot::after { content: ""; position: absolute; inset: 6px 0px -6px; border-radius: 14px; background: linear-gradient(180deg,var(--slot-edge),color-mix(in srgb,var(--slot-edge) 62%,#000)); box-shadow: 0 14px 26px -12px var(--slot-glow),inset 0 -1px 0 rgba(0,0,0,.35); z-index: -1; }
.cap-face { position: relative; box-sizing: border-box; width: 100%; min-height: 96px; display: flex; flex-direction: column; align-items: flex-start; justify-content: space-between; gap: 14px; padding: 14px 16px; border-radius: 14px; border: 1px solid rgba(170, 196, 232, 0.3); background: linear-gradient(rgba(46, 62, 96, 0.97), rgba(19, 28, 48, 0.97)); box-shadow: rgba(255, 255, 255, 0.16) 0px 1px 0px inset, rgba(0, 0, 0, 0.25) 0px -1px 0px inset; color: rgb(238, 243, 250); font: 600 15px/1.2 var(--font-sans,"Instrument Sans",system-ui,sans-serif); text-decoration: none; text-align: left; transition: transform 0.18s cubic-bezier(0.2, 0.8, 0.2, 1), border-color 0.2s; }
.cap-ico { display: grid; place-items: center; width: 30px; height: 30px; border-radius: 50%; background: rgba(6, 10, 20, 0.78); box-shadow: rgba(0, 0, 0, 0.65) 0px 2px 4px inset, rgba(255, 255, 255, 0.05) 0px 0px 0px 1px; color: var(--slot-c); }
.cap-ico svg { width: 14px; height: 14px; fill: none; stroke: currentcolor; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }
.cap-slot.is-open { --slot-c: #5EEAD4; --slot-edge: #0E5550; --slot-glow: rgba(45,212,191,.5); }
.cap-slot.is-open .cap-face { cursor: pointer; border-color: rgba(94, 234, 212, 0.45); box-shadow: rgba(255, 255, 255, 0.16) 0px 1px 0px inset, rgba(45, 212, 191, 0.32) 0px 0px 22px -4px; animation: 3s ease-in-out 0s 2 normal none running capGlow; }
.cap-slot.is-open .cap-face:hover { transform: translateY(-2px); border-color: rgba(94, 234, 212, 0.8); }
.cap-slot.is-open .cap-face:active { transform: translateY(3px); }
.cap-slot.is-open .cap-face:focus-visible { outline: rgb(94, 234, 212) solid 2px; outline-offset: 4px; }
@keyframes capGlow { 
  0%, 100% { box-shadow: rgba(255, 255, 255, 0.16) 0px 1px 0px inset, rgba(45, 212, 191, 0.32) 0px 0px 22px -4px; }
  50% { box-shadow: rgba(255, 255, 255, 0.16) 0px 1px 0px inset, rgba(45, 212, 191, 0.42) 0px 0px 26px -2px; }
}
.cap-slot.is-taken { --slot-c: #8793A6; --slot-edge: #232A36; --slot-glow: rgba(0,0,0,0); }
.cap-slot.is-taken::after { top: 1px; bottom: -1px; }
.cap-slot.is-taken .cap-face { transform: translateY(5px); background: linear-gradient(rgba(30, 38, 54, 0.96), rgba(15, 20, 32, 0.96)); border-color: rgba(170, 196, 232, 0.14); color: rgb(142, 154, 173); box-shadow: rgba(0, 0, 0, 0.55) 0px 2px 6px inset; }
.cap .cap-slots .cap-slot a.cap-face { color: rgb(238, 243, 250); text-decoration: none; }
.cap-cta { white-space: nowrap; }
.cap-slots--compact { gap: 8px; padding-bottom: 4px; }
.cap-slots--compact .cap-slot { flex: 1 1 0px; min-width: 60px; max-width: 104px; width: auto; }
.cap-slots--compact .cap-slot::after { top: 4px; bottom: -4px; border-radius: 10px; }
.cap-slots--compact .cap-slot.is-taken::after { top: 1px; bottom: -1px; }
.cap-slots--compact .cap-face { min-height: 60px; padding: 9px 10px; gap: 6px; border-radius: 10px; font-size: 12.5px; }
.cap-slots--compact .cap-slot.is-taken .cap-face { transform: translateY(3px); }
.cap-slots--compact .cap-ico { width: 22px; height: 22px; }
.cap-slots--compact .cap-ico svg { width: 11px; height: 11px; }
.cap-status { display: flex; align-items: center; gap: 10px; margin: 0px; color: var(--fg-1); font-size: 15px; font-weight: 500; line-height: 1.4; }
.cap-cta { min-height: 44px; }
.cap-bar { display: none; }
@media (max-width: 767px){
.cap-bar { display: flex; position: fixed; left: 0px; right: 0px; bottom: 0px; z-index: 97; align-items: center; gap: 12px; padding: 10px clamp(14px,4vw,20px) calc(10px + env(safe-area-inset-bottom)); background: rgba(10, 12, 17, 0.97); border-top: 1px solid var(--border-strong); transform: translateY(105%); transition: transform 320ms cubic-bezier(0.2, 0.8, 0.2, 1); }
.cap-bar.is-on { transform: none; }
.cap-bar-t { flex: 1 1 0%; min-width: 0px; display: flex; align-items: center; gap: 10px; margin: 0px; color: rgb(238, 243, 250); font: 500 13px/1.3 var(--font-sans,system-ui,sans-serif); }
.cap-bar-cta { flex: 0 0 auto; white-space: nowrap; display: inline-flex; align-items: center; justify-content: center; min-height: 44px; padding: 10px 16px; border-radius: var(--radius-sm,8px); background: var(--ck-sig,#3AA0D2); color: var(--ck-on,#05131D); font-size: 14px; font-weight: 600; text-decoration: none; }
.cap-bar-cta:focus-visible { outline: rgb(255, 255, 255) solid 2px; outline-offset: 2px; }
body.cap-has-bar .ck-mbar, body.cap-has-bar .om-sticky { display: none !important; }
body.cap-has-bar { padding-bottom: calc(66px + env(safe-area-inset-bottom)) !important; }
}
[data-theme="light"] .cap-bar { background: rgba(250, 251, 253, 0.97); }
[data-theme="light"] .cap-bar-t { color: var(--fg-1); }
@media (prefers-reduced-motion: reduce){
.cap-dot::after, .cap-slot.is-open .cap-face { animation: auto ease 0s 1 normal none running none !important; }
.cap-bar { transition: none; }
.cap-face { transition: none; }
}
.cap[data-state="full"] .cap-slot.is-open .cap-face { animation: auto ease 0s 1 normal none running none; cursor: default; border-color: rgba(170, 196, 232, 0.3); box-shadow: rgba(255, 255, 255, 0.12) 0px 1px 0px inset; }
.cap[data-state="full"] .cap-slot.is-open { --slot-c: #9AA6B8; --slot-edge: #2A3140; --slot-glow: rgba(0,0,0,0); }
.cap-wl { display: flex; flex-direction: column; gap: 18px; }
.cap-wl[hidden], .cap-wl [hidden], .cap-wl-on form[hidden] { display: none !important; }
.cap-wl-h { margin: 0px; font-size: clamp(24px, 2.6vw, 34px); line-height: 1.08; letter-spacing: -0.02em; color: var(--fg-1); }
.cap-wl-h:focus { outline: none; }
.cap-wl .ck-row { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
@media (max-width: 640px){
.cap-wl .ck-row { grid-template-columns: 1fr; }
}
.cap-wl-note { margin: 0px; color: var(--fg-2); font-size: 14px; line-height: 1.5; }
.cap-wl-row { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 20px; }
.cap-wl-send { min-height: 44px; white-space: nowrap; flex: 0 0 auto; }
.cap-wl-row .ck-consent { flex: 1 1 260px; margin: 0px; }
.cap-wl-back { background: none; border: 0px; padding: 0px; min-height: 44px; color: var(--ck-sig,#3AA0D2); font: 600 14px var(--font-sans,system-ui,sans-serif); text-decoration: underline; text-underline-offset: 3px; cursor: pointer; }
.cap-wl-back:focus-visible { outline: 2px solid var(--ck-sig,#3AA0D2); outline-offset: 3px; }
.cap-wl-ok:focus { outline: none; }
.cap-wl-ok p { margin: 10px 0px 0px; color: var(--fg-2); font-size: 16px; line-height: 1.55; }
.cap-hero { margin-top: 16px; }
footer.footer { font-family: var(--font-sans,"Instrument Sans",system-ui,sans-serif); }
footer.footer > .container { width: 100%; max-width: 1440px; margin: 0px auto; padding: 0px clamp(20px, 4vw, 48px); position: relative; }
.lang-switch { display: flex; flex: 0 0 auto; border: 1px solid var(--border-strong); border-radius: var(--radius-sm); overflow: hidden; }
.lang-switch button { background: transparent; border-top: 0px; border-bottom: 0px; border-left: 0px; border-image: none; border-right: 1px solid var(--border-strong); color: var(--fg-3); font-family: var(--font-mono); font-size: 11px; letter-spacing: var(--tracking-caps); padding: 9px 12px; cursor: pointer; transition: color var(--dur-base) var(--ease-out), background var(--dur-base) var(--ease-out); }
.lang-switch button:last-child { border-right: 0px; }
.lang-switch button:hover { color: var(--fg-1); }
.lang-switch button.is-on { background: rgba(58, 160, 210, 0.12); color: var(--signal); }
.lang-switch button:focus-visible { outline: 2px solid var(--signal); outline-offset: -2px; }
@media (max-width: 640px){
.lang-switch button { padding: 9px; }
}
@media (max-width: 767px){
.nav-tools .lang-switch { display: none !important; }
}
.m-menu .m-langs { display: flex; gap: 8px; margin: 26px 0px 0px; }
.m-menu .m-langs button { border: 1px solid var(--border-strong); background: transparent; color: var(--fg-3); font-family: var(--font-mono); font-size: 12px; letter-spacing: 0.1em; padding: 10px 16px; border-radius: var(--radius-sm); min-height: 44px; cursor: pointer; }
.m-menu .m-langs button.is-on { color: var(--signal); border-color: var(--signal); background: rgba(58, 160, 210, 0.1); }
html body, html body :not(svg):not(svg *), html body svg text { font-family: Roboto, system-ui, -apple-system, "Segoe UI", sans-serif !important; }
:root { --font-display: "Roboto",system-ui,sans-serif; --font-sans: "Roboto",system-ui,sans-serif; --font-mono: "Roboto",system-ui,sans-serif; --aag-sun: #FCB913; --aag-loch: #0080C3; --aag-green: #00A551; --aag-ink: #1F1F1F; }
.sec-head h2, .hero h1, .check-panel h3, .m-menu ul a { font-weight: 700 !important; }
a { color: rgb(58, 160, 210); }
a:hover { color: rgb(252, 185, 19); }
.lt { display: inline-flex; align-items: center; justify-content: center; flex: 0 0 auto; width: 1em; height: 1em; border-radius: 0.24em; background: rgb(255, 255, 255); box-shadow: rgba(31, 31, 31, 0.08) 0px 0px 0px 1px, rgba(0, 0, 0, 0.25) 0px 0.08em 0.2em; overflow: hidden; vertical-align: middle; }
.lt img { display: block; width: 76%; height: 76%; object-fit: contain; }
.aag-btn:focus-visible, .aag-x-b:focus-visible, .aw-tab:focus-visible, .a3:focus-visible { outline: rgb(252, 185, 19) solid 2px; outline-offset: 3px; }
.rot { position: relative; display: inline-flex; vertical-align: bottom; color: rgb(58, 160, 210); }
.rw { position: absolute; left: 0px; bottom: 0px; display: inline-flex; align-items: center; gap: 0.16em; white-space: nowrap; opacity: 0; transform: translate3d(0px, 0.35em, 0px); transition: opacity 0.35s, transform 0.45s cubic-bezier(0.2, 0.8, 0.2, 1); }
.rw.is-on { position: relative; opacity: 1; transform: none; }
.rw .lt { width: 0.74em; height: 0.74em; margin-right: 0.04em; }
.ao { position: relative; --p: 0; }
.ao { --Rb: min(220px,36vw); --R: calc(var(--Rb)*(1 - var(--p)*.34)); }
@keyframes aoSpin { 
  100% { transform: rotateZ(360deg); }
}
.aw { position: relative; padding-top: clamp(72px, 9vw, 120px); border-top: 1px solid var(--border-2); }
.a3 { position: relative; padding: 26px 24px 24px; border-radius: 16px; border: 1px solid var(--border-1); background: linear-gradient(160deg,rgba(0,128,195,.12),rgba(0,128,195,0) 60%),var(--surface,rgba(15,19,26,.6)); transition: transform 0.25s cubic-bezier(0.2, 0.8, 0.2, 1), border-color 0.25s, box-shadow 0.25s; cursor: default; outline: none; }
.a3 h3 { margin-top: 18px; font-size: 30px; font-weight: 700; letter-spacing: -0.02em; color: var(--fg-1); }
.a3:hover, .a3:focus-visible, .a3.is-on { transform: translateY(-4px); border-color: rgba(58, 160, 210, 0.6); box-shadow: rgba(0, 128, 195, 0.8) 0px 24px 50px -28px; }
@media (max-width: 640px){
.ao { --Rb: min(150px,36vw); }
}
@media (prefers-reduced-motion: reduce){
.rw, .aag-x-d, .aw-steps li, .a3, .a3-st i, .a3-chk li, .a3-chk li i::after { transition: none !important; }
}
@media (prefers-reduced-motion: no-preference){
html { scroll-behavior: smooth; }
}
html:not([data-theme="light"]) { --fg-4: #7d8697; }
.cap-hero:empty { min-height: 36px; }
@media (max-width: 767px){
.nav, .nav * { backdrop-filter: none !important; }
.nav.is-scrolled { background-color: color-mix(in srgb,var(--bg,#05070b) 94%,transparent); }
.grain { animation: auto ease 0s 1 normal none running none !important; }
main > section:first-of-type, main > section:first-of-type *, main > section:first-of-type ::before, main > section:first-of-type ::after, .hero, .hero *, .hero ::before, .hero ::after, #hero, #hero *, .jr-ch0, .jr-ch0 *, .jr-ch0 ::before, .jr-ch0 ::after { animation: auto ease 0s 1 normal none running none !important; backdrop-filter: none !important; }
}
@supports (content-visibility:auto){
html:not(.cv-off) [data-cv] { content-visibility: auto; contain-intrinsic-size: auto 900px; }
}
@media (max-width: 767px){
body { padding-bottom: calc(56px + env(safe-area-inset-bottom)); }
body.ck-app-open { padding-bottom: 0px; }
.ck-mbar { transition: transform 0.3s cubic-bezier(0.2, 0.8, 0.2, 1); will-change: transform; }
body.cc-open .ck-mbar { bottom: 0px !important; transform: translateY(calc(-1 * var(--cc-h,0px))); }
}
.cga-eb { display: inline-block; font-size: 13px; font-weight: 600; letter-spacing: 0.08em; text-transform: uppercase; color: var(--signal,#3AA0D2); }
.cga-h1 { margin: 14px 0px 0px; font-size: clamp(40px, 5.4vw, 76px); line-height: 1.02; font-weight: 800; letter-spacing: -0.03em; color: var(--fg-1); text-wrap: balance; }
.cga-h1 em { font-style: normal; color: rgb(252, 185, 19); }
.cga-sub { margin: 20px 0px 0px; max-width: 52ch; font-size: clamp(16px, 1.3vw, 19px); line-height: 1.55; color: var(--fg-2); text-wrap: pretty; }
.cga-ctas { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 26px; }
.cga-btn { white-space: nowrap; display: inline-flex; align-items: center; gap: 8px; min-height: 48px; padding: 0px 22px; border-radius: 12px; font-weight: 600; font-size: 15px; text-decoration: none; }
.cga-btn--sun { background: rgb(252, 185, 19); color: rgb(17, 17, 17); }
.cga-btn--ghost { border: 1px solid var(--border-strong,rgba(255,255,255,.25)); color: var(--fg-1); }
.cga-serp { padding: 16px; border-radius: 14px; background: rgb(255, 255, 255); color: rgb(31, 31, 31); font-size: 13px; display: grid; gap: 10px; }
.cga-serp .r { padding: 10px; border-radius: 10px; background: rgb(246, 246, 246); }
.cga-serp .r.top { background: rgb(234, 244, 251); border: 1px solid rgb(191, 224, 242); }
.cga-serp .r small { display: block; color: rgb(95, 99, 104); font-size: 11px; }
:root { --cg2-lo: #0080C3; --cg2-sun: #FCB913; --cg2-gh: #00A551; --cg2-ink: #1F1F1F; --cg2-e: cubic-bezier(.2,.8,.2,1); }
.cg2-sr { width: 1px; height: 1px; padding: 0px; margin: -1px; overflow: hidden; clip: rect(0px, 0px, 0px, 0px); white-space: nowrap; border: 0px; position: absolute !important; }
html.js-reveal .cg2-rv:not(.is-in) { opacity: 0; transform: translateY(14px); }
.cg2-rv { transition-property: ; transition-duration: ; transition-timing-function: ; transition-behavior: ; transition-delay: calc(var(--i,0) * 60ms); }
.cg2-foot { margin-top: 18px; font-size: 13px; line-height: 1.5; color: var(--fg-2); }
.cg2-concept { display: inline-flex; align-items: center; padding: 2px 8px; border-radius: 999px; border: 1px solid rgb(214, 214, 214); font-size: 12px; font-weight: 700; letter-spacing: 0.04em; text-transform: uppercase; color: rgb(74, 74, 74); }
.cg2-hero { position: relative; padding: calc(var(--nav-h,96px) + clamp(28px,4vw,56px)) 0 clamp(56px,7vw,96px); overflow: clip; background: radial-gradient(60% 50% at 78% 30%, rgba(0, 128, 195, 0.22), transparent 70%), radial-gradient(40% 40% at 12% 80%, rgba(252, 185, 19, 0.08), transparent 70%); }
.cg2-hgrid { display: grid; grid-template-columns: minmax(0px, 0.92fr) minmax(0px, 1.08fr); gap: clamp(32px, 5vw, 72px); align-items: center; }
.cg2-copy .cga-h1 { margin-top: 14px; }
.cg2-copy .cga-sub { max-width: 52ch; }
.cg2-sim { margin: 0px; display: grid; grid-template-columns: 104px minmax(0px, 1fr); gap: 16px; align-items: center; }
.cg2-meter { align-self: stretch; display: grid; grid-template-rows: auto minmax(0px, 1fr); gap: 12px; padding: 6px 0px; }
.cg2-mt { font-size: 12px; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; color: var(--fg-2); }
.cg2-mbody { display: grid; grid-template-columns: 8px minmax(0px, 1fr); gap: 12px; min-height: 0px; }
.cg2-mtrack { position: relative; border-radius: 8px; background: var(--border-2); overflow: hidden; }
.cg2-mtrack i { position: absolute; inset: 0px; background: linear-gradient(0deg, rgb(0, 165, 81), rgb(63, 210, 134)); transform-origin: 50% 100%; transform: scaleY(0.2); transition: transform 1s var(--cg2-e); }
.cg2-meter[data-stage="1"] .cg2-mtrack i { transform: scaleY(0.58); }
.cg2-meter[data-stage="2"] .cg2-mtrack i { transform: scaleY(1); }
.cg2-meter ol { list-style: none; margin: 0px; padding: 0px; display: flex; flex-direction: column-reverse; justify-content: space-between; }
.cg2-meter li { font-size: 13px; line-height: 1.3; color: var(--fg-2); transition: color 0.4s; }
.cg2-meter[data-stage="0"] li:nth-child(1), .cg2-meter[data-stage="1"] li:nth-child(-n+2), .cg2-meter[data-stage="2"] li { color: var(--fg-1); }
.cg2-meter[data-stage="2"] li:nth-child(3) { color: rgb(63, 210, 134); font-weight: 700; }
.cg2-frame { min-width: 0px; }
.cg2-win { position: relative; background: rgb(255, 255, 255); color: rgb(13, 13, 13); border-radius: 22px; height: clamp(560px, 66vh, 640px); display: flex; flex-direction: column; overflow: hidden; font-size: 16px; line-height: 1.55; box-shadow: rgba(0, 0, 0, 0.7) 0px 40px 90px -30px, rgba(255, 255, 255, 0.1) 0px 0px 0px 1px; transform: perspective(1800px) rotateY(-5deg) rotateX(2deg); transform-origin: 30% 50%; }
.cg2-top { display: flex; align-items: center; justify-content: space-between; padding: 12px 16px; border-bottom: 1px solid rgb(239, 239, 239); flex: 0 0 auto; }
.cg2-model { display: inline-flex; align-items: center; gap: 6px; font-size: 17px; font-weight: 500; color: rgb(13, 13, 13); }
.cg2-model svg { width: 14px; height: 14px; color: rgb(107, 107, 107); }
.cg2-ticons { display: flex; gap: 14px; color: rgb(107, 107, 107); }
.cg2-ticons svg { width: 20px; height: 20px; }
.cg2-log { position: relative; flex: 1 1 0%; min-height: 0px; overflow: hidden; }
.cg2-feed { display: flex; flex-direction: column; gap: 18px; padding: 18px 20px 22px; transition: transform .5s var(--cg2-e),opacity .4s; }
.cg2-feed.is-fade { opacity: 0; }
.cg2-u { align-self: flex-end; max-width: 82%; background: rgb(244, 244, 244); border-radius: 22px; padding: 10px 16px; color: rgb(13, 13, 13); }
.cg2-a { display: grid; grid-template-columns: 28px minmax(0px, 1fr); gap: 12px; align-items: start; }
.cg2-av { width: 28px; height: 28px; border-radius: 50%; border: 1px solid rgb(227, 227, 227); display: grid; place-items: center; color: rgb(13, 13, 13); }
.cg2-av svg { width: 16px; height: 16px; }
.cg2-ab p { margin: 0px 0px 10px; }
.cg2-ab ul { margin: 0px 0px 12px; padding-left: 20px; }
.cg2-ab li { margin: 4px 0px; }
.cg2-ab b { font-weight: 700; }
.cg2-srch { font-size: 14px; color: rgb(93, 93, 93); margin: 2px 0px 8px; display: inline-flex; align-items: center; gap: 6px; }
.cg2-srch svg { width: 14px; height: 14px; }
.cg2-srch.is-busy span { background: linear-gradient(90deg, rgb(93, 93, 93) 0%, rgb(93, 93, 93) 35%, rgb(189, 189, 189) 50%, rgb(93, 93, 93) 65%, rgb(93, 93, 93) 100%) 0% 0% / 220% 100% text; color: transparent; animation: 1.4s linear 0s infinite normal none running cg2Shim; }
@keyframes cg2Shim { 
  0% { background-position: 120% 0px; }
  100% { background-position: -100% 0px; }
}
.cg2-chip { display: inline-flex; align-items: center; margin-left: 6px; padding: 1px 9px; border-radius: 999px; background: rgb(237, 237, 237); color: rgb(77, 77, 77); font-size: 12px; line-height: 20px; font-weight: 500; white-space: nowrap; vertical-align: 1px; transition: background-color 0.7s, box-shadow 0.7s, color 0.7s; }
.cg2-chip.is-new { background: rgb(252, 185, 19); color: rgb(31, 31, 31); box-shadow: rgba(252, 185, 19, 0.35) 0px 0px 0px 4px; }
.cg2-srcs { display: inline-flex; align-items: center; gap: 8px; border: 1px solid rgb(227, 227, 227); border-radius: 999px; padding: 4px 12px 4px 6px; font-size: 13px; font-weight: 500; color: rgb(60, 60, 60); }
.cg2-favs { display: flex; }
.cg2-favs svg { width: 20px; height: 20px; border-radius: 50%; border: 2px solid rgb(255, 255, 255); margin-left: -6px; }
.cg2-favs svg:first-child { margin-left: 0px; }
.cg2-spon { margin-left: 40px; border: 1px solid rgb(227, 227, 227); border-radius: 16px; padding: 12px 14px; display: grid; gap: 10px; background: rgb(255, 255, 255); }
.cg2-spl { font-size: 12px; font-weight: 500; color: rgb(93, 93, 93); }
.cg2-sprow { display: grid; grid-template-columns: 40px minmax(0px, 1fr); gap: 12px; align-items: center; }
.cg2-splg { width: 40px; height: 40px; border-radius: 10px; background: rgb(0, 128, 195); color: rgb(255, 255, 255); display: grid; place-items: center; font-weight: 900; font-size: 18px; }
.cg2-sprow b { display: block; font-size: 15px; }
.cg2-sprow small { display: block; font-size: 14px; color: rgb(77, 77, 77); }
.cg2-spbtn { justify-self: start; background: rgb(13, 13, 13); color: rgb(255, 255, 255); border-radius: 999px; padding: 8px 16px; font-size: 14px; font-weight: 500; }
.cg2-in { flex: 0 0 auto; margin: 6px 14px 14px; border: 1px solid rgb(227, 227, 227); border-radius: 28px; box-shadow: rgba(0, 0, 0, 0.06) 0px 2px 10px; display: flex; align-items: center; gap: 10px; padding: 10px 10px 10px 18px; height: 56px; }
.cg2-field { flex: 1 1 0%; min-width: 0px; height: 24px; overflow: hidden; position: relative; font-size: 16px; line-height: 24px; }
.cg2-ph { position: absolute; inset: 0px; color: rgb(107, 107, 107); }
.cg2-typed { display: block; color: rgb(13, 13, 13); transition: transform 0.2s; }
.cg2-field.has-text .cg2-ph { visibility: hidden; }
.cg2-send { flex: 0 0 auto; width: 36px; height: 36px; border-radius: 50%; background: rgb(215, 215, 215); color: rgb(255, 255, 255); display: grid; place-items: center; transition: background-color 0.2s; }
.cg2-send svg { width: 18px; height: 18px; }
.cg2-field.has-text + .cg2-send { background: rgb(13, 13, 13); }
.cg2-enter { opacity: 0; transform: translateY(8px); }
.cg2-feed > * { transition: opacity .45s var(--cg2-e),transform .45s var(--cg2-e); }
.cg2-cap { grid-column: 1 / -1; margin: 4px 0px 0px; font-size: 13px; color: var(--fg-2); text-align: center; }
@media (max-width: 1023px){
.cg2-hgrid { grid-template-columns: minmax(0px, 1fr); }
.cg2-win { transform: none; }
}
@media (max-width: 767px){
.cg2-sim { grid-template-columns: minmax(0px, 1fr); gap: 12px; }
.cg2-meter { grid-template-rows: auto auto; gap: 8px; padding: 0px; }
.cg2-mbody { grid-template-columns: minmax(0px, 1fr); grid-template-rows: 8px auto; gap: 8px; }
.cg2-mtrack i { background: linear-gradient(90deg, rgb(0, 165, 81), rgb(63, 210, 134)); transform-origin: 0px 50%; transform: scaleX(0.2); }
.cg2-meter[data-stage="1"] .cg2-mtrack i { transform: scaleX(0.58); }
.cg2-meter[data-stage="2"] .cg2-mtrack i { transform: scaleX(1); }
.cg2-meter ol { flex-direction: row; }
.cg2-frame { border-radius: 44px; padding: 10px; background: rgb(17, 17, 17); box-shadow: rgba(0, 0, 0, 0.8) 0px 30px 60px -30px, rgba(255, 255, 255, 0.12) 0px 0px 0px 1px inset; }
.cg2-win { border-radius: 34px; height: 600px; box-shadow: none; }
.cg2-top { padding-top: 16px; }
.cg2-feed { padding: 16px 14px 20px; }
.cg2-spon { margin-left: 0px; }
.cg2-in { margin: 6px 10px 12px; }
}
.cg2-facts { display: grid; grid-template-columns: repeat(4, minmax(0px, 1fr)); gap: 16px; }
.cg2-fact { position: relative; border-right-color: ; border-right-style: ; border-right-width: ; border-bottom-color: ; border-bottom-style: ; border-bottom-width: ; border-left-color: ; border-left-style: ; border-left-width: ; border-image-source: ; border-image-slice: ; border-image-width: ; border-image-outset: ; border-image-repeat: ; border-top: 3px solid rgb(0, 128, 195); border-radius: 18px; padding: 22px; background: var(--surface); display: flex; flex-direction: column; gap: 10px; min-height: 210px; }
.cg2-fv { margin: 0px; font-size: clamp(40px, 4.4vw, 58px); font-weight: 900; letter-spacing: -0.03em; line-height: 1; color: var(--fg-1); font-variant-numeric: tabular-nums; }
.cg2-fv.is-word { font-size: clamp(30px, 3.2vw, 42px); }
.cg2-fl { margin: 0px; font-size: 16px; line-height: 1.45; color: var(--fg-1); }
.cg2-fs { margin: auto 0px 0px; font-size: 13px; color: var(--fg-2); }
@media (max-width: 1023px){
.cg2-facts { grid-template-columns: repeat(2, minmax(0px, 1fr)); }
}
@media (max-width: 560px){
.cg2-facts { grid-template-columns: minmax(0px, 1fr); }
.cg2-fact { min-height: 0px; }
}
.cg2-lanes { display: grid; grid-template-columns: minmax(0px, 1fr) minmax(0px, 1fr); gap: 20px; }
.cg2-lane { border: 1px solid var(--border-1); border-radius: 20px; padding: clamp(16px, 2.4vw, 24px); background: var(--surface); display: flex; flex-direction: column; gap: 18px; }
.cg2-lane h3 { margin: 0px; font-size: 20px; display: flex; align-items: baseline; justify-content: space-between; gap: 12px; }
.cg2-lane h3 small { font-size: 13px; font-weight: 500; color: var(--fg-2); }
.cg2-lane > p { margin: 0px; color: var(--fg-2); font-size: 15px; line-height: 1.5; }
.cg2-mock { position: relative; border-radius: 14px; padding: 14px; height: 300px; overflow: hidden; }
.cg2-mock--s { background: rgb(236, 238, 241); }
.cg2-tabs { display: flex; gap: 6px; margin-bottom: 12px; }
.cg2-tabs i { flex: 1 1 0%; height: 18px; border-radius: 6px 6px 2px 2px; background: rgb(207, 211, 217); transform: scale(0.6); opacity: 0; transition-property: ; transition-duration: ; transition-timing-function: ; transition-behavior: ; transition-delay: calc(var(--n) * 260ms + 200ms); }
.cg2-rows { display: grid; gap: 9px; }
.cg2-row { background: rgb(255, 255, 255); border-radius: 8px; padding: 8px 10px; display: grid; gap: 5px; transform: translate(var(--x,0),var(--y,0)) rotate(var(--r,0deg)); transition-property: ; transition-duration: ; transition-timing-function: ; transition-behavior: ; transition-delay: calc(var(--n) * 90ms); }
.cg2-row b { display: block; height: 8px; width: 62%; border-radius: 4px; background: rgb(138, 164, 200); }
.cg2-row i { display: block; height: 6px; width: 92%; border-radius: 3px; background: rgb(221, 224, 229); }
.cg2-row.ad b { background: rgb(185, 194, 207); }
.cg2-row.ad::before { content: "Ad"; font-size: 11px; font-weight: 700; color: rgb(60, 65, 72); }
.cg2-lane.is-play .cg2-tabs i { transform: none; opacity: 1; }
.cg2-lane.is-play .cg2-row { --x: calc(var(--sx) * 1px); --y: calc(var(--sy) * 1px); --r: calc(var(--sr) * 1deg); }
.cg2-mock--c { background: rgb(255, 255, 255); color: rgb(13, 13, 13); display: flex; flex-direction: column; gap: 10px; font-size: 14px; line-height: 1.45; }
.cg2-mock--c > * { opacity: 0; transform: translateY(8px); transition-property: ; transition-duration: ; transition-timing-function: ; transition-behavior: ; transition-delay: calc(var(--n) * 650ms + 200ms); }
.cg2-lane.is-play .cg2-mock--c > * { opacity: 1; transform: none; }
.cg2-mu { align-self: flex-end; max-width: 85%; background: rgb(244, 244, 244); border-radius: 16px; padding: 7px 12px; }
.cg2-ma { max-width: 92%; }
.cg2-mrec { border: 1px solid rgb(227, 227, 227); border-radius: 12px; padding: 9px 12px; display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.cg2-mrec b { font-size: 14px; }
.cg2-ok { display: inline-flex; align-items: center; gap: 6px; padding: 3px 10px; border-radius: 999px; background: rgb(227, 246, 236); color: rgb(0, 107, 53); font-size: 13px; font-weight: 700; }
.cg2-gauge { position: relative; padding-top: 18px; }
.cg2-gauge::before { content: ""; position: absolute; left: 50%; top: -18px; height: 30px; border-left: 2px dashed var(--border-strong); }
.cg2-gtrack { position: relative; height: 10px; border-radius: 10px; background: var(--border-2); overflow: hidden; }
.cg2-gtrack i { position: absolute; inset: 0px; transform-origin: 0px 50%; transform: scaleX(0.22); transition: transform 1.4s var(--cg2-e); background: rgb(139, 144, 153); }
.cg2-lane--ai .cg2-gtrack i { background: linear-gradient(90deg, rgb(0, 128, 195), rgb(0, 165, 81)); transform: scaleX(0.22); transition-delay: 2.6s; }
.cg2-lane--ai.is-play .cg2-gtrack i { transform: scaleX(1); }
.cg2-glab { display: flex; justify-content: space-between; margin-top: 8px; font-size: 13px; color: var(--fg-2); }
.cg2-gnow { margin: 10px 0px 0px; font-size: 15px; font-weight: 700; color: var(--fg-1); }
.cg2-lane--ai .cg2-gnow b { color: rgb(63, 210, 134); }
.cg2-why { margin: 22px 0px 0px; font-size: clamp(18px, 1.8vw, 22px); line-height: 1.5; color: var(--fg-1); max-width: 60ch; text-wrap: pretty; }
@media (max-width: 767px){
.cg2-lanes { grid-template-columns: minmax(0px, 1fr); }
}
.cg2-sec { position: relative; padding: clamp(72px, 9vw, 120px) 0px; border-top: 1px solid var(--border-2); }
.cg2-eng-stage { position: relative; }
.cg2-eng { display: grid; grid-template-columns: minmax(0px, 1fr) minmax(0px, 1.05fr) minmax(0px, 1fr); gap: clamp(16px, 2.4vw, 36px); align-items: center; }
.cg2-elane h3 { margin: 0px 0px 12px; font-size: 18px; display: flex; align-items: center; gap: 10px; }
.cg2-elane h3::before { content: ""; width: 12px; height: 12px; border-radius: 4px; background: var(--lc); }
.cg2-elane--ctx { --lc: #0080C3; --dx: -36px; }
.cg2-elane--ads { --lc: #FCB913; --dx: 36px; }
.cg2-plates { list-style: none; margin: 0px; padding: 0px; display: grid; gap: 10px; }
.cg2-pl { --k: 1; position: relative; border: 1px solid var(--border-1); border-radius: 14px; padding: 11px 14px 11px 18px; background: var(--surface); transform: translateX(calc((1 - var(--k)) * var(--dx))); will-change: transform; }
.cg2-pl::before { content: ""; position: absolute; left: 0px; top: 10px; bottom: 10px; width: 4px; border-radius: 0px 4px 4px 0px; background: var(--lc); transform-origin: 50% 50%; transform: scaleY(var(--k)); }
.cg2-pl::after { content: ""; position: absolute; inset: 0px; border-radius: inherit; box-shadow: 0 18px 30px -16px rgba(0,0,0,.65),0 0 0 1px color-mix(in srgb,var(--lc) 55%,transparent); opacity: var(--k); pointer-events: none; }
.cg2-pl b { display: block; font-size: 15px; line-height: 1.3; }
.cg2-pl span { display: block; font-size: 14px; line-height: 1.4; color: var(--fg-2); }
.cg2-ocol { position: relative; }
.cg2-beam { position: absolute; top: 50%; height: 3px; width: clamp(16px, 2.4vw, 36px); border-radius: 3px; transform-origin: var(--o) 50%; }
.cg2-beam--l { right: 100%; --o: 0%; background: rgb(0, 128, 195); transform: scaleX(var(--k1,1)); }
.cg2-beam--r { left: 100%; --o: 100%; background: rgb(252, 185, 19); transform: scaleX(var(--k2,1)); }
.cg2-out { --ko: 1; background: rgb(255, 255, 255); color: rgb(13, 13, 13); border-radius: 20px; padding: 16px; font-size: 15px; line-height: 1.5; box-shadow: rgba(0, 0, 0, 0.7) 0px 40px 80px -30px; transform: perspective(1200px) rotateX(calc((1 - var(--ko)) * 14deg)) translateY(calc((1 - var(--ko)) * 24px)) scale(calc(.94 + var(--ko) * .06)); }
.cg2-out .cg2-u { font-size: 16px; padding: 7px 12px; margin-bottom: 12px; display: block; width: fit-content; margin-left: auto; }
.cg2-out p { margin: 0px 0px 10px; }
.cg2-out .cg2-spon { margin: 0px; }
.cg2-olab { margin: 14px 0px 0px; text-align: center; font-weight: 700; font-size: 16px; color: var(--fg-1); }
.cg2-olab span { color: rgb(63, 210, 134); }
@media (min-width: 1024px) and (min-height: 720px){
.cg2-eng-track { height: 230vh; }
.cg2-eng-stage { position: sticky; top: var(--nav-h,96px); min-height: calc(100vh - var(--nav-h,96px)); display: flex; flex-direction: column; justify-content: center; padding: 24px 0px; }
.cg2-eng-head { margin-bottom: 28px; }
}
@media (max-width: 1023px){
.cg2-eng { grid-template-columns: minmax(0px, 1fr); gap: 0px; }
.cg2-elane--ads { order: 2; }
.cg2-ocol { order: 3; }
.cg2-vline { display: block; width: 3px; height: 36px; margin: 12px auto; border-radius: 3px; transform-origin: 50% 0px; transform: scaleY(var(--kv,1)); }
.cg2-vline--1 { order: 1; background: linear-gradient(rgb(0, 128, 195), rgb(252, 185, 19)); }
.cg2-vline--2 { order: 2; background: linear-gradient(rgb(252, 185, 19), rgb(0, 165, 81)); }
.cg2-elane--ctx { --dx: -28px; }
.cg2-elane--ads { --dx: 28px; }
.cg2-beam { display: none; }
}
@media (min-width: 1024px){
.cg2-vline { display: none; }
}
.cg2-lay { display: grid; grid-template-columns: minmax(0px, 1fr) minmax(0px, 1fr); gap: clamp(24px, 5vw, 72px); align-items: start; }
.cg2-stackcol { position: sticky; top: calc(var(--nav-h,96px) + 24px); height: min(560px,calc(100vh - var(--nav-h,96px) - 48px)); display: flex; align-items: center; justify-content: center; }
.cg2-stack { --g: 56px; position: relative; width: min(280px, 64%); aspect-ratio: 1 / 1; transform: translateY(calc(var(--g) * 1.6)) rotateX(58deg) rotateZ(-42deg); transform-style: preserve-3d; }
.cg2-plate { position: absolute; inset: 0px; border-radius: 18px; border: 1px solid rgba(255, 255, 255, 0.22); background: linear-gradient(135deg,color-mix(in srgb,var(--pc) 78%,#0b1220),color-mix(in srgb,var(--pc) 34%,#0b1220)); transform: translateZ(calc(var(--n) * var(--g))); box-shadow: rgba(0, 0, 0, 0.75) 0px 26px 40px -18px; transition: border-color 0.3s, filter 0.3s; }
.cg2-plate span { position: absolute; left: 16px; top: 12px; font-weight: 900; font-size: 26px; color: rgb(255, 255, 255); }
.cg2-plate.is-act { border-color: rgb(252, 185, 19); box-shadow: rgba(0, 0, 0, 0.75) 0px 26px 40px -18px, rgb(252, 185, 19) 0px 0px 0px 2px; }
.cg2-ll { list-style: none; margin: 0px; padding: 0px; }
.cg2-ll li { min-height: 44vh; display: flex; flex-direction: column; justify-content: center; gap: 8px; padding: 28px 0px; border-top: 1px solid var(--border-2); }
.cg2-ln { font-size: 13px; font-weight: 700; letter-spacing: 0.08em; color: var(--fg-2); }
.cg2-ll li.is-act .cg2-ln { color: var(--cg2-sun); }
.cg2-ll h3 { margin: 0px; font-size: clamp(22px, 2.2vw, 28px); }
.cg2-ll p { margin: 0px; color: var(--fg-2); font-size: 16px; line-height: 1.55; max-width: 52ch; }
.cg2-ll p.cg2-del { color: var(--fg-1); }
.cg2-xl { margin-top: 28px; font-size: 16px; }
.cg2-xl a { font-weight: 700; }
@media (max-width: 767px){
.cg2-lay { grid-template-columns: minmax(0px, 1fr); gap: 0px; }
.cg2-stackcol { top: var(--nav-h,76px); height: 240px; z-index: 2; background: var(--bg); border-bottom: 1px solid var(--border-2); }
.cg2-stack { width: 130px; --g: 28px; }
.cg2-ll li { min-height: 52vh; }
}
.cg2-plats { display: grid; grid-template-columns: repeat(3, minmax(0px, 1fr)); gap: 16px; }
.cg2-pf { border: 1px solid var(--border-1); border-radius: 20px; padding: 22px; background: var(--surface); display: flex; flex-direction: column; gap: 14px; }
.cg2-pfh { display: flex; align-items: center; gap: 12px; }
.cg2-pfl { width: 44px; height: 44px; border-radius: 12px; background: rgb(255, 255, 255); display: grid; place-items: center; flex: 0 0 auto; }
.cg2-pfl img, .cg2-pfl svg { width: 26px; height: 26px; }
.cg2-pfh b { font-size: 18px; }
.cg2-st { display: inline-flex; align-items: center; gap: 8px; align-self: flex-start; padding: 5px 12px; border-radius: 999px; border: 1px solid var(--border-1); font-size: 13px; font-weight: 700; color: var(--fg-1); }
.cg2-st::before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: var(--sc,#00A551); }
.cg2-pf p { margin: 0px; color: var(--fg-2); font-size: 15px; line-height: 1.5; }
.cg2-do { display: flex; flex-wrap: wrap; gap: 8px; margin-top: auto; }
.cg2-do span { padding: 4px 10px; border-radius: 8px; font-size: 13px; font-weight: 700; background: color-mix(in srgb,var(--tc) 18%,transparent); color: var(--fg-1); border: 1px solid color-mix(in srgb,var(--tc) 55%,transparent); }
@media (max-width: 900px){
.cg2-plats { grid-template-columns: minmax(0px, 1fr); }
}
.cg2-carw { position: relative; }
.cg2-car { display: grid; grid-auto-flow: column; grid-auto-columns: min(440px, 86%); gap: 16px; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; padding: 4px 2px 12px; outline-offset: 4px; }
.cg2-car::-webkit-scrollbar { display: none; }
.cg2-pc { scroll-snap-align: start; background: rgb(255, 255, 255); color: rgb(13, 13, 13); border-radius: 20px; padding: 18px; display: flex; flex-direction: column; gap: 12px; font-size: 16px; line-height: 1.5; }
.cg2-pch { display: flex; align-items: center; justify-content: space-between; gap: 8px; font-size: 13px; color: rgb(77, 77, 77); }
.cg2-pc .cg2-u { max-width: 92%; }
.cg2-pc p { margin: 0px; }
.cg2-cctl { display: flex; gap: 10px; margin-top: 14px; }
.cg2-cbtn { width: 44px; height: 44px; border-radius: 50%; border: 1px solid var(--border-strong); background: transparent; color: var(--fg-1); display: grid; place-items: center; cursor: pointer; }
.cg2-cbtn svg { width: 18px; height: 18px; }
.cg2-cbtn:focus-visible { outline: 2px solid var(--cg2-sun); outline-offset: 2px; }
.cg2-proof { display: grid; grid-template-columns: minmax(0px, 1fr) minmax(0px, 1fr); gap: 16px; }
.cg2-pp { border: 1px solid var(--border-1); border-radius: 20px; padding: clamp(18px, 2.6vw, 28px); background: var(--surface); display: flex; flex-direction: column; gap: 14px; }
.cg2-pp .lab { font-size: 13px; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase; color: var(--cg2-sun); }
.cg2-pp h3 { margin: 0px; font-size: 22px; }
.cg2-pp p { margin: 0px; color: var(--fg-2); font-size: 16px; line-height: 1.55; }
.cg2-rings { display: flex; flex-wrap: wrap; gap: 18px; }
.cg2-ring { display: grid; justify-items: center; gap: 6px; font-size: 14px; color: var(--fg-1); }
.cg2-ring svg { width: 92px; height: 92px; transform: rotate(-90deg); }
.cg2-ring circle { fill: none; stroke-width: 10; }
.cg2-ring .bg { stroke: var(--border-2); }
.cg2-ring .fg { stroke-linecap: round; transition: stroke-dasharray 1.3s var(--cg2-e); }
html.js-reveal .cg2-rings:not(.is-in) .fg { stroke-dasharray: 0, 100; }
.cg2-rw { position: relative; }
.cg2-rv2 { position: absolute; inset: 0px; display: grid; place-items: center; font-weight: 900; font-size: 22px; }
.cg2-pp .cga-serp { margin-top: auto; }
.cg2-pp a { font-weight: 700; }
@media (max-width: 860px){
.cg2-proof { grid-template-columns: minmax(0px, 1fr); }
}
.cg2-tlw { --k: 1; position: relative; }
.cg2-tlw::before, .cg2-tlf { content: ""; position: absolute; left: 0px; right: 0px; top: 10px; height: 3px; border-radius: 3px; }
.cg2-tlw::before { background: var(--border-2); }
.cg2-tlf { background: linear-gradient(90deg, rgb(0, 128, 195), rgb(252, 185, 19)); transform-origin: 0px 50%; transform: scaleX(var(--k)); }
.cg2-tl { list-style: none; margin: 0px; padding: 38px 0px 0px; display: grid; grid-template-columns: repeat(4, minmax(0px, 1fr)); gap: 20px; }
.cg2-tn { position: relative; }
.cg2-tn::before { content: ""; position: absolute; left: 0px; top: -36px; width: 20px; height: 20px; border-radius: 50%; background: var(--bg); border: 3px solid var(--border-strong); transition: border-color 0.3s, background-color 0.3s; }
.cg2-tn.is-on::before { border-color: rgb(252, 185, 19); background: rgb(252, 185, 19); }
.cg2-tn .d { font-size: 13px; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase; color: var(--cg2-sun); }
.cg2-tn h3 { margin: 6px 0px; font-size: 19px; }
.cg2-tn p { margin: 0px; color: var(--fg-2); font-size: 15px; line-height: 1.5; }
@media (max-width: 767px){
.cg2-tl { grid-template-columns: minmax(0px, 1fr); padding: 0px 0px 0px 38px; gap: 26px; }
.cg2-tlw::before, .cg2-tlf { inset: 0px auto 0px 9px; width: 3px; height: auto; }
.cg2-tlf { transform-origin: 50% 0px; transform: scaleY(var(--k)); }
.cg2-tn::before { left: -38px; top: 2px; }
}
.cg2-price { border: 1px solid var(--border-1); border-radius: 20px; padding: clamp(22px, 3vw, 34px); display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 20px; background: var(--surface); }
.cg2-price p { margin: 0px; font-size: clamp(20px, 2vw, 26px); font-weight: 700; line-height: 1.35; color: var(--fg-1); max-width: 40ch; }
.cg2-price small { display: block; margin-top: 8px; font-size: 15px; font-weight: 400; color: var(--fg-2); }
@media (prefers-reduced-motion: reduce){
.cg2-win, .cg2-out { transform: none; }
.cg2-feed, .cg2-feed > *, .cg2-mtrack i, .cg2-chip { transition: none; }
}
@media (max-width: 767px){
.cg2-srch.is-busy span { animation: auto ease 0s 1 normal none running none; color: rgb(93, 93, 93); background: none; }
}
.cg2-win p, .cg2-win li, .cg2-win b, .cg2-out p, .cg2-out b, .cg2-pc p, .cg2-pc b, .cg2-mock--c div, .cg2-mock--c b { color: rgb(13, 13, 13); }
.cg2-sec { background-color: var(--bg); }
.cg2-av { border: 0px; overflow: hidden; border-radius: 8px; }
.cg2-av img { display: block; width: 28px; height: 28px; }
.cg2-mav, .cg2-oh, .cg2-pa { display: inline-flex; align-items: center; gap: 8px; font-size: 13px; font-weight: 700; color: rgb(60, 60, 60); }
.cg2-mav { display: flex; margin-bottom: 4px; }
.cg2-oh { display: flex; margin-bottom: 10px; }
.cg2-mav img, .cg2-oh img, .cg2-pa img { border-radius: 6px; flex: 0 0 auto; }
.cg2-hero { display: flex; flex-direction: column; justify-content: center; }
.cg2-cue { position: absolute; left: 50%; bottom: 10px; transform: translateX(-50%); display: flex; flex-direction: column; align-items: center; gap: 4px; min-width: 44px; min-height: 44px; padding: 4px 10px; color: rgb(0, 128, 195); font-size: 14px; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase; text-decoration: none; transition: opacity 0.4s; }
.cg2-cue:hover, .cg2-cue:focus-visible { color: rgb(0, 128, 195); }
.cg2-cue:focus-visible { outline: rgb(252, 185, 19) solid 2px; outline-offset: 2px; border-radius: 8px; }
.cg2-cue-m { display: block; width: 20px; height: 30px; border: 2px solid rgb(0, 128, 195); border-radius: 12px; position: relative; }
.cg2-cue-m i { position: absolute; left: 50%; top: 6px; width: 3px; height: 7px; margin-left: -1.5px; border-radius: 2px; background: rgb(0, 128, 195); }
#hero .cg2-cue-m { animation: 1.8s cubic-bezier(0.45, 0, 0.55, 1) 0s infinite normal none running cg2Bob !important; }
#hero .cg2-cue-m i { animation: 1.8s ease-in-out 0s infinite normal none running cg2Dot !important; }
@keyframes cg2Bob { 
  0%, 100% { transform: translateY(0px); }
  50% { transform: translateY(5px); }
}
@keyframes cg2Dot { 
  0% { transform: translateY(0px); opacity: 1; }
  70% { transform: translateY(8px); opacity: 0; }
  100% { transform: translateY(0px); opacity: 0; }
}
html.cg2-scrolled .cg2-cue { opacity: 0; pointer-events: none; }
#facts { scroll-margin-top: var(--nav-h,96px); padding-top: 32px; }
@media (prefers-reduced-motion: reduce){
#hero .cg2-cue-m, #hero .cg2-cue-m i { animation: auto ease 0s 1 normal none running none !important; }
}
@media (min-width: 768px){
.cg2-hero { min-height: calc(-96px + 100svh); padding: calc(var(--nav-h,96px) + 20px) 0 76px; }
.cg2-copy .cga-h1 { font-size: clamp(36px, min(5vw, 7svh), 76px); }
.cg2-win { height: clamp(400px,calc(100svh - var(--nav-h,96px) - 290px),620px); }
}
@media (min-width: 1024px){
.cg2-copy .cga-sub { font-size: clamp(16px, min(1.35vw, 2.4svh), 20px); }
}
@media (max-width: 767px){
.cg2-hero { min-height: calc(-84px + 100svh); padding: calc(var(--nav-h,76px) + 20px) 0 76px; justify-content: flex-start; }
.cg2-hsim { display: none; }
.cg2-copy .cga-h1 { font-size: clamp(32px, min(10vw, 5.4svh), 44px); }
}
.cg2-def { padding: clamp(40px, 6vw, 72px) 0px; }
.cg2-defbox { max-width: 860px; border-top-color: ; border-top-style: ; border-top-width: ; border-right-color: ; border-right-style: ; border-right-width: ; border-bottom-color: ; border-bottom-style: ; border-bottom-width: ; border-image-source: ; border-image-slice: ; border-image-width: ; border-image-outset: ; border-image-repeat: ; border-left: 0px; border-radius: 20px; padding: clamp(22px, 3vw, 36px); background: var(--surface); }
.cg2-defbox h2 { margin: 0px 0px 12px; font-size: clamp(24px, 2.6vw, 34px); }
.cg2-defbox p { margin: 0px; font-size: clamp(17px, 1.5vw, 20px); line-height: 1.6; color: var(--fg-1); text-wrap: pretty; }
.cg2-pgrid { grid-template-columns: minmax(0px, 1.3fr) minmax(0px, 1fr) minmax(0px, 1fr); }
.cg2-pline { color: var(--fg-1) !important; }
.cg2-main .amt > span:first-child { font-size: 0.45em; font-weight: 500; margin-right: 6px; }
.cg2-addl { display: inline-block; margin-bottom: 10px; font-size: 12px; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase; color: var(--fg-2); }
@media (max-width: 1023px){
.cg2-pgrid { grid-template-columns: minmax(0px, 1fr); }
}
.cg2-car { touch-action: pan-x pan-y; overscroll-behavior-x: contain; }
.cg2-pf h3 { margin: 0px; font-size: 18px; }
@media (max-width: 400px){
.cg2-feed { padding: 14px 12px 18px; gap: 14px; }
.cg2-u { max-width: 88%; }
.cg2-chip { margin-left: 4px; padding: 1px 7px; }
.cg2-spon { padding: 10px 12px; }
}
.nav-burger { display: none; width: 40px; height: 40px; border: 1px solid var(--border-strong); border-radius: var(--radius-sm); background: transparent; color: var(--fg-1); flex: 0 0 auto; align-items: center; justify-content: center; flex-direction: column; gap: 5px; padding: 0px; }
.nav-burger span { display: block; width: 16px; height: 2px; background: currentcolor; transition: transform 0.25s, opacity 0.25s; }
.nav-burger.is-open span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.nav-burger.is-open span:nth-child(2) { opacity: 0; }
.nav-burger.is-open span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }
@media (max-width: 1080px){
.nav-burger { display: inline-flex; }
.nav-links { display: none !important; }
.nav .nav-cta { display: none !important; }
}
.m-menu { position: fixed; inset: 0px; z-index: 99; background: rgba(7, 9, 13, 0.97); backdrop-filter: blur(16px); display: none; flex-direction: column; justify-content: center; padding: 130px clamp(24px, 7vw, 48px) 40px; overflow-y: auto; }
.m-menu.is-open { display: flex; }
.m-menu ul { list-style: none; margin: 0px; padding: 0px; display: flex; flex-direction: column; }
.m-menu ul a { display: block; padding: 13px 0px; font-family: var(--font-display); font-weight: 800; font-size: clamp(26px, 7vw, 40px); letter-spacing: -0.03em; text-transform: uppercase; color: var(--fg-1); text-decoration: none; border-bottom: 1px solid var(--border-2); }
.m-menu ul a.is-active { color: var(--signal); }
.m-menu .m-ctas { display: flex; flex-direction: column; gap: 10px; margin-top: 26px; }
.m-menu .m-ctas a { display: flex; align-items: center; justify-content: center; gap: 10px; padding: 15px; border-radius: var(--radius-sm); font-size: 14px; font-weight: 600; text-decoration: none; }
.m-menu .m-cta-call { background: var(--signal); color: rgb(5, 19, 29); }
.m-menu .m-cta-wa { border: 1px solid var(--border-strong); color: var(--fg-1); }
:root { --nav-h: 117px; --navh: 117px; }
@media (max-width: 1080px){
:root { --nav-h: 125px; --navh: 125px; }
}
@media (max-width: 767px){
:root { --nav-h: 109px; --navh: 109px; }
}
@media (max-width: 767px){
.cg2-hero { min-height: 0px; padding: calc(var(--nav-h,109px) + 16px) 0 18px; justify-content: flex-start; }
.cg2-hsim { display: block; }
.cg2-hgrid { gap: 22px; }
.cg2-meter { grid-template-rows: auto; gap: 6px; }
.cg2-mt { display: none; }
.cg2-mbody { grid-template-rows: 4px auto; gap: 6px; }
.cg2-meter li { font-size: 12px; }
.cg2-frame { padding: 6px; border-radius: 38px; }
.cg2-win { height: 62svh; min-height: 420px; max-height: 600px; border-radius: 32px; }
.cg2-cue { position: relative; left: auto; bottom: auto; transform: none; margin: 14px auto 0px; width: max-content; }
.cg2-cap { margin-top: 6px; }
}
@media (max-width: 1023px){
#engines { content-visibility: auto; contain-intrinsic-size: auto 2000px; }
}
#layers { content-visibility: auto; contain-intrinsic-size: auto 2600px; }
html.cv-off #engines, html.cv-off #layers { content-visibility: visible; }
@media (max-width:767px){.slim{-webkit-backdrop-filter:none;backdrop-filter:none;background:rgba(8,10,15,.97)}}
.cg2-hero .cap-hero[hidden]{display:block!important;visibility:hidden}

/* ==== pass M: accessibility (grey text lightened slightly to 4.5:1 on the dark theme) ==== */
html:not([data-theme="light"]){--fg-4:#8B93A0}

/* ==== pass Q: shared client logos v2 ==== */
/* client logos v2 (pass Q): shared tiles, strips and card badges for client and partner logos (v1 rules plus compact strip and badges) */
.cl-logo{display:inline-flex;align-items:center;justify-content:center;line-height:0;border-radius:12px}
.cl-logo img{display:block;width:auto;height:100%;max-height:100%;max-width:100%}
.cl-tile--own,.cl-tile--dark{background:transparent}
.cl-tile--white{background:#fff;padding:8px 12px}
.cl-tile--text{line-height:1.2;font-weight:700;letter-spacing:.02em;color:var(--fg-1)}
.cl-strip{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:14px 18px;align-items:center}
.cl-strip li{display:flex;flex-direction:column;align-items:flex-start;gap:6px}
.cl-strip a{color:inherit;text-decoration:none;display:flex;flex-direction:column;gap:6px}
.cl-strip .cl-logo{height:56px}
.cl-strip .cl-tile--text{height:56px;padding:0 4px;font-size:18px}
.cl-kind{font-size:12px;color:var(--fg-3);letter-spacing:.04em;text-transform:uppercase}
.cs-hero-name .cl-logo{height:56px}
.cs-hero-name .cl-tile--white{height:64px}
.b3-name .cl-logo{height:40px}
.cs-hero-logos{display:flex;flex-wrap:wrap;align-items:center;gap:14px;margin:0 0 14px}
.cs-hero-logos .cl-logo{height:56px}
.cs-hero-logos .cl-x{font-size:20px;color:var(--fg-3)}

[data-client-logos]:not([data-cl-done]){min-height:72px}
[data-client-logos][data-variant="compact"]:not([data-cl-done]){min-height:58px}
.cl-strip--compact{flex-wrap:wrap;gap:10px 22px}
.cl-strip--compact .cl-logo{height:40px}
.cl-strip--compact .cl-tile--text{height:40px;font-size:15px}
.cl-strip--compact li{position:relative;flex-direction:row;align-items:center;gap:6px}
.cl-strip--compact a{flex-direction:row;align-items:center;gap:6px}
.cl-strip--compact img{filter:grayscale(1);opacity:.85;transition:filter .25s,opacity .25s}
.cl-strip--compact a:hover img,.cl-strip--compact a:focus-visible img{filter:none;opacity:1}
.cl-strip--compact .cl-kind{font-size:10.5px;padding:2px 6px;border:1px solid var(--border-1);border-radius:999px;color:var(--fg-2)}
.cl-badge{position:absolute;left:14px;bottom:14px;z-index:2}
.cl-badge .cl-logo{height:40px;box-shadow:0 8px 20px -10px rgba(0,0,0,.6)}
.cl-badge .cl-tile--text{background:rgba(10,12,17,.75);color:#fff;padding:0 12px;border-radius:10px;font-size:15px}
.cl-band{padding:clamp(28px,4vw,44px) 0}
.cl-band h2{margin:0 0 14px;font-size:clamp(20px,2.2vw,28px)}
.ft-trust{padding:20px 0;border-top:1px solid var(--border-1)}
.ft-trust p{margin:0 0 10px;font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--fg-3)}
.cl-badge{display:flex;gap:8px;align-items:center}
.cl-badge .cl-tile--dark{background:rgba(10,12,17,.72);padding:6px 10px}
.card-cover{position:relative}

/* ==== pass R: client logos v3 ==== */
/* client logos v3 (pass R: own-product wordmark) based on v2 (pass Q): shared tiles, strips and card badges for client and partner logos (v1 rules plus compact strip and badges) */
.cl-logo{display:inline-flex;align-items:center;justify-content:center;line-height:0;border-radius:12px}
.cl-logo img{display:block;width:auto;height:100%;max-height:100%;max-width:100%}
.cl-tile--own,.cl-tile--dark{background:transparent}
.cl-tile--white{background:#fff;padding:8px 12px}
.cl-tile--text{line-height:1.2;font-weight:700;letter-spacing:.02em;color:var(--fg-1)}
.cl-strip{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:14px 18px;align-items:center}
.cl-strip li{display:flex;flex-direction:column;align-items:flex-start;gap:6px}
.cl-strip a{color:inherit;text-decoration:none;display:flex;flex-direction:column;gap:6px}
.cl-strip .cl-logo{height:56px}
.cl-strip .cl-tile--text{height:56px;padding:0 4px;font-size:18px}
.cl-kind{font-size:12px;color:var(--fg-3);letter-spacing:.04em;text-transform:uppercase}
.cs-hero-name .cl-logo{height:56px}
.cs-hero-name .cl-tile--white{height:64px}
.b3-name .cl-logo{height:40px}
.cs-hero-logos{display:flex;flex-wrap:wrap;align-items:center;gap:14px;margin:0 0 14px}
.cs-hero-logos .cl-logo{height:56px}
.cs-hero-logos .cl-x{font-size:20px;color:var(--fg-3)}

[data-client-logos]:not([data-cl-done]){min-height:72px}
[data-client-logos][data-variant="compact"]:not([data-cl-done]){min-height:58px}
.cl-strip--compact{flex-wrap:wrap;gap:10px 22px}
.cl-strip--compact .cl-logo{height:40px}
.cl-strip--compact .cl-tile--text{height:40px;font-size:15px}
.cl-strip--compact li{position:relative;flex-direction:row;align-items:center;gap:6px}
.cl-strip--compact a{flex-direction:row;align-items:center;gap:6px}
.cl-strip--compact img{filter:grayscale(1);opacity:.85;transition:filter .25s,opacity .25s}
.cl-strip--compact a:hover img,.cl-strip--compact a:focus-visible img{filter:none;opacity:1}
.cl-strip--compact .cl-kind{font-size:10.5px;padding:2px 6px;border:1px solid var(--border-1);border-radius:999px;color:var(--fg-2)}
.cl-badge{position:absolute;left:14px;bottom:14px;z-index:2}
.cl-badge .cl-logo{height:40px;box-shadow:0 8px 20px -10px rgba(0,0,0,.6)}
.cl-badge .cl-tile--text{background:rgba(10,12,17,.75);color:#fff;padding:0 12px;border-radius:10px;font-size:15px}
.cl-band{padding:clamp(28px,4vw,44px) 0}
.cl-band h2{margin:0 0 14px;font-size:clamp(20px,2.2vw,28px)}
.ft-trust{padding:20px 0;border-top:1px solid var(--border-1)}
.ft-trust p{margin:0 0 10px;font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--fg-3)}
.cl-badge{display:flex;gap:8px;align-items:center}
.cl-badge .cl-tile--dark{background:rgba(10,12,17,.72);padding:6px 10px}
.card-cover{position:relative}
.cl-logo .cl-wm{margin-left:10px;font:700 18px/1 "Roboto","Roboto Fallback",system-ui,sans-serif;color:#1F1F1F;white-space:nowrap}
.cl-logo:has(.cl-wm){gap:0}