.ns-hero {
	position: relative;
	overflow: hidden;
	background: #efeee9;
}
.ns-hero__grid {
	min-height: 690px;
	display: grid;
	grid-template-columns: minmax(0, .94fr) minmax(420px, 1.06fr);
	align-items: center;
	gap: clamp(45px, 7vw, 110px);
}
.ns-hero__content { padding: 78px 0; }
.ns-hero h1 {
	max-width: 760px;
	margin: 0;
	font-size: clamp(3.5rem, 6.25vw, 6.7rem);
	line-height: .91;
	letter-spacing: -.075em;
	font-weight: 780;
	text-wrap: balance;
}
.ns-hero p {
	max-width: 590px;
	margin: 26px 0 0;
	color: #5f5e58;
	font-size: clamp(1rem, 1.2vw, 1.16rem);
	line-height: 1.65;
}
.ns-hero__actions {
	margin-top: 32px;
	display: flex;
	align-items: center;
	gap: 24px;
}
.ns-proof-row {
	margin-top: 58px;
	display: flex;
	gap: 40px;
}
.ns-proof-row > div { display: grid; gap: 4px; }
.ns-proof-row strong { font-size: 14px; }
.ns-proof-row span { color: var(--ns-muted); font-size: 12px; }

.ns-hero__art {
	position: relative;
	height: 590px;
	isolation: isolate;
}
.ns-product-stage {
	position: absolute;
	inset: 55px 0 30px 40px;
	overflow: hidden;
	border-radius: 34px;
	background: #d5ff67;
	box-shadow: var(--ns-shadow);
}
.ns-stage-label {
	position: absolute;
	top: 30px;
	left: 30px;
	font-size: 11px;
	font-weight: 850;
	letter-spacing: .16em;
}
.ns-stage-object {
	position: absolute;
	width: 48%;
	aspect-ratio: .68;
	left: 28%;
	top: 14%;
	border-radius: 48% 48% 20% 20% / 28% 28% 10% 10%;
	background:
		linear-gradient(150deg, rgba(255,255,255,.2), transparent 40%),
		#181814;
	transform: rotate(-7deg);
	box-shadow: 0 35px 60px rgba(23,23,18,.22);
}
.ns-stage-object::before {
	content: "";
	position: absolute;
	width: 42%;
	aspect-ratio: 1;
	left: 29%;
	top: -7%;
	border: 18px solid #181814;
	border-bottom: 0;
	border-radius: 999px 999px 0 0;
}
.ns-stage-meta {
	position: absolute;
	left: 30px;
	right: 30px;
	bottom: 27px;
	display: flex;
	align-items: end;
	justify-content: space-between;
	gap: 20px;
}
.ns-stage-meta span { font-size: 12px; }
.ns-stage-meta strong { font-size: 14px; }
.ns-hero-orb {
	position: absolute;
	border-radius: 50%;
	filter: blur(1px);
}
.ns-hero-orb--one {
	width: 130px;
	height: 130px;
	right: -25px;
	top: 18px;
	background: #f3a1b5;
}
.ns-hero-orb--two {
	width: 88px;
	height: 88px;
	left: 0;
	bottom: 5px;
	background: #9cb6ff;
}

.ns-category-strip {
	padding: 20px 0;
	border-bottom: 1px solid var(--ns-line);
	background: #fff;
}
.ns-category-strip__track {
	display: flex;
	gap: 10px;
	overflow-x: auto;
	scrollbar-width: none;
}
.ns-category-strip__track::-webkit-scrollbar { display: none; }
.ns-category-pill {
	flex: 0 0 auto;
	min-width: 155px;
	display: flex;
	justify-content: space-between;
	gap: 22px;
	padding: 15px 18px;
	border: 1px solid var(--ns-line);
	border-radius: 999px;
	font-size: 13px;
	font-weight: 700;
}
.ns-category-pill small { color: var(--ns-muted); }

