:root{--n9-www-primary:#00bad3;--n9-www-primary-dark:#00819e;--n9-www-green:#c8d655;--n9-www-pink:#e248b4;--n9-text-main:#1f2933;--n9-text-muted:#6b7280;--n9-border-subtle:#e5e7eb;--n9-border-strong:#cbd5e1;--n9-bg-page:#f5f7fb;--n9-surface:#fff;--n9-radius-xl:24px;--n9-radius-lg:18px;--n9-radius-md:12px;--n9-radius-sm:8px;--n9-shadow-soft:0 18px 40px rgba(15,23,42,.18);--n9-shadow-subtle:0 2px 8px rgba(15,23,42,.08)}.roi-container{background:var(--n9-surface);border:1px solid rgba(15,23,42,.03);border-radius:var(--n9-radius-xl);box-shadow:var(--n9-shadow-soft);margin:0 auto;max-width:1200px;overflow:hidden}.roi-header{background:url(https://www.nobl9.com/hubfs/sandbox_CTA-background-10-min.png);background-position:50%;background-repeat:no-repeat;background-size:cover;color:#fff;overflow:hidden;padding:74px 42px 72px;position:relative}.roi-header h1{font-size:2.6rem;font-weight:700;letter-spacing:.02em;margin-bottom:16px;text-align:center}.roi-header p{font-size:1.1rem;margin:0;opacity:.95;text-align:center}.roi-main-content{background:radial-gradient(circle at top left,rgba(0,186,211,.04),transparent 55%),radial-gradient(circle at bottom right,rgba(226,72,180,.04),transparent 55%),#f9fafb;display:grid;gap:26px;grid-template-columns:minmax(0,1.1fr) minmax(0,1.1fr);padding:26px 36px 32px}@media (max-width:1024px){.roi-main-content{grid-template-columns:1fr;padding:22px 18px 26px}.roi-header{padding:36px 34px 34px}}.section{background:#fff;border:1px solid var(--n9-border-subtle);border-radius:var(--n9-radius-lg);box-shadow:var(--n9-shadow-subtle);padding:20px 22px 22px}.section h2{align-items:center;color:#1a1a1a;display:flex;font-size:18px!important;font-weight:700;gap:10px;letter-spacing:.07em;margin-bottom:18px;text-transform:uppercase}.section h2:before{background:linear-gradient(90deg,#9b99b8,#59ccdd);border-radius:999px;content:"";height:3px;width:38px}.input-group{margin-bottom:16px}.input-group label{color:var(--n9-text-main);display:block;font-size:15px;font-weight:600;margin-bottom:4px}.input-group .help-text{color:var(--n9-text-muted);display:block;font-size:.78rem;margin-bottom:6px}.input-group input,.input-group select{background:#f9fafb;border:1px solid var(--n9-border-subtle);border-radius:var(--n9-radius-sm);color:var(--n9-text-main);font-size:14px;font-weight:500;padding:9px 11px;transition:border-color .16s ease,box-shadow .16s ease,background-color .16s ease;width:100%}.input-group input::placeholder{color:#9ca3af}.input-group input:focus,.input-group select:focus{background:#fff;border-color:var(--n9-www-primary);box-shadow:0 0 0 1px rgba(0,186,211,.25);outline:none}.input-with-unit{align-items:center;display:flex;gap:8px}.input-with-unit input{flex:1}.input-with-unit .unit{color:var(--n9-text-muted);font-size:13px;font-weight:600;min-width:80px;text-align:right}.results-summary{background:url(https://www.nobl9.com/hubfs/Customer_Experience_background-07-min.png);background-position:100% 0;background-repeat:no-repeat;background-size:cover;border-radius:var(--n9-radius-lg);box-shadow:0 18px 40px rgba(15,23,42,.7);color:#fff;font-size:16px;grid-column:1/-1;overflow:hidden;padding:26px 28px;position:relative}.results-summary h2{color:#fff;font-size:1.4rem!important;font-weight:700;margin-bottom:18px;position:relative;z-index:1}.results-summary h2:before{background:#fff;border-radius:999px;content:"";display:inline-block;height:3px;margin-right:10px;vertical-align:middle;width:34px}.roi-grid{display:grid;gap:16px;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));position:relative;z-index:1}.roi-card{backdrop-filter:blur(12px);background:rgba(15,23,42,.6);border:1px solid rgba(148,163,184,.6);border-radius:14px;font-variant-numeric:tabular-nums;padding:16px 16px 18px}.roi-card h3{color:#cbd5f5;font-size:12px;font-weight:600;letter-spacing:.1em;margin-bottom:0;text-transform:uppercase}.roi-card .value{font-size:28px;font-weight:700}.roi-card .subtext{color:#e5e7eb;font-size:.8rem;opacity:.9}.positive{color:var(--n9-www-green)!important}.negative{color:var(--n9-www-pink)!important}.breakdown{margin-top:16px}.breakdown-item{align-items:baseline;background:#f9fafb;border:1px solid var(--n9-border-subtle);border-radius:11px;display:flex;font-size:15px;font-variant-numeric:tabular-nums;justify-content:space-between;padding:10px 12px}.breakdown-item .label{color:var(--n9-text-main);font-weight:600}.breakdown-item .value{color:var(--n9-www-primary-dark);font-weight:700}.chart-container{background:#fff;border:1px solid var(--n9-border-subtle);border-radius:var(--n9-radius-md);margin-top:16px;padding:18px 20px 22px}.chart-container h3{color:var(--n9-text-main);font-size:.96rem;font-weight:600}.bar-chart{align-items:flex-end;display:flex;gap:22px;height:230px;padding:18px 10px 6px}.bar-group{align-items:center;display:flex;flex:1;flex-direction:column;gap:8px;height:100%;justify-content:flex-end}.bar{background:linear-gradient(to top,var(--n9-www-primary-dark),var(--n9-www-primary));border-radius:8px 8px 0 0;position:relative;transition:transform .16s ease,box-shadow .16s ease;width:100%}.bar:hover{box-shadow:0 12px 26px rgba(0,129,158,.4);transform:translateY(-3px)}.bar-label{color:var(--n9-text-main);font-size:.86rem;font-weight:600;margin-top:4px;text-align:center}.bar-value{background:#0b1120;border-radius:999px;color:#e5e7eb;font-size:12px;font-weight:600;left:50%;padding:3px 8px;position:absolute;top:-28px;transform:translateX(-50%);white-space:nowrap}.timeline{background:#fff;border:1px solid var(--n9-border-subtle);border-radius:var(--n9-radius-md);margin-top:16px;padding:18px 18px 10px}.timeline h3{color:var(--n9-text-main);font-size:.96rem;font-weight:600;margin-bottom:14px}.timeline-item{align-items:flex-start;display:flex;gap:14px;margin-bottom:14px}.timeline-marker{align-items:center;background:#1a1a1a;border-radius:999px;box-shadow:0 10px 22px rgba(0,0,0,.5);color:#fff;display:flex;flex-shrink:0;font-size:.82rem;font-weight:700;height:30px;justify-content:center;width:30px}.timeline-content{flex:1;padding-top:2px}.timeline-content h4{color:var(--n9-text-main);font-size:15px;font-weight:600;margin-bottom:0}.timeline-content p{color:var(--n9-text-muted);font-size:13px;margin:0}.timeline-content .amount{color:var(--n9-www-primary-dark);font-size:15px;font-weight:600}.assumptions{background:#fffbeb;border-left:4px solid #facc15;border-radius:12px;margin-top:14px;padding:14px 14px 12px}.assumptions h3{color:#92400e;font-size:.9rem;font-weight:600;margin-bottom:6px}.assumptions ul{color:#78350f;font-size:14px;margin-bottom:0;margin-left:18px;padding-left:0}.button-group{display:flex;flex-wrap:wrap;gap:14px;margin-top:18px}.roi-main-content .btn{align-items:center;border:1px solid transparent;border-radius:999px;cursor:pointer;display:inline-flex;font-size:16px;font-weight:600;gap:10px;letter-spacing:.02em;padding:10px 24px;transition:background-color .16s ease,color .16s ease,border-color .16s ease,box-shadow .16s ease,transform .16s ease;white-space:nowrap}.roi-main-content .btn-primary{background:var(--n9-www-primary-dark);border:none;box-shadow:0 10px 26px rgba(0,0,0,.45);color:#fff}.roi-main-content .btn-primary:hover{background:#000;border:none;box-shadow:0 14px 32px rgba(0,0,0,.6);font-weight:600;transform:translateY(-1px)}.roi-main-content .btn-secondary{background:#fff;border-color:var(--n9-www-primary-dark);color:var(--n9-www-primary-dark);font-weight:600}.roi-main-content .btn-secondary:hover{background:#f3f4f6;box-shadow:0 8px 20px rgba(15,23,42,.12);transform:translateY(-1px)}.metric-comparison{display:grid;gap:12px;grid-template-columns:repeat(2,minmax(0,1fr));margin-top:18px}@media (max-width:768px){.metric-comparison{grid-template-columns:1fr}}.metric-card{background:rgba(15,23,42,.7);border:1px solid rgba(148,163,184,.8);border-radius:12px;color:#e5e7eb;font-variant-numeric:tabular-nums;padding:14px 14px 12px}.metric-card.before{border-color:rgba(226,72,180,.9)}.metric-card.after{border-color:rgba(200,214,85,.95)}.metric-card h4{color:#cbd5f5;font-size:13px;letter-spacing:.05em;margin-bottom:0;text-transform:uppercase}.metric-card .big-number{font-size:22px;font-weight:700;margin-bottom:2px}.metric-card.before .big-number{color:var(--n9-www-pink)}.metric-card.after .big-number{color:var(--n9-www-green)}.metric-card p{color:#e5e7eb;font-size:.78rem;opacity:.9}.section[style*="grid-column: 1 / -1;"]{border-color:#d1d5db;border-radius:var(--n9-radius-lg);padding:24px 24px 26px}.section[style*="grid-column: 1 / -1; text-align: center;"]{text-align:center}.section[style*="grid-column: 1 / -1; text-align: center;"] p{color:var(--n9-text-muted);font-size:15px}.section h3{font-size:15px;font-weight:600}.section h3[style*="color: #f87171"]{color:var(--n9-www-pink)!important}.section h3[style*="color: #4ade80"]{color:var(--n9-www-green)!important}.breakdown-item[style*="background: #fee"]{background:#fef2f7!important;border-left:4px solid var(--n9-www-pink)!important}.breakdown-item[style*="background: #efe"]{background:#f5fbe8!important;border-left:4px solid var(--n9-www-green)!important}.breakdown-item[style*="font-size: 1.2em;"] .value{font-size:1.08rem!important}@media (max-width:640px){.roi-container{border-radius:20px}.roi-header h1{font-size:2rem}.roi-header p{font-size:18px}.roi-cost{gap:40px!important;grid-template-columns:auto!important;margin-bottom:40px}.section{padding:18px 16px 20px}.section h2{letter-spacing:0}.section h2:before{width:28px}.bar-label{font-size:12px;line-height:1.2}.results-summary{padding:22px 18px}}.roi-results-wrapper{grid-column:1/-1;position:relative;width:100%}.roi-results{transition:filter .25s ease,opacity .25s ease}.roi-results--blurred{filter:blur(6px);opacity:.75;pointer-events:none;user-select:none}.roi-gate-overlay{align-items:flex-start;background:radial-gradient(circle at top,rgba(15,23,42,.75),rgba(15,23,42,.22));display:flex;inset:0;justify-content:center;opacity:1;padding:100px 24px 24px;position:absolute;transition:opacity .25s ease;z-index:20}.roi-gate-overlay.is-hidden{opacity:0;pointer-events:none}.roi-gate-card{background-color:#0b1120;background-image:url(https://www.nobl9.com/hubfs/webinar-template-background-hero-banner.png);background-position:100%;background-repeat:no-repeat;background-size:cover;border-radius:20px;box-shadow:0 20px 40px rgba(0,0,0,.55);color:#e5e7eb;max-width:620px;padding:40px;width:100%}.roi-gate-card h2{font-size:26px;font-weight:700;margin-bottom:6px;text-align:center}.roi-gate-card p{color:#fff;font-size:18px;margin-bottom:14px;margin-top:0;text-align:center}.roi-gate-card form{background:transparent}.roi-gate-overlay.is-hidden{display:none}@media (max-width:640px){.roi-gate-card{padding:18px 16px 16px}}.roi-gate-card .hs-form{display:flex;flex-direction:column;gap:10px;margin:0;padding:4px 0 0}.roi-gate-card .hs-form fieldset{border:none;margin:0;max-width:100%;padding:0}.roi-gate-card .hs-form fieldset.form-columns-2{display:flex;gap:20px}@media (max-width:640px){.roi-gate-card .hs-form fieldset.form-columns-2{flex-direction:column}}.roi-gate-card .hs-form legend{display:none}.roi-gate-card .hs-form .hs-form-field{margin-bottom:8px}.roi-gate-card .hs-form .hs-form-field>label{color:#fff;display:block;font-size:15px;font-weight:500;margin-bottom:4px}.roi-gate-card .hs-form ul.inputs-list{list-style:none;margin:0;padding:0}.roi-gate-card .hs-form .hs_i_agree ul.inputs-list input{width:auto!important}.roi-gate-card .hs-form .input{margin:0;margin-right:0!important}.roi-gate-card .hs-form .hs-input{background:rgba(15,23,42,.9);border:1px solid rgba(148,163,184,.7);border-radius:999px;box-sizing:border-box;color:#e5e7eb;font-size:14px;line-height:1.4;padding:8px 12px;transition:border-color .18s ease,box-shadow .18s ease,background-color .18s ease,transform .1s ease;width:100%!important}.roi-gate-card .hs-form .hs-input::placeholder{color:#6b7280}.roi-gate-card .hs-form .hs-input:focus{background:#020617;border-color:var(--n9-www-primary);box-shadow:0 0 0 1px rgba(0,186,211,.45);outline:none;transform:translateY(-1px)}.roi-gate-card .hs-form textarea.hs-input{border-radius:16px;min-height:80px;resize:vertical}.roi-gate-card .hs-form .hs-form-booleancheckbox label,.roi-gate-card .hs-form .hs-form-radio label{color:#fff;font-size:12px;letter-spacing:0;text-transform:none}.roi-gate-card .hs-form .actions,.roi-gate-card .hs-form .hs-submit{margin-top:10px}.roi-gate-card .hs-form .hs-button,.roi-gate-card .hs-form .hs-button.primary,.roi-gate-card .hs-form input[type=submit]{background:#00bad3;border:none;border-radius:999px;box-shadow:0 12px 28px rgba(0,0,0,.6);color:#fff;cursor:pointer;display:block;font-size:18px;font-weight:600;margin:0 auto;max-width:max-content;padding:10px 35px;transition:background-color .2s ease,box-shadow .2s ease,transform .12s ease}.roi-gate-card .hs-form .hs-button.primary:hover,.roi-gate-card .hs-form .hs-button:hover,.roi-gate-card .hs-form input[type=submit]:hover{background:var(--n9-www-primary-dark);box-shadow:0 16px 34px rgba(0,0,0,.8);transform:translateY(-1px)}.roi-gate-card .hs-form .hs-error-msgs,.roi-gate-card .hs-form .hs-error-msgs li,.roi-gate-card .hs-form .hs-form-field .error{color:#fb7185;font-size:12px;list-style:none;margin-top:4px}.roi-gate-card .hs-form .hs-input.error{border-color:#fb7185;box-shadow:0 0 0 1px hsla(0,91%,71%,.4)}.roi-gate-card .hs-form .hs_submission_message,.roi-gate-card .hs-form .submitted-message{background:rgba(22,163,74,.14);border:1px solid rgba(34,197,94,.5);border-radius:12px;color:#bbf7d0;font-size:13px;margin-top:8px;padding:10px 12px}@media (max-width:640px){.roi-gate-card .hs-form{gap:8px}}.roi-gate-card .hs-form .hs-button.is-loading,.roi-gate-card .hs-form input[type=submit].is-loading{position:relative}.roi-gate-card .hs-form .hs-button.is-loading:after{animation:roi-spin .7s linear infinite;border:2px solid hsla(0,0%,100%,.4);border-radius:50%;border-top-color:#fff;content:"";height:18px;position:absolute;right:-28px;top:50%;transform:translateY(-50%);width:18px}@keyframes roi-spin{to{transform:translateY(-50%) rotate(1turn)}}