/* L02 only. Shared header, footer and lead form continue using the site system. */
.l02-page { --l02-ink:#24252b; --l02-muted:#595b63; --l02-violet:#5843bd; --l02-line:#dcdde2; }
.l02-page .l02-main { background:#f8f7f3; color:var(--l02-ink); font-size:16px; line-height:1.65; overflow:visible; }
.l02-page .l02-main > .commercial-container { max-width:1350px; padding-inline:30px; }
.l02-page .commercial-breadcrumbs { margin-bottom:28px; padding-top:16px; font-size:12px; line-height:1.5; }
.l02-page .l02-kicker { margin:0 0 20px; color:var(--l02-violet); font-size:12px; letter-spacing:.08em; font-weight:700; text-transform:uppercase; line-height:1.6; }
.l02-page .l02-hero { display:grid; grid-template-columns:minmax(0,1.04fr) minmax(0,1fr); gap:36px; align-items:stretch; margin-bottom:35px; }
.l02-page .l02-hero-copy { padding:26px 0 12px; align-self:center; }
.l02-page .l02-hero h1 { font-size:clamp(36px,4.1vw,58px); letter-spacing:-.05em; line-height:1.11; font-weight:600; margin:0; }
.l02-page .l02-hero h1 span { color:var(--l02-violet); }
.l02-page .l02-lead { font-size:18px; line-height:1.65; margin:25px 0 0; max-width:600px; }
.l02-page .l02-audience { color:var(--l02-muted); font-size:14px; margin:12px 0 0; }
.l02-page .l02-actions { display:flex; align-items:center; flex-wrap:wrap; gap:17px 24px; margin-top:28px; }
.l02-page .l02-button { display:inline-flex; justify-content:space-between; align-items:center; gap:25px; min-height:56px; padding:16px 23px; border-radius:12px; background:#5843bd; color:#fff; font-size:15px; line-height:1.4; font-weight:600; text-decoration:none; transition:background .2s; }
.l02-page .l02-button:hover { background:#44319c; }
.l02-page .l02-button span { font-size:24px; line-height:1; }
.l02-page .l02-text-link { display:inline-flex; align-items:center; min-height:44px; color:var(--l02-violet); font-size:14px; font-weight:600; text-decoration:underline; text-underline-offset:5px; }
.l02-page .l02-hero-proof { border-left:2px solid #9e8fde; padding-left:15px; font-size:14px; line-height:1.65; color:var(--l02-muted); max-width:515px; margin:26px 0 0; }
.l02-page .l02-hero-proof a { color:var(--l02-violet); text-decoration:underline; text-underline-offset:3px; }
.l02-page .l02-hero-media { margin:0; position:relative; border-radius:24px; background:#33343a; overflow:hidden; min-height:590px; }
.l02-page .l02-hero-media img { width:100%; height:100%; object-fit:cover; object-position:66% 50%; }
.l02-page .l02-hero-media::after { content:''; position:absolute; inset:50% 0 0; background:linear-gradient(transparent,rgba(18,19,22,.85)); pointer-events:none; }
.l02-page .l02-hero-media figcaption { position:absolute; z-index:2; top:18px; left:18px; right:18px; font-size:12px; color:white; text-shadow:0 1px 3px #000; }
.l02-page .l02-image-note { position:absolute; z-index:2; bottom:30px; left:30px; right:30px; color:#fff; }
.l02-page .l02-image-note span { display:block; font-size:12px; margin-bottom:8px; color:#f3f0fa; }
.l02-page .l02-image-note strong { font-size:29px; line-height:1.2; font-weight:500; letter-spacing:-.025em; }
.l02-page .l02-section-nav { display:flex; flex-wrap:wrap; gap:12px 30px; padding:22px 0; border-block:1px solid var(--l02-line); }
.l02-page .l02-section-nav a { font-size:14px; min-height:32px; display:flex; align-items:center; color:var(--l02-muted); text-decoration:none; }
.l02-page .l02-section-nav a:hover { color:var(--l02-violet); }
.l02-page .l02-section { padding:85px 0; scroll-margin-top:20px; }
.l02-page .l02-section-head { max-width:810px; margin-bottom:36px; }
.l02-page .l02-section h2,.l02-page .l02-contact h2 { font-size:clamp(30px,3.2vw,45px); font-weight:500; letter-spacing:-.045em; line-height:1.18; margin:0; }
.l02-page .l02-section-head > p:not(.l02-kicker) { max-width:740px; color:var(--l02-muted); margin:22px 0 0; font-size:16px; }
.l02-page .l02-section h3 { margin:0; font-size:22px; line-height:1.3; font-weight:600; letter-spacing:-.02em; }
.l02-page .l02-route { list-style:none; display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:30px; padding:0; margin:40px 0; }
.l02-page .l02-route li { min-width:0; border-top:2px solid #a898df; padding-top:18px; }
.l02-page .l02-route li span { font-size:12px; color:var(--l02-muted); display:block; margin-bottom:10px; }
.l02-page .l02-route h3 { font-size:18px; }
.l02-page .l02-route p { font-size:14px; color:var(--l02-muted); margin:12px 0 0; }
.l02-page .l02-demo { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,.9fr); gap:60px; padding:45px; background:#282a32; border-radius:24px; color:white; }
.l02-page .l02-demo-story { align-self:center; min-width:0; }
.l02-page .l02-demo .l02-kicker { color:#b9acf3; font-size:12px; }
.l02-page .l02-demo h3 { color:white; font-weight:500; font-size:28px; }
.l02-page .l02-demo-story > p:not(.l02-kicker) { margin:20px 0 0; color:#dadbe3; font-size:14px; }
.l02-page .l02-demo-controls { display:flex; flex-wrap:wrap; gap:8px; margin-top:23px; }
.l02-page .l02-demo-controls[hidden] { display:none; }
.l02-page .l02-demo-controls button { font-family:inherit; font-size:12px; line-height:1.45; padding:12px 14px; border:1px solid #c8bcea; border-radius:8px; color:#463776; background:#f8f6ff; min-height:44px; cursor:pointer; text-align:left; }
.l02-page .l02-demo-controls button[aria-pressed=true] { color:#26232f; background:#d8cff9; border-color:#d8cff9; }
.l02-page .l02-demo-story > .l02-demo-note { font-size:14px; color:#b9bdcd; }
.l02-page .l02-workorder { background:#fff; color:var(--l02-ink); border-radius:16px; padding:25px; min-width:0; box-shadow:0 20px 50px #17181b55; }
.l02-page .l02-order-top { display:flex; flex-wrap:wrap; gap:8px; justify-content:space-between; color:var(--l02-muted); font-size:12px; letter-spacing:.03em; margin-bottom:20px; }
.l02-page .l02-workorder > h3 { font-size:22px; color:var(--l02-ink); font-weight:600; }
.l02-page .l02-order-meta { margin:12px 0 21px; font-size:14px; color:var(--l02-muted); line-height:1.8; }
.l02-page .l02-order-data { margin:0; }
.l02-page .l02-order-data > div { display:flex; flex-wrap:wrap; gap:4px 12px; justify-content:space-between; border-top:1px solid #e8e8ec; padding:11px 0; font-size:12px; }
.l02-page .l02-order-data dt { color:var(--l02-muted); }
.l02-page .l02-order-data dd { margin:0; font-weight:500; }
.l02-page .l02-sync-status { padding:18px; border-radius:10px; background:#f3f0fc; margin-top:15px; min-height:173px; }
.l02-page .l02-state-tag { display:inline-flex; border-radius:5px; padding:4px 7px; background:#ded4f8; color:#453580; font-size:12px; font-weight:600; margin-bottom:11px; }
.l02-page .l02-sync-status strong { display:block; font-size:14px; line-height:1.6; }
.l02-page .l02-sync-status p { font-size:14px; color:var(--l02-muted); margin:9px 0 0; }
.l02-page .l02-sync-status[data-state=received] { background:#eef8f2; }
.l02-page .l02-sync-status[data-state=received] .l02-state-tag { background:#d4ecde; color:#275f3c; }
.l02-page .l02-sync-status[data-state=conflict] { background:#fff3e8; }
.l02-page .l02-sync-status[data-state=conflict] .l02-state-tag { background:#f8dfc9; color:#805128; }
.l02-page .l02-order-footer { color:var(--l02-muted); font-size:12px; margin-top:17px; }
.l02-page .l02-under-note { font-size:14px; color:var(--l02-muted); margin:18px 0 0; max-width:890px; }
.l02-page .l02-scope { padding:60px 45px; background:#eeebf6; border-radius:24px; }
.l02-page .l02-scope-grid { display:grid; grid-template-columns:minmax(0,1.4fr) minmax(0,.8fr); gap:60px; }
.l02-page .l02-scope-list dl { margin:20px 0 0; }
.l02-page .l02-scope-list dl > div { display:grid; grid-template-columns:145px minmax(0,1fr); gap:20px; border-top:1px solid #d5cee6; padding:20px 0; }
.l02-page .l02-scope-list dt { font-size:14px; font-weight:600; }
.l02-page .l02-scope-list dd { margin:0; color:var(--l02-muted); font-size:13px; }
.l02-page .l02-scope-aside { padding:26px; background:#fff9; border-radius:16px; align-self:start; }
.l02-page .l02-scope-aside > span { display:block; }
.l02-page .l02-scope-aside p { font-size:14px; color:var(--l02-muted); margin:18px 0 0; }
.l02-page .l02-split { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,.85fr); align-items:start; gap:75px; }
.l02-page .l02-split .l02-section-head { margin:0; }
.l02-page .l02-split .l02-text-link { margin-top:18px; }
.l02-page .l02-exchange-map { padding:30px; border:1px solid var(--l02-line); border-radius:18px; }
.l02-page .l02-exchange-map > div { padding:20px; border:1px solid var(--l02-line); border-radius:10px; background:#fff; }
.l02-page .l02-exchange-map .l02-map-server { border-color:#a99acf; background:#efeaf9; }
.l02-page .l02-exchange-map span:not(.l02-map-arrow) { color:var(--l02-muted); font-size:12px; display:block; margin-bottom:8px; }
.l02-page .l02-exchange-map strong { display:block; font-size:14px; line-height:1.5; font-weight:600; }
.l02-page .l02-exchange-map p { margin:10px 0 0; font-size:14px; color:var(--l02-muted); }
.l02-page .l02-map-arrow { display:block; text-align:center; color:var(--l02-violet); font-size:20px; padding:5px; }
.l02-page .l02-exchange-rules { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:40px; margin-top:40px; padding-top:28px; border-top:1px solid var(--l02-line); }
.l02-page .l02-exchange-rules h3 { font-size:17px; }
.l02-page .l02-exchange-rules p { font-size:14px; color:var(--l02-muted); margin:12px 0 0; }
.l02-page .l02-proof { border-block:1px solid var(--l02-line); }
.l02-page .l02-proof-grid { display:grid; grid-template-columns:minmax(0,1.25fr) minmax(0,.9fr); gap:50px; align-items:center; }
.l02-page .l02-proof-grid figure { margin:0; }
.l02-page .l02-proof-grid figure img { border:1px solid #eadbd6; border-radius:12px; width:100%; height:auto; }
.l02-page .l02-proof-grid figcaption { font-size:12px; color:var(--l02-muted); margin-top:10px; }
.l02-page .l02-proof-copy p { font-size:14px; color:var(--l02-muted); margin:18px 0 0; }
.l02-page .l02-proof-copy .l02-proof-boundary { font-size:14px; border-left:2px solid #a494d5; padding-left:15px; }
.l02-page .l02-proof-copy .l02-text-link { margin-top:15px; }
.l02-page .l02-adjacent { display:grid; grid-template-columns:130px minmax(0,1fr) auto; gap:25px; align-items:start; margin-top:35px; padding-top:25px; border-top:1px solid var(--l02-line); }
.l02-page .l02-adjacent > span { font-size:12px; color:var(--l02-violet); padding-top:5px; }
.l02-page .l02-adjacent p { margin:0; font-size:14px; color:var(--l02-muted); }
.l02-page .l02-estimate-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:65px; }
.l02-page .l02-estimate-grid p { color:var(--l02-muted); font-size:14px; margin:20px 0 0; }
.l02-page .l02-list { margin:22px 0 0; padding-left:20px; }
.l02-page .l02-list li { font-size:14px; margin-bottom:14px; color:var(--l02-muted); }
.l02-page .l02-list li::marker { color:var(--l02-violet); }
.l02-page .l02-estimate-output { padding:28px; border-radius:16px; background:#fff; border:1px solid var(--l02-line); }
.l02-page .l02-acceptance { display:grid; grid-template-columns:minmax(0,.85fr) minmax(0,1fr); gap:60px; margin-top:60px; background:#e7e9e7; border-radius:18px; padding:38px; }
.l02-page .l02-acceptance p { font-size:14px; color:var(--l02-muted); margin:18px 0 0; }
.l02-page .l02-acceptance ol { margin:0; padding-left:20px; }
.l02-page .l02-acceptance li { font-size:13px; margin-bottom:15px; padding-left:6px; }
.l02-page .l02-acceptance li:last-child { margin-bottom:0; }
.l02-page .l02-faq-section { padding-top:0; }
.l02-page .l02-faq { margin:0; max-width:100%; gap:0; border-top:1px solid var(--l02-line); }
.l02-page .l02-faq > details { background:transparent; border:0; border-bottom:1px solid var(--l02-line); border-radius:0; box-shadow:none; }
.l02-page .l02-faq > details > summary { padding-left:0; font-size:17px; font-weight:500; }
.l02-page .l02-faq > details > p { padding-left:0; max-width:910px; font-size:14px; }
.l02-page .l02-contact { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,.6fr); gap:60px; background:#302b4c; border-radius:24px; color:#fff; padding:48px; }
.l02-page .l02-contact .l02-kicker { color:#c8bff1; }
.l02-page .l02-contact p:not(.l02-kicker) { font-size:15px; margin:23px 0 0; max-width:660px; color:#e0deeb; }
.l02-page .l02-contact .l02-contact-geo { font-size:14px; }
.l02-page .l02-contact-actions { align-self:center; display:flex; flex-direction:column; align-items:flex-start; gap:7px; }
.l02-page .l02-contact-actions .l02-button { background:#e4dcfc; color:#30294c; margin-bottom:10px; }
.l02-page .l02-contact-actions .l02-text-link { color:#fff; }
.l02-page .l02-reading { padding:30px 0 45px; color:var(--l02-muted); font-size:14px; margin:0; }
.l02-page .l02-reading a { color:var(--l02-violet); text-decoration:underline; text-underline-offset:3px; }
.l02-page :is(.l02-button,.l02-text-link,.l02-section-nav a,.l02-demo-controls button,.l02-proof-grid a):focus-visible { outline:3px solid #a88eec; outline-offset:5px; }
@media(max-width:1100px) {
 .l02-page .l02-hero { gap:25px; }.l02-page .l02-hero h1 { font-size:44px; }.l02-page .l02-hero-media { min-height:560px; }
 .l02-page .l02-demo,.l02-page .l02-scope,.l02-page .l02-contact { padding:32px; }.l02-page .l02-demo,.l02-page .l02-split,.l02-page .l02-scope-grid { gap:35px; }
 .l02-page .l02-scope-list dl > div { grid-template-columns:1fr; gap:8px; }
}
@media(max-width:800px) {
 .l02-page .l02-main > .commercial-container { padding-inline:22px; }.l02-page .l02-hero { grid-template-columns:1fr; gap:25px; }
 .l02-page .l02-hero-copy { padding-top:0; }.l02-page .l02-hero h1 { font-size:clamp(34px,6.5vw,51px); max-width:650px; }.l02-page .l02-lead { font-size:17px; }
 .l02-page .l02-hero-media { min-height:0; aspect-ratio:3/2; }.l02-page .l02-hero-media img { position:absolute; inset:0; object-position:60% 50%; }
 .l02-page .l02-section { padding-block:60px; }.l02-page .l02-route { grid-template-columns:repeat(2,minmax(0,1fr)); gap:25px; }
 .l02-page .l02-demo,.l02-page .l02-scope-grid,.l02-page .l02-split,.l02-page .l02-proof-grid,.l02-page .l02-estimate-grid,.l02-page .l02-acceptance,.l02-page .l02-contact { grid-template-columns:1fr; gap:30px; }
 .l02-page .l02-demo { padding:28px; }.l02-page .l02-workorder { max-width:530px; width:100%; justify-self:center; }
 .l02-page .l02-scope { padding:35px 28px; }.l02-page .l02-scope-list dl > div { grid-template-columns:145px minmax(0,1fr); gap:20px; }
 .l02-page .l02-scope-aside { max-width:100%; }.l02-page .l02-exchange-rules { gap:23px; }.l02-page .l02-exchange-map { max-width:540px; width:100%; justify-self:center; }
 .l02-page .l02-adjacent { grid-template-columns:1fr; gap:10px; }.l02-page .l02-acceptance { padding:28px; }
 .l02-page .l02-faq-section { padding-top:0; }.l02-page .l02-contact { padding:35px; }.l02-page .l02-contact-actions { gap:5px; }
}
@media(max-width:520px) {
 .l02-page .l02-main > .commercial-container { padding-inline:16px; }.l02-page .commercial-breadcrumbs { font-size:12px; margin-bottom:23px; }
 .l02-page .l02-kicker { font-size:12px; margin-bottom:16px; }.l02-page .l02-hero h1 { font-size:35px; letter-spacing:-.045em; }
 .l02-page .l02-lead { font-size:15px; margin-top:20px; }.l02-page .l02-audience { font-size:14px; }
 .l02-page .l02-actions { gap:9px; margin-top:23px; flex-direction:column; align-items:stretch; }.l02-page .l02-button { padding:15px 18px; font-size:15px; }
 .l02-page .l02-actions .l02-text-link { justify-content:center; }.l02-page .l02-hero-proof { margin-top:20px; font-size:14px; }
 .l02-page .l02-hero-media { aspect-ratio:1.12; border-radius:16px; }.l02-page .l02-image-note { left:20px; bottom:20px; }.l02-page .l02-image-note strong { font-size:25px; }
 .l02-page .l02-hero-media figcaption { font-size:12px; left:15px; top:15px; }.l02-page .l02-section-nav { gap:3px 20px; padding:15px 0; }.l02-page .l02-section-nav a { font-size:14px; min-height:36px; }
 .l02-page .l02-section { padding-block:45px; }.l02-page .l02-section h2,.l02-page .l02-contact h2 { font-size:30px; }.l02-page .l02-section-head > p:not(.l02-kicker) { font-size:14px; margin-top:18px; }
 .l02-page .l02-section-head { margin-bottom:25px; }.l02-page .l02-route { grid-template-columns:1fr; gap:20px; margin:28px 0; }.l02-page .l02-route li { padding:14px 0 0; }.l02-page .l02-route p { font-size:14px; margin-top:8px; }
 .l02-page .l02-demo { padding:23px 18px; border-radius:16px; gap:24px; }.l02-page .l02-demo h3 { font-size:24px; }.l02-page .l02-demo-story > p:not(.l02-kicker) { font-size:14px; }
 .l02-page .l02-demo-controls { flex-direction:column; }.l02-page .l02-demo-controls button { width:100%; }.l02-page .l02-demo-story > .l02-demo-note { font-size:14px; }
 .l02-page .l02-workorder { padding:18px; }.l02-page .l02-workorder > h3 { font-size:20px; }.l02-page .l02-order-data > div { flex-direction:column; font-size:12px; }.l02-page .l02-sync-status { padding:14px; min-height:180px; }
 .l02-page .l02-scope { padding:30px 20px; border-radius:16px; }.l02-page .l02-scope-list dl > div { grid-template-columns:1fr; gap:7px; padding:16px 0; }.l02-page .l02-scope-aside { padding:20px; }
 .l02-page .l02-section h3 { font-size:20px; }.l02-page .l02-exchange-map { padding:18px; }.l02-page .l02-exchange-map > div { padding:17px; }.l02-page .l02-exchange-rules { grid-template-columns:1fr; gap:24px; margin-top:30px; }
 .l02-page .l02-exchange-rules h3 { font-size:17px; }.l02-page .l02-proof-copy p { font-size:14px; }.l02-page .l02-estimate-grid p,.l02-page .l02-list li { font-size:14px; }
 .l02-page .l02-estimate-output,.l02-page .l02-acceptance { padding:22px; }.l02-page .l02-acceptance { margin-top:35px; gap:24px; }
 .l02-page .l02-faq-section { padding-top:0; }.l02-page .l02-faq > details > summary { font-size:15px; padding-block:18px; }.l02-page .l02-faq > details > p { font-size:14px; }
 .l02-page .l02-contact { padding:30px 23px; border-radius:16px; }.l02-page .l02-contact p:not(.l02-kicker) { font-size:14px; }.l02-page .l02-contact-actions { align-items:stretch; }.l02-page .l02-contact .l02-contact-geo { font-size:14px; }
 .l02-page .l02-reading { font-size:14px; padding-bottom:30px; }
}
@media(max-width:350px) { .l02-page .l02-hero h1 { font-size:31px; }.l02-page .l02-section h2,.l02-page .l02-contact h2 { font-size:27px; }.l02-page .l02-workorder { padding:15px; } }
@media(prefers-reduced-motion:reduce) { .l02-page .l02-button { transition:none; } }
@media print { .l02-page .l02-main { background:white; }.l02-page .l02-demo,.l02-page .l02-contact { background:white; color:black; border:1px solid #888; }.l02-page .l02-demo h3,.l02-page .l02-demo p,.l02-page .l02-contact p { color:black!important; }.l02-page .l02-demo-controls,.l02-page .l02-section-nav,.l02-page .l02-button { display:none; } }


/* 2026-10-03: shared 13FOX spacing and readable UI refinement. */
.l02-page .l02-main > .commercial-container { box-sizing:border-box; width:100%; max-width:1320px; margin-inline:auto; padding-inline:15px; }
.commercial-page .commercial-breadcrumbs { gap:8px; font-size:16px; line-height:1.5; }
.commercial-page .l02-faq > details { border:1px solid var(--commercial-border); border-radius:18px; background:#fff; padding:0; }
.commercial-page .l02-faq > details > summary { font-size:17px; line-height:1.5; padding:20px 58px 20px 22px; }
.commercial-page .l02-faq > details > :not(summary) { padding-left:22px; padding-right:22px; }
@media(max-width:600px) {
 .commercial-page .commercial-breadcrumbs { font-size:15px; }
 .commercial-page .l02-faq > details > summary { font-size:16px; padding:18px 52px 18px 18px; }
 .commercial-page .l02-faq > details > :not(summary) { padding-left:18px; padding-right:18px; }
}
.commercial-page.l02-page main .l02-button { border-radius:14px; }