.ns-home-section { padding: 100px 0; }
.ns-section-head {
	margin-bottom: 40px;
	display: flex;
	align-items: end;
	justify-content: space-between;
	gap: 30px;
}
.ns-section-head h2 {
	max-width: 720px;
	margin: 0;
	font-size: clamp(2.5rem, 4vw, 4.2rem);
	line-height: .98;
	letter-spacing: -.06em;
	font-weight: 720;
}

.ns-editorial { padding: 20px 0 100px; }
.ns-editorial__grid {
	min-height: 560px;
	display: grid;
	grid-template-columns: 1fr 1fr;
	border-radius: var(--ns-radius-lg);
	overflow: hidden;
	background: var(--ns-ink);
	color: #fff;
}
.ns-editorial__visual {
	position: relative;
	min-height: 500px;
	overflow: hidden;
	background: #f3a1b5;
}
.ns-editorial__visual > span {
	position: absolute;
	left: 30px;
	bottom: 26px;
	color: #111;
	font-size: 11px;
	font-weight: 850;
	letter-spacing: .13em;
}
.ns-editorial__shape {
	position: absolute;
	width: 58%;
	aspect-ratio: .75;
	left: 21%;
	top: 11%;
	border-radius: 46% 46% 18% 18%;
	background: #efeee9;
	transform: rotate(8deg);
	box-shadow: 0 28px 55px rgba(44,20,26,.15);
}
.ns-editorial__shape::after {
	content: "";
	position: absolute;
	width: 50%;
	aspect-ratio: 1;
	left: 25%;
	top: 20%;
	border-radius: 50%;
	background: #1b1b17;
}
.ns-editorial__content {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	justify-content: center;
	padding: clamp(45px, 7vw, 105px);
}
.ns-editorial__content .ns-kicker { color: #aaa9a2; }
.ns-editorial h2 {
	margin: 0;
	font-size: clamp(2.6rem, 4.5vw, 5rem);
	line-height: .94;
	letter-spacing: -.065em;
	font-weight: 710;
}
.ns-editorial p {
	max-width: 540px;
	margin: 25px 0 30px;
	color: #c4c3bd;
	line-height: 1.7;
}

.ns-benefit-bar { padding: 0 0 60px; }
.ns-benefit-bar__grid {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	border-top: 1px solid var(--ns-line);
	border-bottom: 1px solid var(--ns-line);
}
.ns-benefit-bar__grid > div {
	display: flex;
	align-items: center;
	gap: 14px;
	padding: 28px 20px;
}
.ns-benefit-bar__grid > div + div { border-left: 1px solid var(--ns-line); }
.ns-benefit-icon {
	width: 36px;
	height: 36px;
	display: grid;
	place-items: center;
	flex: 0 0 auto;
	border-radius: 50%;
	background: var(--ns-soft);
}
.ns-benefit-bar p { margin: 0; display: grid; gap: 4px; }
.ns-benefit-bar strong { font-size: 13px; }
.ns-benefit-bar small { color: var(--ns-muted); font-size: 11px; }

@media (max-width: 1020px) {
	.ns-hero__grid { grid-template-columns: 1fr; min-height: 0; gap: 0; }
	.ns-hero__content { padding: 76px 0 35px; }
	.ns-hero__art { height: 520px; max-width: 720px; width: 100%; margin-inline: auto; }
	.ns-product-stage { left: 0; }
	.ns-benefit-bar__grid { grid-template-columns: repeat(2, 1fr); }
	.ns-benefit-bar__grid > div:nth-child(3) { border-left: 0; border-top: 1px solid var(--ns-line); }
	.ns-benefit-bar__grid > div:nth-child(4) { border-top: 1px solid var(--ns-line); }
}

@media (max-width: 760px) {
	.ns-hero h1 { font-size: clamp(3.1rem, 15vw, 4.5rem); }
	.ns-proof-row { gap: 24px; overflow-x: auto; }
	.ns-proof-row > div { min-width: 100px; }
	.ns-hero__art { height: 420px; }
	.ns-product-stage { inset: 25px 0 20px; }
	.ns-home-section { padding: 72px 0; }
	.ns-section-head { align-items: start; }
	.ns-editorial { padding-bottom: 72px; }
	.ns-editorial__grid { grid-template-columns: 1fr; }
	.ns-editorial__visual { min-height: 390px; }
	.ns-editorial__content { padding: 46px 28px 52px; }
	.ns-benefit-bar__grid { grid-template-columns: 1fr; }
	.ns-benefit-bar__grid > div + div,
	.ns-benefit-bar__grid > div:nth-child(3),
	.ns-benefit-bar__grid > div:nth-child(4) {
		border-left: 0;
		border-top: 1px solid var(--ns-line);
	}
}

@media (max-width: 520px) {
	.ns-hero__content { padding-top: 58px; }
	.ns-hero__actions { align-items: flex-start; flex-direction: column; }
	.ns-hero__art { height: 350px; }
	.ns-stage-meta { flex-direction: column; align-items: flex-start; }
	.ns-section-head { flex-direction: column; }
}

/* 0.11.0 editable hero */
.ns-stage-object--image{
	background:transparent!important;
	border-radius:0!important;
	box-shadow:none!important;
	transform:
		translate(var(--ns-hero-image-x,0px),var(--ns-hero-image-y,0px))
		rotate(var(--ns-hero-image-rotate,0deg))
		scale(var(--ns-hero-image-scale,1))!important;
	transform-origin:center center!important;
	overflow:visible!important;
	will-change:transform;
}
.ns-stage-object--image::before,.ns-stage-object--image::after{display:none!important}
.ns-stage-product-image{
	display:block!important;
	width:100%!important;
	height:100%!important;
	max-width:100%!important;
	max-height:100%!important;
	margin:0 auto!important;
	object-fit:contain!important;
	object-position:center!important;
	filter:drop-shadow(0 22px 22px rgba(24,22,18,.16));
}
.ns-external-hero{width:100%;margin-bottom:clamp(28px,5vw,70px)}


@media (max-width: 680px){
	.ns-stage-object--image{
		transform:
			translate(
				clamp(-56px,var(--ns-hero-image-x,0px),56px),
				clamp(-56px,var(--ns-hero-image-y,0px),56px)
			)
			rotate(var(--ns-hero-image-rotate,0deg))
			scale(var(--ns-hero-image-scale,1))!important;
	}
}



/* 0.13.0 — Uniform Multi Hero Collection */
.ns-hero-slider{position:relative;overflow:hidden}
.ns-hero-slider__track{position:relative}
.ns-hero-slider__slide{display:none;animation:nsHeroIn .55s ease both}
.ns-hero-slider__slide.is-active{display:block}
.ns-hero-slider__slide > .ns-hero{height:690px;min-height:690px}
.ns-hero-slider__dots{display:flex;justify-content:center;align-items:center;gap:8px;margin:14px 0 2px}
.ns-hero-slider__dot{appearance:none;width:7px;height:7px;border:0;border-radius:999px;padding:0;background:currentColor;opacity:.24;cursor:pointer;transition:width .25s ease,opacity .25s ease}
.ns-hero-slider__dot.is-active{width:25px;opacity:.85}
@keyframes nsHeroIn{from{opacity:.3;transform:translateY(4px)}to{opacity:1;transform:none}}

.ns-hero-image-control{
	--ns-hi-scale:1;--ns-hi-x:0px;--ns-hi-y:0px;--ns-hi-rotate:0deg;
	width:100%;height:100%;
	transform:translate(var(--ns-hi-x),var(--ns-hi-y)) rotate(var(--ns-hi-rotate)) scale(var(--ns-hi-scale));
	transform-origin:center;display:grid;place-items:center;
}
.ns-hero-upload{display:block;width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 28px 28px rgba(20,20,20,.18))}
.ns-hero-placeholder{display:block;position:relative}

