@font-face {
font-family: 'Golos Text';
font-style: normal;
font-weight: 400 700;
font-display: swap;
src: url(/assets/fonts/golos-text-400-700.25073a9c11.woff2) format('woff2');
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0301, U+0304, U+0308, U+0329, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2000-206F, U+20AC, U+20BD, U+2116, U+2122, U+2191-2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
font-family: 'Manrope';
font-style: normal;
font-weight: 400 800;
font-display: swap;
src: url(/assets/fonts/manrope-400-800.0a29801d61.woff2) format('woff2');
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0301, U+0304, U+0308, U+0329, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2000-206F, U+20AC, U+2116, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face { font-family: 'Golos Fallback'; font-weight: 400 500; src: local('Arial'), local('ArialMT'); size-adjust: 106.2%; ascent-override: 92.28%; descent-override: 20.72%; line-gap-override: 0%; }
@font-face { font-family: 'Golos Fallback'; font-weight: 600 700; src: local('Arial Bold'), local('Arial-BoldMT'); size-adjust: 99.87%; ascent-override: 98.13%; descent-override: 22.03%; line-gap-override: 0%; }
@font-face { font-family: 'Manrope Fallback'; font-weight: 400 500; src: local('Arial'), local('ArialMT'); size-adjust: 106.2%; ascent-override: 100.38%; descent-override: 28.25%; line-gap-override: 0%; }
@font-face { font-family: 'Manrope Fallback'; font-weight: 600 800; src: local('Arial Bold'), local('Arial-BoldMT'); size-adjust: 98.81%; ascent-override: 107.88%; descent-override: 30.36%; line-gap-override: 0%; }
:root {
--c-anchor: #0E1B2C;
--c-anchor-2: #15263B;
--c-anchor-3: #1D3149;
--c-base: #F9FAFB;
--c-tint: #EDEFF1;
--c-surface: #FFFFFF;
--c-accent: #0B7A72;
--c-accent-strong: #08615B;
--c-accent-on-dark: #4FD1C5;
--c-accent-wash: #E2F2F0;
--c-done: var(--c-accent); --c-done-strong: var(--c-accent-strong); --c-done-on-dark: var(--c-accent-on-dark); --c-done-wash: var(--c-accent-wash);
--c-agent: #F57C1F;
--c-agent-hover: #E8661A;
--c-agent-ink: #B0470F;
--c-agent-deep: #8F3606;
--c-agent-on-dark: #FF9A4D;
--c-agent-wash: #FDEEE3;
--c-stage: #FFFFFF;
--c-stage-line: #E0E1E6;
--c-rule: #8B8D98;
--c-navy-line: #3A4D66;
--c-navy-detail: #52607A;
--slate-1: #FCFCFD; --slate-2: #F9F9FB; --slate-3: #F0F0F3; --slate-4: #E8E8EC;
--slate-5: #E0E1E6; --slate-6: #D9D9E0; --slate-7: #CDCED6; --slate-8: #B9BBC6;
--slate-9: #8B8D98; --slate-10: #80838D; --slate-11: #60646C; --slate-12: #1C2024;
--c-text: #1C2024;
--c-text-2: #4A4F57;
--c-text-3: #60646C;
--c-on-dark: #FFFFFF; --c-on-dark-2: #B9C4D2;  --c-on-dark-3: #8FA3BA;
--c-line-dark: rgba(255, 255, 255, .12);
--navy-ink: var(--c-anchor); --navy-deep: var(--c-anchor); --navy: #13263D;
--navy-700: var(--c-anchor-3); --navy-600: #52607A;
--paper: var(--c-base);  --zebra: #F3F4F6;  --paper-2: var(--c-tint);
--paper-3: var(--slate-3); --sand: var(--c-tint);  --sand-2: var(--slate-4);
--ink: var(--c-text);  --ink-2: var(--c-text-2);
--muted-strong: var(--c-text-3);
--muted: var(--c-text-3);
--rule: var(--slate-9);
--rule-mid: var(--slate-7);
--line-soft: var(--slate-5);
--line-dark: #3A4D66;
--line-dark-soft: var(--c-line-dark);
--accent: var(--c-accent);
--accent-btn: var(--c-accent);
--accent-deep: var(--c-accent-strong);
--accent-wash: var(--c-accent-wash);
--on-dark: var(--c-on-dark); --on-dark-2: var(--c-on-dark-2); --on-dark-3: var(--c-on-dark-3);
--amber: var(--c-accent-on-dark);
--amber-hi: #9BE7DE;
--ok: var(--c-done); --warn: var(--slate-11); --bad: #9B2226;
--ico-check: url(/assets/img/icon-check.54cd158664.svg);
--font-display: 'Manrope', 'Manrope Fallback', 'Golos Text', system-ui, -apple-system, 'Segoe UI', Roboto, Arial, sans-serif;
--font: 'Golos Text', 'Golos Fallback', system-ui, -apple-system, 'Segoe UI', Roboto, Arial, sans-serif;
--fs-h1: clamp(1.875rem, 1.30vw + 1.581rem, 2.75rem);
--fs-h4: clamp(1.0625rem, 0.09vw + 1.044rem, 1.125rem);
--fs-lead: var(--fs-h3);
--fs-body: clamp(1.0625rem, 0.09vw + 1.044rem, 1.125rem);
--fs-small: 1rem;
--fs-meta: 0.9375rem;
--fs-kicker: 0.9375rem;
--fs-num: clamp(0.9375rem, 0.09vw + 0.919rem, 1rem);
--fs-stat: clamp(1.75rem, 0.76vw + 1.5625rem, 2.25rem);
--fs-stat-m: clamp(2rem, 1.11vw + 1.75rem, 2.75rem);
--fs-price: clamp(1.625rem, 0.56vw + 1.5rem, 2rem);
--fs-quote: clamp(1.3125rem, 0.65vw + 1.169rem, 1.75rem);
--lh-display: 1.07; --lh-h2: 1.16; --lh-h3: 1.3; --lh-lead: 1.5; --lh-body: 1.62; --lh-tight: 1.45;
--ls-num: -.02em;
--w-text: 66ch; --w-note: 72ch;
--w-max: 1200px; --w-wide: 1320px;
--gap: 16px; --gutter: 16px;
--bleed-r: calc(max(0px, (100vw - var(--w-max)) / 2) + var(--gutter));
--sp-air: clamp(72px, 7vw, 120px);
--sp-base: clamp(56px, 5.5vw, 96px);
--sp-tight: clamp(40px, 4vw, 64px);
--s1: 4px; --s2: 8px; --s3: 12px; --s4: 16px; --s5: 24px; --s6: 32px; --s7: 48px; --s8: 64px;
--r-xs: 4px; --r-s: 8px; --r-m: 14px; --r-l: 20px;
--r-panel: 20px; --r-ctl: 8px; --r-inner: 12px;
--e1: 0 1px 2px rgba(14, 27, 44, .05);
--e3: 0 8px 32px rgba(0, 0, 0, .18);
--header-h: 56px; --scroll-pad: 64px;
--dur-fast: 140ms; --dur-base: 200ms; --dur-reveal: 240ms; --dur-mask: 420ms;
--stagger: 60ms;
--ease-out: cubic-bezier(.2, .6, .2, 1);
--ease-io: cubic-bezier(.4, 0, .2, 1);
--fs-base: var(--fs-body);
--lh: var(--lh-body);
--fs-display: clamp(2.375rem, 1.95rem + 2.1vw, 3.75rem);
--fs-h2: clamp(1.875rem, 1.5rem + 1.667vw, 2.5rem);
--fs-h3: clamp(1.3125rem, 1.1875rem + .556vw, 1.5rem);
--fs-stat-l: clamp(2.5rem, 2rem + 2.222vw, 4rem);
--fs-stat-xl: clamp(3rem, 2rem + 4.444vw, 6rem);
--fw-display: 700;
--ls-display: -.035em; --ls-h: -.025em; --ls-h3: -.01em;
--ls-kicker: 0; --ls-sec: 0;
--w-h1: 17ch; --w-h2: 22ch; --w-lead: 50ch;
--wire-c: var(--c-navy-detail);
--wire-dot: var(--c-agent);
--flow-bg: var(--paper);
--status-c: var(--ink-2);
--status-done: var(--c-done);
--link-c: var(--c-text);
--link-line: var(--c-agent-ink);
--dock-h: 64px;
}
@media (min-width: 768px) { :root { --gap: 20px; --gutter: 24px; --header-h: 64px; --scroll-pad: 72px; } }
@media (min-width: 1024px) { :root { --gap: 24px; --gutter: 32px; } }
:root {
--nav-w-full: 256px;
--nav-w-rail: 72px;
--nav-w: var(--nav-w-full);
--shell-gap: 12px;
--col-max: 1400px;
--sheet-r: 20px;
--sheet-bg: var(--c-base);
--glass: rgb(14 27 44 / .80);
--glass-solid: rgb(14 27 44 / .97);
--glass-nav: rgb(14 27 44 / .72);
--glass-line: rgba(255, 255, 255, .10);
--glass-blur: 16px;
--topbar-h: 56px;
--nav-item-h: 44px;
--nav-ico: 20px;
--nav-active-bg: rgba(79, 209, 197, .16);
--nav-hover-bg: rgba(255, 255, 255, .06);
--nav-active-bar: var(--c-accent-on-dark);
--nav-text: #FFFFFF;
--nav-text-2: var(--c-on-dark-2);
--bg-fallback: #0E1B2C;
--dur-nav: 220ms;
}
*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
html, body { overflow-x: clip; }
[id] { scroll-margin-top: var(--scroll-pad); }
html.reduce { scroll-behavior: auto; }
body {
margin: 0;
font-family: var(--font);
font-size: var(--fs-base);
line-height: var(--lh);
color: var(--ink);
background-color: var(--c-base);
overflow-wrap: anywhere;
}
h1, h2, h3 { overflow-wrap: normal; }
img, svg, video { max-width: 100%; height: auto; display: block; }
a { color: var(--link-c); text-decoration-line: underline; text-decoration-color: var(--link-line); text-decoration-thickness: 1px; text-underline-offset: .2em; }
a:hover { color: var(--link-hover, var(--c-agent-ink)); text-decoration-color: currentColor; text-decoration-thickness: 2px; }
a:active { color: var(--link-active, var(--c-agent-deep)); }
::selection { background: var(--c-agent-wash); color: var(--c-text); }
[hidden] { display: none !important; }
:focus-visible { outline: 2px solid var(--focus-c, var(--c-anchor)); outline-offset: 2px; border-radius: var(--r-xs); }
:is(.hero, .clients, .section-data, .section-trust, .section-contact, .site-footer, .masthead) { --focus-c: #fff; }
.explain--panel { --focus-c: var(--c-anchor); }
h1, h2, h3, h4 { margin: 0 0 .5em; color: var(--ink); }
h1, h2 { font-family: var(--font-display); font-weight: var(--fw-display); text-wrap: balance; hyphens: none; -webkit-hyphens: none; font-variant-numeric: lining-nums; }
h1 { font-size: var(--fs-display); line-height: var(--lh-display); letter-spacing: var(--ls-display); max-width: var(--w-h1); }
h2 { font-size: var(--fs-h2); line-height: var(--lh-h2); letter-spacing: var(--ls-h); max-width: var(--w-h2); margin: 0 0 var(--s4); }
h3 { font-family: var(--font-display); font-size: var(--fs-h3); font-weight: 700; line-height: var(--lh-h3); letter-spacing: var(--ls-h3); }
h4 { font-family: var(--font); font-size: var(--fs-h4); font-weight: 600; line-height: var(--lh-tight); }
.h3 { font-family: var(--font-display); font-size: var(--fs-h3); font-weight: 700; line-height: var(--lh-h3); letter-spacing: var(--ls-h); max-width: none; text-wrap: balance; }
@media (max-width: 767px) {
h2 { hyphens: auto; -webkit-hyphens: auto; }
@supports (hyphenate-limit-chars: 8 4 4) { h2 { hyphenate-limit-chars: 8 4 4; } }
}
p, li { text-wrap: pretty; }
p { margin: 0 0 1em; }
ul, ol { margin: 0 0 1em; padding-left: 1.3em; }
strong { font-weight: 600; }
.section-intro { font-size: var(--fs-lead); line-height: var(--lh-lead); color: var(--ink-2); max-width: 60ch; margin: 0 0 var(--s7); }
.lead { font-size: var(--fs-lead); line-height: var(--lh-lead); color: var(--ink-2); max-width: var(--w-lead); }
.vh { position: absolute !important; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
.skip-link { position: absolute; left: 8px; top: -60px; background: var(--navy); color: #fff; padding: 10px 14px; border-radius: var(--r-s); z-index: 100; }
.skip-link:focus { top: 8px; }
.container { width: 100%; max-width: var(--w-max); margin-inline: auto; padding-inline: var(--gutter); }
.section { padding-block: var(--sp-base); }
.section-cases, .section-packages { padding-block: var(--sp-air); }
.hero { padding-block: clamp(32px, 4.5vw, 72px) var(--s7); }
.section-contact { padding-block: var(--sp-base) var(--sp-air); }
.section-cases, .section-process, .section-market, .section-faq { background-color: var(--c-tint); }
.section-audience, .section-hours, .section-packages, .section-stack { background-color: var(--c-base); }
.section-cases, .section-process, .section-market, .section-faq { --paper: var(--c-surface); }
.section-trust, .section-data, .section-contact {
position: relative; color: #fff; background-color: var(--c-anchor);
--ink: #fff; --ink-2: var(--c-on-dark-2); --muted: var(--c-on-dark-2); --muted-strong: var(--c-on-dark-2);
--c-text: #fff; --c-text-2: var(--c-on-dark-2); --c-text-3: var(--c-on-dark-2);
--navy: #fff; --rule: rgba(255, 255, 255, .28); --rule-mid: rgba(255, 255, 255, .18); --line-soft: rgba(255, 255, 255, .14);
--link-c: #fff; --link-line: var(--c-agent-on-dark); --link-hover: var(--c-agent-on-dark); --link-active: #fff;
--wire-c: var(--c-on-dark-3); --flow-bg: var(--c-anchor-3); --status-c: var(--c-on-dark-2); --status-done: var(--c-done-on-dark);
}
:is(.section-trust, .section-data, .section-contact) :is(h2, h3) { color: #fff; }
:is(.section-trust, .section-data, .section-contact) .section-intro { color: var(--c-on-dark-2); }
.table-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; margin-bottom: 1em; }
table { border-collapse: collapse; width: 100%; font-size: var(--fs-small); }
th, td { text-align: left; vertical-align: top; padding: 12px 14px; border-bottom: 1px solid var(--line-soft); }
th { font-weight: 600; color: var(--ink); }
thead th { border-bottom: 2px solid var(--rule); }
.btn {
display: inline-flex; align-items: center; justify-content: center; gap: .4em;
min-height: 48px; padding: 12px 22px; border-radius: var(--r-ctl);
font: inherit; font-weight: 600; letter-spacing: -.005em; text-decoration: none; cursor: pointer;
border: 1px solid transparent;
transition: background-color var(--dur-fast) var(--ease-out), color var(--dur-fast) var(--ease-out), border-color var(--dur-fast) var(--ease-out), box-shadow var(--dur-fast) var(--ease-out), transform var(--dur-fast) var(--ease-out);
}
.btn:active { transform: translateY(1px); }
.btn-primary { background-color: var(--c-agent); color: var(--c-anchor); border-color: var(--c-agent-deep); }
.btn-primary:hover { background-color: var(--c-agent-hover); border-color: var(--c-agent-deep); color: var(--c-anchor); }
.btn-primary:active { background-color: var(--c-agent-hover); border-color: var(--c-agent-deep); color: var(--c-anchor); box-shadow: inset 0 1px 2px rgba(14, 27, 44, .3); }
:is(.hero, .section-data, .section-trust, .section-contact, .masthead) .btn-primary { border-color: var(--c-agent); }
.btn-secondary { background: transparent; color: var(--c-anchor); border-color: var(--c-anchor); }
.btn-secondary:hover { background: var(--c-surface); border-color: var(--c-anchor); color: var(--c-anchor); }
.btn-secondary-light { background: transparent; color: #fff; border-color: rgba(255, 255, 255, .7); }
.btn-secondary-light:hover { background: rgba(255, 255, 255, .08); border-color: #fff; color: #fff; }
.btn:focus-visible { outline: 2px solid var(--focus-c, var(--c-anchor)); outline-offset: 2px; border-radius: var(--r-ctl); }
.btn-sm { min-height: 44px; padding: 8px 16px; }
.btn-lg { padding: 16px 30px; font-size: var(--fs-h4); }
.btn-block { width: 100%; }
.btn:disabled, .btn[aria-disabled="true"] { opacity: .55; cursor: not-allowed; }
.cta-row { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 1.4em; }
@media (max-width: 479px) { .cta-row .btn { flex: 1 1 100%; } }
.link-arrow { display: inline-flex; align-items: center; gap: .3em; min-height: 44px; font-weight: 600; color: var(--link-c); text-decoration: underline; text-decoration-color: var(--link-line); text-decoration-thickness: 1px; text-underline-offset: .2em; }
.link-arrow:hover { text-decoration-thickness: 2px; text-decoration-color: currentColor; color: var(--link-hover, var(--c-agent-ink)); }
.status { display: inline-flex; align-items: center; gap: .45em; font-size: var(--fs-meta); font-weight: 500; line-height: 1.2; color: var(--status-c); white-space: nowrap; }
.status::before { content: ""; flex: 0 0 auto; width: .62em; height: .62em; border-radius: 50%; border: 1.5px solid currentColor; box-sizing: border-box; }
.status[data-state="work"]::before { background: linear-gradient(90deg, currentColor 50%, transparent 50%); }
.status[data-state="done"] { color: var(--status-done); }
.status[data-state="done"]::before { background: currentColor; }
details.more { border-top: 1px solid var(--line-soft); }
details.more:last-of-type { border-bottom: 1px solid var(--line-soft); }
details.more > summary { display: flex; align-items: center; justify-content: space-between; gap: var(--s4); min-height: 48px; padding-block: var(--s3); cursor: pointer; list-style: none; }
details.more > summary::-webkit-details-marker { display: none; }
details.more > summary::marker { content: ""; }
.more-title { min-width: 0; font-weight: 600; color: var(--ink); }
.more-icon { flex: none; position: relative; width: 16px; height: 16px; color: var(--navy); transition: transform var(--dur-base) var(--ease-out); }
.more-icon::before, .more-icon::after { content: ""; position: absolute; left: 0; top: 7px; width: 16px; height: 2px; border-radius: 1px; background: currentColor; }
.more-icon::after { transform: rotate(90deg); }
details.more[open] > summary .more-icon { transform: rotate(45deg); }
details.more > summary:hover .more-title { color: var(--navy); }
.more-body { padding-bottom: var(--s4); }
.more-body > :last-child { margin-bottom: 0; }
html.reduce .more-icon { transition: none; }
@media (prefers-reduced-motion: reduce) { .more-icon { transition: none; } }
.icons-sprite { position: absolute; width: 0; height: 0; overflow: hidden; }
.ico { display: block; width: var(--nav-ico); height: var(--nav-ico); flex: 0 0 auto; }
.brand { display: inline-flex; align-items: center; gap: 10px; min-height: 44px; min-width: 0; color: #fff; text-decoration: none; font-family: var(--font-display); font-weight: 800; font-size: 1.1875rem; letter-spacing: -.03em; white-space: nowrap; }
.brand:hover { color: #fff; }
.brand-mark { display: block; width: 24px; height: 24px; flex: 0 0 auto; color: currentColor; }
.brand-mark svg { width: 100%; height: 100%; }
.brand-mark .bm-core { fill: var(--c-accent-on-dark); }
button.nav-open, .nav-rail, .nav-close {
display: inline-grid; place-items: center; flex: 0 0 auto; width: 44px; height: 44px; padding: 0;
background: transparent; border: 0; border-radius: 10px; color: var(--nav-text); font: inherit; cursor: pointer;
transition: background-color var(--dur-fast) var(--ease-out);
}
button.nav-open:hover, .nav-rail:hover, .nav-close:hover { background: var(--nav-hover-bg); }
.site-header :focus-visible { outline: 2px solid #fff; outline-offset: 2px; box-shadow: none; border-radius: 10px; }
.topbar { display: none; }
.topbar-slogan { display: none; }
@media (max-width: 1023px) {
.site-header { position: sticky; top: 0; z-index: 60; }
.topbar {
position: relative; display: flex; align-items: center; gap: 12px; min-height: calc(var(--topbar-h) + env(safe-area-inset-top, 0px));
padding: env(safe-area-inset-top, 0px) var(--gutter) 0 calc(var(--gutter) - 10px); background: var(--glass-solid); color: #fff;
}
.topbar .brand { margin-right: auto; }
.topbar-cta { flex: 0 0 auto; }
html.nav-open .topbar::after { content: ""; position: absolute; inset: 0; z-index: 2; background: rgba(14, 27, 44, .55); }
}
@media (min-width: 768px) and (max-width: 1023px) {
.topbar-slogan {
display: block; flex: 1 1 auto; min-width: 0; margin: 0; font-size: .9375rem; line-height: 1.3; color: var(--c-on-dark-2);
white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.topbar .brand { margin-right: 8px; }
}
@media (max-width: 479px) { .topbar-cta { display: none; } }
.dock {
position: fixed; left: 0; right: 0; bottom: 0; z-index: 45;
padding: 8px var(--gutter) calc(8px + env(safe-area-inset-bottom, 0px));
background: var(--paper); background: color-mix(in srgb, var(--paper) 94%, transparent);
backdrop-filter: blur(8px); border-top: 1px solid var(--line-soft);
}
.dock .btn { min-height: 48px; }
@media (min-width: 768px) { .dock { display: none; } }
html.nav-open .dock, body:has(.modal[open]) .dock { display: none; }
@media (prefers-reduced-motion: no-preference) { html.js .dock:not([hidden]) { animation: dock-in 280ms var(--ease-out); } }
@keyframes dock-in { from { transform: translateY(100%); } }
.dock.is-typing { display: none; }
.sidebar { color: var(--nav-text); }
.sidebar-head { display: flex; align-items: center; gap: 8px; min-height: 64px; padding: 10px 12px; border-bottom: 1px solid var(--glass-line); }
.sidebar-head .brand { min-width: 0; overflow: hidden; }
.site-nav { padding: 12px; }
.nav-list, .nav-sub { list-style: none; margin: 0; padding: 0; }
.nav-list { display: grid; gap: 2px; }
.nav-item { margin: 0; }
.nav-row { display: flex; align-items: center; gap: 2px; }
.nav-link, .nav-sublink, .nav-badge {
position: relative; display: flex; align-items: center; gap: 12px; min-width: 0;
color: var(--nav-text); text-decoration: none; border-radius: 10px;
transition: background-color var(--dur-fast) var(--ease-out), color var(--dur-fast) var(--ease-out);
}
.nav-link { flex: 1 1 auto; min-height: var(--nav-item-h); padding: 0 12px; font-family: var(--font); font-size: .9375rem; line-height: 1.25rem; font-weight: 500; }
.nav-label { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.nav-link:hover, .nav-sublink:hover, .nav-badge:hover { background: var(--nav-hover-bg); color: #fff; text-decoration: none; }
.nav-link[aria-current], .nav-item:has([aria-current]) > .nav-row .nav-link { background: var(--nav-active-bg); font-weight: 600; }
.nav-link[aria-current]::before, .nav-item:has([aria-current]) > .nav-row .nav-link::before {
content: ""; position: absolute; left: 0; top: 10px; bottom: 10px; width: 2px; border-radius: 0 2px 2px 0; background: var(--nav-active-bar);
}
.nav-row { position: relative; isolation: isolate; }
.nav-group:has(.nav-sub [aria-current]) > .nav-row::before { content: ""; position: absolute; inset: 0; z-index: -1; border-radius: 10px; background: var(--nav-active-bg); }
.nav-group:has(.nav-sub [aria-current]) > .nav-row .nav-link { background: transparent; }
.nav-list:has(> .nav-item > .nav-row > .nav-link[aria-current="location"]) > .nav-item:not(:has([aria-current="location"])) > .nav-row .nav-link { background: transparent; font-weight: 500; }
.nav-list:has(> .nav-item > .nav-row > .nav-link[aria-current="location"]) > .nav-item:not(:has([aria-current="location"])) > .nav-row .nav-link::before { content: none; }
.nav-sub-toggle {
display: inline-grid; place-items: center; flex: 0 0 auto; width: 44px; height: 44px; padding: 0;
background: transparent; border: 0; border-radius: 10px; color: var(--nav-text-2); cursor: pointer;
}
.nav-sub-toggle:hover { background: var(--nav-hover-bg); color: #fff; }
.ico-chev { transition: transform var(--dur-base) var(--ease-out); }
.nav-sub-toggle[aria-expanded="true"] .ico-chev { transform: rotate(180deg); }
.nav-sub { display: grid; gap: 1px; padding: 2px 0 6px; }
.nav-sublink { min-height: 40px; padding: 0 12px 0 24px; gap: 10px; font-size: var(--fs-meta); line-height: 1.25rem; color: var(--nav-text-2); }
.nav-sublink .ico { width: 18px; height: 18px; }
.nav-sublink[aria-current] { color: #fff; font-weight: 600; }
.nav-sublink[aria-current]::after { content: ""; flex: 0 0 auto; width: 6px; height: 6px; margin-left: auto; border-radius: 50%; background: var(--c-accent-on-dark); }
.nav-toc .nav-sublink { padding-left: 44px; }
.nav-dot { position: absolute; left: 31px; top: 50%; width: 5px; height: 5px; margin-top: -2.5px; border-radius: 50%; background: currentColor; opacity: .55; }
.nav-toc .nav-sublink[aria-current] .nav-dot { background: var(--c-accent-on-dark); opacity: 1; }
.nav-toc .nav-sublink[aria-current]::after { content: none; }
.sidebar-foot { display: grid; gap: 10px; margin-top: auto; padding: 12px; border-top: 1px solid var(--glass-line); }
.nav-badge { align-items: flex-start; gap: 10px; padding: 8px 12px; min-height: 44px; font-size: var(--fs-meta); line-height: 1.3; color: var(--nav-text-2); }
.nav-badge .ico { width: 18px; height: 18px; margin-top: 0; color: var(--c-accent-on-dark); }
.nav-badge .nav-label { white-space: normal; }
.nav-cta { position: relative; display: flex; justify-content: center; gap: 10px; width: 100%; min-height: 44px; padding: 8px 16px; }
.nav-cta .ico { width: 18px; height: 18px; }
.brand-name, .nav-label { transition: opacity var(--dur-fast) var(--ease-out); }
@media (min-width: 1024px) {
.site-header { position: sticky; top: 0; height: 100vh; height: 100dvh; align-self: start; z-index: 40; padding: var(--shell-gap) 0 var(--shell-gap) var(--shell-gap); }
.topbar, .nav-close { display: none; }
.sidebar {
height: 100%; display: flex; flex-direction: column; border-radius: var(--sheet-r);
background: var(--glass-nav); -webkit-backdrop-filter: blur(var(--glass-blur)) saturate(1.2); backdrop-filter: blur(var(--glass-blur)) saturate(1.2);
border: 1px solid var(--glass-line); overflow-x: hidden; overflow-y: auto; overscroll-behavior: contain; scrollbar-width: thin;
}
html[data-nav="rail"] .sidebar { overflow: visible; }
html[data-nav="rail"] .sidebar-head { flex-direction: column; gap: 4px; padding: 10px 0; }
html[data-nav="rail"] .sidebar-head .brand { overflow: visible; gap: 0; }
html[data-nav="rail"] :is(.brand-name, .nav-label) {
position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap; border: 0;
}
html[data-nav="rail"] .nav-row { gap: 0; }
html[data-nav="rail"] .nav-link { justify-content: center; width: 48px; padding: 0; }
html[data-nav="rail"] :is(.nav-sub, .nav-sub-toggle) { display: none; }
html[data-nav="rail"] .sidebar-foot { justify-items: center; }
html[data-nav="rail"] .nav-badge { justify-content: center; width: 48px; padding: 0; align-items: center; }
html[data-nav="rail"] .nav-cta { width: 48px; padding: 0; }
html[data-nav="rail"] [data-tip] { position: relative; }
html[data-nav="rail"] [data-tip]::after {
content: attr(data-tip); position: absolute; left: calc(100% + 12px); top: 50%; z-index: 5; translate: 0 -50%;
padding: 6px 10px; border-radius: 8px; border: 1px solid rgba(255, 255, 255, .28); background: #0E1B2C; color: #fff;
font-family: var(--font); font-size: var(--fs-meta); line-height: 1.25rem; font-weight: 500; white-space: nowrap; pointer-events: none;
opacity: 0; visibility: hidden; transition: opacity var(--dur-fast) var(--ease-out), visibility 0s linear var(--dur-fast);
}
html[data-nav="rail"] [data-tip]:is(:hover, :focus-visible)::after { opacity: 1; visibility: visible; transition-delay: 0s; }
html:not([data-nav="rail"]) [data-tip]::after { content: none; }
}
@media (min-width: 1024px) and (max-height: 620px) {
html[data-nav="rail"] .sidebar { overflow-x: hidden; overflow-y: auto; }
html[data-nav="rail"] [data-tip]::after { content: none; }
}
@media (max-width: 1023px) {
.nav-rail { display: none; }
.sidebar {
position: fixed; inset: 0 auto 0 0; width: min(84vw, 320px); z-index: 60; display: flex; flex-direction: column;
background: #0E1B2C; color: #fff; overflow-y: auto; overscroll-behavior: contain; padding-top: env(safe-area-inset-top, 0px);
transform: translateX(-100%); visibility: hidden; transition: transform 240ms var(--ease-out), visibility 0s linear 240ms;
}
html.nav-open .sidebar { transform: none; visibility: visible; transition-delay: 0s; box-shadow: var(--e3); }
.sidebar-head { padding-left: calc(var(--gutter) - 10px); }
.nav-scrim { position: fixed; inset: 0; z-index: 55; background: rgba(14, 27, 44, .55); }
html.nav-open body { position: fixed; inset-inline: 0; top: var(--lock-top, 0); overflow: hidden; }
html.nav-open .site-header { position: fixed; top: 0; left: 0; right: 0; }
html.nav-open .shell { padding-top: calc(var(--topbar-h) + env(safe-area-inset-top, 0px)); }
}
@media (max-width: 1023px) and (prefers-reduced-motion: reduce) { .sidebar { transition: none; } }
@media (min-width: 1024px) { .nav-scrim { display: none; } }
@media (scripting: none) {
.nav-sub[hidden] { display: grid !important; }
.nav-sub-toggle, .nav-rail { display: none; }
}
@media (max-width: 1023px) and (scripting: none) {
button.nav-open { display: none; }
.sidebar { position: static; transform: none; visibility: visible; width: auto; background: var(--glass-solid); overflow: visible; padding-top: 0; }
.sidebar-head, .sidebar-foot, .nav-sub, .nav-sub[hidden] { display: none !important; }
.site-nav { padding: 0 var(--gutter) 8px calc(var(--gutter) - 12px); }
.nav-list { display: flex; flex-wrap: wrap; gap: 0 4px; }
.nav-link .ico { display: none; }
.nav-link { padding: 0 12px; }
.site-header { position: static; }
}
@media (min-width: 1024px) { :root { --header-h: 0px; --scroll-pad: 16px; } html[data-nav="rail"] { --nav-w: var(--nav-w-rail); } }
@media (max-width: 1023px) { :root { --header-h: var(--topbar-h); --scroll-pad: 72px; } }
html { background: #0E1B2C; scrollbar-gutter: stable; scroll-padding-top: var(--scroll-pad); }
html.reduce-tmp { scroll-behavior: auto; }
[id] { scroll-margin-top: 0; }
body { background: transparent; }
body::before { content: ""; position: fixed; inset: 0; z-index: -1; pointer-events: none; background: var(--bg-fallback); }
html.has-bg-shell body::before {
background-color: #0E1B2C;
background-image: url(/assets/img/photo/bg-shell-1600.5ee5b10ae5.webp);
background-image: image-set(url(/assets/img/photo/bg-shell-1600.535e729c09.avif) type("image/avif"), url(/assets/img/photo/bg-shell-1600.5ee5b10ae5.webp) type("image/webp"));
background-size: cover; background-position: 50% 50%; background-repeat: no-repeat;
}
@media (min-width: 1600px), (min-width: 1024px) and (min-resolution: 1.5dppx) {
html.has-bg-shell body::before { background-image: url(/assets/img/photo/bg-shell-2560.4a4098de49.webp);
background-image: image-set(url(/assets/img/photo/bg-shell-2560.83c13bcb54.avif) type("image/avif"), url(/assets/img/photo/bg-shell-2560.4a4098de49.webp) type("image/webp")); }
}
@media (max-width: 767px), (max-width: 1023px) and (orientation: portrait) {
html.has-bg-shell body::before { background-image: none; }
html.has-bg-shell-m body::before { background-image: url(/assets/img/photo/bg-shell-m-1080.7792056237.webp);
background-image: image-set(url(/assets/img/photo/bg-shell-m-1080.135f553dff.avif) type("image/avif"), url(/assets/img/photo/bg-shell-m-1080.7792056237.webp) type("image/webp")); background-position: 50% 100%; background-size: cover; }
}
@media (min-width: 1024px) { .shell-col { padding-bottom: 28px; } }
@media (forced-colors: active) { body::before { display: none; } }
.shell-col { container: shell / inline-size; min-width: 0; }
@media (min-width: 1024px) {
.shell { display: grid; grid-template-columns: calc(var(--nav-w) + var(--shell-gap)) minmax(0, var(--col-max)); column-gap: var(--shell-gap); padding-right: var(--shell-gap); }
html.nav-anim .shell { transition: grid-template-columns var(--dur-nav) var(--ease-io); }
.shell-col { padding-top: var(--shell-gap); padding-bottom: var(--shell-gap); }
}
@media (min-width: 768px) and (max-width: 1023px) { .shell-col { padding: 12px; } }
@media (max-width: 767px) { .shell-col { padding: 8px 0 0; } }
main > :where(:not(.masthead)) { background-color: var(--sheet-bg); }
main > .masthead + *, main > :first-child:not(.masthead) { border-start-start-radius: var(--sheet-r); border-start-end-radius: var(--sheet-r); overflow: clip; }
main > :last-child { border-end-start-radius: var(--sheet-r); border-end-end-radius: var(--sheet-r); overflow: clip; }
@media (max-width: 767px) { main > :last-child { border-end-start-radius: 0; border-end-end-radius: 0; } }
.masthead { position: relative; background: var(--glass); border-radius: var(--sheet-r); margin-bottom: var(--shell-gap); color: #fff; }
@media (min-width: 1024px) {
.masthead { -webkit-backdrop-filter: blur(var(--glass-blur)) saturate(1.2); backdrop-filter: blur(var(--glass-blur)) saturate(1.2); border: 1px solid var(--glass-line); }
}
@media (max-width: 767px) { .masthead { margin: 0 8px 8px; } }
.masthead--slim { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px 24px; padding: 16px 20px; }
@media (min-width: 1024px) { .masthead--slim { padding: 16px 32px; } }
.masthead-slogan { margin: 0; max-width: 34ch; font-family: var(--font-display); font-weight: 700; font-size: clamp(1.125rem, .9rem + .9cqi, 1.5rem); line-height: 1.25; letter-spacing: -.015em; color: #fff; text-wrap: balance; }
.masthead--slim .btn { flex: 0 0 auto; }
@container shell (max-width: 479px) { .masthead--slim .btn { flex: 1 1 100%; } }
@media (prefers-reduced-transparency: reduce) {
:root { --glass: var(--glass-solid); --glass-nav: var(--glass-solid); }
.sidebar, .masthead, .site-footer { -webkit-backdrop-filter: none !important; backdrop-filter: none !important; }
}
@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) { :root { --glass: var(--glass-solid); --glass-nav: var(--glass-solid); } }
@media (forced-colors: active) { .sidebar, .masthead, .site-footer { border: 1px solid CanvasText; } }
@media (max-width: 559px) { :root { --sp-base: 40px; --sp-air: 52px; } }
.hero {
position: relative; color: var(--c-on-dark); overflow: clip;
background-color: var(--c-anchor);
--hero-px: 20px;
padding: 28px var(--hero-px) 24px;
--ink: #fff; --ink-2: var(--c-on-dark-2); --muted: var(--c-on-dark-2); --muted-strong: var(--c-on-dark-2);
--navy: #fff; --navy-600: var(--c-on-dark-2); --rule: rgba(255, 255, 255, .28); --rule-mid: rgba(255, 255, 255, .14); --line-soft: rgba(255, 255, 255, .10);
--link-c: #fff; --link-line: var(--c-agent-on-dark); --link-hover: var(--c-agent-on-dark); --link-active: #fff;
}
.hero10-grid { display: grid; gap: clamp(28px, 3.4cqi, 48px); align-items: center; }
.hero-copy { min-width: 0; }
.hero h1 { font-size: clamp(2.125rem, 1.5rem + 2.1cqi, 3.25rem); max-width: 14ch; margin-bottom: 0; text-wrap: balance; }
.hero-copy .lead { margin: .75em 0 0; max-width: 34ch; color: var(--c-on-dark-2); }
.hero .cta-row { margin-top: var(--s5); align-items: center; column-gap: var(--s5); row-gap: var(--s2); }
.hero-link { color: #fff; }
.hero-sums { list-style: none; margin: var(--s6) 0 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--s4); }
.hero-sums li { display: grid; gap: 6px; align-content: start; min-width: 0; }
.hero-sum { font-family: var(--font-display); font-weight: 700; font-size: clamp(1.125rem, .95rem + .8cqi, 1.5rem); line-height: 1.1; letter-spacing: -.02em; color: #fff; font-variant-numeric: tabular-nums; white-space: nowrap; }
.hero-sum-lbl { font-size: var(--fs-meta); line-height: 1.35; color: var(--c-on-dark-2); }
@container shell (max-width: 519px) { .hero-sums { grid-template-columns: 1fr 1fr; } .hero-sums li:last-child { grid-column: 1 / -1; } }
@container shell (min-width: 1080px) {
.hero10-grid { grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); }
.hero h1 { font-size: clamp(2.25rem, 1.2rem + 1.7cqi, 3rem); }
.hero .hero-sums { grid-template-columns: 1fr; gap: 10px; }
.hero .hero-sums li { display: flex; align-items: baseline; gap: 12px; }
.hero .hero-sum { min-width: 8.2em; }
}
.hero-scene { min-width: 0; }
@media (min-width: 768px) { .hero { --hero-px: 40px; padding: 40px var(--hero-px) 32px; } }
@media (min-width: 1280px) { .hero { --hero-px: 56px; padding: 56px var(--hero-px) 40px; } }
.hero > .clients { margin: 28px calc(-1 * var(--hero-px)) 0; padding-left: var(--hero-px); padding-right: var(--hero-px); }
.hero > .clients > .container { max-width: none; padding-left: 0; padding-right: 0; }
@media (max-height: 820px) {
@container shell (min-width: 1024px) {
.hero { padding-top: 28px; }
.hero .cta-row { margin-top: var(--s4); }
.hero > .clients { margin-top: 20px; }
}
}
@container shell (max-width: 379px) {
.hero h1 { font-size: 2.125rem; }
.hero-copy .lead { font-size: 1.1875rem; }
}
.aud-grid .section-intro { margin-bottom: var(--s6); }
.aud-scroll { overflow: hidden; padding: 8px; background: var(--c-stage); border: 1px solid var(--c-stage-line); border-radius: var(--r-panel); }
.audience-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 0; }
.audience-list li { display: flex; flex-direction: column; min-width: 0; margin: 0; }
@container shell (min-width: 640px) { .audience-list { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@container shell (min-width: 1100px) { .audience-list { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
.aud-media { display: block; background: var(--c-stage); }
.aud-media img { display: block; width: 100%; height: auto; aspect-ratio: 16 / 9; object-fit: cover; }
.aud-text { display: flex; flex-direction: column-reverse; justify-content: flex-end; gap: 4px; padding: var(--s3) var(--s5) var(--s5); }
.aud-text h3 { margin: 0; font-family: var(--font); font-size: var(--fs-meta); font-weight: 600; line-height: var(--lh-tight); letter-spacing: 0; color: var(--c-text-2); }
.aud-num { display: block; margin: 0; }
.aud-num-val { display: block; font-family: var(--font-display); font-size: var(--fs-stat); font-weight: 700; line-height: 1.05; letter-spacing: var(--ls-num); color: var(--c-text); font-variant-numeric: tabular-nums; white-space: nowrap; overflow-wrap: normal; }
.audience-list li:first-child .aud-num-val { color: var(--c-agent-ink); }
.aud-num-lbl { display: block; margin-top: 4px; font-size: var(--fs-meta); line-height: 1.35; color: var(--c-text-3); }
@container shell (min-width: 1100px) { .aud-num-val { font-size: clamp(1.5rem, 1rem + 1cqi, 2rem); } }
@container shell (max-width: 639px) {
.aud-scroll { overflow-x: auto; overscroll-behavior-x: contain; scroll-snap-type: x mandatory; scroll-padding-left: 8px; -webkit-overflow-scrolling: touch; }
.audience-list { grid-auto-flow: column; grid-auto-columns: 80%; grid-template-columns: none; }
.audience-list li { scroll-snap-align: start; }
.aud-text { padding: var(--s3) var(--s4) var(--s4); }
}
.aud-scroll:focus-visible { outline-offset: 4px; border-radius: var(--r-panel); }
.clients { position: relative; background-color: transparent; border-top: 1px solid var(--glass-line, rgba(255, 255, 255, .10)); padding-top: 20px; margin-top: 20px; overflow: hidden; color: var(--c-on-dark-2); }
.clients-sprite { position: absolute; width: 0; height: 0; overflow: hidden; }
.clients-row { display: grid; grid-template-columns: 170px minmax(0, 1fr); column-gap: 32px; align-items: center; }
.clients-label { margin: 0; font-size: var(--fs-meta); font-weight: 600; line-height: var(--lh-tight); color: var(--c-on-dark-2); }
.marquee { min-width: 0; overflow: hidden;
-webkit-mask-image: linear-gradient(90deg, transparent, #000 64px, #000 calc(100% - 64px), transparent);
mask-image: linear-gradient(90deg, transparent, #000 64px, #000 calc(100% - 64px), transparent); }
.marquee-track { display: flex; width: max-content; animation: marquee var(--marquee-dur, 40s) linear infinite; will-change: transform; }
.marquee-set { display: flex; align-items: center; margin: 0; padding: 0; list-style: none; }
.logo { flex: none; margin-inline: 44px; color: var(--c-on-dark-2); }
.logo svg { display: block; width: var(--w); height: var(--h); max-width: none; fill: currentColor; }
.logo--client-1 { --w: 103px; --h: 32px; }
.logo--client-2 { --w: 148px; --h: 28px; }
.logo--client-3 { --w: 149px; --h: 32px; }
.logo--client-4 { --w: 226px; --h: 28px; }
.clients.is-offscreen .marquee-track { animation-play-state: paused; }
@keyframes marquee { to { transform: translateX(-50%); } }
@container shell (max-width: 767px) {
.clients { padding-top: 16px; }
.hero > .clients { margin-top: 20px; }
.clients-row { grid-template-columns: minmax(0, 1fr); row-gap: 12px; }
.marquee { grid-column: 1 / -1; grid-row: 2;
-webkit-mask-image: linear-gradient(90deg, transparent, #000 24px, #000 calc(100% - 24px), transparent);
mask-image: linear-gradient(90deg, transparent, #000 24px, #000 calc(100% - 24px), transparent); }
.logo { margin-inline: 28px; }
.logo svg { width: calc(var(--w) * .8); height: calc(var(--h) * .8); }
}
@media (prefers-reduced-motion: reduce) {
.marquee-track { animation: none; width: auto; }
.marquee-set { flex: 1 1 auto; flex-wrap: wrap; justify-content: center; row-gap: 16px; column-gap: 48px; }
.marquee-set[aria-hidden="true"] { display: none; }
.logo { margin-inline: 0; }
.marquee { -webkit-mask-image: none; mask-image: none; }
}
html.reduce .marquee-track { animation: none; width: auto; }
html.reduce .marquee-set { flex: 1 1 auto; flex-wrap: wrap; justify-content: center; row-gap: 16px; column-gap: 48px; }
html.reduce .marquee-set[aria-hidden="true"] { display: none; }
html.reduce .logo { margin-inline: 0; }
html.reduce .marquee { -webkit-mask-image: none; mask-image: none; }
.explain { --n: 4; margin: 0; min-width: 0; container: explain / inline-size; }
.explain--n2 { --n: 2; } .explain--n3 { --n: 3; } .explain--n5 { --n: 5; }
.explain-head { position: relative; height: 48px; }
.explain-pins { list-style: none; margin: 0; padding: 0; }
.pin {
position: absolute; top: 0; bottom: 0; left: var(--x); width: calc(100% / var(--n) - 12px); transform: translateX(-50%);
display: flex; flex-direction: column; align-items: center; gap: 6px; text-align: center;
}
.pin-num {
position: relative; z-index: 1; flex: 0 0 auto; display: grid; place-items: center; width: 28px; height: 28px; border-radius: 50%;
border: 2px solid var(--c-anchor); background: var(--c-surface); color: var(--c-anchor);
font: 700 var(--fs-meta)/1 var(--font-display); font-variant-numeric: tabular-nums;
}
.pin--agent .pin-num { background: var(--c-agent); }
.pin--done .pin-num { background: var(--c-done); color: #fff; }
.pin-text { display: none; }
.pin::after { content: ""; flex: 1 1 auto; min-height: 6px; border-left: 2px dashed var(--c-anchor); opacity: .45; }
.explain-seg { position: absolute; top: 13px; left: var(--x); width: var(--w); height: 2px; background: var(--c-stage-line); }
.explain-run { position: absolute; inset: 0; opacity: 0; }
.explain-run::before {
content: ""; position: absolute; left: -6px; top: -5px; width: 12px; height: 12px; box-sizing: border-box;
border-radius: 50%; background: var(--c-agent); border: 2px solid var(--c-anchor);
}
.explain-stage { overflow: hidden; background: var(--c-stage); border: 1px solid var(--c-stage-line); border-radius: var(--r-panel); }
.explain-img, .explain-img img { display: block; width: 100%; }
.explain-img img { height: auto; aspect-ratio: 5 / 2; object-fit: cover; object-position: 50% 62%; }
.explain-ba { margin: var(--s4) 0 0; font-size: var(--fs-body); line-height: 1.45; color: var(--c-text-2); }
.explain-ba s { color: var(--c-text-3); text-decoration-thickness: 1px; }
.explain-ba .ba-now { font-weight: 700; color: var(--c-text); }
.explain-ba .ba-arrow { padding-inline: 4px; font-weight: 700; color: var(--c-agent-ink); }
.explain-legend { list-style: none; margin: var(--s4) 0 0; padding: 0; display: grid; gap: 6px; }
.explain-legend .lg { display: flex; gap: 10px; align-items: flex-start; margin: 0; padding: 8px 10px; border-radius: 10px; font-size: var(--fs-small); line-height: 1.35; color: var(--c-text); }
.lg-num {
flex: 0 0 auto; display: grid; place-items: center; width: 24px; height: 24px; border-radius: 50%;
border: 2px solid var(--c-anchor); background: var(--c-surface); color: var(--c-anchor);
font: 700 var(--fs-meta)/1 var(--font-display); font-variant-numeric: tabular-nums;
}
.lg--agent { background: var(--c-agent-wash); }
.lg--agent .lg-num { background: var(--c-agent); }
.lg--done .lg-num { background: var(--c-done); color: #fff; }
.lg-text { padding-top: 2px; }
.explain-cap { margin: var(--s3) 0 0; font-size: var(--fs-meta); line-height: var(--lh-tight); color: var(--c-text-3); max-width: 70ch; }
.explain--bare .pin::after { content: none; }
.explain--bare .explain-head { height: 32px; }
@container explain (min-width: 760px) {
.explain-head { height: 112px; }
.explain--bare .explain-head { height: 96px; }
.pin-num { width: 32px; height: 32px; }
.explain-seg { top: 15px; }
.pin-text { display: block; max-width: 20ch; font-size: var(--fs-small); font-weight: 600; line-height: 1.3; color: var(--c-text); text-wrap: balance; }
.pin--agent .pin-text { padding: 1px 8px; border-radius: 6px; background: var(--c-agent-wash); }
.explain-legend { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0; }
}
.explain--panel {
--c-text: var(--slate-12); --c-text-2: #4A4F57; --c-text-3: var(--slate-11);
--ink: var(--c-text); --ink-2: var(--c-text-2); --muted: var(--c-text-3); --muted-strong: var(--c-text-3);
padding: clamp(8px, 1.2cqi, 14px) clamp(8px, 1.2cqi, 14px) clamp(14px, 1.6cqi, 20px);
border-radius: var(--r-panel); background: var(--c-stage); color: var(--c-text);
}
.explain--panel .explain-stage { border: 0; border-radius: 12px; }
.explain--panel .explain-cap { padding-inline: 6px; }
.pin-num::after { content: ""; position: absolute; inset: -6px; border-radius: 50%; border: 2px solid var(--c-agent); opacity: 0; }
@media (prefers-reduced-motion: no-preference) and (scripting: enabled) {
.explain--n2 .explain-run { animation: ex-run2 4s var(--ease-io) infinite; }
.explain--n3 .explain-run { animation: ex-run3 6s var(--ease-io) infinite; }
.explain--n4 .explain-run { animation: ex-run4 8s var(--ease-io) infinite; }
.explain--n5 .explain-run { animation: ex-run5 10s var(--ease-io) infinite; }
.explain--n2 .pin-num::after { animation: ex-ring2 4s linear infinite; }
.explain--n3 .pin-num::after { animation: ex-ring3 6s linear infinite; }
.explain--n4 .pin-num::after { animation: ex-ring4 8s linear infinite; }
.explain--n5 .pin-num::after { animation: ex-ring5 10s linear infinite; }
.explain-seg:nth-of-type(2) .explain-run, .pin:nth-child(2) .pin-num::after { animation-delay: 2s; }
.explain-seg:nth-of-type(3) .explain-run, .pin:nth-child(3) .pin-num::after { animation-delay: 4s; }
.explain-seg:nth-of-type(4) .explain-run, .pin:nth-child(4) .pin-num::after { animation-delay: 6s; }
.pin:nth-child(5) .pin-num::after { animation-delay: 8s; }
}
html.reduce .explain-run, html.reduce .pin-num::after { animation: none; }
@keyframes ex-run2 { 0%, 34% { transform: translateX(0); opacity: 0; } 38%, 46% { opacity: 1; } 50%, 100% { transform: translateX(100%); opacity: 0; } }
@keyframes ex-run3 { 0%, 22% { transform: translateX(0); opacity: 0; } 25%, 30% { opacity: 1; } 33.3%, 100% { transform: translateX(100%); opacity: 0; } }
@keyframes ex-run4 { 0%, 17% { transform: translateX(0); opacity: 0; } 19%, 23% { opacity: 1; } 25%, 100% { transform: translateX(100%); opacity: 0; } }
@keyframes ex-run5 { 0%, 14% { transform: translateX(0); opacity: 0; } 15%, 19% { opacity: 1; } 20%, 100% { transform: translateX(100%); opacity: 0; } }
@keyframes ex-ring2 { 0% { opacity: 0; } 3%, 36% { opacity: 1; } 42%, 100% { opacity: 0; } }
@keyframes ex-ring3 { 0% { opacity: 0; } 3%, 25% { opacity: 1; } 30%, 100% { opacity: 0; } }
@keyframes ex-ring4 { 0% { opacity: 0; } 2%, 18% { opacity: 1; } 22%, 100% { opacity: 0; } }
@keyframes ex-ring5 { 0% { opacity: 0; } 2%, 15% { opacity: 1; } 18%, 100% { opacity: 0; } }
@media (forced-colors: active) { .explain-run, .pin-num::after { display: none; } }
.px-0{--x:0%}.px-1{--x:1%}.px-2{--x:2%}.px-3{--x:3%}.px-4{--x:4%}.px-5{--x:5%}.px-6{--x:6%}.px-7{--x:7%}.px-8{--x:8%}.px-9{--x:9%}.px-10{--x:10%}.px-11{--x:11%}.px-12{--x:12%}.px-13{--x:13%}.px-14{--x:14%}.px-15{--x:15%}.px-16{--x:16%}.px-17{--x:17%}.px-18{--x:18%}.px-19{--x:19%}.px-20{--x:20%}.px-21{--x:21%}.px-22{--x:22%}.px-23{--x:23%}.px-24{--x:24%}.px-25{--x:25%}.px-26{--x:26%}.px-27{--x:27%}.px-28{--x:28%}.px-29{--x:29%}.px-30{--x:30%}.px-31{--x:31%}.px-32{--x:32%}.px-33{--x:33%}.px-34{--x:34%}.px-35{--x:35%}.px-36{--x:36%}.px-37{--x:37%}.px-38{--x:38%}.px-39{--x:39%}.px-40{--x:40%}.px-41{--x:41%}.px-42{--x:42%}.px-43{--x:43%}.px-44{--x:44%}.px-45{--x:45%}.px-46{--x:46%}.px-47{--x:47%}.px-48{--x:48%}.px-49{--x:49%}.px-50{--x:50%}.px-51{--x:51%}.px-52{--x:52%}.px-53{--x:53%}.px-54{--x:54%}.px-55{--x:55%}.px-56{--x:56%}.px-57{--x:57%}.px-58{--x:58%}.px-59{--x:59%}.px-60{--x:60%}.px-61{--x:61%}.px-62{--x:62%}.px-63{--x:63%}.px-64{--x:64%}.px-65{--x:65%}.px-66{--x:66%}.px-67{--x:67%}.px-68{--x:68%}.px-69{--x:69%}.px-70{--x:70%}.px-71{--x:71%}.px-72{--x:72%}.px-73{--x:73%}.px-74{--x:74%}.px-75{--x:75%}.px-76{--x:76%}.px-77{--x:77%}.px-78{--x:78%}.px-79{--x:79%}.px-80{--x:80%}.px-81{--x:81%}.px-82{--x:82%}.px-83{--x:83%}.px-84{--x:84%}.px-85{--x:85%}.px-86{--x:86%}.px-87{--x:87%}.px-88{--x:88%}.px-89{--x:89%}.px-90{--x:90%}.px-91{--x:91%}.px-92{--x:92%}.px-93{--x:93%}.px-94{--x:94%}.px-95{--x:95%}.px-96{--x:96%}.px-97{--x:97%}.px-98{--x:98%}.px-99{--x:99%}.px-100{--x:100%}
.pw-1{--w:1%}.pw-2{--w:2%}.pw-3{--w:3%}.pw-4{--w:4%}.pw-5{--w:5%}.pw-6{--w:6%}.pw-7{--w:7%}.pw-8{--w:8%}.pw-9{--w:9%}.pw-10{--w:10%}.pw-11{--w:11%}.pw-12{--w:12%}.pw-13{--w:13%}.pw-14{--w:14%}.pw-15{--w:15%}.pw-16{--w:16%}.pw-17{--w:17%}.pw-18{--w:18%}.pw-19{--w:19%}.pw-20{--w:20%}.pw-21{--w:21%}.pw-22{--w:22%}.pw-23{--w:23%}.pw-24{--w:24%}.pw-25{--w:25%}.pw-26{--w:26%}.pw-27{--w:27%}.pw-28{--w:28%}.pw-29{--w:29%}.pw-30{--w:30%}.pw-31{--w:31%}.pw-32{--w:32%}.pw-33{--w:33%}.pw-34{--w:34%}.pw-35{--w:35%}.pw-36{--w:36%}.pw-37{--w:37%}.pw-38{--w:38%}.pw-39{--w:39%}.pw-40{--w:40%}.pw-41{--w:41%}.pw-42{--w:42%}.pw-43{--w:43%}.pw-44{--w:44%}.pw-45{--w:45%}.pw-46{--w:46%}.pw-47{--w:47%}.pw-48{--w:48%}.pw-49{--w:49%}.pw-50{--w:50%}.pw-51{--w:51%}.pw-52{--w:52%}.pw-53{--w:53%}.pw-54{--w:54%}.pw-55{--w:55%}.pw-56{--w:56%}.pw-57{--w:57%}.pw-58{--w:58%}.pw-59{--w:59%}.pw-60{--w:60%}.pw-61{--w:61%}.pw-62{--w:62%}.pw-63{--w:63%}.pw-64{--w:64%}.pw-65{--w:65%}.pw-66{--w:66%}.pw-67{--w:67%}.pw-68{--w:68%}.pw-69{--w:69%}.pw-70{--w:70%}.pw-71{--w:71%}.pw-72{--w:72%}.pw-73{--w:73%}.pw-74{--w:74%}.pw-75{--w:75%}.pw-76{--w:76%}.pw-77{--w:77%}.pw-78{--w:78%}.pw-79{--w:79%}.pw-80{--w:80%}.pw-81{--w:81%}.pw-82{--w:82%}.pw-83{--w:83%}.pw-84{--w:84%}.pw-85{--w:85%}.pw-86{--w:86%}.pw-87{--w:87%}.pw-88{--w:88%}.pw-89{--w:89%}.pw-90{--w:90%}.pw-91{--w:91%}.pw-92{--w:92%}.pw-93{--w:93%}.pw-94{--w:94%}.pw-95{--w:95%}.pw-96{--w:96%}.pw-97{--w:97%}.pw-98{--w:98%}.pw-99{--w:99%}.pw-100{--w:100%}
.metrics { list-style: none; margin: 0 0 var(--s4); padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--s4) var(--s6); }
.metrics li { min-width: 0; margin: 0; }
.metric-num { display: block; min-width: 4ch; font-family: var(--font-display); font-size: var(--fs-h3); font-weight: 700; line-height: 1.1; color: var(--c-text); font-variant-numeric: tabular-nums; white-space: nowrap; overflow-wrap: normal; }
.metric-lbl { display: block; margin-top: 4px; font-size: var(--fs-meta); line-height: var(--lh-tight); color: var(--ink-2); }
.calc { margin: 0; min-width: 0; padding: clamp(20px, 3vw, 40px); border: 1px solid var(--c-stage-line); border-radius: var(--r-panel); background: var(--c-surface); box-shadow: var(--e1); }
.calc h3 { margin: 0 0 .3em; }
.calc-intro { color: var(--c-text-2); margin: 0 0 var(--s5); max-width: var(--w-lead); }
.hours-lead { margin: 0 0 var(--s6); font-size: var(--fs-body); color: var(--c-text-2); max-width: var(--w-lead); }
.calc-wrap { display: grid; gap: var(--s5); align-items: start; }
.calc-grid { display: grid; gap: var(--s4); align-content: start; }
@container shell (min-width: 560px) { .calc-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--s5) var(--s6); } }
.calc-field { min-width: 0; }
.calc-field label { display: block; font-weight: 600; margin-bottom: 6px; }
.stepper { display: flex; align-items: stretch; min-height: 48px; border: 1px solid var(--c-rule); border-radius: var(--r-ctl); background: var(--c-surface); overflow: hidden; }
.stepper button { width: 48px; min-height: 48px; border: 0; border-radius: 0; background: var(--slate-2); font: inherit; font-size: 1.25rem; line-height: 1; color: var(--c-anchor); cursor: pointer; }
.stepper button:hover { background: var(--slate-4); color: var(--c-anchor); }
.stepper:focus-within { border-color: var(--c-anchor); outline: 2px solid var(--c-anchor); outline-offset: 2px; }
.stepper input:focus-visible { outline: 0; }
.stepper input { flex: 1; min-width: 0; border: 0; border-inline: 1px solid var(--line-soft); padding: 8px 12px; font: inherit; font-size: 1.25rem; font-variant-numeric: tabular-nums; text-align: center; background: transparent; color: var(--ink); -moz-appearance: textfield; appearance: textfield; }
.stepper input::-webkit-outer-spin-button, .stepper input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.stepper input:focus-visible { outline-offset: -3px; }
.calc-result { margin: 0; padding: clamp(20px, 2.4vw, 32px); border-radius: var(--r-m); background: var(--c-tint); color: var(--c-text); box-shadow: none; }
.calc-line { margin: 0 0 .6em; }
.calc-big { display: flex; align-items: baseline; gap: .15em; font-family: var(--font-display); color: var(--c-agent-ink); font-size: var(--fs-stat-xl); font-weight: 700; line-height: 1; letter-spacing: var(--ls-num); }
.calc-result strong { display: block; min-width: 3ch; font-variant-numeric: tabular-nums; overflow-wrap: normal; }
.calc-unit { display: block; margin-top: var(--s3); font-size: var(--fs-lead); color: var(--ink); }
.calc-unit b { color: var(--c-anchor); font-weight: 700; font-variant-numeric: tabular-nums; }
.calc-empty { margin: .6em 0 0; font-size: var(--fs-meta); color: var(--muted-strong); }
.calc-result.is-empty .calc-big { color: var(--muted-strong); }
.calc-cta { margin-top: var(--s5); }
@container shell (max-width: 479px) { .calc-cta { width: 100%; } }
@container shell (min-width: 1024px) { .calc-result { display: grid; grid-template-columns: minmax(0, 1fr) auto; column-gap: var(--s5); align-items: end; } .calc-result > * { grid-column: 1; } .calc-result > .calc-cta { grid-column: 2; grid-row: 1; align-self: start; margin-top: 0; }  }
.process-explain { margin: 0 0 var(--s6); }
.process-explain--accept { margin: var(--s7) 0 var(--s4); }
.process-steps { list-style: none; margin: 0 0 var(--s6); padding: 0; }
.process-steps > li { margin: 0; }
.process-steps > li:last-child details.more { border-bottom: 1px solid var(--line-soft); }
details.process-step > summary { align-items: flex-start; padding-block: var(--s4); }
.process-step > summary .more-icon { margin-top: 10px; }
.ps-head { display: flex; gap: var(--s4); align-items: flex-start; font-weight: 400; }
.ps-num { flex: none; width: 36px; height: 36px; box-sizing: border-box; border-radius: 50%; display: grid; place-items: center; background: var(--c-surface); border: 2px solid var(--c-anchor); font-family: var(--font-display); font-weight: 700; font-size: var(--fs-h4); line-height: 1; color: var(--c-anchor); }
.process-step[open] .ps-num { background: var(--c-anchor); color: #fff; }
.ps-text { display: grid; gap: 2px; min-width: 0; }
.ps-meta { font-size: var(--fs-meta); font-weight: 600; color: var(--muted-strong); }
.ps-title { font-size: var(--fs-h4); font-weight: 600; line-height: 1.3; color: var(--ink); }
.process-step > summary:hover .ps-title { text-decoration: underline; text-decoration-color: var(--c-agent-ink); text-decoration-thickness: 1px; text-underline-offset: .2em; }
.process-step .more-body { padding-left: calc(36px + var(--s4)); }
.process-step .more-body p { margin: 0; color: var(--ink-2); max-width: 62ch; }
.process-step .more-body .ps-sum { margin-bottom: .6em; font-weight: 600; color: var(--ink); max-width: 60ch; }
.process-panels details.more:first-child { border-top: 1px solid var(--slate-7); }
.process-panels .more-body p, .process-panels .more-body ol { margin: 0; color: var(--ink-2); max-width: 62ch; }
.process-panels .more-body ol { padding-left: 1.2em; }
.process-panels .more-body li + li { margin-top: .6em; }
.training-explain, .hours-explain, .market-explain { margin: 0 0 var(--s6); }
.training-explain { margin-bottom: 0; }
.data-head { margin-bottom: var(--s6); }
.data-head > :last-child { margin-bottom: 0; }
.data-grid { display: grid; gap: var(--s6); align-items: start; }
@container shell (min-width: 1024px) {
.data-grid { grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--gap); align-items: center; }
.data-modes { grid-column: 1 / span 5; }
.data-explain { grid-column: 6 / -1; }
}
.data-modes, .data-explain { min-width: 0; }
.data-modes { display: grid; gap: var(--s5); }
.data-mode-list { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--s5); }
.data-mode { position: relative; margin: 0; padding: 0 0 0 32px; }
.data-mode::before { content: ""; position: absolute; left: 0; top: 11px; width: 10px; height: 10px; border-radius: 3px; background: var(--c-done-on-dark); }
details.data-mode-more, details.data-mode-more:last-of-type { border: 0; }
details.data-mode-more > summary { align-items: flex-start; min-height: 0; padding-block: 0; }
.data-mode-more > summary .more-icon { margin-top: 6px; color: #fff; }
.data-mode-title { display: block; font-family: var(--font-display); font-size: var(--fs-h3); font-weight: 700; line-height: var(--lh-h3); color: #fff; }
.data-mode-short { display: block; margin-top: 4px; font-weight: 400; font-size: var(--fs-small); color: var(--c-on-dark-2); }
.data-mode-more .more-body { padding: var(--s3) 0 0; }
.data-mode-more .more-body p { margin: 0; font-size: var(--fs-small); color: var(--c-on-dark-2); max-width: 60ch; }
.data-mode-more > summary:hover .data-mode-title { text-decoration: underline; text-decoration-color: var(--c-agent-on-dark); text-decoration-thickness: 2px; text-underline-offset: .2em; }
.data-metrics { grid-template-columns: minmax(0, 1fr); gap: 0; margin: 0; }
.data-metrics li { display: grid; grid-template-columns: minmax(min-content, 10fr) minmax(0, 12fr); column-gap: var(--s4); align-items: baseline; padding: var(--s2) 0; border-top: 1px solid var(--c-line-dark); }
.data-metrics li:first-child { border-top: 0; }
.section-data .metric-num { font-size: var(--fs-stat); color: #fff; }
.section-data .metric-lbl { margin-top: 0; color: var(--c-on-dark-2); }
.data-proof-note { margin: 0; font-size: var(--fs-small); color: var(--c-on-dark-2); }
.data-link { margin: calc(-1 * var(--s2)) 0 0; }
.section-llm { --paper: var(--c-surface); }
.section-llm h3 { font-size: var(--fs-h3); line-height: var(--lh-h3); letter-spacing: var(--ls-h3); }
.section-llm h4 { margin: 0 0 .35em; }
.llm-variants { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--s7) var(--s5); }
.llm-variant { min-width: 0; margin: 0; }
.llm-variant-title { margin: 0; font-family: var(--font-display); font-size: var(--fs-h4); font-weight: 700; line-height: 1.3; color: var(--c-text); }
.llm-variant > .llm-variant-tag { margin: 2px 0 var(--s4); font-size: var(--fs-meta); font-weight: 600; color: var(--c-text-2); }
@container shell (min-width: 1100px) { .llm-variants { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.llm-mask { margin-top: var(--s8); }
.llm-mask-explain { margin: 0 0 var(--s5); }
.llm-mask-grid { display: grid; gap: var(--s5); align-items: start; }
.llm-mask-side { min-width: 0; }
@container shell (min-width: 1024px) { .llm-mask-grid { grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); column-gap: var(--s6); } }
.llm-steps-more { margin-top: 0; }
.llm-steps { list-style: none; margin: var(--s2) 0 0; padding: 0; counter-reset: llm; }
.llm-steps li { position: relative; counter-increment: llm; padding: 0 0 var(--s5) calc(32px + var(--s4)); }
.llm-steps li::before { content: counter(llm); position: absolute; left: 0; top: -2px; width: 32px; height: 32px; display: grid; place-items: center; box-sizing: border-box; border-radius: 50%; background: var(--c-surface); border: 2px solid var(--c-anchor); font-family: var(--font-display); font-weight: 700; font-size: var(--fs-meta); color: var(--c-anchor); }
.llm-steps li:not(:last-child)::after { content: ""; position: absolute; left: 15px; top: 34px; bottom: 2px; border-left: 2px dashed var(--wire-c); }
.llm-steps li:last-child { padding-bottom: 0; }
.llm-steps p { margin: 0; color: var(--c-text-2); }
.anon-demo { margin: 0; padding: var(--s5); background: var(--c-surface); border: 1px solid var(--c-stage-line); border-radius: var(--r-m); box-shadow: var(--e1); color: var(--c-text); }
.anon-demo-title { margin: 0 0 var(--s3); font-weight: 600; color: var(--c-text); }
.anon-row { display: grid; gap: 2px; }
.anon-row.is-out { position: relative; margin-top: var(--s4); padding-top: var(--s4); border-top: 1px dashed var(--slate-7); }
.anon-row.is-out::before { content: ""; position: absolute; left: var(--s4); top: -6px; width: 10px; height: 10px; background: var(--c-surface); border-right: 1.5px solid var(--c-anchor); border-bottom: 1.5px solid var(--c-anchor); transform: rotate(45deg); }
.anon-demo .anon-label { margin: 0; font-size: var(--fs-meta); font-weight: 600; color: var(--c-text-3); }
.anon-demo .anon-line { margin: 0; font-size: var(--fs-body); line-height: 1.7; color: var(--c-text); font-variant-numeric: tabular-nums; }
.anon-pd { padding: 1px 4px; border-radius: var(--r-xs); background: #F6E4E4; color: var(--c-text); -webkit-box-decoration-break: clone; box-decoration-break: clone; }
.anon-tag { display: inline-block; padding: 0 6px; border-radius: var(--r-xs); background: var(--c-done-wash); border: 1px solid rgba(11, 122, 114, .28); font-family: ui-monospace, 'Cascadia Mono', Consolas, 'Liberation Mono', monospace; font-size: .92em; font-weight: 600; line-height: 1.5; color: var(--c-done-strong); white-space: nowrap; }
.anon-keep { white-space: nowrap; }
.anon-demo .anon-note { margin: var(--s4) 0 0; font-size: var(--fs-meta); line-height: var(--lh-tight); color: var(--c-text-3); }
.llm-demand { margin-top: var(--s8); }
.llm-demand h3 { margin: 0 0 var(--s4); }
.llm-facts { list-style: none; margin: var(--s5) 0; padding: 0; display: grid; gap: var(--s3) var(--s6); }
.llm-facts li { min-width: 0; margin: 0; }
.llm-facts .metric-num { font-size: var(--fs-stat); }
@container shell (min-width: 600px) { .llm-facts { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@container shell (max-width: 599px) {
.llm-facts { gap: 0; }
.llm-facts li { display: grid; grid-template-columns: minmax(0, 9fr) minmax(0, 12fr); column-gap: var(--s4); align-items: baseline; padding: var(--s2) 0; border-top: 1px solid var(--slate-6); }
.llm-facts li:first-child { border-top: 0; padding-top: 0; }
.llm-facts .metric-lbl { margin-top: 0; }
}
.llm-demand-more { margin-top: var(--s2); }
.llm-demand-more .more-body p { color: var(--c-text-2); }
.llm-guards { margin: 0; font-size: var(--fs-small); color: var(--c-text-2); }
.llm-limits { margin-top: var(--s7); }
.llm-limits > summary .more-title { font-family: var(--font-display); font-size: var(--fs-h3); font-weight: 700; }
.llm-limits > .more-body { padding: var(--s3) 0 var(--s4); }
.llm-limit-list { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--s4) var(--s6); }
@container shell (min-width: 768px) { .llm-limit-list { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.llm-limit-list li { position: relative; margin: 0; padding-left: calc(10px + var(--s4)); color: var(--c-text-2); }
.llm-limit-list li::before { content: ""; position: absolute; left: 0; top: .6em; width: 10px; height: 10px; border-radius: 3px; border: 1.5px solid var(--slate-9); box-sizing: border-box; }
.llm-link { margin: var(--s4) 0 0; }
.case-inline-fig { margin: 1.2em 0 1.4em; }
.case-inline-fig picture { display: block; overflow: hidden; border: 1px solid var(--c-stage-line); border-radius: var(--r-panel); background: var(--c-stage); }
.case-inline-fig img { display: block; width: 100%; height: auto; background: var(--c-stage); }
.case-inline-fig figcaption { margin-top: 10px; font-size: var(--fs-meta); color: var(--c-text-3); }
.prose .anon-demo { margin: 1.2em 0 1.4em; }
.prose .anon-demo p { color: var(--c-text); }
.section-savings, .section-process-short { background-color: var(--c-base); }
details.savings-how { max-width: var(--w-note); margin: var(--s6) 0; }
.savings-how .more-body p { margin: 0 0 .4em; color: var(--c-text-2); }
.savings-basis-list { display: grid; gap: var(--s3); margin: 0 0 var(--s4); }
.savings-basis-list dt { font-weight: 600; color: var(--c-text); }
.savings-basis-list dd { margin: 2px 0 0; font-size: var(--fs-meta); color: var(--c-text-3); }
.section-savings .calc-intro { margin-bottom: var(--s5); font-size: var(--fs-small); }
.section-savings .calc-big { flex-wrap: wrap; }
.section-savings .calc-result strong { min-width: 0; overflow-wrap: anywhere; }
.section-savings .calc-unit { margin-top: var(--s2); }
.section-savings .calc-result > .calc-line:first-child { display: flex; flex-wrap: wrap; align-items: baseline; column-gap: .5em; }
.section-savings .calc-result > .calc-line:first-child .calc-unit { margin-top: 0; font-weight: 600; }
.calc-year { font-size: var(--fs-lead); color: var(--c-text); }
.calc-year b, .calc-hours b { color: var(--c-anchor); font-weight: 700; font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
.calc-hours { color: var(--c-text-2); }
.calc-long { margin-top: -.2em; }
.calc-result.is-empty :is(.calc-year, .calc-hours) { color: var(--c-text-3); }
.savings-long { display: grid; gap: var(--s5); align-items: center; margin-top: var(--s7); }
.savings-long-text { min-width: 0; }
.savings-long-media { display: block; max-width: 440px; overflow: hidden; border-radius: var(--r-panel); background: var(--c-stage); }
.savings-long-media img { display: block; width: 100%; height: auto; }
@container shell (min-width: 560px) { .savings-long.has-media { grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); column-gap: var(--s7); } }
.savings-long .v9-chips--flow { flex-direction: column; align-items: flex-start; gap: var(--s3); margin-bottom: var(--s4); }
.savings-long .v9-chips--flow li + li::after { right: auto; left: 27px; top: auto; bottom: 100%; width: 0; height: var(--s3); border-top: 0; border-left: 2px dashed var(--wire-c); }
.savings-long-note { max-width: var(--w-note); margin: var(--s5) 0 0; color: var(--c-text-2); }
.savings-long-note .link-arrow { white-space: nowrap; }
@container shell (max-width: 559px) {
.savings-long-media { max-width: 280px; }
.savings-long.has-media { grid-template-columns: minmax(0, 34%) minmax(0, 1fr); column-gap: var(--s3); row-gap: var(--s3); }
.savings-long.has-media .savings-long-text { display: contents; }
.savings-long.has-media .v9-chips--flow { margin: 0; }
.savings-long.has-media .v9-chips--flow li { font-size: var(--fs-meta); }
.savings-long.has-media .savings-long-note { grid-column: 1 / -1; margin: 0; }
}
.ps-explain { margin: var(--s5) 0 0; }
.ps-more { margin: var(--s5) 0 0; }
.trust-grid { display: grid; gap: var(--s6); align-items: center; }
.trust-text, .trust-scene { min-width: 0; }
.trust-text > :last-child { margin-bottom: 0; }
.trust-list { margin-bottom: var(--s4); }
@container shell (min-width: 1024px) { .trust-grid { grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); column-gap: var(--s7); } }
.package-option-line { margin: var(--s4) 0 0; padding: var(--s4) var(--s5); border-radius: var(--r-panel); background: var(--c-tint); color: var(--c-text); }
.package-option-line a, .price-note a { font-weight: 600; }
.page-hero { padding-block: clamp(24px, 3vw, 48px) clamp(32px, 4vw, 56px); background-color: var(--c-base); border-bottom: 1px solid var(--c-stage-line); }
.page-hero h1 { font-size: var(--fs-h1); margin-bottom: .3em; }
.page-hero .lead { max-width: var(--w-note); margin: 0; }
.page-security .page-hero .lead { max-width: 60ch; text-wrap: balance; }
.breadcrumbs { margin: 0 0 .6em; font-size: var(--fs-meta); color: var(--c-text-3); }
.breadcrumbs a { display: inline-flex; align-items: center; min-height: 44px; min-width: 44px; color: var(--c-text-3); }
.breadcrumbs a:hover { color: var(--c-agent-ink); }
.breadcrumbs [aria-current] { color: var(--c-text-2); }
.page-inner main > .section:nth-of-type(odd):not(.section-data):not(.section-contact) { background-color: var(--c-tint); --paper: var(--c-surface); }
.page-inner main > .section:nth-of-type(even):not(.section-data):not(.section-contact) { background-color: var(--c-base); --paper: var(--c-base); }
.hours-folds { margin: 0 0 var(--s5); }
.hours-method .more-body p { color: var(--c-text-2); }
.hours-calc { margin: var(--s5) 0 0; }
.hours-tiles { list-style: none; margin: var(--s2) 0 0; padding: 0; display: grid; gap: var(--gap); }
@container shell (min-width: 640px) { .hours-tiles { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@container shell (min-width: 1100px) { .hours-tiles { grid-template-columns: repeat(6, minmax(0, 1fr)); } .hours-tiles > li { grid-column: span 2; } .hours-tiles > .hours-tile:nth-child(4) { grid-column: 2 / span 2; } }
@container shell (min-width: 640px) and (max-width: 1099px) { .hours-tiles > .hours-tile:last-child:nth-child(odd) { grid-column: 1 / -1; } }
.hours-tile { display: flex; flex-direction: column; gap: var(--s2); min-width: 0; margin: 0; padding: var(--s5); border: 1px solid var(--c-stage-line); border-radius: var(--r-panel); background: var(--c-surface); }
.hours-tile-title { margin: 0; font-family: var(--font); font-size: var(--fs-h4); font-weight: 600; line-height: var(--lh-tight); letter-spacing: 0; }
.hours-tile-money { margin: 0; font-family: var(--font-display); font-size: var(--fs-price); font-weight: 700; line-height: 1.1; letter-spacing: var(--ls-num); color: var(--c-anchor); font-variant-numeric: tabular-nums; white-space: nowrap; overflow-wrap: normal; }
.hours-tile-hours { margin: 0; font-size: var(--fs-small); color: var(--c-text-2); }
.hours-tile-dl { margin: var(--s2) 0 0; display: grid; gap: var(--s2); font-size: var(--fs-meta); }
.hours-tile-dl dt { font-weight: 600; color: var(--c-text-3); }
.hours-tile-dl dd { margin: 0; color: var(--c-text); font-variant-numeric: tabular-nums; }
@container shell (max-width: 559px) {
.hours-tiles { grid-template-columns: minmax(0, 1fr); gap: var(--s3); }
.hours-tile { padding: var(--s4); }
.hours-tile-money { font-size: 1.25rem; }
}
.package-list { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--s4); }
@container shell (min-width: 560px) { .package-list { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@container shell (min-width: 1100px) { .package-list { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
.package { position: relative; display: flex; flex-direction: column; min-width: 0; margin: 0; padding: 0 0 var(--s4); overflow: hidden; border: 1px solid var(--c-stage-line); border-radius: var(--r-panel); background: var(--c-surface); box-shadow: var(--e1); }
.package > :not(.package-head) { margin-inline: var(--s5); }
.package-head { margin-bottom: var(--s4); padding: var(--s5) var(--s5) var(--s4); border-bottom: 1px solid var(--c-stage-line); }
.package h3 { margin: 0; font-size: var(--fs-h4); line-height: 1.3; color: var(--c-text); }
.package-dur { margin: var(--s2) 0 0; font-size: var(--fs-meta); font-weight: 600; color: var(--c-text-3); }
.package.is-recommended { border-color: var(--c-anchor); }
.package.is-recommended .package-head { border-bottom: 0; color: #fff; background-color: var(--c-anchor); }
.package.is-recommended h3 { color: #fff; }
.package.is-recommended .package-dur { color: var(--c-on-dark-2); }
.package-flag { display: inline-block; margin: var(--s2) 0 0; padding: 1px 10px; border: 1px solid rgba(255, 255, 255, .6); border-radius: 999px; color: #fff; font-size: var(--fs-meta); font-weight: 600; line-height: 1.5; }
.package-includes { margin: 0 0 var(--s3); padding-left: 1.15em; font-size: var(--fs-small); color: var(--ink-2); }
.package-includes li + li { margin-top: .4em; }
.package > .package-more { margin-top: auto; margin-bottom: 0; }
.package > details.package-more:last-child { border-bottom: 0; }
details.package-more > summary { min-height: 44px; padding-block: var(--s2); }
.package-more > summary .more-title { font-size: var(--fs-meta); color: var(--c-anchor); }
.package-more .more-body .package-includes { margin-top: 0; }
.package-excludes { margin: 0; font-size: var(--fs-meta); color: var(--muted-strong); }
.package-excludes span { font-weight: 600; }
.package-list > .package { padding-bottom: 0; }
.package-list > .package > .package-includes:last-child { margin-bottom: var(--s5); }
details.package-option, details.package-option:last-of-type { margin-top: var(--s4); padding: 0 var(--s5); border: 0; border-radius: var(--r-panel); background: var(--c-surface); }
details.package-option > summary { min-height: 56px; }
.package-option details.more:last-of-type { border-bottom: 0; }
.package-option-head { display: flex; flex-wrap: wrap; align-items: baseline; column-gap: var(--s4); row-gap: 2px; }
.package-option-name { font-weight: 600; color: var(--c-text); }
.package-option-terms { margin: 0; font-size: var(--fs-small); font-weight: 400; color: var(--ink-2); font-variant-numeric: tabular-nums; }
.package-option-full { margin: 0 0 var(--s3); font-weight: 600; color: var(--c-text); }
@container shell (min-width: 1024px) { .package-option .package-includes { columns: 2; column-gap: var(--s7); } .package-option .package-includes li { break-inside: avoid; } }
.section-packages--full .package-includes { margin-inline: var(--s5); }
.section-packages--full .package .package-more .package-includes { margin-inline: 0; }
.section-packages--full .package-more .package-excludes { margin: var(--s2) 0 0; padding-top: 0; border-top: 0; }
.pk-m-only { display: none; }
@container shell (max-width: 559px) {
.package-includes .pk-m-hide { display: none; }
.package-more .pk-m-only { display: block; margin-bottom: 0; }
.package-more .pk-m-only + .package-includes { margin-top: 0; }
.package-head { padding-bottom: var(--s3); margin-bottom: var(--s3); }
}
.package-foot { display: grid; gap: var(--s5); margin-top: var(--s6); align-items: center; }
.package-audit { margin: 0; }
.price-note { margin: 0; font-size: var(--fs-small); color: var(--ink-2); max-width: var(--w-note); }
.package-cta { justify-self: start; }
@container shell (min-width: 900px) {
.package-foot { grid-template-columns: minmax(0, 1fr) auto; column-gap: var(--s6); }
.package-foot > .package-audit { grid-column: 1 / -1; }
}
@container shell (max-width: 479px) { .package-cta { justify-self: stretch; } }
.compare-table { table-layout: fixed; font-size: var(--fs-meta); }
.compare-table th[scope="row"] { font-size: var(--fs-small); color: var(--ink); }
.compare-table td { color: var(--ink-2); }
.mark-flag { display: flex; align-items: center; gap: 6px; margin-bottom: 4px; font-size: var(--fs-meta); font-weight: 600; }
.mark-flag:last-child { margin-bottom: 0; }
.mark { flex: 0 0 auto; width: 18px; height: 18px; }
.mark-no { color: var(--muted-strong); }
.mark-part { color: var(--warn); }
.mark-yes { color: var(--ok); }
@container shell (min-width: 768px) {
.section-market .table-wrap { overflow: visible; }
.compare-table th[scope="row"] { width: 22%; }
.compare-table thead th { position: sticky; top: calc(var(--header-h) + 8px); z-index: 2; background: var(--c-tint); border-bottom: 0; box-shadow: inset 0 -1px 0 var(--slate-7); }
.compare-table thead th.us { background: var(--c-anchor); color: #fff; border-radius: var(--r-m) var(--r-m) 0 0; box-shadow: none; }
.compare-table td.us { background: var(--c-surface); font-weight: 600; color: var(--c-text); }
.compare-table tbody tr:last-child td.us { border-radius: 0 0 var(--r-m) var(--r-m); }
}
@container shell (min-width: 1024px) { .compare-table { font-size: var(--fs-small); } }
@container shell (max-width: 767px) {
.compare-table thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
.compare-table, .compare-table tbody { display: block; }
.compare-table tr { display: flex; flex-direction: column; gap: 6px; padding: var(--s3) 0 var(--s4); border-bottom: 1px solid var(--line-soft); }
.compare-table tbody tr:last-child { border-bottom: 0; }
.compare-table th[scope="row"] { order: 0; display: block; padding: 0 0 2px; border: 0; font-size: var(--fs-h4); }
.compare-table td { display: block; order: 2; min-width: 0; padding: 0; border: 0; font-size: var(--fs-meta); line-height: 1.45; }
.compare-table td.us { order: 1; padding: 6px 12px; margin-bottom: 2px; border-radius: var(--r-s); background: var(--c-surface); font-weight: 600; color: var(--c-text); }
.compare-table td::before { content: attr(data-label); margin-right: .5em; font-weight: 600; color: var(--muted-strong); }
.compare-table td.us::before { color: var(--c-anchor); }
.section-market .market-note { font-size: var(--fs-small); }
.compare-table td .mark-flag { display: inline-flex; vertical-align: -3px; margin: 0 .45em 0 0; }
}
.market-main { min-width: 0; }
.market-note { margin: 0; padding: var(--s5); border: 1px solid var(--c-stage-line); border-radius: var(--r-panel); background: var(--c-surface); color: var(--c-text-2); max-width: var(--w-note); }
.market-note p { margin: 0; }
.market-note .market-note-title { margin-bottom: var(--s2); font-size: var(--fs-h4); font-weight: 600; color: var(--ink); }
.market-more { margin-top: var(--s4); }
.market-more .more-title { color: var(--c-anchor); }
.stack-explain { margin: 0 0 var(--s6); }
.stack-list { list-style: none; padding: 0; margin: 0; display: grid; gap: 0 var(--s6); }
@container shell (min-width: 640px) { .stack-list { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@container shell (min-width: 1024px) { .stack-list { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.stack-list > li { min-width: 0; margin: 0; }
details.stack-more, details.stack-more:last-of-type { border: 0; border-top: 1px solid var(--rule-mid); }
details.stack-more > summary { display: grid; grid-template-columns: 40px minmax(0, 1fr) 16px; column-gap: var(--s4); align-items: start; min-height: 0; padding-block: var(--s4); }
.stack-icon { width: 40px; height: 40px; display: grid; place-items: center; border: 1px solid var(--c-stage-line); border-radius: 10px; background: var(--c-surface); color: var(--c-anchor); }
.stack-icon svg { width: 24px; height: 24px; stroke-width: 1.5; }
.stack-more .more-icon { margin-top: 8px; }
.stack-title { display: block; font-family: var(--font-display); font-size: var(--fs-h4); font-weight: 700; line-height: 1.3; color: var(--c-text); }
.stack-short { display: block; margin-top: 2px; font-weight: 400; font-size: var(--fs-small); color: var(--c-text-2); }
.stack-more .more-body { padding: 0 0 var(--s4) calc(40px + var(--s4)); }
.stack-more .more-body p { margin: 0; font-size: var(--fs-small); color: var(--c-text-2); }
details.stack-note { margin-top: var(--s5); max-width: var(--w-note); }
details.stack-note .more-title { font-size: var(--fs-meta); color: var(--c-text-2); }
details.stack-note .more-body p { margin: 0; font-size: var(--fs-meta); color: var(--c-text-3); }
.check-list { list-style: none; padding: 0; margin: 0; display: grid; gap: 0; border-bottom: 1px solid var(--rule-mid); }
.check-list li { position: relative; padding: 12px 0 12px 36px; border-top: 1px solid var(--rule-mid); font-size: var(--fs-small); color: var(--ink); }
.check-list li::before { content: ""; position: absolute; left: 0; top: 14px; width: 22px; height: 22px; border-radius: 50%; background: var(--c-done); }
.check-list li::after { content: ""; position: absolute; left: 5px; top: 19px; width: 12px; height: 12px; background: #fff; -webkit-mask: var(--ico-check) center/12px no-repeat; mask: var(--ico-check) center/12px no-repeat; }
:is(.section-trust, .section-data, .section-contact) .check-list li::before { background: var(--c-done-on-dark); }
:is(.section-trust, .section-data, .section-contact) .check-list li::after { background: var(--c-anchor); }
.section-faq h2 { margin-bottom: var(--s6); }
.section-faq .faq { max-width: 880px; }
.faq-item { border-top: 1px solid var(--line-soft); }
.faq-item:last-child { border-bottom: 1px solid var(--line-soft); }
.faq-item summary { display: flex; align-items: center; justify-content: space-between; gap: 16px; min-height: 56px; padding: 16px 4px; list-style: none; cursor: pointer; font-size: var(--fs-h4); font-weight: 600; color: var(--ink); }
.faq-item summary::-webkit-details-marker { display: none; }
.faq-item summary::marker { content: ""; }
.faq-item summary > span:first-child, .faq-inner > p { transition: transform var(--dur-base) var(--ease-io); }
.faq-item summary:hover > span:first-child { text-decoration: underline; text-decoration-color: var(--c-agent-ink); text-decoration-thickness: 1px; text-underline-offset: .2em; }
.faq-icon { position: relative; flex: 0 0 auto; width: 32px; height: 32px; }
.faq-icon::before, .faq-icon::after { content: ""; position: absolute; left: 50%; top: 50%; border-radius: 1px; background: var(--c-anchor); transform: translate(-50%, -50%); }
.faq-icon::before { width: 16px; height: 2px; }
.faq-icon::after { width: 2px; height: 16px; transition: transform var(--dur-base) var(--ease-io); }
.faq-item[open] .faq-icon::after { transform: translate(-50%, -50%) scaleY(0); }
.faq-body { display: grid; grid-template-rows: 0fr; transition: grid-template-rows var(--dur-base) var(--ease-io); }
.faq-item.is-open .faq-body { grid-template-rows: 1fr; }
.faq-inner { min-height: 0; overflow: hidden; padding: 0 44px 18px 4px; color: var(--ink-2); }
.faq-inner p { margin: 0; max-width: var(--w-text); }
.faq-item[open] { background: var(--c-surface); border-radius: var(--r-m); }
.faq-item.is-open summary > span:first-child, .faq-item.is-open .faq-inner > p { transform: translateX(12px); }
@media (scripting: none) {
.faq-item[open] .faq-body { grid-template-rows: 1fr; }
.faq-item[open] summary > span:first-child, .faq-item[open] .faq-inner > p { transform: translateX(12px); }
}
html.reduce .faq-item summary > span:first-child, html.reduce .faq-inner > p, html.reduce .faq-icon::after, html.reduce .faq-body { transition: none; }
.contact-inner { max-width: var(--w-max); display: grid; gap: var(--s6); align-items: start; }
.contact-main { max-width: var(--w-note); min-width: 0; }
.contact-note { margin: var(--s5) 0 0; font-size: var(--fs-small); color: var(--c-on-dark-2); max-width: var(--w-note); }
@container shell (min-width: 768px) { .contact-inner { grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); column-gap: var(--s7); } }
@container shell (min-width: 1100px) { .contact-inner { grid-template-columns: minmax(0, 7fr) minmax(0, 4fr); } }
.after-card { min-width: 0; padding: var(--s5); border-radius: var(--r-panel); background: var(--c-anchor-2); }
.modal { border: 0; padding: 0; border-radius: var(--r-panel); width: min(560px, calc(100% - 32px)); background: var(--c-surface); color: var(--c-text); box-shadow: var(--e3); }
.modal::backdrop { background: rgba(14, 27, 44, .6); -webkit-backdrop-filter: blur(4px); backdrop-filter: blur(4px); }
.modal-inner { padding: clamp(20px, 4vw, 32px); }
.modal-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; margin-bottom: 8px; }
.modal-head h2 { margin: 0; }
.modal-close { width: 44px; height: 44px; border: 1px solid var(--c-rule); border-radius: var(--r-ctl); background: var(--c-surface); font-size: 1.5rem; line-height: 1; cursor: pointer; color: var(--c-text); flex: 0 0 auto; }
.modal-close:hover { background: var(--c-tint); border-color: var(--c-anchor); }
.modal-stub { padding: 12px 14px; background: var(--c-tint); border-radius: var(--r-ctl); color: var(--c-text-2); font-size: var(--fs-meta); }
.modal-form .field { margin-bottom: 12px; }
.modal-form label { display: block; font-weight: 600; margin-bottom: 4px; font-size: var(--fs-small); }
.modal-form input, .modal-form textarea { width: 100%; padding: 10px 12px; border: 1px solid var(--c-rule); border-radius: var(--r-ctl); font: inherit; background: var(--c-surface); color: var(--c-text); min-height: 48px; }
.modal-form input:focus-visible, .modal-form textarea:focus-visible { border-color: var(--c-anchor); outline: 2px solid var(--c-anchor); outline-offset: 2px; }
.modal-form textarea { min-height: 96px; resize: vertical; }
.modal-form input:disabled, .modal-form textarea:disabled { background: var(--slate-2); color: var(--c-text-3); }
.modal-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; margin-top: 8px; }
.modal-hint { font-size: var(--fs-meta); color: var(--c-text-2); }
.site-footer { --focus-c: #fff; margin-top: var(--shell-gap); background: var(--glass); border: 1px solid var(--glass-line); border-radius: var(--sheet-r); padding-block: clamp(32px, 4cqi, 56px) clamp(28px, 3cqi, 40px); color: var(--c-on-dark-2); }
@media (min-width: 1024px) { .site-footer { -webkit-backdrop-filter: blur(var(--glass-blur)) saturate(1.2); backdrop-filter: blur(var(--glass-blur)) saturate(1.2); } }
@media (max-width: 767px) { .site-footer { border-width: 1px 0 0; border-radius: var(--sheet-r) var(--sheet-r) 0 0; } }
.site-footer > .container { max-width: none; padding-inline: clamp(20px, 3.4cqi, 44px); }
.footer-inner { display: grid; gap: var(--s6); }
.footer-inner { grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: var(--s5); }
@container shell (min-width: 1024px) {
.footer-inner { grid-template-columns: 4fr 2.4fr 5.6fr; column-gap: var(--s6); }
.footer-cases ul { column-count: 2; column-gap: var(--s6); }
.footer-cases li { break-inside: avoid; }
}
.footer-brand .brand-mark { display: block; width: 32px; height: 32px; margin-bottom: 14px; color: #fff; }
.footer-brand .brand-mark svg { width: 100%; height: 100%; }
.footer-brand .brand-mark .bm-core { fill: var(--c-accent-on-dark); }
.footer-brand .brand-name { font-family: var(--font-display); font-weight: 800; font-size: 1.25rem; letter-spacing: -.03em; margin-bottom: 8px; color: #fff; }
.footer-tagline { color: var(--c-on-dark-2); margin: 0; max-width: 34em; font-size: var(--fs-small); }
.footer-nav h2 { font-family: var(--font); font-size: var(--fs-meta); font-weight: 600; line-height: var(--lh-tight); letter-spacing: 0; max-width: none; hyphens: none; -webkit-hyphens: none; color: var(--c-on-dark-2); margin: 0 0 12px; }
.footer-nav ul { list-style: none; padding: 0; margin: 0; }
.footer-nav a { color: var(--c-on-dark-2); font-size: var(--fs-small); text-decoration: none; display: inline-flex; align-items: center; min-height: 40px; min-width: 44px; line-height: 1.35; }
.footer-nav a:hover, .footer-nav a[aria-current="page"] { color: #fff; text-decoration: underline; text-decoration-color: var(--c-agent-on-dark); text-decoration-thickness: 1px; text-underline-offset: .2em; }
.footer-nav a:hover { text-decoration-thickness: 2px; }
@media (max-width: 767px) { body:has(.dock) .site-footer { padding-bottom: calc(40px + var(--dock-h, 64px) + env(safe-area-inset-bottom, 0px)); } }
@container shell (max-width: 1023px) { .footer-brand { grid-column: 1 / -1; } }
.footer-brand { display: grid; grid-template-columns: auto minmax(0, 1fr); column-gap: 10px; align-items: center; align-content: start; }
.footer-brand .brand-mark { width: 24px; height: 24px; margin-bottom: 0; }
.footer-brand .brand-name { margin-bottom: 0; font-size: 1.1875rem; }
.footer-tagline { grid-column: 1 / -1; margin-top: 12px; }
@container shell (max-width: 767px) { .footer-nav { display: none; } }
@container shell (max-width: 767px) { .footer-tagline { display: none; } .footer-inner { row-gap: var(--s5); } }
.case10-head { padding-block: clamp(28px, 4vw, 56px) var(--s5); }
.case10-head h1 { font-size: clamp(1.875rem, 1.4rem + 1.6cqi, 2.75rem); max-width: 18ch; margin: 0; text-wrap: balance; }
.case10-head .lead { margin: .6em 0 0; max-width: 46ch; }
.case10-explain { padding-block: var(--s2) var(--sp-tight); background-color: var(--c-base); }
.case-numbers { padding-block: var(--s6) var(--s5); background-color: var(--c-tint); }
.case-metrics { margin: 0 0 var(--s4); }
.case-metrics .metric-num { font-size: var(--fs-stat-m); line-height: 1.05; letter-spacing: var(--ls-num); color: var(--c-text); }
.case-metrics li:first-child .metric-num { color: var(--c-agent-ink); }
.case-metrics .metric-lbl { font-size: var(--fs-small); }
.case-metrics--many { row-gap: var(--s5); }
@container shell (max-width: 767px) {
.case-metrics, .case-metrics--many { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--s4); }
.case-metrics li:last-child:nth-child(odd) { grid-column: 1 / -1; }
.case-metrics .metric-num { font-size: var(--fs-stat); }
.case-metrics .metric-num { white-space: normal; }
}
.case-folds { display: grid; gap: 0 var(--s6); }
@container shell (min-width: 768px) { .case-folds { grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: start; } .case-folds details.more { border-bottom: 1px solid var(--line-soft); } }
.case-folds .more-body p { color: var(--c-text-2); max-width: var(--w-text); }
.case-tech .more-title, .case-verified .more-title { color: var(--ink); }
.tag-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 4px; font-size: var(--fs-meta); line-height: var(--lh-tight); color: var(--muted-strong); }
.case-main9 { padding-block: var(--s7) var(--s4); }
.prose { max-width: var(--w-text); }
.prose h2 { font-size: var(--fs-h2); max-width: none; margin-top: 1.4em; }
.prose h2:first-child { margin-top: 0; }
.prose p, .prose li { color: var(--ink-2); }
.prose strong { color: var(--ink); }
.prose blockquote { margin: 1.2em 0; padding-left: 24px; border-left: 1px solid var(--rule-mid); color: var(--ink-2); }
.prose blockquote p { margin: 0; }
.case-more { margin: 1em 0 1.4em; }
.prose details.case-more:last-of-type { border-bottom: 1px solid var(--line-soft); }
.case-more .more-body > p:first-child { margin-top: 0; }
.case-more .case-inline-fig { margin-bottom: var(--s4); }
.llm-badges { list-style: none; margin: 0 0 1em; padding: 0; display: grid; gap: var(--s3); }
@container shell (min-width: 640px) { .llm-badges { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.prose .llm-badges li { display: flex; flex-direction: column; align-items: flex-start; gap: var(--s1); margin: 0; padding: var(--s4); border: 1px solid var(--c-stage-line); border-radius: var(--r-m); background: var(--c-surface); color: var(--c-text); }
.llm-badges .llm-variant-tag { font-size: var(--fs-meta); font-weight: 600; color: var(--c-text-2); }
.llm-badge-title { font-weight: 700; font-family: var(--font-display); font-size: var(--fs-h4); color: var(--c-text); }
.prose .llm-facts { margin: var(--s4) 0; }
.prose .llm-facts li { color: var(--c-text); }
.case-tail { padding-bottom: var(--s8); }
.case-transfer { margin-top: var(--s5); padding-top: var(--s5); border-top: 1px solid var(--c-stage-line); }
.case-transfer h2 { margin: 0 0 var(--s4); }
.case-cta--line { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--s4) var(--s6); margin-top: var(--s6); padding: var(--s5) var(--s6); border-radius: var(--r-panel); background: var(--c-tint); color: var(--c-text); }
.case-cta--line h2 { margin: 0; color: var(--c-text); }
@container shell (max-width: 479px) { .case-cta--line { padding: var(--s5); } .case-cta--line .btn { flex: 1 1 100%; } }
.case-ribbon { margin-block: var(--s7) 0; }
.case-ribbon h2 { margin: 0 0 var(--s4); }
.case-ribbon ul.case-ribbon-list { list-style: none; margin: 0; padding: 0 0 var(--s2); border: 0; display: grid; grid-auto-flow: column; grid-auto-columns: minmax(200px, 1fr); gap: var(--s4); overflow-x: auto; overscroll-behavior-x: contain; scroll-snap-type: x mandatory; -webkit-overflow-scrolling: touch; }
.case-ribbon-list li { min-width: 0; margin: 0; scroll-snap-align: start; }
@container shell (max-width: 767px) { .case-ribbon ul.case-ribbon-list { grid-auto-columns: 62%; } }
@container shell (max-width: 559px) { .case-ribbon ul.case-ribbon-list { grid-auto-columns: 44%; } }
@container shell (min-width: 1100px) { .case-ribbon ul.case-ribbon-list { grid-auto-flow: row; grid-template-columns: repeat(5, minmax(0, 1fr)); overflow: visible; } }
.case-ribbon-link { display: flex; flex-direction: column; height: 100%; overflow: hidden; border: 1px solid var(--c-stage-line); border-radius: var(--r-m); background: var(--c-surface); color: var(--c-text); text-decoration: none; transition: border-color var(--dur-fast) var(--ease-out); }
.case-ribbon-link:hover { border-color: var(--c-rule); color: var(--c-text); }
.case-ribbon-link:focus-visible { outline: 2px solid var(--c-anchor); outline-offset: 2px; border-radius: var(--r-m); }
.case-ribbon-media { display: block; background: var(--c-stage); }
.case-ribbon-media img { display: block; width: 100%; height: auto; aspect-ratio: 4 / 3; object-fit: cover; }
.case-ribbon-cat { display: block; padding: var(--s3); font-size: var(--fs-meta); font-weight: 600; line-height: 1.35; }
.case-ribbon-link:hover .case-ribbon-cat { text-decoration: underline; text-decoration-color: var(--c-agent-ink); text-decoration-thickness: 1px; text-underline-offset: .2em; }
.v9-chips { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: var(--s2) var(--s3); }
.v9-chips li { display: inline-flex; align-items: center; min-height: 40px; margin: 0; padding: 6px 16px; border-radius: 999px; background: var(--c-surface); border: 1px solid var(--c-stage-line); font-weight: 600; font-size: var(--fs-small); line-height: 1.3; color: var(--c-text); }
.v9-chips--flow { counter-reset: v9c; }
.v9-chips--flow li { counter-increment: v9c; gap: 10px; }
.v9-chips--flow li::before { content: counter(v9c); display: grid; place-items: center; flex: none; width: 26px; height: 26px; box-sizing: border-box; border-radius: 50%; border: 2px solid var(--c-anchor); background: var(--c-surface); color: var(--c-anchor); font-family: var(--font-display); font-size: var(--fs-meta); font-weight: 700; line-height: 1; }
@container shell (min-width: 768px) {
.v9-chips--flow { gap: var(--s3) 36px; }
.v9-chips--flow li { position: relative; }
.v9-chips--flow li + li::after { content: ""; position: absolute; right: calc(100% + 6px); top: 50%; width: 24px; border-top: 2px dashed var(--wire-c); }
}
.v9-steps { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--s3); isolation: isolate; }
.v9-step { position: relative; display: grid; grid-template-columns: 32px minmax(0, 1fr); column-gap: var(--s3); row-gap: 2px; align-items: center; min-width: 0; margin: 0; }
.v9-step-num { grid-row: 1 / span 2; display: grid; place-items: center; width: 32px; height: 32px; box-sizing: border-box; border-radius: 50%; background: var(--c-surface); border: 2px solid var(--c-anchor); font-family: var(--font-display); font-weight: 700; font-size: var(--fs-meta); color: var(--c-anchor); }
.v9-step[data-state="work"] .v9-step-num { background: var(--c-agent); border-color: var(--c-anchor); color: var(--c-anchor); }
.v9-step[data-state="done"] .v9-step-num { background: var(--c-surface); border-color: var(--c-done); color: var(--c-done-strong); }
.v9-step-name { font-weight: 600; line-height: 1.3; color: var(--ink); }
.v9-step .status { justify-self: start; }
.v9-step .status[data-state="done"]::before { width: .8em; height: .8em; border: 0; border-radius: 0; background: currentColor; -webkit-mask: var(--ico-check) center / contain no-repeat; mask: var(--ico-check) center / contain no-repeat; }
@container shell (min-width: 768px) {
.v9-steps:not(.v9-steps--col) { grid-template-columns: repeat(3, minmax(0, 1fr)); column-gap: var(--s6); }
.v9-steps:not(.v9-steps--col) .v9-step { grid-template-columns: minmax(0, 1fr); row-gap: 6px; align-items: start; justify-items: start; }
.v9-steps:not(.v9-steps--col) .v9-step-num { grid-row: auto; }
.v9-steps:not(.v9-steps--col) .v9-step:not(:last-child)::after { content: ""; position: absolute; left: 40px; right: calc(-1 * var(--s6) + 8px); top: 15px; border-top: 2px dashed var(--wire-c); z-index: -1; }
}
.v9-steps--col { gap: var(--s4); }
.v9-steps--col .v9-step:not(:last-child)::after { content: ""; position: absolute; left: 15px; top: 36px; bottom: calc(-1 * var(--s4) + 4px); border-left: 2px dashed var(--wire-c); z-index: -1; }
.v9-steps--dark .v9-step-num { background: var(--c-anchor-3); border-color: rgba(255, 255, 255, .7); color: #fff; }
.v9-steps--dark .v9-step[data-state="work"] .v9-step-num { background: var(--c-agent); border-color: var(--c-agent); color: var(--c-anchor); }
.v9-steps--dark .v9-step[data-state="done"] .v9-step-num { background: var(--c-anchor-3); border-color: var(--c-done-on-dark); color: var(--c-done-on-dark); }
.v9-steps--dark .v9-step-name { color: #fff; }
.case-grid9 { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--s3); }
.case-card9--wide { grid-column: span 2; }
@container shell (min-width: 560px) { .case-grid9 { gap: var(--gap); } }
@container shell (min-width: 1100px) { .case-grid9 { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
.case-card9 { min-width: 0; margin: 0; }
.case-card9-link { display: flex; flex-direction: column; height: 100%; overflow: hidden; border: 1px solid var(--c-stage-line); border-radius: var(--r-panel); background: var(--c-surface); box-shadow: var(--e1); color: var(--c-text); text-decoration: none; transition: border-color var(--dur-base) var(--ease-out), transform var(--dur-base) var(--ease-out); }
.case-card9-link:hover { color: var(--c-text); border-color: var(--c-rule); }
@media (hover: hover) and (prefers-reduced-motion: no-preference) { html:not(.reduce) .case-card9-link:hover { transform: translateY(-2px); } }
.case-card9-link:focus-visible { outline: 2px solid var(--c-anchor); outline-offset: 3px; border-radius: var(--r-panel); }
.case-card9-media { display: block; background: var(--c-stage); }
.case-card9-media img { display: block; width: 100%; height: auto; aspect-ratio: 4 / 3; object-fit: cover; }
.case-card9-body { display: flex; flex-direction: column; flex: 1 1 auto; gap: 4px; padding: var(--s4) var(--s5) var(--s5); }
.case-card9-cat { font-size: var(--fs-meta); line-height: 1.35; color: var(--c-text-3); }
.case-card9-title { font-size: var(--fs-h4); font-weight: 600; line-height: 1.3; color: var(--c-text); }
.case-card9-num { margin-top: auto; padding-top: var(--s3); font-family: var(--font-display); font-size: var(--fs-stat); font-weight: 700; line-height: 1.05; letter-spacing: var(--ls-num); color: var(--c-text); font-variant-numeric: tabular-nums; white-space: nowrap; overflow-wrap: normal; }
.case-card9-lbl { font-size: var(--fs-meta); line-height: 1.35; color: var(--c-text-2); }
.case-card9-link:hover .case-card9-title { text-decoration: underline; text-decoration-color: var(--c-agent-ink); text-decoration-thickness: 1px; text-underline-offset: .2em; }
.case-card9--wide .case-card9-link:has(.case-card9-media) { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); align-items: stretch; }
.case-card9--wide .case-card9-media img { height: 100%; object-fit: contain; }
.case-card9--wide .case-card9-title { font-size: var(--fs-h3); font-family: var(--font-display); font-weight: 700; line-height: var(--lh-h3); }
@container shell (max-width: 559px) {
.case-card9-body { padding: var(--s3) var(--s3) var(--s4); }
.case-card9-num { font-size: 1.5rem; }
.case-card9--wide .case-card9-link:has(.case-card9-media) { grid-template-columns: minmax(0, 2fr) minmax(0, 3fr); }
.case-card9--wide .case-card9-title { font-size: var(--fs-h4); font-family: var(--font); font-weight: 600; }
}
.market-head { margin-bottom: var(--s6); }
.market-head-text { min-width: 0; }
.market-head .market-note { margin-top: var(--s4); padding: var(--s4) var(--s5); }
.market-head .market-note .market-note-title { margin-bottom: var(--s1); font-size: var(--fs-small); }
.compare-table--marks td { vertical-align: middle; }
.compare-table--marks .mark-flag { margin: 0; }
.compare-table--marks .mark-flag { white-space: nowrap; overflow-wrap: normal; }
.compare-col-short, .compare-legend { display: none; }
@container shell (max-width: 767px) {
.compare-table.compare-table--marks { display: table; width: 100%; table-layout: fixed; border-collapse: collapse; }
.compare-table--marks thead { position: static; width: auto; height: auto; overflow: visible; clip: auto; display: table-header-group; }
.compare-table--marks tbody { display: table-row-group; }
.compare-table--marks tr { display: table-row; padding: 0; border: 0; }
.compare-table--marks th, .compare-table--marks td, .compare-table--marks td.us, .compare-table--marks th[scope="row"] {
display: table-cell; order: 0; margin: 0; padding: 10px 4px; border: 0; border-bottom: 1px solid var(--line-soft); border-radius: 0;
font-size: var(--fs-meta); line-height: 1.3; vertical-align: middle; background: none;
}
.compare-table--marks th[scope="row"] { padding-left: 0; font-weight: 600; font-size: var(--fs-meta); overflow-wrap: normal; -webkit-hyphens: auto; hyphens: auto; }
.compare-table--marks thead th { font-weight: 600; font-size: var(--fs-meta); letter-spacing: -.01em; color: var(--c-text-3); text-align: center; vertical-align: bottom; -webkit-hyphens: auto; hyphens: auto; overflow-wrap: normal; }
.compare-table--marks thead th:first-child { width: 38%; text-align: left; padding-left: 0; }
.compare-table--marks thead th.us, .compare-table--marks td.us { background: var(--c-surface); color: var(--c-anchor); }
.compare-table--marks tbody tr:last-child > * { border-bottom: 0; }
.compare-table--marks td { text-align: center; }
.compare-table--marks td::before { content: none; }
.compare-table--marks td .mark-flag { display: inline-flex; justify-content: center; margin: 0; vertical-align: middle; }
.compare-table--marks .mark { width: 20px; height: 20px; }
.compare-table--marks .mark-text, .compare-col-full {
position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap; border: 0;
}
.compare-col-short { display: block; }
.compare-legend { display: flex; flex-wrap: wrap; gap: 4px var(--s4); margin: var(--s3) 0 0; padding: 0; list-style: none; font-size: var(--fs-meta); color: var(--c-text-2); }
.compare-legend li { display: inline-flex; align-items: center; gap: 6px; }
.compare-legend .mark-flag { display: inline-flex; gap: 6px; }
}
.market-values { margin: 0; display: grid; gap: var(--s4); }
@container shell (min-width: 900px) { .market-values { grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: var(--s6); } }
.market-values dt { font-weight: 600; color: var(--c-text); }
.market-values dd { margin: 0; }
.market-values ul { margin: 4px 0 0; padding-left: 1.1em; font-size: var(--fs-meta); color: var(--c-text-2); }
.market-values-col { font-weight: 600; color: var(--c-text-3); }
@container shell (max-width: 559px) {
.calc-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--s3); }
.calc-field label { font-size: var(--fs-meta); line-height: 1.3; min-height: 2.6em; }
.stepper button { width: 40px; }
.stepper input { padding-inline: 4px; font-size: 1.0625rem; }
}
@container shell (min-width: 1024px) {
html.has-bg-hero .page-home .hero {
background-color: #0E1B2C;
background-image: url(/assets/img/photo/bg-hero-1600.6ab4573e14.webp);
background-image: image-set(url(/assets/img/photo/bg-hero-1600.97b85c71eb.avif) type("image/avif"), url(/assets/img/photo/bg-hero-1600.6ab4573e14.webp) type("image/webp"));
background-repeat: no-repeat; background-position: right center; background-size: cover;
}
@media (min-resolution: 1.5dppx) {
html.has-bg-hero .page-home .hero {
background-image: url(/assets/img/photo/bg-hero-2560.4e902311b2.webp);
background-image: image-set(url(/assets/img/photo/bg-hero-2560.b01f3cebe9.avif) type("image/avif"), url(/assets/img/photo/bg-hero-2560.4e902311b2.webp) type("image/webp"));
}
}
}
.page-home .section-audience, .page-home .section-faq, .page-how .page-hero,
.case10-head, .page-security .page-hero, .page-tech .page-hero, .section-packages { background-color: var(--c-base); }
@container shell (min-width: 1100px) {
html.has-bg-read-a :is(.page-home .section-audience, .page-home .section-faq, .page-how .page-hero) {
background-image: url(/assets/img/photo/bg-read-a-1600.e612cf6421.webp);
background-image: image-set(url(/assets/img/photo/bg-read-a-1600.d5f2f29d4f.avif) type("image/avif"), url(/assets/img/photo/bg-read-a-1600.e612cf6421.webp) type("image/webp"));
background-repeat: no-repeat; background-position: right top; background-size: auto min(100%, 760px);
}
html.has-bg-read-b :is(.case10-head, .page-security .page-hero, .page-tech .page-hero, .section-packages) {
background-image: url(/assets/img/photo/bg-read-b-1600.78dcd71ba8.webp);
background-image: image-set(url(/assets/img/photo/bg-read-b-1600.5bad8ccb14.avif) type("image/avif"), url(/assets/img/photo/bg-read-b-1600.78dcd71ba8.webp) type("image/webp"));
background-repeat: no-repeat; background-position: right top; background-size: auto min(100%, 760px);
}
html.has-bg-read-b .section.section-packages { background-size: auto calc(var(--sp-air) + var(--fs-h2) * var(--lh-h2) + var(--s4)); }
@media (min-resolution: 1.5dppx) {
html.has-bg-read-a :is(.page-home .section-audience, .page-home .section-faq, .page-how .page-hero) {
background-image: url(/assets/img/photo/bg-read-a-2560.ba57008c09.webp);
background-image: image-set(url(/assets/img/photo/bg-read-a-2560.07320e837b.avif) type("image/avif"), url(/assets/img/photo/bg-read-a-2560.ba57008c09.webp) type("image/webp"));
}
html.has-bg-read-b :is(.case10-head, .page-security .page-hero, .page-tech .page-hero, .section-packages) {
background-image: url(/assets/img/photo/bg-read-b-2560.e8f06cc3b6.webp);
background-image: image-set(url(/assets/img/photo/bg-read-b-2560.6fff4420fa.avif) type("image/avif"), url(/assets/img/photo/bg-read-b-2560.e8f06cc3b6.webp) type("image/webp"));
}
}
}
@container shell (min-width: 768px) {
html.has-bg-cases .section-cases { background-color: var(--c-tint); }
html.has-bg-cases .section-cases .case-grid9 { position: relative; isolation: isolate; }
html.has-bg-cases .section-cases .case-grid9::before {
content: ""; position: absolute; z-index: -1; pointer-events: none;
inset: calc(-1 * var(--s5)) calc(50% - 50cqi) calc(-1 * var(--sp-air));
background-color: var(--c-tint);
background-image: url(/assets/img/photo/bg-cases-1600.f57d11b29d.webp);
background-image: image-set(url(/assets/img/photo/bg-cases-1600.530f64f55f.avif) type("image/avif"), url(/assets/img/photo/bg-cases-1600.f57d11b29d.webp) type("image/webp"));
background-repeat: no-repeat; background-position: center; background-size: cover;
}
@media (min-resolution: 1.5dppx) {
html.has-bg-cases .section-cases .case-grid9::before {
background-image: url(/assets/img/photo/bg-cases-2560.5a3f51fe79.webp);
background-image: image-set(url(/assets/img/photo/bg-cases-2560.d0a2e1ecf5.avif) type("image/avif"), url(/assets/img/photo/bg-cases-2560.5a3f51fe79.webp) type("image/webp"));
}
}
}
@container shell (min-width: 1024px) {
html.has-bg-dark :is(.section-trust, .section-data) {
background-image: url(/assets/img/photo/bg-dark-1600.3ebb7dbbc3.webp);
background-image: image-set(url(/assets/img/photo/bg-dark-1600.ed45e87c37.avif) type("image/avif"), url(/assets/img/photo/bg-dark-1600.3ebb7dbbc3.webp) type("image/webp"));
background-repeat: no-repeat; background-position: right center; background-size: 88% auto;
}
@media (min-resolution: 1.5dppx) {
html.has-bg-dark :is(.section-trust, .section-data) {
background-image: url(/assets/img/photo/bg-dark-2560.65f599885b.webp);
background-image: image-set(url(/assets/img/photo/bg-dark-2560.07671a9190.avif) type("image/avif"), url(/assets/img/photo/bg-dark-2560.65f599885b.webp) type("image/webp"));
}
}
}
@container shell (min-width: 768px) {
html.has-bg-contact .section-contact {
background-image: url(/assets/img/photo/bg-contact-1600.15a6d7f75c.webp);
background-image: image-set(url(/assets/img/photo/bg-contact-1600.7e30ddec2b.avif) type("image/avif"), url(/assets/img/photo/bg-contact-1600.15a6d7f75c.webp) type("image/webp"));
background-repeat: no-repeat; background-position: right center; background-size: 100% auto;
}
@media (min-resolution: 1.5dppx) {
html.has-bg-contact .section-contact {
background-image: url(/assets/img/photo/bg-contact-2560.8243319d09.webp);
background-image: image-set(url(/assets/img/photo/bg-contact-2560.27a02214c0.avif) type("image/avif"), url(/assets/img/photo/bg-contact-2560.8243319d09.webp) type("image/webp"));
}
}
}
@container shell (max-width: 767px) {
html.has-bg-dark-m :is(.section-trust, .section-data) {
background-image: url(/assets/img/photo/bg-dark-m-1080.637b99040b.webp);
background-image: image-set(url(/assets/img/photo/bg-dark-m-1080.3a0268793b.avif) type("image/avif"), url(/assets/img/photo/bg-dark-m-1080.637b99040b.webp) type("image/webp"));
background-repeat: no-repeat; background-position: 50% 100%; background-size: 100% auto;
padding-bottom: max(var(--sp-base), 56vw);
}
html.has-bg-contact-m .section-contact {
background-image: url(/assets/img/photo/bg-contact-m-1080.8c5513a562.webp);
background-image: image-set(url(/assets/img/photo/bg-contact-m-1080.c83b80455f.avif) type("image/avif"), url(/assets/img/photo/bg-contact-m-1080.8c5513a562.webp) type("image/webp"));
background-repeat: no-repeat; background-position: 50% calc(100% + 27vw); background-size: 100% auto;
padding-bottom: max(var(--sp-base), 56vw);
}
}
@media (forced-colors: active) {
html :is(.hero, .section-audience, .section-faq, .page-hero, .case10-head, .section-packages, .section-cases, .section-trust, .section-data, .section-contact) { background-image: none; }
html .section-cases .case-grid9::before { display: none; }
}
html.reveal-on [data-reveal] { opacity: 0; transform: translateY(12px); transition: opacity var(--dur-reveal) var(--ease-out), transform var(--dur-reveal) var(--ease-out); }
html.reveal-on [data-reveal].is-in { opacity: 1; transform: none; }
html.reveal-on .case-card9:nth-child(2).is-in, html.reveal-on .stack-list li:nth-child(2).is-in, html.reveal-on .package:nth-child(2).is-in { transition-delay: var(--stagger); }
html.reveal-on .case-card9:nth-child(3).is-in, html.reveal-on .stack-list li:nth-child(3).is-in, html.reveal-on .package:nth-child(3).is-in { transition-delay: calc(var(--stagger) * 2); }
@media (prefers-reduced-motion: reduce) {
*, *::before, *::after {
animation-duration: .001ms !important; animation-delay: 0s !important; animation-iteration-count: 1 !important;
transition-duration: .001ms !important; transition-delay: 0s !important; scroll-behavior: auto !important;
}
html.reveal-on [data-reveal] { opacity: 1; transform: none; }
}
@media print {
.site-header, .site-footer, .masthead--slim, .nav-scrim, .modal, .skip-link, .dock, .icons-sprite { display: none !important; }
body::before { display: none; }
.shell { display: block !important; padding: 0 !important; }
.hero { background: #0E1B2C; }
html.reveal-on [data-reveal] { opacity: 1; transform: none; }
body { background: #fff; }
.section { box-shadow: none; }
.explain-run, .pin-num::after { display: none; }
}
.section-404 { padding-block: var(--sp-base) var(--sp-air); background-color: var(--c-base); }
.nf-wrap { display: grid; gap: var(--s6); justify-items: start; }
.nf-text { min-width: 0; }
.nf-media { display: block; width: 100%; max-width: 560px; border-radius: var(--r-panel); overflow: hidden; background: var(--c-stage); }
.nf-media img { display: block; width: 100%; height: auto; aspect-ratio: 4 / 3; object-fit: cover; }
.page-404 h1 { font-size: clamp(2.125rem, 1.6rem + 2.4cqi, 3.5rem); line-height: var(--lh-display); letter-spacing: var(--ls-display); max-width: 14ch; margin: 0 0 var(--s4); }
.page-404 .lead { margin: 0 0 var(--s6); font-size: var(--fs-lead); color: var(--c-text-2); max-width: 40ch; }
.page-404 .cta-row { margin-top: 0; }