/* N12 contractor portal: page-owned components only. */
.n12-page { --n12-ink:#292632; --n12-text:#575461; --n12-violet:#6045bd; --n12-paper:#f5f3ef; --n12-line:#dedbe4; background:#fff; }
.n12-main,.n12-main *,.n12-main *::before,.n12-main *::after { box-sizing:border-box; }
.n12-main { color:var(--n12-ink); font-size:17px; line-height:1.65; }
.n12-shell { width:100%; max-width:1320px; padding:0 15px; margin:auto; }
.n12-main :is(h1,h2,h3,h4,p,figure) { margin:0; }
.n12-main :is(h1,h2) { font-weight:600; letter-spacing:-.04em; line-height:1.14; text-wrap:balance; }
.n12-main h1 { font-size:clamp(38px,4.2vw,60px); }
.n12-main h1 em { display:block; color:var(--n12-violet); font-style:normal; }
.n12-main h2 { font-size:clamp(30px,3.1vw,44px); }
.n12-main h3 { font-size:22px; font-weight:600; line-height:1.35; letter-spacing:-.02em; }
.n12-main h4 { font-size:18px; line-height:1.4; font-weight:600; }
.n12-main p { color:var(--n12-text); }
.n12-main p+p { margin-top:16px; }
.n12-main img { display:block; width:100%; max-width:100%; height:auto; }
.n12-main [hidden] { display:none!important; }
.n12-main :is(a,button,summary):focus-visible { outline:3px solid var(--n12-violet); outline-offset:5px; }
.n12-main a:not([class]) { color:var(--n12-violet); text-decoration:underline; text-underline-offset:4px; }
.n12-breadcrumb { display:flex; flex-wrap:wrap; gap:8px; padding:24px 0 34px; font-size:16px; line-height:1.5; color:var(--n12-text); }
.n12-breadcrumb a { color:inherit!important; text-decoration:none!important; }
.n12-breadcrumb [aria-current] { color:var(--n12-violet); }
.n12-kicker { color:var(--n12-violet)!important; font-size:12px; font-weight:700; letter-spacing:.085em; text-transform:uppercase; line-height:1.5; }
.n12-hero { display:grid; grid-template-columns:1.08fr 1fr; gap:56px; align-items:center; padding-bottom:50px; }
.n12-hero-copy > .n12-kicker { margin-bottom:18px; }
.n12-hero-copy > p:not(.n12-kicker) { margin-top:20px; }
.n12-hero-copy .n12-lead { font-size:23px; line-height:1.4; font-weight:500; color:var(--n12-ink); margin-top:25px; }
.n12-actions { display:flex; flex-wrap:wrap; gap:16px 25px; align-items:center; margin-top:26px; }
.n12-button { display:inline-flex; justify-content:space-between; align-items:center; gap:18px; max-width:100%; min-height:56px; padding:16px 22px; border-radius:var(--commercial-radius-sm); color:#fff; background:var(--n12-violet); font-size:16px; font-weight:600; line-height:1.4; text-decoration:none; transition:background .2s; }
.n12-button:hover { background:#49348f; }
.n12-button > span { font-size:23px; flex:none; }
.n12-main .n12-prepare { margin-top:13px; font-size:14px; line-height:1.6; }
.n12-hero-proof { display:grid; grid-template-columns:1fr auto; gap:7px 18px; padding-top:20px; border-top:1px solid var(--n12-line); margin-top:25px; text-decoration:none; line-height:1.5; }
.n12-hero-proof > span:first-child { grid-column:1/-1; color:var(--n12-text); font-size:12px; letter-spacing:.06em; text-transform:uppercase; }
.n12-hero-proof strong { font-size:14px; font-weight:500; }
.n12-hero-art { align-self:center; padding:12px; border-radius:var(--commercial-radius-lg); background:var(--n12-paper); }
.n12-hero-art picture { display:block; border-radius:var(--commercial-radius-md); overflow:hidden; }
.n12-hero-art figcaption { padding:10px 9px; color:var(--n12-text); font-size:12px; line-height:1.5; }
.n12-art-note { padding:16px 18px 20px; border-top:1px solid #dedbd7; }
.n12-art-note span { display:block; margin-bottom:6px; font-size:12px; text-transform:uppercase; letter-spacing:.06em; color:var(--n12-text); }
.n12-art-note strong { font-size:23px; line-height:1.35; font-weight:500; letter-spacing:-.02em; }
.n12-section-nav { display:flex; flex-wrap:wrap; gap:6px 28px; padding:16px 0; border-block:1px solid var(--n12-line); }
.n12-section-nav a { display:flex; align-items:center; min-height:40px; font-size:14px; font-weight:500; text-decoration:none!important; color:var(--n12-text)!important; }
.n12-section-nav a:hover { color:var(--n12-violet)!important; }
.n12-section { padding:80px 0; scroll-margin-top:24px; }
.n12-section-head { display:grid; grid-template-columns:1fr 1fr; gap:60px; align-items:end; margin-bottom:38px; }
.n12-section-head .n12-kicker,.n12-sources-section > div > .n12-kicker,.n12-faq-section .n12-kicker,.n12-final .n12-kicker { margin-bottom:18px; }
.n12-section-head > p { max-width:590px; }
.n12-demo { background:#312b43; color:#fff; border-radius:var(--commercial-radius-lg); overflow:hidden; }
.n12-demo p { color:#e3dfe9; }
.n12-demo-top { display:flex; justify-content:space-between; gap:30px; padding:32px 36px; border-bottom:1px solid #655a75; }
.n12-tag { display:inline-block; font-size:12px; letter-spacing:.04em; line-height:1.5; color:#dccdff; }
.n12-demo-top h3 { margin:14px 0 8px; font-size:27px; }
.n12-demo-top p { font-size:14px; }
.n12-demo-reference { align-self:center; max-width:250px; font-size:14px; line-height:1.55; }
.n12-demo-reference span { display:block; color:#cdc6d9; font-size:12px; margin-bottom:6px; }
.n12-demo-reference strong { font-weight:500; }
.n12-demo-body { display:grid; grid-template-columns:.95fr 1.05fr; }
.n12-packet { padding:32px 36px; border-right:1px solid #655a75; }
.n12-packet ul { list-style:none; margin:22px 0; padding:0; }
.n12-packet li { display:flex; gap:18px; padding:16px 0; border-top:1px solid #655a75; }
.n12-packet li > span { color:#ccb2ff; font-size:12px; padding-top:3px; flex:none; }
.n12-packet strong { display:block; font-size:16px; line-height:1.5; font-weight:500; }
.n12-packet small { display:block; color:#d3cddc; font-size:14px; line-height:1.5; margin-top:5px; }
.n12-packet > p { font-size:14px; }
.n12-review { padding:32px 36px; min-width:0; }
.n12-demo-controls { display:flex; flex-wrap:wrap; gap:8px; margin-bottom:30px; }
.n12-demo-controls button { min-height:44px; border:1px solid #897c9c; border-radius:var(--commercial-radius-sm); padding:10px 13px; background:transparent; color:#f6f2fc; cursor:pointer; font-size:14px; font-weight:500; }
.n12-demo-controls button[aria-pressed="true"] { background:#ded0ff; color:#322445; border-color:#ded0ff; }
.n12-demo-controls button:hover { border-color:#e3d6ff; }
.n12-main .n12-demo :is(a,button):focus-visible { outline-color:#e3d6ff; }
.n12-state { display:inline-block; margin-bottom:18px; font-size:14px; line-height:1.5; color:#dfd1ff; border-left:3px solid #b495ec; padding-left:10px; }
.n12-state-panel h4 { margin-bottom:12px; }
.n12-state-panel { min-height:260px; }
.n12-state-panel .n12-result { padding-top:18px; margin-top:20px; border-top:1px solid #655a75; color:#fff; font-size:15px; }
.n12-demo-note { padding:22px 36px; border-top:1px solid #655a75; font-size:14px; }
.n12-roles-section { border-bottom:1px solid var(--n12-line); }
.n12-roles { display:grid; grid-template-columns:repeat(3,1fr); gap:40px; }
.n12-role-number { font-size:12px; color:var(--n12-violet); display:block; margin-bottom:20px; }
.n12-roles h3 { margin-bottom:14px; }
.n12-role-rule { font-size:14px; padding-top:20px; border-top:1px solid var(--n12-line); }
.n12-access-note { display:grid; grid-template-columns:1fr 2fr; gap:50px; margin-top:38px; padding:28px; border-radius:var(--commercial-radius-md); background:#f5f2fc; }
.n12-access-note p { font-size:16px; }
.n12-sources-section { display:grid; grid-template-columns:1fr 1fr; gap:40px 70px; }
.n12-sources-section > div > h2+p { margin-top:26px; }
.n12-sources { display:grid; gap:24px; align-self:start; }
.n12-sources article { border-left:2px solid #c7b9e9; padding-left:24px; }
.n12-sources p { margin-top:8px; font-size:16px; }
.n12-exception { grid-column:1/-1; padding:30px 36px; border-radius:var(--commercial-radius-md); background:var(--n12-paper); }
.n12-exception .n12-tag { color:var(--n12-violet); }
.n12-exception h3 { margin:13px 0; }
.n12-exception p { max-width:1090px; }
.n12-scope-grid { display:grid; grid-template-columns:1fr 1.1fr; gap:70px; }
.n12-checklist,.n12-acceptance { padding:0; margin:24px 0 0; }
.n12-checklist { list-style:none; }
.n12-checklist li { position:relative; padding-left:25px; margin-top:14px; color:var(--n12-text); }
.n12-checklist li::before { content:'✓'; position:absolute; left:0; color:var(--n12-violet); }
.n12-acceptance { padding-left:22px; }
.n12-acceptance li { padding-left:7px; margin-top:13px; color:var(--n12-text); font-size:16px; }
.n12-acceptance li::marker { color:var(--n12-violet); font-weight:600; }
.n12-boundary { display:grid; grid-template-columns:1fr 2fr; gap:50px; border-top:1px solid var(--n12-line); margin-top:38px; padding-top:28px; }
.n12-responsibility { margin-top:28px!important; font-size:14px; max-width:1100px; }
.n12-proof-section { border-block:1px solid var(--n12-line); }
.n12-case { display:grid; grid-template-columns:1fr 1.05fr; gap:65px; align-items:center; }
.n12-case h3 { margin:16px 0; font-size:28px; }
.n12-case figure { background:#f9f6f4; padding:12px; border-radius:var(--commercial-radius-md); }
.n12-case figure a { display:block; }
.n12-case figure img { border-radius:var(--commercial-radius-sm); }
.n12-case figcaption { margin-top:10px; font-size:12px; color:var(--n12-text); line-height:1.5; }
.n12-text-link { display:inline-flex; align-items:center; gap:15px; min-height:44px; color:var(--n12-violet); font-size:15px; line-height:1.5; font-weight:600; text-decoration:underline; text-underline-offset:5px; }
.n12-case .n12-text-link { margin-top:20px; }
.n12-adjacent { display:grid; grid-template-columns:1fr 2fr; gap:50px; padding-top:36px; border-top:1px solid var(--n12-line); margin-top:40px; }
.n12-adjacent .n12-text-link { margin-top:14px; }
.n12-comparison { border:1px solid var(--n12-line); border-radius:var(--commercial-radius-md); overflow:hidden; }
.n12-comparison table { border-collapse:collapse; width:100%; text-align:left; font-size:16px; line-height:1.6; }
.n12-comparison caption { font-size:12px; text-align:left; padding:18px 24px; color:var(--n12-text); text-transform:uppercase; letter-spacing:.06em; }
.n12-comparison th,.n12-comparison td { vertical-align:top; padding:22px 24px; border-top:1px solid var(--n12-line); }
.n12-comparison thead th { font-size:14px; background:#f5f2fc; font-weight:600; }
.n12-comparison tbody th { width:25%; font-weight:600; }
.n12-comparison td { width:37.5%; color:var(--n12-text); }
.n12-work { display:grid; grid-template-columns:repeat(4,1fr); gap:32px; list-style:none; padding:0; margin:44px 0 0; }
.n12-work li { border-top:1px solid var(--n12-line); padding-top:20px; }
.n12-work li > span { font-size:12px; color:var(--n12-violet); }
.n12-work h3 { margin:14px 0 10px; font-size:20px; }
.n12-work p { font-size:15px; }
.n12-estimate-note { margin-top:35px; max-width:1050px; }
.n12-estimate-note h3 { margin-bottom:14px; }
.n12-faq-section { display:grid; grid-template-columns:1fr 1.2fr; gap:65px; padding-top:40px; }
.n12-final { display:grid; grid-template-columns:1.6fr 1fr; gap:65px; padding:46px; border-radius:var(--commercial-radius-lg); background:#f4f0fc; margin-bottom:35px; }
.n12-final h2 { font-size:40px; }
.n12-final h2+p { margin-top:24px; }
.n12-final aside { border-left:1px solid #cfc4e3; padding-left:30px; align-self:center; }
.n12-final aside > span { font-size:12px; text-transform:uppercase; letter-spacing:.06em; color:var(--n12-violet); }
.n12-final ul { list-style:none; margin:16px 0 24px; padding:0; }
.n12-final li { border-bottom:1px solid #d6cde5; padding:12px 0; font-size:16px; }
.n12-final aside p { font-size:14px; }
.n12-contact { font-size:14px; overflow-wrap:anywhere; margin-top:22px!important; }
.n12-related { display:flex; flex-wrap:wrap; gap:12px 30px; justify-content:space-between; padding-bottom:45px; }
.n12-related a { min-height:44px; display:flex; align-items:center; font-size:14px; }
@media (max-width:1100px) {
 .n12-hero { gap:30px; }
 .n12-section-head,.n12-case,.n12-scope-grid,.n12-faq-section,.n12-final { gap:35px; }
 .n12-main h1 { font-size:44px; }
 .n12-hero-copy .n12-lead { font-size:21px; }
 .n12-demo-controls { gap:6px; }
 .n12-packet,.n12-review { padding:28px; }
 .n12-work { grid-template-columns:repeat(2,1fr); }
}
@media (max-width:850px) {
 .n12-hero { grid-template-columns:1fr; gap:32px; }
 .n12-hero-copy { max-width:700px; }
 .n12-hero-art { width:100%; max-width:690px; }
 .n12-main h1 { font-size:48px; }
 .n12-section-head { grid-template-columns:1fr; gap:24px; }
 .n12-section-head > p { max-width:760px; }
 .n12-roles { gap:25px; }
 .n12-demo-top { padding:28px; }
 .n12-demo-body,.n12-scope-grid,.n12-sources-section,.n12-case,.n12-faq-section,.n12-final { grid-template-columns:1fr; }
 .n12-packet { border-right:0; border-bottom:1px solid #655a75; }
 .n12-packet ul { display:grid; grid-template-columns:repeat(3,1fr); gap:20px; }
 .n12-packet li { display:block; }
 .n12-packet li > span { display:block; margin-bottom:8px; }
 .n12-state-panel { min-height:0; }
 .n12-access-note,.n12-adjacent,.n12-boundary { grid-template-columns:1fr; gap:20px; }
 .n12-case figure { max-width:690px; }
 .n12-section { padding:58px 0; }
 .n12-final { padding:35px; }
 .n12-final aside { border-left:0; border-top:1px solid #cfc4e3; padding:25px 0 0; }
}
@media (max-width:600px) {
 .n12-main { font-size:16px; line-height:1.65; }
 .n12-main h1 { font-size:38px; }
 .n12-main h2,.n12-final h2 { font-size:30px; }
 .n12-main h3 { font-size:21px; }
 .n12-breadcrumb { padding:18px 0 26px; font-size:15px; }
 .n12-hero { padding-bottom:30px; }
 .n12-hero-copy .n12-lead { font-size:20px; margin-top:20px; }
 .n12-hero-copy > p:not(.n12-kicker) { margin-top:16px; }
 .n12-button { width:100%; padding:15px 18px; font-size:15px; }
 .n12-actions { margin-top:22px; }
 .n12-hero-proof { margin-top:20px; }
 .n12-hero-art { padding:9px; border-radius:var(--commercial-radius-md); }
 .n12-hero-art picture { border-radius:var(--commercial-radius-sm); }
 .n12-art-note { padding:15px 12px; }
 .n12-art-note strong { font-size:21px; }
 .n12-section-nav { gap:2px 22px; }
 .n12-section { padding:46px 0; }
 .n12-section-head { gap:20px; margin-bottom:28px; }
 .n12-section-head .n12-kicker { margin-bottom:14px; }
 .n12-demo { border-radius:var(--commercial-radius-md); }
 .n12-demo-top { display:block; padding:24px 20px; }
 .n12-demo-top h3 { font-size:24px; }
 .n12-demo-reference { max-width:none; margin-top:20px; padding-top:15px; border-top:1px solid #655a75; }
 .n12-packet,.n12-review { padding:24px 20px; }
 .n12-packet ul { display:block; }
 .n12-packet li { display:flex; }
 .n12-packet li > span { padding-top:3px; margin:0; }
 .n12-demo-controls { margin-bottom:24px; }
 .n12-demo-controls button { padding:10px 11px; }
 .n12-demo-note { padding:20px; }
 .n12-roles { grid-template-columns:1fr; gap:26px; }
 .n12-role-number { margin-bottom:10px; }
 .n12-roles h3 { margin-bottom:10px; }
 .n12-roles article+article { border-top:1px solid var(--n12-line); padding-top:24px; }
 .n12-role-rule { border-top:0; padding-top:0; }
 .n12-access-note,.n12-exception { padding:24px 20px; }
 .n12-sources-section { gap:30px; }
 .n12-scope-grid { gap:32px; }
 .n12-checklist,.n12-acceptance { margin-top:18px; }
 .n12-comparison { border:0; overflow:visible; }
 .n12-comparison :is(table,tbody,tr,th,td) { display:block; width:100%; }
 .n12-comparison caption { display:block; padding:0 0 16px; }
 .n12-comparison thead { display:none; }
 .n12-comparison tr { border:1px solid var(--n12-line); border-radius:var(--commercial-radius-md); overflow:hidden; margin-bottom:16px; }
 .n12-comparison tbody th { width:100%; background:#f5f2fc; padding:18px 20px; border:0; }
 .n12-comparison td { width:100%; padding:18px 20px; font-size:16px; }
 .n12-comparison td::before { content:attr(data-label); display:block; font-size:12px; letter-spacing:.04em; text-transform:uppercase; color:var(--n12-violet); margin-bottom:7px; font-weight:600; }
 .n12-work { grid-template-columns:1fr; gap:25px; margin-top:30px; }
 .n12-work p { font-size:16px; }
 .n12-faq-section { gap:26px; }
 .n12-final { padding:28px 20px; border-radius:var(--commercial-radius-md); }
 .n12-final li { font-size:16px; }
 .n12-related { display:block; padding-bottom:30px; }
 .n12-related a+a { margin-top:8px; }
}
@media (max-width:359px) { .n12-main h1 { font-size:32px; } .n12-main h2,.n12-final h2 { font-size:28px; } .n12-hero-copy .n12-lead { font-size:19px; } .n12-demo-controls button { font-size:14px; } }
@media (prefers-reduced-motion:reduce) { .n12-main *,.n12-main *::before,.n12-main *::after { transition:none!important; animation:none!important; scroll-behavior:auto!important; } }