/* Hero 2 — image dead-center, editorial type split above/below. */
.ns-hero--center{
	position:relative;height:690px;min-height:690px;border-radius:30px;overflow:hidden;
	background:linear-gradient(145deg,#f1ede5,#e7dfd2);isolation:isolate;
}
.ns-hero-center__halo{position:absolute;width:520px;height:520px;border-radius:50%;left:50%;top:50%;transform:translate(-50%,-50%);background:#d8ff73;box-shadow:0 0 0 58px rgba(255,255,255,.32),0 0 0 118px rgba(255,255,255,.18)}
.ns-hero-center__copy{position:absolute;left:clamp(28px,5vw,70px);top:clamp(34px,5vw,66px);z-index:4;max-width:480px}
.ns-hero-center__copy h2{font-size:clamp(2.5rem,4.6vw,4.9rem);line-height:.92;letter-spacing:-.06em;margin:.18em 0 .22em;max-width:9ch}
.ns-hero-center__copy p{max-width:34ch;margin:0 0 22px}
.ns-hero-center__product{position:absolute;width:min(46%,520px);height:78%;left:50%;top:12%;transform:translateX(-50%);z-index:3}
.ns-hero-center__badge{position:absolute;right:clamp(24px,4vw,54px);bottom:clamp(28px,4vw,48px);z-index:4;border:1px solid currentColor;border-radius:999px;padding:9px 13px;font-size:.72rem;letter-spacing:.15em}
.ns-hero-placeholder--center{width:50%;height:76%;border-radius:44% 44% 18% 18%;background:#171717;transform:rotate(5deg)}

/* Hero 3 — product left, copy right. */
.ns-hero--reverse{
	position:relative;height:690px;min-height:690px;border-radius:30px;overflow:hidden;background:#eceef4;
	display:grid;grid-template-columns:1.02fr .98fr;align-items:center;
}
.ns-hero-reverse__visual{position:relative;height:100%;overflow:hidden}
.ns-hero-reverse__shape{position:absolute;width:72%;height:76%;left:8%;top:12%;border-radius:36% 64% 58% 42% / 44% 38% 62% 56%;background:#9cb6ff;transform:rotate(-8deg)}
.ns-hero-reverse__visual .ns-hero-image-control{position:absolute;left:12%;top:8%;width:72%;height:84%;z-index:2}
.ns-hero-placeholder--reverse{width:48%;height:76%;border-radius:18px 18px 38px 38px;background:#171717;transform:rotate(-7deg)}
.ns-hero-reverse__copy{padding:0 clamp(42px,6vw,90px) 0 clamp(18px,3vw,42px);max-width:650px}
.ns-hero-reverse__copy h2{font-size:clamp(3rem,5.4vw,5.5rem);line-height:.91;letter-spacing:-.065em;margin:.17em 0 .24em}
.ns-hero-reverse__copy p{max-width:40ch;margin:0 0 27px}
.ns-hero-reverse__note{display:block;margin-top:35px;font-size:.72rem;text-transform:uppercase;letter-spacing:.16em;color:#777}

/* Hero 4 — centered launch stage, product is the hero. */
.ns-hero--launch{
	position:relative;height:690px;min-height:690px;border-radius:30px;overflow:hidden;background:#f7f4ef;padding:34px clamp(30px,5vw,68px);
	display:grid;grid-template-rows:auto 1fr auto;isolation:isolate;
}
.ns-hero-launch__top,.ns-hero-launch__bottom{display:flex;align-items:flex-start;justify-content:space-between;gap:30px;z-index:3}
.ns-hero-launch__badge{font-size:.72rem;letter-spacing:.15em}
.ns-hero-launch__product{position:relative;min-height:0;display:grid;place-items:center}
.ns-hero-launch__disc{position:absolute;width:390px;height:390px;border-radius:50%;background:#f3a1b5;box-shadow:0 0 0 50px rgba(243,161,181,.14),0 0 0 95px rgba(243,161,181,.07)}
.ns-hero-launch__product .ns-hero-image-control{position:relative;width:min(42%,430px);height:100%;z-index:2}
.ns-hero-placeholder--launch{width:50%;height:78%;background:#1b1b17;border-radius:18px 18px 42px 42px;transform:rotate(7deg)}
.ns-hero-launch__bottom{align-items:flex-end}
.ns-hero-launch__bottom > div{max-width:620px}
.ns-hero-launch__bottom h2{font-size:clamp(2.2rem,4vw,4.2rem);line-height:.95;letter-spacing:-.055em;margin:0 0 8px}
.ns-hero-launch__bottom p{margin:0;max-width:52ch}

/* Hero 5 — diagonal luxe. */
.ns-hero--diagonal{
	position:relative;height:690px;min-height:690px;border-radius:30px;overflow:hidden;background:#171917;color:#fff;isolation:isolate;
}
.ns-hero-diagonal__panel{position:absolute;inset:-18% 44% -18% -12%;background:#d5ff67;transform:skewX(-12deg);z-index:0}
.ns-hero-diagonal__product{position:absolute;left:3%;top:7%;width:48%;height:86%;z-index:2}
.ns-hero-placeholder--diagonal{width:48%;height:74%;border-radius:48% 48% 18% 18%;background:#171917;transform:rotate(-8deg)}
.ns-hero-diagonal__copy{position:absolute;right:clamp(34px,6vw,88px);top:50%;transform:translateY(-50%);width:min(44%,590px);z-index:3}
.ns-hero-diagonal__copy .ns-kicker{color:#b8bcb2}
.ns-hero-diagonal__copy h2{color:#fff;font-size:clamp(3rem,5.2vw,5.3rem);line-height:.91;letter-spacing:-.06em;margin:.18em 0 .24em}
.ns-hero-diagonal__copy p{color:#b8bcb2;max-width:40ch;margin:0 0 28px}
.ns-button--light{background:#fff;color:#171917}

/* Hero 6 — editorial campaign with giant centered product and asymmetrical copy. */
.ns-hero--campaign{
	position:relative;height:690px;min-height:690px;border-radius:30px;overflow:hidden;background:#e9e1d7;isolation:isolate;
}
.ns-hero-campaign__frame{position:absolute;inset:24px;border:1px solid rgba(30,28,24,.18);border-radius:22px}
.ns-hero-campaign__title{position:absolute;left:clamp(35px,6vw,86px);top:clamp(36px,6vw,78px);width:min(48%,650px);z-index:4}
.ns-hero-campaign__title h2{font-size:clamp(3rem,5.6vw,5.8rem);line-height:.88;letter-spacing:-.068em;margin:.15em 0 0}
.ns-hero-campaign__product{position:absolute;left:50%;top:5%;width:min(42%,500px);height:82%;transform:translateX(-50%);z-index:2}
.ns-hero-placeholder--campaign{width:52%;height:78%;background:#171917;border-radius:18px 18px 40px 40px;transform:rotate(4deg)}
.ns-hero-campaign__footer{position:absolute;left:clamp(35px,6vw,86px);right:clamp(35px,6vw,86px);bottom:clamp(34px,5vw,58px);display:grid;grid-template-columns:1fr auto 1fr;align-items:end;gap:26px;z-index:4}
.ns-hero-campaign__footer p{margin:0;max-width:36ch;font-size:.95rem}
.ns-hero-campaign__footer > span{text-align:right;font-size:.72rem;text-transform:uppercase;letter-spacing:.15em}

/* Keep the single native heroes exactly the same desktop height too. */
body:not(.ns-noop) .ns-hero--center,
body:not(.ns-noop) .ns-hero--reverse,
body:not(.ns-noop) .ns-hero--launch,
body:not(.ns-noop) .ns-hero--diagonal,
body:not(.ns-noop) .ns-hero--campaign{height:690px;min-height:690px}

@media(max-width:900px){
	.ns-hero-slider__slide > .ns-hero{height:690px;min-height:690px}
	.ns-hero--center,.ns-hero--reverse,.ns-hero--launch,.ns-hero--diagonal,.ns-hero--campaign{height:690px;min-height:690px}
	.ns-hero--reverse{grid-template-columns:1fr}
	.ns-hero-reverse__visual{position:absolute;inset:0 0 38% 0;opacity:.82}
	.ns-hero-reverse__copy{position:absolute;left:22px;right:22px;bottom:28px;padding:26px;max-width:none;background:rgba(255,255,255,.86);backdrop-filter:blur(12px);border-radius:22px;z-index:3}
	.ns-hero-reverse__copy h2{font-size:clamp(2.6rem,11vw,4.4rem)}
	.ns-hero-reverse__note{display:none}
	.ns-hero-center__copy{left:24px;right:24px;top:30px;text-align:center;max-width:none}
	.ns-hero-center__copy h2{margin-left:auto;margin-right:auto;font-size:clamp(2.5rem,11vw,4.2rem)}
	.ns-hero-center__copy p{margin-left:auto;margin-right:auto}
	.ns-hero-center__product{width:58%;height:45%;top:45%}
	.ns-hero-center__halo{width:380px;height:380px;top:66%}
	.ns-hero-center__badge{right:20px;bottom:18px}
	.ns-hero--launch{padding:28px 22px}
	.ns-hero-launch__product .ns-hero-image-control{width:60%}
	.ns-hero-launch__disc{width:300px;height:300px}
	.ns-hero-launch__bottom{display:grid;gap:18px}
	.ns-hero-launch__bottom h2{font-size:clamp(2.3rem,10vw,3.8rem)}
	.ns-hero-diagonal__panel{inset:-12% 24% 42% -22%;transform:skewY(-8deg)}
	.ns-hero-diagonal__product{left:12%;top:2%;width:76%;height:55%}
	.ns-hero-diagonal__copy{left:24px;right:24px;top:auto;bottom:30px;transform:none;width:auto}
	.ns-hero-diagonal__copy h2{font-size:clamp(2.7rem,11vw,4.2rem)}
	.ns-hero-campaign__title{left:28px;right:28px;top:34px;width:auto}
	.ns-hero-campaign__title h2{font-size:clamp(2.7rem,11vw,4.3rem);max-width:10ch}
	.ns-hero-campaign__product{top:28%;width:58%;height:48%}
	.ns-hero-campaign__footer{left:28px;right:28px;bottom:30px;grid-template-columns:1fr auto}
	.ns-hero-campaign__footer p{display:none}
	.ns-hero-campaign__footer > span{display:none}
}
@media(max-width:680px){
	.ns-hero-slider__slide > .ns-hero{height:690px;min-height:690px}
	.ns-hero-image-control{transform:translate(clamp(-56px,var(--ns-hi-x),56px),clamp(-56px,var(--ns-hi-y),56px)) rotate(var(--ns-hi-rotate)) scale(var(--ns-hi-scale))}
}
@media(prefers-reduced-motion:reduce){
	.ns-hero-slider__slide{animation:none}
	.ns-hero-slider__dot{transition:none}
}

.ns-editorial__visual .ns-editorial__image{
	display:block;width:100%;height:100%;object-fit:cover;border-radius:inherit;
}

.ns-extra-banner{padding:24px 0 70px}.ns-extra-banner__inner{display:grid;grid-template-columns:1fr 1fr;min-height:420px;background:#f0eee8;border-radius:28px;overflow:hidden}.ns-extra-banner__copy{padding:clamp(32px,6vw,76px);display:flex;flex-direction:column;justify-content:center;align-items:flex-start}.ns-extra-banner__copy h2{font-size:clamp(2.3rem,4vw,4.5rem);line-height:.96;letter-spacing:-.05em;margin:.2em 0}.ns-extra-banner__copy p{max-width:44ch;margin:0 0 24px}.ns-extra-banner__media{background:#dce8c2;min-height:420px}.ns-extra-banner__media img{width:100%;height:100%;object-fit:cover;display:block}@media(max-width:760px){.ns-extra-banner__inner{grid-template-columns:1fr}.ns-extra-banner__media{min-height:300px}}
