/* ==========================================================================
   Home
   Hero + collage + marquee, about statement, needs picker, sticky rescue
   story, before/after, testimonials.
   ========================================================================== */

/* ---------- Hero ---------- */
/* Photo hero. The picture is dusk-dark in both themes, so the hero's colour
   tokens are pinned light here; the header and topbar above still follow the
   theme. The overlay keeps the headline AA over the brightest part of the sky. */
.nsd-home-hero--photo {
	--ht: #F2F1F5; --hm: #E8E4EE; --hl: rgba(255, 255, 255, .32); --hb: #0B0B0D;
	position: relative; isolation: isolate; overflow: hidden; background-color: #14101B; background-image: none;
}
/* Cursor glow and parallax headline. The glow follows the pointer (--mx/--my
   are set from JS), 420px across, 16% strong, and fades out over the top
   140px so it never touches the header. The headline drifts up to 28px
   sideways and 18px vertically against the pointer (--px/--py, set from JS). */
.nsd-home-hero { --mx: 50%; --my: 40%; position: relative; isolation: isolate; overflow: hidden; }
.nsd-hero__glow {
	position: absolute; inset: 0; z-index: -1; pointer-events: none;
	opacity: 0; transition: opacity .5s;
	background: radial-gradient(circle 420px at var(--mx) var(--my), var(--hacc) 0%, transparent 70%);
	-webkit-mask-image: linear-gradient(to bottom, transparent 0, #000 140px);
	mask-image: linear-gradient(to bottom, transparent 0, #000 140px);
}
.nsd-home-hero.is-active .nsd-hero__glow { opacity: .16; }
.nsd-hero__title {
	transform: translate3d(var(--px, 0px), var(--py, 0px), 0);
	transition: transform .5s cubic-bezier(.2, .7, .2, 1);
	will-change: transform;
}
/* Off on touch devices and for reduced motion. Three separate rules on
   purpose: LiteSpeed's minifier drops prefers-reduced-motion queries, so
   the JS-set .nsd-reduce class and the (hover: none) query each stand alone. */
@media (hover: none) {
	.nsd-hero__glow { display: none; }
	.nsd-hero__title { transform: none !important; transition: none; }
}
@media (prefers-reduced-motion: reduce) {
	.nsd-hero__glow { display: none; }
	.nsd-hero__title { transform: none !important; transition: none; }
}
.nsd-reduce .nsd-hero__glow { display: none; }
.nsd-reduce .nsd-hero__title { transform: none !important; transition: none; }

.nsd-hero__bg { position: absolute; inset: 0; z-index: -1; }
.nsd-hero__bg img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: 62% 45%; }
.nsd-hero__bg::after {
	content: ""; position: absolute; inset: 0;
	background: linear-gradient(180deg, rgba(11, 11, 13, .68) 0%, rgba(11, 11, 13, .58) 40%, rgba(11, 11, 13, .82) 100%);
}
.nsd-home-hero__top { text-align: center; padding-top: 72px; padding-bottom: 0; }

.nsd-tagpill {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	border: 1px solid var(--hl);
	border-radius: 999px;
	padding: 6px 14px 6px 6px;
	font-size: 13px;
	font-weight: 600;
	color: var(--hm);
	margin-bottom: 32px;
	transition: border-color .2s;
}
.nsd-tagpill:hover { border-color: var(--ht); }
.nsd-tagpill__chip { background: #FFFFFF; color: #101012; border-radius: 999px; padding: 3px 10px; font-size: 12px; }

.nsd-home-hero__h1 { margin: 0 auto 26px; max-width: 14ch; }
.nsd-home-hero__lead { margin: 0 auto 36px; max-width: 54ch; }
.nsd-home-hero__ctas { display: flex; justify-content: center; flex-wrap: wrap; gap: 12px; margin-bottom: 72px; }

.nsd-play {
	width: 22px; height: 22px; border-radius: 50%;
	background: var(--ht); color: var(--hb);
	display: grid; place-items: center; font-size: 9px; transition: background .2s, color .2s;
}
.nsd-btn--ghost:hover .nsd-play { background: var(--hb); color: var(--ht); }

/* ---------- Collage ---------- */
.nsd-collage {
	max-width: var(--nsd-max);
	margin: 0 auto;
	display: grid;
	grid-template-columns: 1.25fr 1fr 1.1fr 1fr 1.2fr;
	gap: 14px;
	align-items: end;
	text-align: left;
}
.nsd-tile { border-radius: var(--nsd-radius-card); overflow: hidden; position: relative; box-sizing: border-box; }
.nsd-tile--h300 { height: 300px; }
.nsd-tile--h220 { height: 220px; }
.nsd-tile--h260 { height: 260px; }
.nsd-tile--h240 { height: 240px; }
.nsd-tile--h320 { height: 320px; }
.nsd-grey-static { filter: grayscale(1); }

.nsd-tile--photo { background: var(--hc2); }
.nsd-tile__badge {
	position: absolute; top: 14px; left: 14px;
	background: #FFFFFF; color: #101012;
	font-size: 12px; font-weight: 600; padding: 6px 12px; border-radius: 999px;
	pointer-events: none;
}

.nsd-tile--white {
	background: #FFFFFF; color: #101012; padding: 22px;
	display: flex; flex-direction: column; justify-content: flex-end;
}
.nsd-tile--card { background: var(--hc); border: 1px solid var(--hl); }
.nsd-tile--logo { perspective: 800px; }
.nsd-tile--chart { padding: 22px; display: flex; flex-direction: column; justify-content: space-between; }
.nsd-tile--split { padding: 0; justify-content: flex-start; }

.nsd-stat { font-family: 'Roboto', sans-serif; font-weight: 900; letter-spacing: -0.04em; line-height: 1; }
.nsd-stat--44 { font-size: 44px; }
.nsd-stat--40 { font-size: 40px; }
.nsd-stat--30 { font-size: 30px; letter-spacing: -0.03em; }
.nsd-stat__label { font-size: 13px; line-height: 1.45; color: #6B6B73; margin-top: 8px; }
.nsd-stat__label--hm { font-size: 12.5px; color: var(--hm); margin-top: 6px; }
.nsd-stat__label--tight { margin: 8px 0 12px; }

.nsd-logo3d {
	position: absolute; inset: 12%;
	transition: transform .3s cubic-bezier(.2, .7, .2, 1);
	display: grid; place-items: center;
}
.nsd-logo3d__default { display: block; width: 60%; max-width: 120px; height: auto; }
.nsd-media--contain { width: 100%; height: 100%; background: transparent; }
.nsd-media--contain .nsd-media__img { object-fit: contain; }

.nsd-bars { display: flex; align-items: flex-end; gap: 8px; height: 90px; }
.nsd-bars span { flex: 1; background: var(--hl); border-radius: 6px; display: block; }
.nsd-bars span:nth-child(1) { height: 10%; }
.nsd-bars span:nth-child(2) { height: 28%; }
.nsd-bars span:nth-child(3) { height: 52%; }
.nsd-bars span:nth-child(4) { height: 100%; background: var(--hacc); }

.nsd-tile__pad { padding: 22px 22px 0; }
.nsd-chips { display: flex; gap: 6px; flex-wrap: wrap; }
.nsd-chips span { background: #101012; color: #FFFFFF; font-size: 11.5px; font-weight: 600; padding: 5px 10px; border-radius: 999px; }
.nsd-tile__photo { flex: 1; min-height: 0; margin-top: 16px; background: #F5F5F6; position: relative; }

/* ---------- Client marquee ---------- */
.nsd-marquee { overflow: hidden; padding: 56px 0 48px; }
.nsd-marquee__track {
	display: flex;
	gap: 64px;
	width: max-content;
	padding-right: 64px;
	animation: nsd-marquee 55s linear infinite;
	font-family: 'Roboto', sans-serif;
	font-weight: 700;
	font-size: 22px;
	letter-spacing: -0.02em;
	color: #6B6B73;
	white-space: nowrap;
}

/* ---------- About statement ---------- */
.nsd-home-about { padding: 88px 0 72px; }

.nsd-home-about__photos {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr);
	gap: 14px;
	align-items: end;
	margin-top: 80px;
}
.nsd-photo { border-radius: var(--nsd-radius-card); overflow: hidden; position: relative; box-sizing: border-box; background: var(--surface); }
.nsd-photo--54 { aspect-ratio: 5 / 4; }
/* No photos yet: the note sits under the statement, in the same column (260px label + 48px gap). */
.nsd-home-about__photos--none { display: block; margin-top: 32px; padding-left: 308px; }
.nsd-home-about__photos--none .nsd-home-about__note { flex-direction: row; align-items: center; flex-wrap: wrap; gap: 20px; padding: 0; }
.nsd-home-about__photos--none .nsd-home-about__line { max-width: none; }
.nsd-home-about__note { display: flex; flex-direction: column; gap: 16px; padding: 0 0 8px 8px; }
.nsd-home-about__line {
	font-family: 'Roboto', sans-serif; font-weight: 700; font-size: 20px; line-height: 1.25;
	letter-spacing: -0.02em; max-width: 18ch;
}
.nsd-home-about__note .nsd-btn { align-self: flex-start; }

/* ---------- "What do you need help with?" ---------- */
.nsd-need { padding: 80px 0; scroll-margin-top: 100px; }
.nsd-need__head {
	display: flex; align-items: flex-end; justify-content: space-between;
	gap: 32px; flex-wrap: wrap; margin-bottom: 40px;
}
.nsd-need__head .nsd-h2 { margin: 0; color: #F2F1F5; }
.nsd-need__head p { font-size: 16px; line-height: 1.6; color: #9A9AA6; margin: 0; max-width: 36ch; }

.nsd-need__chips { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 48px; }
.nsd-need__chip {
	font-size: 14.5px; font-weight: 600; padding: 12px 18px; border-radius: 999px; cursor: pointer;
	border: 1px solid #26262E; background: transparent; color: #E4E4E6;
	transition: background .2s, color .2s, border-color .2s;
}
.nsd-need__chip:hover { border-color: #55555E; }
.nsd-need__chip.is-on { background: #FFFFFF; color: #101012; border-color: #FFFFFF; }

.nsd-need__cards { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; align-items: stretch; }
.nsd-svc {
	border-radius: var(--nsd-radius-card); padding: 26px; min-height: 300px;
	display: flex; flex-direction: column; justify-content: space-between; gap: 24px;
	background: #141419; color: #F2F1F5; border: 1px solid #26262E;
	transition: transform .45s cubic-bezier(.2, .8, .2, 1), background .3s, color .3s, border-color .3s;
	position: relative; z-index: 1;
}
.nsd-svc.is-on { background: #FFFFFF; color: #101012; border-color: #FFFFFF; transform: rotate(-3deg) translateY(-10px); z-index: 2; }
.nsd-svc__title { font-family: 'Roboto', sans-serif; font-weight: 900; font-size: 22px; line-height: 1.15; letter-spacing: -0.025em; }
.nsd-svc__body { display: block; font-size: 14.5px; line-height: 1.6; margin-bottom: 16px; opacity: .8; }
.nsd-svc__more { font-size: 13.5px; font-weight: 600; }
.nsd-svc__more--on { display: none; }
.nsd-svc.is-on .nsd-svc__more--on { display: inline; }
.nsd-svc.is-on .nsd-svc__more--off { display: none; }

.nsd-need__case {
	margin-top: 40px; display: flex; justify-content: space-between; align-items: center;
	gap: 24px; flex-wrap: wrap; border-top: 1px solid #26262E; padding-top: 24px;
}
.nsd-need__case + .nsd-need__case { margin-top: 24px; }
.nsd-need__case p { font-size: 15.5px; line-height: 1.6; color: #9A9AA6; margin: 0; max-width: 70ch; }
.nsd-need__case strong { color: #F2F1F5; font-weight: 700; }

/* ---------- Rescue story ---------- */
/* Self-contained: a button steps through the three parts, so the page itself
   scrolls normally. (It used to pin to the scroll for 300vh.) Without
   JavaScript, all three steps show in full (see html:not(.js) below). */
.nsd-story { position: relative; padding: 72px 0; }
.nsd-story__stick > .nsd-wrap { width: 100%; }
.nsd-story__grid { grid-template-columns: minmax(0, .85fr) minmax(0, 1.15fr); gap: 64px; align-items: center; }

.nsd-story__from { font-size: 14px; font-weight: 600; color: var(--muted); margin: 0 0 20px; }
.nsd-story__from a { color: var(--text); border-bottom: 1px solid var(--text); }

/* Each step is a two-row grid: the heading, and the paragraph in a row that animates from 0fr to 1fr.
   That opens and closes the paragraph without animating height, margin or padding directly. */
.nsd-story__step {
	display: grid; grid-template-rows: auto 0fr; opacity: .55;
	transition: opacity .4s, grid-template-rows .5s;
	padding: 18px 0; border-top: 1px solid var(--line);
}
.nsd-story__step h2 {
	font-family: 'Roboto', sans-serif; font-weight: 900; letter-spacing: -0.04em; line-height: 1.02;
	font-size: 28px;
}
@media (min-width: 900px) { .nsd-story__step h2 { font-size: 38px; } }
.nsd-story__step h2 { font-size: clamp(28px, 3.4vw, 44px); }
.nsd-story__step p {
	font-size: 16.5px; line-height: 1.65; color: var(--muted); max-width: 46ch;
	margin: 0; padding-top: 0; min-height: 0; overflow: hidden;
}
.nsd-story[data-step="0"] .nsd-story__step[data-i="0"],
.nsd-story[data-step="1"] .nsd-story__step[data-i="1"],
.nsd-story[data-step="2"] .nsd-story__step[data-i="2"] { opacity: 1; grid-template-rows: auto 1fr; }
.nsd-story[data-step="0"] .nsd-story__step[data-i="0"] p,
.nsd-story[data-step="1"] .nsd-story__step[data-i="1"] p,
.nsd-story[data-step="2"] .nsd-story__step[data-i="2"] p { padding-top: 14px; min-height: 8.3em; }
/* min-height reserves five lines, so the button does not move between steps. */

.nsd-story__ctrl { display: flex; align-items: center; flex-wrap: wrap; gap: 20px; margin-top: 28px; }
.nsd-story__ctrl[hidden] { display: none !important; }
.nsd-story__dots { display: flex; gap: 4px; }
/* 24x24 tap target (WCAG 2.2 target size); the visible dot is the 12px ::before circle. */
.nsd-story__dot {
	position: relative; width: 24px; height: 24px; padding: 0; border: 0; border-radius: 50%;
	background: none; cursor: pointer;
}
.nsd-story__dot::before {
	content: ""; position: absolute; inset: 6px; border-radius: 50%; box-sizing: border-box;
	border: 2px solid var(--muted); background: transparent; transition: background .2s, border-color .2s, transform .2s;
}
.nsd-story__dot:hover::before { border-color: var(--text); transform: scale(1.15); }
.nsd-story__dot[aria-current="step"]::before { background: var(--text); border-color: var(--text); }
.nsd-story__dot:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
.nsd-story__bar { height: 3px; background: var(--line); border-radius: 2px; margin-top: 22px; }
/* The bar fills by scaling (--nsd-s is 0 to 1, set by nsd.js), not by animating width. */
.nsd-story__bar span { display: block; height: 100%; width: 100%; background: var(--text); border-radius: 2px; transform-origin: left center; transform: scaleX(var(--nsd-s, .333)); transition: transform .4s; }

/* No JavaScript: every step reads in full and the mock shows the finished,
   protected state. */
html:not(.js) .nsd-story__step { opacity: 1; }
html:not(.js) .nsd-story__step { grid-template-rows: auto auto; }
html:not(.js) .nsd-story__step p { padding-top: 14px; min-height: 0 !important; }
html:not(.js) .nsd-story__bar, html:not(.js) .nsd-story__ctrl { display: none; }
html:not(.js) .nsd-layer--0 { opacity: 0 !important; }
html:not(.js) .nsd-layer--1, html:not(.js) .nsd-layer--2 { opacity: 1 !important; transform: none !important; }
html:not(.js) .nsd-mock__chip { background: #141419 !important; color: #C46BD6 !important; }
html:not(.js) .nsd-mock__chip span { display: none !important; }
html:not(.js) .nsd-mock__chip [data-c="2"] { display: inline !important; }

/* The browser mock */
.nsd-mock { border: 1px solid var(--line); border-radius: 18px; overflow: hidden; background: var(--bg); }
.nsd-mock__bar {
	display: flex; align-items: center; gap: 8px; padding: 12px 16px;
	border-bottom: 1px solid var(--line); background: var(--surface);
}
.nsd-mock__bar i { display: block; width: 10px; height: 10px; border-radius: 50%; background: var(--line); }
.nsd-mock__url {
	flex: 1; margin: 0 12px; background: var(--bg); border: 1px solid var(--line);
	border-radius: 999px; padding: 5px 14px; font-size: 12.5px; color: var(--muted);
}
.nsd-mock__chip {
	font-size: 11.5px; font-weight: 700; padding: 5px 12px; border-radius: 999px;
	background: #FFFFFF; color: #101012; transition: background .4s, color .4s;
}
.nsd-mock__chip span { display: none; }
.nsd-story[data-step="0"] .nsd-mock__chip [data-c="0"],
.nsd-story[data-step="1"] .nsd-mock__chip [data-c="1"],
.nsd-story[data-step="2"] .nsd-mock__chip [data-c="2"] { display: inline; }
.nsd-story[data-step="1"] .nsd-mock__chip { background: var(--bg); color: var(--text); }
.nsd-story[data-step="2"] .nsd-mock__chip { background: #141419; color: #C46BD6; }

.nsd-mock__stage { position: relative; aspect-ratio: 16 / 11; overflow: hidden; }
.nsd-layer { position: absolute; inset: 0; opacity: 0; transition: opacity .5s, transform .5s; }

.nsd-layer--0 {
	padding: 28px; display: flex; flex-direction: column; gap: 14px;
	background-color: var(--surface); background-image: var(--grain);
}
.nsd-story[data-step="0"] .nsd-layer--0 { opacity: 1; }
.nsd-err { background: #FFFFFF; color: #101012; border: 1px solid #E4E4E6; border-radius: 10px; padding: 16px 18px; }
.nsd-err__h { font-family: 'Roboto', sans-serif; font-weight: 900; letter-spacing: -0.03em; font-size: 20px; }
@media (min-width: 900px) { .nsd-err__h { font-size: 26px; } }
.nsd-err__h { font-size: clamp(20px, 2.4vw, 30px); }
.nsd-err__p { font-size: 13px; margin-top: 4px; }
.nsd-err__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; flex: 1; }
.nsd-err__grid > div { border: 1.5px dashed #6B6B73; border-radius: 10px; padding: 14px; font-size: 13px; color: #55555E; }
:root[data-theme="dark"] .nsd-err__grid > div { color: #9A9AA6; }

.nsd-layer--1 { padding: 22px 26px; display: flex; flex-direction: column; gap: 14px; }
.nsd-story:not([data-step="0"]) .nsd-layer--1 { opacity: 1; }
.nsd-site-nav { display: flex; justify-content: space-between; align-items: center; font-size: 12px; font-weight: 600; color: var(--muted); }
.nsd-site-nav__logo { font-family: 'Roboto', sans-serif; font-weight: 900; font-size: 16px; color: var(--text); }
.nsd-site-nav > span:last-child { display: flex; gap: 14px; }
.nsd-site-h {
	font-family: 'Roboto', sans-serif; font-weight: 900; line-height: 1.05; letter-spacing: -0.03em;
	max-width: 18ch; font-size: 18px;
}
@media (min-width: 900px) { .nsd-site-h { font-size: 24px; } }
.nsd-site-h { font-size: clamp(18px, 2.2vw, 28px); }
.nsd-site-cards { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; flex: 1; }
.nsd-site-cards > div { border: 1px solid var(--line); border-radius: 10px; padding: 12px; font-size: 12.5px; }
.nsd-site-cards span { display: block; color: var(--muted); margin-top: 4px; }
.nsd-site-chart { border: 1px solid var(--line); border-radius: 10px; padding: 12px 14px; display: flex; align-items: flex-end; gap: 14px; }
.nsd-site-chart__l { font-size: 12px; color: var(--muted); flex: 1; }
.nsd-site-chart__bars { display: flex; align-items: flex-end; gap: 6px; height: 48px; }
.nsd-site-chart__bars i { display: block; width: 22px; border-radius: 3px; }
.nsd-site-chart__bars i:first-child { height: 5px; background: var(--line); }
.nsd-site-chart__bars i:last-child { height: 48px; background: var(--text); }
.nsd-site-chart__n { font-family: 'Roboto', sans-serif; font-weight: 900; font-size: 18px; }

.nsd-layer--2 {
	inset: auto 16px 16px auto; width: 62%; max-width: 300px;
	background: #141419; color: #F2F1F5; border-radius: 14px; padding: 16px 18px;
	transform: translateY(24px);
}
.nsd-story[data-step="2"] .nsd-layer--2 { opacity: 1; transform: none; }
.nsd-shield__h { font-family: 'Roboto', sans-serif; font-weight: 900; font-size: 15px; margin-bottom: 10px; }
.nsd-shield__h span { font-weight: 400; color: #9A9AA6; }
.nsd-shield__row { display: flex; justify-content: space-between; gap: 12px; font-size: 12.5px; padding: 6px 0; border-top: 1px solid #26262E; }
.nsd-shield__row span:last-child { color: #C46BD6; font-weight: 600; }

/* ---------- Testimonials ---------- */
.nsd-testi { padding: 80px 0; }
.nsd-testi__grid { grid-template-columns: minmax(0, 320px) minmax(0, 1fr); gap: 64px; }
.nsd-testi__h { margin: 0 0 28px; }
.nsd-testi__tabs { display: flex; flex-direction: column; }
.nsd-testi__tab {
	text-align: left; background: none; border: 0; border-left: 2px solid var(--line);
	color: var(--muted); font-size: 14px; font-weight: 600; padding: 10px 16px; cursor: pointer;
	transition: color .2s, border-color .2s;
}
.nsd-testi__tab:hover { color: var(--text); }
.nsd-testi__tab.is-on { color: var(--text); border-left-color: var(--text); }
.nsd-testi__stage { padding-top: 8px; }
.nsd-testi__fig { margin: 0; }
.nsd-testi__fig + .nsd-testi__fig { margin-top: 40px; }
.js .nsd-testi__fig + .nsd-testi__fig { margin-top: 0; }
.nsd-testi__fig figcaption { font-size: 15px; color: var(--muted); }
.nsd-testi__fig figcaption strong { color: var(--text); font-weight: 600; }
.nsd-testi__nav { display: flex; gap: 8px; margin-top: 36px; }
html:not(.js) .nsd-testi__nav { display: none; }
.nsd-testi__nav button {
	font-size: 18px; width: 44px; height: 44px; border-radius: 50%; border: 1px solid var(--line);
	background: none; color: var(--text); cursor: pointer; transition: border-color .2s;
}
.nsd-testi__nav button:hover { border-color: var(--text); }

/* ---------- Responsive ---------- */
@media (max-width: 960px) {
	.nsd-collage { grid-template-columns: 1fr 1fr; }
	.nsd-collage > :first-child { grid-column: 1 / -1; }
	.nsd-home-about { padding: 72px 0; }
	.nsd-home-about__photos { grid-template-columns: 1fr 1fr; margin-top: 48px; }
	.nsd-home-about__photos--none { padding-left: 0; margin-top: 28px; }
	.nsd-home-about__photos > :first-child { grid-column: 1 / -1; }
	.nsd-need { padding: 72px 0; }
	.nsd-need__cards { grid-template-columns: 1fr 1fr; }
	.nsd-ba, .nsd-testi { padding: 72px 0; }
	.nsd-testi__grid { grid-template-columns: 1fr; gap: 32px; }

	/* The rescue story stacks: text and controls first, then the mock. */
	.nsd-story { padding: 72px 0; }
	.nsd-story__grid { grid-template-columns: 1fr; gap: 32px; }
}
@media (max-width: 560px) {
	.nsd-need__cards { grid-template-columns: 1fr; }
	.nsd-svc { min-height: 240px; }
	.nsd-svc.is-on { transform: none; }
}

/* ---------- Recent work: two-by-two case grid ---------- */
.nsd-homework__head { display: flex; justify-content: space-between; align-items: flex-end; gap: 24px; flex-wrap: wrap; margin-bottom: 40px; }
.nsd-homework__all { font-size: 15px; font-weight: 600; }
.nsd-homework__grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 40px 24px; }
@media (max-width: 720px) { .nsd-homework__grid { grid-template-columns: 1fr; } }

/* ---------- Google reviews band ---------- */
.nsd-reviews { padding-top: 0; }
.nsd-reviews__inner { display: flex; justify-content: space-between; align-items: center; gap: 24px 40px; flex-wrap: wrap; border-top: 1px solid var(--hl); padding-top: 48px; }
.nsd-reviews__h { margin: 0; max-width: 24ch; }
.nsd-reviews__btns { display: flex; gap: 12px; flex-wrap: wrap; }
@media (max-width: 720px) { .nsd-reviews__btns .nsd-btn { width: 100%; justify-content: center; } }