/*
Theme Name: NetBiz Studio Blue
Description: A Divi child theme for NetBiz's home-service digital management site.
Template: Divi
Version: 1.3.0
Text Domain: netbiz-studio
*/

body.nb-redesign {
	--nb-ink: #10263e;
	--nb-deep: #081b34;
	--nb-dark: #102a48;
	--nb-green: #d8fa81;
	--nb-brand: #3bb2fb;
	--nb-soft: #e8f3fc;
	--nb-muted: #435c75;
	--nb-accent: #7bcaff;
	--nb-cream: #f2f7fc;
	--nb-paper: #ffffff;
	--nb-rule: #d5e4ef;
	--nb-font: Inter, "Avenir Next", Avenir, "Segoe UI", system-ui, sans-serif;
}
.nb-site {
	background: var(--nb-cream);
	color: var(--nb-ink);
	font: 16px/1.62 var(--nb-font);
}
body.nb-redesign #page-container { padding-top: 0 !important; }
.nb-site *, .nb-site *::before, .nb-site *::after { box-sizing: border-box; }
.nb-site main { display: block; }
.nb-site h1, .nb-site h2, .nb-site h3 { color: inherit; font-family: var(--nb-font); font-weight: 760; letter-spacing: -.048em; line-height: 1.05; margin: 0; padding: 0; }
.nb-site p { margin: 0; padding: 0; }
.nb-site a { color: inherit; text-decoration: none; }
.nb-site a:focus-visible, .nb-site summary:focus-visible, .nb-site input:focus-visible, .nb-site textarea:focus-visible { outline: 3px solid #2674b4; outline-offset: 4px; }
.nb-site [id] { scroll-margin-top: 24px; }
.nb-wrap { width: min(1180px, calc(100% - 112px)); margin-inline: auto; }
.nb-skip { position: absolute; left: 12px; top: 10px; z-index: 8; padding: 10px 16px; transform: translateY(-180%); background: var(--nb-paper); border-radius: 8px; }
.nb-skip:focus { transform: translateY(0); }

.nb-header { position: relative; z-index: 2; background: var(--nb-cream); border-bottom: 1px solid #dbe9f4; }
.nb-header-inner, .nb-desktop-nav { display: flex; align-items: center; justify-content: space-between; }
.nb-header-inner { min-height: 81px; gap: 28px; }
.nb-desktop-nav { gap: clamp(25px, 4.3vw, 70px); }
.nb-logo { display: inline-flex; align-items: center; padding-block: 4px; font-size: 27px; font-weight: 820; letter-spacing: -.068em; line-height: 1; }
.nb-logo img { display: block; width: 132px; height: auto; }
.nb-nav-links { display: flex; align-items: center; gap: clamp(18px, 3vw, 40px); font-size: 14px; font-weight: 690; }
.nb-nav-links a:hover, .nb-footer a:hover { text-decoration: underline; text-underline-offset: 4px; }
.nb-button { display: inline-flex; align-items: center; justify-content: center; gap: 18px; width: fit-content; min-height: 52px; padding: 0 20px; border: 1px solid transparent; border-radius: 9px; font: 760 14px/1.25 var(--nb-font); white-space: nowrap; transition: background-color .18s, color .18s, border-color .18s; }
.nb-button span, .nb-text-link span { font-size: 17px; line-height: 1; }
.nb-site .nb-button-header { min-height: 43px; padding-inline: 15px; border-color: #adc6df; color: var(--nb-ink); }
.nb-site .nb-button-header:hover { border-color: var(--nb-deep); color: var(--nb-accent); background: var(--nb-deep); }
.nb-site .nb-button-accent { background: var(--nb-brand); color: var(--nb-deep); }
.nb-site .nb-button-accent:hover { background: #a6ddff; }
.nb-site .nb-button-dark { background: var(--nb-dark); color: #fff; }
.nb-site .nb-button-dark:hover { background: #244d73; }
.nb-mobile-nav { display: none; }

.nb-hero { position: relative; overflow: hidden; color: #f6fbff; background: radial-gradient(ellipse at 85% 5%, #133e68 0, transparent 53%), var(--nb-deep); }
.nb-hero-grid { display: grid; grid-template-columns: minmax(0, 1.08fr) minmax(0, .92fr); align-items: center; gap: clamp(30px, 5vw, 82px); min-height: 595px; padding-block: 82px 88px; }
.nb-kicker { display: flex; align-items: center; gap: 9px; color: var(--nb-muted); font: 780 11px/1.35 var(--nb-font); letter-spacing: .145em; text-transform: uppercase; }
.nb-kicker > span:first-child { width: 8px; height: 8px; flex: 0 0 8px; border-radius: 50%; background: #1f81c2; }
.nb-hero .nb-kicker, .nb-contact .nb-kicker, .nb-inner-hero .nb-kicker { color: #c7dcf3; }
.nb-hero .nb-kicker > span:first-child, .nb-contact .nb-kicker > span:first-child, .nb-inner-hero .nb-kicker > span:first-child { background: var(--nb-accent); }
.nb-hero h1 { font-size: clamp(58px, 7.05vw, 104px); line-height: .94; margin: 25px 0 26px; max-width: 710px; }
.nb-hero h1 em { display: block; color: var(--nb-accent); font-family: Georgia, "Times New Roman", serif; font-size: .94em; font-weight: 400; letter-spacing: -.08em; line-height: 1.03; }
.nb-hero .nb-hero-summary { max-width: 510px; color: #d6e8fa; font-size: clamp(16px, 1.65vw, 20px); line-height: 1.55; }
.nb-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 19px 24px; margin-top: 30px; }
.nb-text-link { display: inline-flex; align-items: center; gap: 8px; width: fit-content; min-height: 36px; color: #f0f8ff; font-weight: 730; font-size: 14px; }
.nb-text-link:hover { text-decoration: underline; text-underline-offset: 5px; }
.nb-site .nb-text-link-dark { color: #145a91; }
.nb-hero .nb-hero-note { margin-top: 25px; color: #b7d0ea; font-size: 12px; }
.nb-hero-note span { margin: 0 3px; color: var(--nb-accent); }

.nb-hero-art { isolation: isolate; position: relative; display: grid; align-content: space-between; min-height: 425px; padding: 17px; border: 1px solid #3b668d; border-radius: 19px; overflow: hidden; background: #132f50; box-shadow: 0 26px 55px #0413295c; }
.nb-hero-art::after { position: absolute; content: ""; z-index: -1; inset: 0; background: radial-gradient(ellipse at 50% 42%, transparent 35%, #0b2241a1 91%); }
.nb-grid-graphic { position: absolute; z-index: -2; inset: 0; width: 100%; height: 100%; }
.nb-visual-top, .nb-visual-bottom { display: flex; justify-content: space-between; color: #b9d5ee; font: 700 9px/1.4 var(--nb-font); letter-spacing: .16em; }
.nb-visual-bottom { justify-content: flex-start; align-items: center; gap: 8px; }
.nb-live-dot { width: 7px; height: 7px; border-radius: 50%; background: var(--nb-green); }
.nb-signal { position: absolute; display: flex; align-items: center; gap: 10px; min-width: 176px; padding: 9px 12px 9px 9px; border-radius: 10px; border: 1px solid #5083ae; background: #173a5e; box-shadow: 0 10px 24px #05172d6b; }
.nb-signal-one { top: 17%; left: 9%; }
.nb-signal-two { top: 42%; left: 28%; }
.nb-signal-three { top: 67%; left: 48%; }
.nb-signal-icon { display: grid; width: 31px; height: 31px; place-items: center; border-radius: 7px; background: var(--nb-accent); color: var(--nb-deep); font-weight: 800; font-size: 17px; line-height: 1; }
.nb-signal small, .nb-signal strong { display: block; }
.nb-signal small { margin-bottom: 3px; color: #bfdbf2; font: 770 8px/1 var(--nb-font); letter-spacing: .115em; }
.nb-signal strong { color: #f8fbff; font: 720 13px/1.18 var(--nb-font); }

.nb-strip { background: #e8f3fc; border-bottom: 1px solid #d6e7f5; }
.nb-strip-inner, .nb-strip-inner > div { display: flex; align-items: center; flex-wrap: wrap; }
.nb-strip-inner { min-height: 72px; justify-content: space-between; gap: 12px 22px; padding-block: 15px; }
.nb-strip-inner > span { color: #3b5874; font-size: 12px; font-weight: 710; }
.nb-strip-inner > div { gap: 7px; }
.nb-strip-inner > div span { padding: 4px 10px; border: 1px solid #bad0e3; border-radius: 30px; font-size: 11px; font-weight: 730; }

.nb-section { padding-block: clamp(61px, 8vw, 110px); }
.nb-section h2 { margin-top: 14px; font-size: clamp(40px, 5.45vw, 72px); }
.nb-section h3 { font-size: clamp(22px, 2.1vw, 29px); letter-spacing: -.037em; }
.nb-section-head { display: grid; grid-template-columns: 1.2fr .8fr; align-items: end; gap: 30px 80px; margin-bottom: 39px; }
.nb-section-head > p { color: var(--nb-muted); max-width: 435px; padding-bottom: 4px; }
.nb-services-grid, .nb-article-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 15px; }
.nb-card { display: flex; flex-direction: column; gap: 17px; min-height: 315px; padding: 25px; border: 1px solid var(--nb-rule); border-radius: 15px; background: var(--nb-paper); }
.nb-card p, .nb-card li { color: var(--nb-muted); font-size: 14px; }
.nb-card-top { display: flex; align-items: center; justify-content: space-between; margin-bottom: 7px; }
.nb-card-num { color: #42607c; font-size: 12px; font-weight: 770; letter-spacing: .1em; }
.nb-card svg { width: 40px; height: 40px; padding: 7px; border-radius: 9px; background: #e4f2fc; stroke: #255d86; stroke-width: 1.55; stroke-linecap: round; stroke-linejoin: round; }
.nb-card ul { display: grid; gap: 5px; padding: 14px 0 0; margin: auto 0 0; border-top: 1px solid var(--nb-rule); list-style: none; }
.nb-card li { padding-left: 15px; position: relative; }
.nb-card li::before { content: ""; width: 5px; height: 5px; position: absolute; left: 0; top: .68em; border-radius: 50%; background: #3896d0; }
.nb-offers { display: grid; grid-template-columns: 1fr 1fr auto; align-items: center; gap: 22px; margin-top: 18px; padding: 23px 25px; border-radius: 15px; border: 1px solid #cfe4f5; background: #e8f3fc; }
.nb-offers h3 { margin: 5px 0 7px; font-size: 19px; }
.nb-offers article > p:last-child { color: var(--nb-muted); font-size: 13px; }

.nb-work { background: #e2f1fc; }
.nb-contact-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); align-items: center; gap: clamp(29px, 7vw, 100px); }

.nb-about { background: #f9fcff; }
.nb-about-grid { display: grid; grid-template-columns: minmax(0, .66fr) minmax(0, 1fr); align-items: center; gap: clamp(30px, 8vw, 120px); }
.nb-about-badge { position: relative; display: grid; align-content: space-between; min-height: 282px; padding: 21px; background: repeating-linear-gradient(90deg, #2a4d73 0, #2a4d73 1px, transparent 1px, transparent 29px), repeating-linear-gradient(0deg, #2a4d73 0, #2a4d73 1px, transparent 1px, transparent 29px), #153457; color: #e0edfa; border-radius: 14px; overflow: hidden; }
.nb-about-badge > span { z-index: 1; color: #cbdff3; font-size: 10px; font-weight: 750; letter-spacing: .16em; }
.nb-about-badge > div { justify-self: center; align-self: center; font-size: clamp(84px, 11vw, 158px); color: var(--nb-accent); font-weight: 820; letter-spacing: -.13em; line-height: .92; }
.nb-about-badge > div > span { color: #83b8e3; }
.nb-about h2 { margin-bottom: 17px; }
.nb-about .nb-about-grid > div:last-child > p:not(.nb-kicker) { max-width: 560px; margin-bottom: 12px; color: var(--nb-muted); }
.nb-about .nb-text-link { margin-top: 4px; }

.nb-faq { border-top: 1px solid var(--nb-rule); }
.nb-faq-grid { display: grid; grid-template-columns: .85fr 1.15fr; gap: 28px clamp(30px, 7vw, 95px); }
.nb-faq-list { border-top: 1px solid #c4d7e8; }
.nb-faq-list details { border-bottom: 1px solid #c4d7e8; padding: 0 0 1px; }
.nb-faq-list summary { display: flex; gap: 12px; justify-content: space-between; align-items: center; min-height: 61px; font-weight: 740; cursor: pointer; list-style: none; }
.nb-faq-list summary::-webkit-details-marker, .nb-mobile-nav summary::-webkit-details-marker { display: none; }
.nb-faq-list summary span { font-size: 21px; font-weight: 500; color: #346b99; }
.nb-faq-list details[open] summary span, .nb-mobile-nav[open] summary span { transform: rotate(45deg); }
.nb-faq-list details p { padding: 0 22px 15px 0; color: var(--nb-muted); }

.nb-contact { color: #f5faff; background: radial-gradient(ellipse at 8% 0%, #184776, transparent 53%), var(--nb-deep); }
.nb-contact-grid { align-items: start; }
.nb-contact h2 { max-width: 560px; }
.nb-contact-grid > div:first-child > p:not(.nb-kicker) { margin-block: 19px 12px; color: #c9e0f5; max-width: 420px; }
.nb-form-card { padding: 26px; border-radius: 15px; background: var(--nb-paper); color: var(--nb-ink); }
.nb-form-card > p { margin: 9px 0 16px; color: var(--nb-muted); font-size: 13px; }
.nb-form-card .nb-form-note { margin-bottom: 0; }
.nb-form-card .wpcf7-form > p { margin: 0; }
.nb-fields { display: grid; grid-template-columns: 1fr 1fr; gap: 11px 12px; }
.nb-field-wide { grid-column: 1 / -1; }
.nb-fields label { display: block; color: var(--nb-ink); font: 720 13px/1.3 var(--nb-font); }
.nb-fields label > br { display: none; }
.nb-optional { font-size: 11px; color: var(--nb-muted); font-weight: 500; }
.nb-fields input, .nb-fields textarea { display: block; width: 100%; min-width: 0; min-height: 42px; margin-top: 5px; padding: 10px 11px; border: 1px solid #a9c2d9; border-radius: 7px; color: #142d49; background: #fff; font: 400 16px/1.4 var(--nb-font); }
.nb-fields textarea { min-height: 96px; resize: vertical; }
.nb-fields input::placeholder, .nb-fields textarea::placeholder { color: #5a7188; opacity: 1; }
.nb-form-card .wpcf7-submit { width: 100%; min-height: 48px; padding: 10px 13px; border: 0; border-radius: 8px; color: var(--nb-deep); background: var(--nb-accent); font: 760 14px/1.3 var(--nb-font); cursor: pointer; }
.nb-form-card .wpcf7-submit:hover { background: #87d2ff; }
.nb-form-card .wpcf7-spinner { display: none; }
.nb-form-card .submitting .wpcf7-spinner { display: inline-block; margin-top: 7px; }
.nb-form-card .wpcf7-not-valid-tip { margin-top: 4px; font-size: 12px; color: #a72b1f; }
.nb-form-card .wpcf7-response-output { margin: 12px 0 0 !important; padding: 7px 9px !important; font-size: 13px; }
.nb-check { margin-block: 12px; font-size: 12px; color: var(--nb-muted); }

.nb-footer { padding: 36px 0 20px; background: #07182d; color: #d4e5f7; }
.nb-footer-grid, .nb-footer-bottom, .nb-footer-links { display: flex; justify-content: space-between; flex-wrap: wrap; gap: 12px 22px; }
.nb-site .nb-footer-logo { margin-bottom: 11px; padding: 8px 11px; border-radius: 8px; color: var(--nb-ink); background: var(--nb-paper); }
.nb-footer-logo img { width: 96px; }
.nb-footer p, .nb-footer-bottom { font-size: 12px; }
.nb-footer-links { align-items: center; font-size: 14px; font-weight: 690; }
.nb-footer-bottom { margin-top: 22px; padding-top: 14px; border-top: 1px solid #2a4e73; }

.nb-inner-hero { padding: clamp(50px, 7vw, 90px) 0; background: var(--nb-dark); color: #f6fbff; }
.nb-inner-hero h1 { margin-top: 11px; font-size: clamp(42px, 6.2vw, 79px); }
.nb-inner-hero p:not(.nb-kicker) { max-width: 650px; margin-top: 12px; color: #d2e5f8; }
.nb-inner-hero .nb-text-link + .nb-kicker { margin-top: 15px; }
.nb-blog-body { padding-block: 48px 70px; }
.nb-article-card { display: flex; flex-direction: column; overflow: hidden; border-radius: 14px; border: 1px solid var(--nb-rule); background: var(--nb-paper); }
.nb-article-image { aspect-ratio: 16 / 9; overflow: hidden; background: #e4f0fb; }
.nb-article-image img { display: block; width: 100%; height: 100%; object-fit: cover; }
.nb-article-pattern { display: grid; place-items: center; background: repeating-linear-gradient(45deg, #d9eafa, #d9eafa 2px, #e8f3fc 2px, #e8f3fc 18px); }
.nb-article-pattern span { color: #245a88; font-size: 43px; font-weight: 820; letter-spacing: -.11em; }
.nb-article-summary { display: grid; align-content: start; gap: 11px; padding: 22px; }
.nb-article-summary h2 { font-size: 25px; }
.nb-article-summary h2 a:hover { text-decoration: underline; text-underline-offset: 3px; }
.nb-article-summary > p:not(.nb-kicker) { color: var(--nb-muted); font-size: 14px; }
.nb-pagination { display: flex; justify-content: center; gap: 10px; margin: 26px 0 0; }
.nb-reading { max-width: 790px; }
.nb-prose { padding-block: 43px 65px; }
.nb-prose h2 { font-size: 33px; margin: 30px 0 10px; }
.nb-prose h3 { font-size: 25px; margin: 21px 0 8px; }
.nb-prose p { margin-bottom: 1em; }
.nb-prose a { color: #115f9b; text-decoration: underline; }
.nb-prose img { height: auto; max-width: 100%; }
.nb-post-cover { margin-bottom: 24px; overflow: hidden; border-radius: 11px; }
.nb-comment-wrap { padding-bottom: 50px; }

@media (max-width: 1060px) {
	.nb-wrap { width: calc(100% - 76px); }
	.nb-hero-grid { min-height: 550px; gap: 34px; padding-block: 67px; }
	.nb-hero-art { min-height: 380px; }
	.nb-signal-three { left: 41%; }
	.nb-offers { grid-template-columns: 1fr 1fr; }
	.nb-offers .nb-button { grid-column: 1 / -1; }
}
@media (max-width: 800px) {
	.nb-wrap { width: calc(100% - 44px); }
	.nb-header-inner { min-height: 67px; }
	.nb-header .nb-logo img { width: 102px; }
	.nb-desktop-nav { display: none; }
	.nb-mobile-nav { display: block; }
	.nb-mobile-nav summary { display: flex; align-items: center; justify-content: space-between; gap: 13px; cursor: pointer; list-style: none; padding: 7px 11px; border: 1px solid #b5cce2; border-radius: 7px; font-size: 14px; font-weight: 750; }
	.nb-mobile-nav summary span { font-size: 18px; line-height: 1; }
	.nb-mobile-panel { position: absolute; inset: 100% 0 auto; display: grid; gap: 14px; padding: 14px 22px 22px; border-top: 1px solid var(--nb-rule); box-shadow: 0 14px 22px #112b492b; background: var(--nb-cream); }
	.nb-mobile-panel .nb-nav-links { display: grid; gap: 0; }
	.nb-mobile-panel .nb-nav-links a { display: block; padding: 7px 0; }
	.nb-hero-grid { grid-template-columns: 1fr; gap: 26px; padding-block: 53px 36px; min-height: 0; }
	.nb-hero h1 { max-width: 610px; margin-block: 17px 19px; }
	.nb-hero-art { min-height: 340px; width: 100%; max-width: 560px; }
	.nb-section-head { grid-template-columns: 1fr; gap: 14px; margin-bottom: 23px; }
	.nb-services-grid, .nb-article-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.nb-card { min-height: 0; }
	.nb-contact-grid { gap: 24px; }
	.nb-form-card { padding: 20px; }
	.nb-fields { grid-template-columns: 1fr; }
}
@media (max-width: 560px) {
	.nb-wrap { width: calc(100% - 34px); }
	.nb-hero h1 { font-size: clamp(46px, 13vw, 64px); }
	.nb-hero .nb-hero-note { margin-top: 16px; }
	.nb-hero-art { min-height: 290px; }
	.nb-signal { min-width: 0; }
	.nb-signal-one { left: 6%; }
	.nb-signal-two { left: 22%; }
	.nb-signal-three { left: 39%; }
	.nb-strip-inner { gap: 8px; }
	.nb-services-grid, .nb-article-grid, .nb-about-grid, .nb-faq-grid, .nb-contact-grid, .nb-offers { grid-template-columns: 1fr; }
	.nb-card { padding: 21px; gap: 11px; }
	.nb-card-top { margin-bottom: 2px; }
	.nb-offers { gap: 16px; padding: 20px; }
	.nb-about-badge { min-height: 188px; }
	.nb-footer-links .nb-nav-links { gap: 13px; }
	.nb-footer-links { justify-content: flex-start; }
}
@media (max-width: 365px) {
	.nb-signal-three { left: 34%; }
	.nb-hero .nb-actions { gap: 10px; }
}
@media (prefers-reduced-motion: reduce) {
	.nb-site *, .nb-site *::before, .nb-site *::after { transition-duration: .01ms !important; }
}

/* Homepage motion and platform panel */
.nb-hero-grid { min-height: 570px; padding-block: 56px 67px; }
.nb-hero .nb-title-line { display: block; }
.nb-hero-art {
	--nb-light-x: 52%;
	--nb-light-y: 48%;
	background: radial-gradient(circle at var(--nb-light-x) var(--nb-light-y), #2c6696 0, transparent 56%), #112e50;
}
.nb-grid-graphic { z-index: -1; }
.nb-hero-art::after { pointer-events: none; }
.nb-radar-sweep {
	position: absolute;
	inset: -25%;
	z-index: -1;
	opacity: 0;
	background: conic-gradient(from 25deg, transparent 83%, #69bbff28 95%, #80d2ff5c 99%, transparent 100%);
	pointer-events: none;
}
.nb-route-packet { opacity: 0; filter: drop-shadow(0 0 6px #7bcaff); }
.nb-site .nb-signal { transition: transform .28s cubic-bezier(.2,.8,.2,1), box-shadow .28s, background-color .28s, border-color .28s; }
.nb-site .nb-signal:is(:hover, :focus-visible) {
	z-index: 1;
	transform: translateY(-5px) scale(1.035);
	border-color: #9bd5ff;
	background: #24537e;
	box-shadow: 0 13px 34px #061d3a9e, 0 0 22px #59b8fb29;
}
.nb-signal-icon { flex: 0 0 31px; }
.nb-visual-bottom { color: #d4e8fa; }
.nb-visual-bottom span:last-child { color: var(--nb-accent); }

.nb-platforms { background: #edf5fd; border-bottom: 1px solid #d5e4ef; }
.nb-platform-layout {
	display: grid;
	grid-template-columns: minmax(160px, .78fr) minmax(0, 3.22fr);
	align-items: center;
	gap: 18px;
	padding-block: 22px;
}
.nb-platform-intro h2 { font-size: 20px; letter-spacing: -.035em; }
.nb-platform-intro p { margin-top: 5px; color: var(--nb-muted); font-size: 12px; line-height: 1.4; }
.nb-platform-grid {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 8px;
	padding: 0 !important;
	margin: 0 !important;
	list-style: none !important;
}
.nb-platform-card {
	display: flex;
	align-items: center;
	gap: 9px;
	min-width: 0;
	min-height: 73px;
	padding: 10px;
	border-radius: 11px;
	border: 1px solid #d5e4ef;
	background: #ffffff;
}
.nb-platform-card img, .nb-tool-icon { flex: 0 0 32px; width: 32px; height: 32px; object-fit: contain; }
.nb-platform-card strong, .nb-platform-card small { display: block; line-height: 1.2; }
.nb-platform-card strong { font-size: 12px; font-weight: 770; }
.nb-platform-card small { margin-top: 4px; color: var(--nb-muted); font-size: 10px; }
.nb-tool-icon { display: grid; place-items: center; border-radius: 8px; background: #e4f1fc; }
.nb-tool-icon svg { width: 20px; height: 20px; fill: none; stroke: #276894; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }
.nb-mailchimp-icon { background: #ffe56e; }
.nb-platform-card .nb-mailchimp-icon img { width: 22px; height: 22px; }
.nb-social-layout { padding-block: 16px 22px; border-top: 1px solid #d5e4ef; }
.nb-social-card { min-height: 62px; }
.nb-social-icon { display: grid; place-items: center; width: 34px; height: 34px; flex: 0 0 34px; border-radius: 8px; }
.nb-social-icon img { width: 21px; height: 21px; }
.nb-social-instagram { background: #f9e8f1; }
.nb-social-facebook { background: #e4efff; }
.nb-social-linkedin { background: #e1f0fa; }
.nb-social-tiktok { background: #e7f1e9; }
@media (prefers-reduced-motion: no-preference) {
	.nb-social-card { transition: translate .22s, box-shadow .22s; }
	.nb-social-card:hover { translate: 0 -3px; box-shadow: 0 8px 16px #102e5114; }
}

.nb-site .nb-card, .nb-site .nb-button { transition: transform .22s, box-shadow .22s, background-color .22s, border-color .22s; }
.nb-card:is(:hover, :target) { border-color: #78add6; box-shadow: 0 15px 28px #142f5215; }
.nb-card:hover, .nb-button:hover { transform: translateY(-3px); }
.nb-review-points { margin: 16px 0 12px !important; padding-left: 21px !important; color: #deedfb; font-size: 14px; }
.nb-review-points li::marker { color: var(--nb-accent); font-weight: 800; }

@media (prefers-reduced-motion: no-preference) {
	.nb-title-line {
		animation: nb-title-reveal .8s cubic-bezier(.18,.75,.25,1) both;
	}
	.nb-title-line:nth-child(2) { animation-delay: .12s; }
	.nb-title-line:nth-child(3) { animation-delay: .25s; }
	.nb-hero-summary, .nb-hero .nb-actions, .nb-hero-note { animation: nb-rise .7s cubic-bezier(.18,.75,.25,1) .33s both; }
	.nb-hero .nb-actions { animation-delay: .45s; }
	.nb-hero-note { animation-delay: .55s; }
	.nb-hero-art { animation: nb-board-enter .95s cubic-bezier(.18,.75,.25,1) .12s both; }
	.nb-radar-sweep { animation: nb-radar 3.75s ease-out .3s both; }
	.nb-route-line { stroke-dasharray: 1; animation: nb-trace 3.4s linear .65s both; }
	.nb-signal { animation: nb-rise .55s cubic-bezier(.18,.75,.25,1) both; }
	.nb-signal-one { animation-delay: .48s; }
	.nb-signal-two { animation-delay: .74s; }
	.nb-signal-three { animation-delay: 1s; }
	.nb-live-dot { animation: nb-pulse 1.2s ease-out 3; }
}
@keyframes nb-title-reveal {
	from { opacity: 0; transform: translateY(31px) rotate(2.5deg); clip-path: inset(90% -7% -20% -7%); }
	to { opacity: 1; transform: translateY(0) rotate(0); clip-path: inset(-20% -7% -25% -7%); }
}
@keyframes nb-rise {
	from { opacity: 0; translate: 0 18px; }
	to { opacity: 1; translate: 0 0; }
}
@keyframes nb-board-enter {
	from { opacity: 0; transform: perspective(900px) rotateY(-11deg) translateX(22px) scale(.97); }
	to { opacity: 1; transform: perspective(900px) rotateY(0) translateX(0) scale(1); }
}
@keyframes nb-radar {
	0% { opacity: 0; transform: rotate(-115deg); }
	24% { opacity: .82; }
	82% { opacity: .65; }
	100% { opacity: 0; transform: rotate(210deg); }
}
@keyframes nb-trace { from { stroke-dashoffset: 1; } to { stroke-dashoffset: 0; } }
@keyframes nb-pulse {
	from { box-shadow: 0 0 0 0 #d8fa8180; }
	to { box-shadow: 0 0 0 8px #d8fa8100; }
}

@media (max-width: 1060px) {
	.nb-platform-layout { grid-template-columns: 1fr; gap: 12px; }
}
@media (max-width: 800px) {
	.nb-hero-grid { min-height: 0; padding-block: 49px 38px; }
}
@media (max-width: 560px) {
	.nb-platform-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.nb-platform-layout { padding-block: 18px; }
	.nb-platform-card { min-height: 67px; }
	.nb-hero .nb-actions { gap: 9px 15px; }
}
@media (prefers-reduced-motion: reduce) {
	.nb-route-packet { display: none; }
	.nb-site .nb-card:hover, .nb-site .nb-button:hover, .nb-site .nb-signal:is(:hover, :focus-visible) { transform: none; }
}

/* Orbital type and the chapter-by-chapter case study */
.nb-orbit-depth { transform: translateY(var(--nb-orbit-shift, 0px)); }
.nb-type-orbit {
	transform-origin: 50% 50%;
	transform-box: view-box;
	font: 780 11px var(--nb-font);
	letter-spacing: .105em;
	opacity: .78;
}
.nb-home[data-motion] .nb-type-orbit { animation: nb-orbit 28s linear infinite; }
.nb-home[data-motion] .nb-radar-sweep { animation: nb-radar 8.6s ease-in-out infinite; }
.nb-home[data-motion] .nb-route-packet {
	opacity: .84;
	stroke-dasharray: .025 .975;
	animation: nb-signal-travel 5s linear infinite;
}
.nb-home[data-motion="paused"] .nb-loop,
.nb-hero-art[data-nb-offscreen] .nb-loop { animation-play-state: paused; }
@keyframes nb-orbit { to { transform: rotate(1turn); } }
@keyframes nb-signal-travel { to { stroke-dashoffset: -1; } }

.nb-motion-toggle[hidden] { display: none !important; }
.nb-motion-toggle {
	position: fixed;
	inset: auto auto max(14px, env(safe-area-inset-bottom)) max(14px, env(safe-area-inset-left));
	z-index: 9;
	display: inline-flex;
	align-items: center;
	gap: 7px;
	min-height: 44px;
	padding: 0 12px;
	border: 1px solid #86b8e2;
	border-radius: 24px;
	box-shadow: 0 5px 20px #081b3440;
	color: #f4faff;
	background: #112b49;
	font: 710 11px/1 var(--nb-font);
	cursor: pointer;
}
.nb-motion-toggle span:first-child { color: var(--nb-accent); font-size: 15px; }
.nb-motion-toggle:hover { background: #24527c; }
.nb-motion-toggle:focus-visible { outline: 3px solid #337caf; outline-offset: 3px; }

.nb-work-intro { margin-bottom: clamp(25px, 5vw, 61px); }
.nb-work-intro > div {
	display: grid;
	grid-template-columns: minmax(0, 1.15fr) minmax(0, .85fr);
	gap: 12px clamp(25px, 7vw, 100px);
	align-items: end;
}
.nb-work-intro > div > p { max-width: 430px; color: #36536f; }
.nb-story {
	--nb-stage-top: max(22px, calc((100svh - 395px) / 2));
	display: grid;
	grid-template-columns: minmax(0, 1.12fr) minmax(0, .88fr);
	align-items: start;
	gap: clamp(25px, 5vw, 76px);
}
.nb-story-stage {
	display: grid;
	gap: 12px;
	min-width: 0;
	padding: 17px;
	border: 1px solid #517da5;
	border-radius: 17px;
	overflow: hidden;
	color: #eaf4fd;
	background: #112c4d;
	box-shadow: 0 15px 32px #122c5128;
}
.nb-story-top {
	display: flex;
	justify-content: space-between;
	gap: 8px;
	font: 790 10px/1.3 var(--nb-font);
	letter-spacing: .13em;
}
.nb-story-top span:last-child { color: var(--nb-accent); }
.nb-story-screen {
	position: relative;
	height: clamp(182px, 23vw, 285px);
	overflow: hidden;
	border: 1px solid #426990;
	border-radius: 11px;
	background:
		radial-gradient(ellipse at 50% 53%, #356da680, transparent 65%),
		repeating-linear-gradient(0deg, #4b81ae45 0 1px, transparent 1px 24px),
		repeating-linear-gradient(90deg, #4b81ae45 0 1px, transparent 1px 24px),
		#17395d;
}
.nb-story-art {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	opacity: 0;
	transform: translateY(14px) scale(.96);
	transition: opacity .35s ease, transform .52s cubic-bezier(.2,.75,.25,1);
}
.nb-story-stage[data-nb-chapter="01"] [data-nb-visual="01"],
.nb-story-stage[data-nb-chapter="02"] [data-nb-visual="02"],
.nb-story-stage[data-nb-chapter="03"] [data-nb-visual="03"] { opacity: 1; transform: none; }
.nb-story-meter { height: 3px; overflow: hidden; border-radius: 3px; background: #355d85; }
.nb-story-meter > span {
	display: block;
	width: 100%;
	height: 100%;
	transform: scaleX(var(--nb-story-progress, .04));
	transform-origin: left center;
	background: var(--nb-accent);
}
.nb-story-nav { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px; }
.nb-site .nb-story-nav a {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 5px;
	min-height: 40px;
	border: 1px solid #477197;
	border-radius: 7px;
	color: #deedf9;
	font-size: 11px;
	font-weight: 720;
}
.nb-site .nb-story-nav a:is(:hover, [aria-current="step"]) { border-color: var(--nb-accent); color: #10263e; background: var(--nb-accent); }
.nb-story-steps { display: grid; gap: 12px; padding: 0 !important; margin: 0 !important; list-style: none !important; }
.nb-story-steps > li { display: grid; align-items: center; }
.nb-story-steps > li:focus { outline: none; }
.nb-story-steps > li:focus-visible article { outline: 2px solid #337caf; outline-offset: 3px; }
.nb-story-steps article {
	padding: clamp(18px, 3vw, 37px);
	border: 1px solid #bad4e8;
	border-radius: 14px;
	background: #f7fbff;
	transition: border-color .24s, box-shadow .24s;
}
.nb-story-steps article h3 { margin-block: 8px 12px; font-size: clamp(27px, 3.55vw, 51px); }
.nb-story-steps article > p:not(.nb-kicker) { max-width: 39ch; color: var(--nb-muted); }
.nb-story-steps article a { margin-top: 12px; }
.nb-story-steps li[data-nb-current] article { border-color: #73a7d0; box-shadow: 0 10px 26px #224c721a; }

@media (min-height: 600px) and (prefers-reduced-motion: no-preference) {
	.nb-story[data-nb-ready] .nb-story-stage { position: sticky; top: var(--nb-stage-top); }
	.nb-story[data-nb-ready] .nb-story-steps > li {
		min-height: clamp(260px, 53svh, 490px);
		scroll-margin-top: max(26px, calc(52svh - clamp(130px, 26.5svh, 245px)));
	}
}
@media (max-width: 770px) {
	.nb-work-intro > div { grid-template-columns: 1fr; }
	.nb-story { --nb-stage-top: 8px; display: block; }
	.nb-story .nb-story-steps { margin-top: 13px !important; }
	.nb-story-stage { z-index: 2; gap: 7px; padding: 10px; }
	.nb-story-screen { height: clamp(118px, 29vw, 176px); }
	.nb-site .nb-story-nav a { min-height: 37px; }
}
@media (max-width: 770px) and (min-height: 600px) and (prefers-reduced-motion: no-preference) {
	.nb-story[data-nb-ready] .nb-story-steps > li { scroll-margin-top: 245px; }
}
.nb-home[data-motion="paused"] :is(.nb-story-art, .nb-story-steps article) { transition: none; }
@media (prefers-reduced-motion: reduce) {
	.nb-home .nb-loop { animation: none !important; }
	.nb-orbit-depth { transform: none; }
}

/* Visitor-facing WordPress and plugin controls. */
body.nb-redesign .catchProgressbar {
	height: 3px !important;
	border-radius: 0 !important;
	background: transparent !important;
	color: var(--nb-brand);
	accent-color: var(--nb-brand);
}
body.nb-redesign .catchProgressbar::-webkit-progress-bar {
	border-radius: 0;
	background: transparent !important;
}
body.nb-redesign .catchProgressbar::-webkit-progress-value {
	border-radius: 0;
	background: var(--nb-brand) !important;
}
body.nb-redesign .catchProgressbar::-moz-progress-bar {
	border-radius: 0;
	background: var(--nb-brand) !important;
}

body.nb-redesign #wpfront-scroll-top-container {
	width: 44px;
	height: 44px;
	padding: 0;
	border: 1px solid #86b8e2;
	border-radius: 12px;
	color: var(--nb-accent);
	background: var(--nb-dark);
	box-shadow: 0 5px 20px #081b3440;
}
body.nb-redesign #wpfront-scroll-top-container img {
	width: 100%;
	height: 100%;
	opacity: 0;
}
body.nb-redesign #wpfront-scroll-top-container::after {
	position: absolute;
	inset: 17px auto auto 16px;
	width: 11px;
	height: 11px;
	border-top: 2px solid currentColor;
	border-left: 2px solid currentColor;
	transform: rotate(45deg);
	content: "";
	pointer-events: none;
}
body.nb-redesign #wpfront-scroll-top-container:hover { background: #24527c; }
body.nb-redesign #wpfront-scroll-top-container:focus-visible { outline: 3px solid #2674b4; outline-offset: 3px; }

body.nb-redesign .wpcf7 .captcha-image {
	max-width: 100%;
	padding: 9px 12px;
	border: 1px solid var(--nb-rule);
	border-radius: 8px;
	color: var(--nb-ink);
	background: var(--nb-soft);
}
body.nb-redesign .wpcf7 .captcha-image label svg {
	border-radius: 6px;
	fill: var(--nb-dark);
}
body.nb-redesign .wpcf7 .captcha-image label input:is(:checked, :focus-visible) + svg {
	outline: 2px solid #2674b4;
	outline-offset: 2px;
}
body.nb-redesign .nb-site .wpcf7 .wpcf7-submit,
body.nb-redesign .nb-site .comment-form .submit {
	border-color: transparent;
	border-radius: 8px;
	color: var(--nb-deep);
	background: var(--nb-brand);
}
body.nb-redesign .nb-site .wpcf7 .wpcf7-submit:hover,
body.nb-redesign .nb-site .comment-form .submit:hover { background: var(--nb-accent); }

.nb-comment-wrap .comment-form :is(input[type="text"], input[type="email"], input[type="url"], textarea) {
	border: 1px solid #a9c2d9;
	border-radius: 8px;
	color: var(--nb-ink);
	background: var(--nb-paper);
}
