/* ==========================================================================
   StartupName.io — main stylesheet
   1:1 conversion of the Claude Design SPA
   ==========================================================================
*/

/* ---------- Reset & base ---------- */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { -webkit-text-size-adjust: 100%; }
body {
	font-family: 'Plus Jakarta Sans', system-ui, -apple-system, Segoe UI, Roboto, sans-serif;
	color: #0E1C1E;
	background: #ffffff;
	min-height: 100vh;
	position: relative;
	overflow-x: hidden;
	line-height: 1.5;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}
input, textarea, select { font-family: inherit; }
button { font-family: inherit; cursor: pointer; border: none; background: none; color: inherit; }
a { color: inherit; text-decoration: none; }
img, svg { display: block; max-width: 100%; }
ul, ol { list-style: none; }

.screen-reader-text {
	border: 0; clip: rect(1px, 1px, 1px, 1px); -webkit-clip-path: inset(50%); clip-path: inset(50%);
	height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute !important; width: 1px; word-wrap: normal !important;
}

.sn-skip-link {
	position: absolute; top: -100px; left: 8px; z-index: 100000;
	background: #0E1C1E; color: #fff; padding: 10px 14px; border-radius: 8px; font-weight: 600;
	transition: top .2s;
}
.sn-skip-link:focus { top: 8px; }

/* ---------- Keyframes ---------- */
@keyframes sn-fadeUp { from { opacity: 0; transform: translateY(16px); } to { opacity: 1; transform: translateY(0); } }
@keyframes sn-rise { from { transform: translateY(16px); } to { transform: translateY(0); } }
@keyframes sn-spin { to { transform: rotate(360deg); } }
@keyframes sn-shimmer { 0% { background-position: -400px 0; } 100% { background-position: 400px 0; } }
@keyframes sn-barUp { from { transform: translateY(120%); } to { transform: translateY(0); } }
@keyframes sn-status { 0% { opacity: 0; transform: translateY(6px); } 15% { opacity: 1; transform: translateY(0); } 85% { opacity: 1; } 100% { opacity: .35; } }
@keyframes sn-ring { 0% { stroke-dashoffset: 289; } 100% { stroke-dashoffset: 40; } }
@keyframes sn-ring-sm { 0% { stroke-dashoffset: 276; } 100% { stroke-dashoffset: 40; } }
@keyframes sn-float { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-14px); } }
@keyframes sn-pulse { 0%, 100% { opacity: .4; transform: scale(.8); } 50% { opacity: 1; transform: scale(1.15); } }

/* ---------- Header ---------- */
.sn-header {
	position: sticky; top: 0; z-index: 40;
	backdrop-filter: saturate(160%) blur(10px);
	-webkit-backdrop-filter: saturate(160%) blur(10px);
	background: rgba(255, 255, 255, 0.82);
	border-bottom: 1px solid #EBF1F1;
}
.sn-header__inner {
	max-width: 1080px;
	margin: 0 auto;
	padding: 13px clamp(20px, 5vw, 40px);
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
}
.sn-logo {
	display: flex; align-items: center; gap: 10px;
	font-family: 'Space Grotesk', sans-serif;
	font-weight: 700; font-size: 20px;
	letter-spacing: -0.02em;
	color: #0E1C1E;
}
.sn-logo__badge {
	width: 30px; height: 30px; border-radius: 9px;
	background: #7DD3D8;
	display: inline-flex; align-items: center; justify-content: center;
	color: #08292B; font-family: 'Space Grotesk', sans-serif;
	font-size: 16px; font-weight: 700;
	box-shadow: 0 4px 14px -3px rgba(125, 211, 216, .8);
}
.sn-logo__tld { color: #2A8E94; }

.sn-nav {
	display: flex; align-items: center; gap: 4px;
	flex-wrap: wrap; justify-content: flex-end;
}
.sn-nav__list { display: flex; align-items: center; gap: 4px; flex-wrap: wrap; }
.sn-nav__list > li > a, .sn-nav__link {
	display: inline-block;
	font-size: 14px; font-weight: 600;
	color: #5E7172;
	background: transparent;
	padding: 8px 12px; border-radius: 9px;
	transition: color .15s;
}
.sn-nav__list > li > a:hover, .sn-nav__link:hover { color: #0E1C1E; }
.sn-nav__list > li.current-menu-item > a,
.sn-nav__list > li.current_page_item > a,
.sn-nav__link.is-active { color: #1F7B81; }

.sn-btn-cta, .sn-nav__cta {
	margin-left: 6px;
	display: inline-flex; align-items: center; gap: 7px;
	background: #0E1C1E; color: #fff !important;
	font-weight: 700; font-size: 13.5px;
	padding: 9px 16px; border-radius: 10px;
	transition: opacity .15s;
}
.sn-btn-cta:hover, .sn-nav__cta:hover { opacity: .88; }

/* ---------- Main wrapper ---------- */
.sn-site-main { display: block; }

/* ---------- Primary buttons ---------- */
.sn-btn-primary {
	display: inline-flex; align-items: center; justify-content: center; gap: 9px;
	background: #7DD3D8; color: #08292B;
	font-weight: 700; font-size: 16px;
	padding: 14px 24px; border-radius: 12px;
	transition: background .18s, transform .18s, box-shadow .18s;
	box-shadow: 0 10px 24px -10px rgba(125, 211, 216, .95);
}
.sn-btn-primary:hover { background: #6BCBD0; transform: translateY(-1px); }
.sn-btn-ghost {
	display: inline-flex; align-items: center; gap: 8px;
	background: #F0F5F5; color: #0E1C1E;
	font-weight: 700; font-size: 15px;
	padding: 14px 20px; border-radius: 12px;
	transition: background .15s;
}
.sn-btn-ghost:hover { background: #E5EDED; }

/* ---------- Spinners & rings ---------- */
.sn-spinner {
	width: 13px; height: 13px;
	border: 2px solid rgba(31, 123, 129, .3);
	border-top-color: #1F7B81;
	border-radius: 50%;
	display: inline-block;
	animation: sn-spin .7s linear infinite;
}
.sn-spinner--sm { width: 13px; height: 13px; }
.sn-ring__progress {
	transform-origin: center;
	transform: rotate(-90deg);
	animation: sn-ring-sm 2.2s ease-in-out infinite;
}
.sn-ring--lg .sn-ring__progress {
	animation: sn-ring 2.4s ease-in-out infinite;
}

/* ---------- HERO ---------- */
.sn-hero {
	position: relative;
	background: radial-gradient(900px 460px at 50% -10%, rgba(125, 211, 216, .30), transparent 68%);
	padding: clamp(56px, 9vw, 108px) clamp(20px, 5vw, 40px) clamp(36px, 6vw, 60px);
	overflow: hidden;
}
.sn-hero__blur {
	position: absolute; pointer-events: none;
	border-radius: 50%; filter: blur(60px);
	background: rgba(125, 211, 216, .22);
}
.sn-hero__blur--a { top: -40px; left: -60px; width: 240px; height: 240px; animation: sn-float 9s ease-in-out infinite; }
.sn-hero__blur--b { top: 60px; right: -70px; width: 200px; height: 200px; background: rgba(125, 211, 216, .18); animation: sn-float 11s ease-in-out infinite reverse; }
.sn-hero__inner {
	max-width: 800px; margin: 0 auto;
	text-align: center; position: relative;
}
.sn-hero__badge {
	display: inline-flex; align-items: center; gap: 8px;
	padding: 7px 15px; border-radius: 999px;
	background: #EAF8F8; border: 1px solid #C7E9EB;
	color: #1F7B81; font-size: 13px; font-weight: 600;
	margin-bottom: 26px;
}
.sn-hero__title {
	font-family: 'Space Grotesk', sans-serif;
	font-weight: 700;
	font-size: clamp(38px, 7vw, 70px);
	line-height: 1.02;
	letter-spacing: -0.03em;
	margin-bottom: 20px;
	text-wrap: balance;
}
.sn-hero__sub {
	font-size: clamp(16px, 2.4vw, 20px);
	line-height: 1.55;
	color: #5E7172;
	max-width: 580px;
	margin: 0 auto 34px;
}

/* ---------- Form ---------- */
.sn-form {
	max-width: 620px; margin: 0 auto;
	background: #fff;
	border: 1px solid #DCE7E7;
	border-radius: 18px;
	padding: 8px;
	box-shadow: 0 18px 50px -16px rgba(14, 28, 30, .16);
	text-align: left;
}
.sn-form__textarea {
	width: 100%; border: none; outline: none; resize: none;
	font-family: inherit; font-size: 16px; line-height: 1.5;
	padding: 14px 14px 4px;
	color: #0E1C1E; background: transparent;
}
.sn-form__row {
	display: flex; align-items: center; justify-content: space-between;
	gap: 10px; padding: 4px 4px 2px;
}
.sn-mic {
	display: inline-flex; align-items: center; gap: 8px;
	font-size: 13.5px; font-weight: 600;
	color: #5E7172;
	padding: 9px 13px; border-radius: 10px;
	background: transparent;
	transition: background .15s, color .15s;
}
.sn-mic:hover { background: #F0F5F5; }
.sn-mic.is-listening { color: #F4607B; }
.sn-mic__idle, .sn-mic__live { display: inline-flex; align-items: center; gap: 8px; }
.sn-mic__dot {
	width: 9px; height: 9px; border-radius: 50%;
	background: #F4607B;
	display: inline-block;
	animation: sn-pulse 1s ease-in-out infinite;
}
.sn-form__submit {
	flex: 0 0 auto;
	display: inline-flex; align-items: center; justify-content: center; gap: 9px;
	background: #7DD3D8; color: #08292B;
	font-weight: 700; font-size: 16px;
	padding: 14px 24px; border-radius: 12px;
	transition: background .18s, transform .18s, box-shadow .18s;
	box-shadow: 0 10px 24px -10px rgba(125, 211, 216, .95);
}
.sn-form__submit:hover { background: #6BCBD0; transform: translateY(-1px); }
.sn-form__submit:disabled { opacity: .65; cursor: not-allowed; transform: none; }

/* ---------- Chips ---------- */
.sn-chips {
	display: flex; flex-wrap: wrap;
	align-items: center; justify-content: center;
	gap: 9px;
	margin-top: 18px;
}
.sn-chips__label {
	font-size: 13px; color: #8A9999; font-weight: 600;
}
.sn-chip {
	font-size: 13px; font-weight: 500;
	color: #1F7B81;
	background: #EAF8F8;
	border: 1px solid #D5EEEF;
	padding: 7px 13px; border-radius: 999px;
	transition: background .15s, border-color .15s;
}
.sn-chip:hover { background: #DCF3F4; border-color: #B6E2E4; }

/* ---------- Errors ---------- */
.sn-error {
	margin-top: 18px;
	display: inline-block;
	background: #FEF2F2; border: 1px solid #FEC5C5;
	color: #B91C1C;
	font-size: 14px; font-weight: 500;
	padding: 10px 16px; border-radius: 10px;
}
.sn-error--inline {
	display: block; margin-top: 0;
	font-size: 13.5px; padding: 9px 13px;
}

/* ---------- Teaser / skeletons ---------- */
.sn-teaser {
	max-width: 720px; margin: 0 auto;
	padding: 8px clamp(20px, 5vw, 40px) 24px;
}
.sn-teaser__header {
	display: flex; align-items: baseline;
	justify-content: space-between; flex-wrap: wrap;
	gap: 8px; margin-bottom: 20px;
}
.sn-teaser__heading {
	font-family: 'Space Grotesk', sans-serif;
	font-weight: 700;
	font-size: clamp(24px, 4vw, 32px);
	letter-spacing: -0.02em;
}
.sn-teaser__status {
	display: inline-flex; align-items: center; gap: 7px;
	font-size: 13px; color: #1F7B81; font-weight: 600;
}
.sn-teaser__status--locked { gap: 6px; }
.sn-skeletons {
	position: relative;
	display: flex; flex-direction: column; gap: 16px;
	filter: blur(5px); opacity: .85;
	pointer-events: none; user-select: none;
}
.sn-skeleton-card {
	border: 1px solid #EBF1F1; border-radius: 18px;
	padding: 24px; background: #fff;
}
.sn-skeleton {
	border-radius: 7px;
	background: linear-gradient(90deg, #F3F8F8 0px, #E9F1F1 200px, #F3F8F8 400px);
	background-size: 800px 100%;
	animation: sn-shimmer 1.4s linear infinite;
}
.sn-skeleton--title {
	height: 30px; width: 46%;
	border-radius: 9px;
	background: linear-gradient(90deg, #F0F6F6 0px, #E4EEEE 200px, #F0F6F6 400px);
	background-size: 800px 100%;
}
.sn-skeleton--line { height: 14px; margin-top: 10px; }
.sn-skeleton--line:first-of-type { margin-top: 16px; }
.sn-skeleton--w62 { width: 62%; }
.sn-skeleton--w38 { width: 38%; }
.sn-skeleton--block {
	height: 44px; border-radius: 12px; margin-top: 18px;
	background: linear-gradient(90deg, #F6FBFB 0px, #ECF4F4 200px, #F6FBFB 400px);
	background-size: 800px 100%;
}

/* ---------- Results ---------- */
.sn-results {
	max-width: 720px; margin: 0 auto;
	padding: 8px clamp(20px, 5vw, 40px) 24px;
}
.sn-results__header {
	display: flex; align-items: baseline;
	justify-content: space-between; flex-wrap: wrap;
	gap: 8px; margin-bottom: 20px;
}
.sn-results__heading {
	font-family: 'Space Grotesk', sans-serif;
	font-weight: 700;
	font-size: clamp(24px, 4vw, 32px);
	letter-spacing: -0.02em;
}
.sn-results__hint {
	font-size: 14px; color: #8A9999; font-weight: 500;
}
.sn-results__list {
	display: flex; flex-direction: column; gap: 16px;
}

/* Result card */
.sn-result-card {
	position: relative; cursor: pointer;
	border: 1px solid #E6EDED;
	border-radius: 18px;
	padding: clamp(20px, 3vw, 28px);
	background: #fff;
	transition: transform .18s, border-color .18s, box-shadow .18s;
	animation: sn-fadeUp .5s ease both;
}
.sn-result-card:hover {
	transform: translateY(-3px);
	border-color: #7DD3D8;
	box-shadow: 0 20px 44px -22px rgba(125, 211, 216, .7);
}
.sn-result-card.is-picked {
	border-color: #7DD3D8;
	box-shadow: 0 20px 44px -22px rgba(125, 211, 216, .7);
}
.sn-result-card__controls {
	position: absolute; top: 18px; right: 18px;
	display: flex; align-items: center; gap: 10px;
}
.sn-fit {
	background: #EAF8F8; color: #1F7B81;
	font-size: 12px; font-weight: 700;
	padding: 5px 10px; border-radius: 999px;
	letter-spacing: .01em;
}
.sn-heart {
	width: 38px; height: 38px; border-radius: 11px;
	border: 1px solid #E6EDED;
	display: inline-flex; align-items: center; justify-content: center;
	background: #fff;
	transition: background .15s, border-color .15s;
}
.sn-heart:hover { background: #FFF1F4; border-color: #FBC7D2; }
.sn-result-card__name {
	font-family: 'Space Grotesk', sans-serif;
	font-weight: 700;
	font-size: clamp(26px, 4.5vw, 36px);
	letter-spacing: -0.025em;
	line-height: 1.05;
	padding-right: 120px;
}
.sn-result-card__meta {
	display: flex; align-items: center; flex-wrap: wrap;
	gap: 10px; margin-top: 10px;
}
.sn-result-card__pronunciation { font-size: 14px; color: #5E7172; letter-spacing: .01em; }
.sn-result-card__syll { font-size: 14px; color: #5E7172; }
.sn-result-card__meta-dot {
	width: 3px; height: 3px; border-radius: 50%;
	background: #C2CFCF; display: inline-block;
}
.sn-result-card__type {
	font-size: 11px; font-weight: 700;
	text-transform: uppercase; letter-spacing: .06em;
	color: #1F7B81; background: #EAF8F8;
	border: 1px solid #C7E9EB;
	padding: 3px 9px; border-radius: 6px;
}
.sn-result-card__tagline {
	font-style: italic; font-size: 16px;
	color: #0E1C1E; margin-top: 14px; font-weight: 500;
}
.sn-result-card__rationale {
	font-size: 14.5px; line-height: 1.6;
	color: #5E7172; margin-top: 8px;
}
.sn-result-card__tags {
	display: flex; flex-wrap: wrap; gap: 7px;
	margin-top: 16px;
}
.sn-result-card__tag {
	font-size: 12.5px; font-weight: 500;
	color: #42595A; background: #F0F5F5;
	padding: 5px 11px; border-radius: 999px;
}
.sn-result-card__domain {
	margin-top: 18px;
	display: flex; align-items: center; justify-content: space-between;
	flex-wrap: wrap; gap: 10px;
	background: #F6FBFB; border: 1px solid #E6EDED;
	border-radius: 12px; padding: 12px 14px;
}
.sn-result-card__domain-name {
	display: flex; align-items: center; gap: 9px;
	font-size: 14px; font-weight: 600; color: #0E1C1E;
}
.sn-result-card__domain-status--available {
	display: inline-flex; align-items: center; gap: 6px;
	font-size: 12.5px; font-weight: 700; color: #15803D;
	background: #EAF7EE;
	padding: 5px 11px; border-radius: 999px;
}
.sn-result-card__domain-status--taken {
	font-size: 12.5px; font-weight: 700; color: #9FB0B0;
	background: #F0F5F5;
	padding: 5px 11px; border-radius: 999px;
}

/* ---------- Features ---------- */
.sn-features {
	max-width: 1080px; margin: 0 auto;
	padding: clamp(56px, 8vw, 96px) clamp(20px, 5vw, 40px) clamp(20px, 4vw, 40px);
}
.sn-features__header { text-align: center; max-width: 580px; margin: 0 auto clamp(36px, 5vw, 52px); }
.sn-features__heading {
	font-family: 'Space Grotesk', sans-serif;
	font-weight: 700;
	font-size: clamp(28px, 4.5vw, 40px);
	letter-spacing: -0.025em;
	margin-bottom: 14px;
}
.sn-features__sub { font-size: 17px; line-height: 1.55; color: #5E7172; }
.sn-features__grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
	gap: 18px;
}
.sn-feature-card {
	border: 1px solid #E6EDED;
	border-radius: 18px;
	padding: 28px; background: #fff;
	transition: border-color .18s, transform .18s;
}
.sn-feature-card:hover { border-color: #C7E9EB; transform: translateY(-3px); }
.sn-feature-card__icon {
	width: 48px; height: 48px; border-radius: 14px;
	background: #EAF8F8; color: #1F7B81;
	display: inline-flex; align-items: center; justify-content: center;
	margin-bottom: 18px;
}
.sn-feature-card__title {
	font-family: 'Space Grotesk', sans-serif;
	font-weight: 600; font-size: 19px;
	letter-spacing: -0.01em;
	margin-bottom: 8px;
}
.sn-feature-card__body { font-size: 14.5px; line-height: 1.6; color: #5E7172; }

/* ---------- How it works ---------- */
.sn-how {
	max-width: 1080px; margin: 0 auto;
	padding: clamp(36px, 5vw, 56px) clamp(20px, 5vw, 40px);
}
.sn-how__heading {
	font-family: 'Space Grotesk', sans-serif;
	font-weight: 700;
	font-size: clamp(24px, 4vw, 32px);
	letter-spacing: -0.02em;
	text-align: center;
	margin-bottom: clamp(32px, 5vw, 48px);
}
.sn-how__grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
	gap: 20px;
}
.sn-how__icon {
	display: inline-flex; align-items: center; justify-content: center;
	width: 44px; height: 44px; border-radius: 13px;
	border: 1.5px solid #C7E9EB;
	color: #1F7B81;
	margin-bottom: 16px;
}
.sn-how__title {
	font-family: 'Space Grotesk', sans-serif;
	font-weight: 600; font-size: 18px;
	letter-spacing: -0.01em;
	margin-bottom: 7px;
}
.sn-how__num { color: #7DD3D8; margin-right: 6px; }
.sn-how__body { font-size: 14.5px; line-height: 1.6; color: #5E7172; }

/* ---------- Final CTA ---------- */
.sn-final-cta {
	max-width: 1080px;
	margin: clamp(40px, 6vw, 72px) auto clamp(56px, 8vw, 96px);
	padding: 0 clamp(20px, 5vw, 40px);
}
.sn-final-cta__card {
	position: relative; overflow: hidden;
	background: #0E1C1E;
	border-radius: 26px;
	padding: clamp(44px, 6vw, 72px) clamp(28px, 5vw, 56px);
	text-align: center;
}
.sn-final-cta__bg {
	position: absolute; inset: 0;
	background: radial-gradient(620px 300px at 50% 0%, rgba(125, 211, 216, .34), transparent 70%);
}
.sn-final-cta__blur {
	position: absolute; bottom: -60px; right: -40px;
	width: 220px; height: 220px; border-radius: 50%;
	background: rgba(125, 211, 216, .18);
	filter: blur(70px);
}
.sn-final-cta__inner { position: relative; }
.sn-final-cta__title {
	font-family: 'Space Grotesk', sans-serif;
	font-weight: 700;
	font-size: clamp(28px, 4.5vw, 44px);
	letter-spacing: -0.025em;
	color: #fff;
	margin-bottom: 16px;
	text-wrap: balance;
}
.sn-final-cta__sub {
	font-size: 17px; line-height: 1.55;
	color: #AFC2C2;
	max-width: 500px;
	margin: 0 auto 30px;
}
.sn-final-cta__btn { padding: 15px 30px; }
.sn-final-cta__btn:hover { background: #8FDADE; }

/* ---------- Shortlist bar ---------- */
.sn-shortlist-bar {
	position: fixed; left: 0; right: 0; bottom: 0;
	z-index: 50;
	background: #fff;
	border-top: 1px solid #E6EDED;
	box-shadow: 0 -10px 30px -12px rgba(14, 28, 30, .16);
	animation: sn-barUp .35s cubic-bezier(.2, .8, .2, 1) both;
}
.sn-shortlist-bar__inner {
	max-width: 1080px; margin: 0 auto;
	padding: 14px clamp(20px, 5vw, 40px);
	display: flex; align-items: center; justify-content: space-between;
	flex-wrap: wrap; gap: 14px;
}
.sn-shortlist-bar__info {
	display: flex; align-items: center; gap: 14px;
	min-width: 0;
}
.sn-shortlist-bar__check {
	flex: 0 0 auto;
	width: 36px; height: 36px; border-radius: 50%;
	background: #EAF7EE;
	display: inline-flex; align-items: center; justify-content: center;
}
.sn-shortlist-bar__text { min-width: 0; }
.sn-shortlist-bar__label {
	font-size: 12px; color: #8A9999;
	font-weight: 600; letter-spacing: .01em;
}
.sn-shortlist-bar__title {
	font-size: 15px; font-weight: 700; color: #0E1C1E;
	font-family: 'Space Grotesk', sans-serif;
	white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.sn-shortlist-bar__domain {
	color: #8A9999; font-weight: 500;
	font-family: 'Plus Jakarta Sans', sans-serif;
}
.sn-shortlist-bar__cta {
	flex: 0 0 auto;
	font-size: 15px; padding: 13px 22px; border-radius: 11px;
}
.sn-shortlist-bar__cta:hover { background: #6BCBD0; }

/* ---------- Modals ---------- */
.sn-modal {
	position: fixed; inset: 0; z-index: 60;
	display: flex; align-items: center; justify-content: center;
	padding: 20px;
}
.sn-modal__backdrop {
	position: absolute; inset: 0;
	background: rgba(14, 28, 30, .55);
	backdrop-filter: blur(4px);
	-webkit-backdrop-filter: blur(4px);
}
.sn-modal__inner {
	position: relative;
	width: 100%; max-width: 440px;
	background: #fff;
	border-radius: 24px;
	padding: clamp(28px, 4vw, 38px);
	box-shadow: 0 40px 90px -30px rgba(14, 28, 30, .55);
	animation: sn-rise .35s ease both;
	max-height: 92vh; overflow: auto;
}
.sn-modal__inner--upgrade { max-width: 480px; padding: clamp(28px, 4vw, 40px); }
.sn-modal__close {
	position: absolute; top: 16px; right: 16px;
	width: 34px; height: 34px; border-radius: 10px;
	display: inline-flex; align-items: center; justify-content: center;
	color: #8A9999;
	transition: background .15s;
	background: transparent;
}
.sn-modal__close:hover { background: #F0F5F5; }

/* Gate */
.sn-gate__badge {
	display: inline-flex; align-items: center; gap: 8px;
	font-size: 13px; font-weight: 600;
	color: #1F7B81;
	background: #EAF8F8; border: 1px solid #C7E9EB;
	padding: 6px 12px; border-radius: 999px;
	margin-bottom: 18px;
}
.sn-gate__badge .sn-spinner {
	width: 14px; height: 14px;
	border-color: rgba(31, 123, 129, .3);
	border-top-color: #1F7B81;
}
.sn-gate__title {
	font-family: 'Space Grotesk', sans-serif;
	font-weight: 700;
	font-size: clamp(24px, 4vw, 30px);
	letter-spacing: -0.025em;
	line-height: 1.12;
	margin-bottom: 10px;
}
.sn-gate__sub {
	font-size: 15px; line-height: 1.55;
	color: #5E7172;
	margin-bottom: 22px;
}
.sn-gate__form { display: flex; flex-direction: column; gap: 12px; }
.sn-input {
	width: 100%;
	border: 1px solid #DCE7E7;
	border-radius: 12px;
	outline: none;
	font-size: 15px;
	padding: 14px 15px;
	color: #0E1C1E;
	background: #fff;
	transition: border-color .15s;
}
.sn-input:focus { border-color: #7DD3D8; }
.sn-gate__submit {
	width: 100%; padding: 15px 24px; border-radius: 13px;
	margin-top: 4px;
}
.sn-gate__submit:hover { background: #6BCBD0; }
.sn-gate__legal {
	font-size: 12px; color: #9FB0B0;
	text-align: center; margin-top: 14px; line-height: 1.5;
}

/* Finalizing */
.sn-finalizing { text-align: center; padding: 14px 4px; }
.sn-ring { margin-bottom: 22px; display: block; margin-left: auto; margin-right: auto; }
.sn-finalizing__title {
	font-family: 'Space Grotesk', sans-serif;
	font-weight: 700;
	font-size: clamp(22px, 3.5vw, 28px);
	letter-spacing: -0.02em;
	margin-bottom: 10px;
}
.sn-finalizing__msg { font-size: 15px; line-height: 1.5; color: #5E7172; }

/* Upgrade modal */
.sn-upgrade__badge {
	display: inline-flex; align-items: center; gap: 7px;
	padding: 6px 13px; border-radius: 999px;
	background: #EAF8F8; border: 1px solid #C7E9EB;
	color: #1F7B81;
	font-size: 12px; font-weight: 700;
	text-transform: uppercase; letter-spacing: .08em;
	margin-bottom: 18px;
}
.sn-upgrade__title {
	font-family: 'Space Grotesk', sans-serif;
	font-weight: 700;
	font-size: clamp(26px, 4vw, 32px);
	letter-spacing: -0.025em;
	line-height: 1.1;
	margin-bottom: 10px;
}
.sn-upgrade__sub {
	font-size: 15.5px; line-height: 1.55;
	color: #5E7172;
	margin-bottom: 24px;
}
.sn-upgrade__features {
	display: flex; flex-direction: column;
	gap: 13px; margin-bottom: 24px;
}
.sn-upgrade__feature {
	display: flex; align-items: flex-start; gap: 11px;
	font-size: 14.5px; line-height: 1.5;
	color: #0E1C1E; font-weight: 500;
}
.sn-upgrade__check {
	flex: 0 0 auto;
	width: 22px; height: 22px; border-radius: 7px;
	background: #EAF8F8;
	display: inline-flex; align-items: center; justify-content: center;
	margin-top: 1px;
}
.sn-upgrade__price {
	display: flex; align-items: baseline; gap: 8px;
	padding-top: 20px;
	border-top: 1px solid #EBF1F1;
	margin-bottom: 6px;
}
.sn-upgrade__amount {
	font-family: 'Space Grotesk', sans-serif;
	font-weight: 700;
	font-size: 38px;
	letter-spacing: -0.02em;
	color: #0E1C1E;
}
.sn-upgrade__period { font-size: 15px; color: #5E7172; font-weight: 500; }
.sn-upgrade__cancel { margin-left: auto; font-size: 13px; color: #8A9999; font-weight: 500; }
.sn-upgrade__compare {
	font-size: 13px; color: #8A9999;
	margin-bottom: 18px; line-height: 1.5;
}
.sn-upgrade__compare strong { color: #0E1C1E; font-weight: 700; }
.sn-upgrade__cta {
	width: 100%; padding: 16px 24px; border-radius: 13px;
}
.sn-upgrade__cta:hover { background: #6BCBD0; }
.sn-upgrade__keep {
	width: 100%; text-align: center;
	font-weight: 600; font-size: 14px;
	color: #8A9999; background: transparent;
	padding: 14px 0 2px;
}

/* ---------- BRAND VIEW ---------- */
.sn-brand {
	position: relative;
	min-height: 100vh;
	background: #fff;
}
.sn-brand__loading {
	min-height: 100vh;
	display: flex; flex-direction: column;
	align-items: center; justify-content: center;
	padding: 40px; text-align: center;
	background: radial-gradient(700px 500px at 50% 35%, rgba(125, 211, 216, .16), transparent 70%);
}
.sn-brand__loading-title {
	font-family: 'Space Grotesk', sans-serif;
	font-weight: 700;
	font-size: clamp(24px, 4vw, 32px);
	letter-spacing: -0.02em;
	margin-bottom: 10px;
	margin-top: 28px;
}
.sn-brand__loading-sub {
	font-size: 16px; color: #5E7172;
	margin-bottom: 28px;
}
.sn-brand__loading-sub strong { color: #0E1C1E; }
.sn-brand__loading-status {
	display: flex; flex-direction: column; gap: 10px;
	font-size: 14px; color: #5E7172; font-weight: 500;
}
.sn-brand__status-item { animation: sn-status 2.6s ease both; }

.sn-brand__ready {
	max-width: 980px; margin: 0 auto;
	padding: clamp(28px, 5vw, 56px) clamp(20px, 5vw, 40px) 96px;
}
.sn-brand__top {
	display: flex; align-items: center; justify-content: space-between;
	flex-wrap: wrap; gap: 14px;
	margin-bottom: clamp(28px, 4vw, 44px);
	animation: sn-rise .5s ease both;
}
.sn-brand__back {
	display: inline-flex; align-items: center; gap: 7px;
	font-size: 14px; font-weight: 600; color: #5E7172;
	background: transparent;
	transition: color .15s;
}
.sn-brand__back:hover { color: #1F7B81; }
.sn-brand__secured {
	display: inline-flex; align-items: center; gap: 7px;
	font-size: 13px; font-weight: 700; color: #15803D;
	background: #EAF7EE;
	padding: 7px 14px; border-radius: 999px;
}
.sn-brand__hero { text-align: center; margin-bottom: clamp(36px, 5vw, 56px); animation: sn-rise .5s ease both; animation-delay: .05s; }
.sn-brand__eyebrow {
	display: inline-flex; align-items: center; gap: 7px;
	font-size: 13px; font-weight: 700;
	text-transform: uppercase; letter-spacing: .12em;
	color: #1F7B81; margin-bottom: 14px;
}
.sn-brand__name {
	font-family: 'Space Grotesk', sans-serif;
	font-weight: 700;
	font-size: clamp(40px, 8vw, 72px);
	letter-spacing: -0.03em;
	line-height: 1;
}
.sn-brand__tagline {
	font-style: italic; font-size: 18px; color: #5E7172;
	margin-top: 14px;
}
.sn-brand__preview-banner {
	display: flex; align-items: center; justify-content: space-between;
	flex-wrap: wrap; gap: 12px;
	background: #EAF8F8;
	border: 1px solid #C7E9EB;
	border-radius: 14px;
	padding: 13px 14px 13px 18px;
	margin-bottom: clamp(24px, 3vw, 34px);
	animation: sn-rise .5s ease both; animation-delay: .08s;
}
.sn-brand__preview-text {
	display: flex; align-items: center; gap: 11px;
	min-width: 0; flex: 1 1 280px;
	font-size: 13.5px; color: #1F6469;
	font-weight: 500; line-height: 1.45;
}
.sn-brand__preview-text strong { font-weight: 700; color: #0E4D52; }
.sn-brand__preview-cta {
	flex: 0 0 auto;
	display: inline-flex; align-items: center; gap: 6px;
	background: #7DD3D8; color: #08292B;
	font-weight: 700; font-size: 13.5px;
	padding: 9px 16px; border-radius: 10px;
	transition: background .15s;
	border: none;
}
.sn-brand__preview-cta:hover { background: #6BCBD0; }

.sn-brand-section { animation: sn-rise .5s ease both; margin-bottom: clamp(20px, 3vw, 28px); }
.sn-brand-section__head {
	display: flex; align-items: center; justify-content: space-between;
	gap: 10px; margin-bottom: 14px;
}
.sn-brand-section__title {
	display: flex; align-items: center; gap: 8px;
	font-size: 13px; font-weight: 700;
	text-transform: uppercase; letter-spacing: .08em;
	color: #8A9999;
}
.sn-brand-section__meta { font-size: 12.5px; color: #8A9999; font-weight: 500; }
.sn-brand-pro-badge {
	display: inline-flex; align-items: center; gap: 5px;
	font-size: 11px; font-weight: 700; color: #1F7B81;
}

/* Logo lockups */
.sn-brand__logos {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
	gap: 16px;
}
.sn-logo-tile {
	border: 1px solid #E6EDED;
	border-radius: 18px;
	padding: 32px 24px;
	display: flex; flex-direction: column;
	align-items: center; justify-content: center;
	gap: 16px; min-height: 180px;
	background: #fff;
}
.sn-logo-tile__mono {
	width: 62px; height: 62px; border-radius: 16px;
	display: flex; align-items: center; justify-content: center;
	font-weight: 700; font-size: 30px;
}
.sn-logo-tile__name { font-weight: 700; font-size: 22px; letter-spacing: -0.02em; }
.sn-logo-tile--locked {
	position: relative;
	border: 1px solid #E6EDED; border-radius: 18px;
	min-height: 180px; background: #fff;
	overflow: hidden; cursor: pointer;
}
.sn-logo-tile--locked__bg {
	position: absolute; inset: 0;
	display: flex; align-items: center; justify-content: center;
	gap: 13px; filter: blur(5px);
}
.sn-logo-tile--locked__bg-dot {
	width: 30px; height: 30px; border-radius: 50%;
	flex: 0 0 auto;
}
.sn-logo-tile--locked__bg-name {
	font-weight: 700; font-size: 26px; letter-spacing: -0.025em;
}
.sn-logo-tile__overlay {
	position: absolute; inset: 0;
	display: flex; flex-direction: column;
	align-items: center; justify-content: center;
	gap: 9px;
}
.sn-logo-tile__overlay--light { background: rgba(255, 255, 255, .55); color: #0E1C1E; }
.sn-logo-tile__overlay--dark  { background: rgba(14, 28, 30, .45); color: #fff; }
.sn-logo-tile__lock {
	width: 38px; height: 38px; border-radius: 50%;
	display: inline-flex; align-items: center; justify-content: center;
}
.sn-logo-tile__overlay--light .sn-logo-tile__lock { background: #0E1C1E; color: #fff; }
.sn-logo-tile__overlay--dark  .sn-logo-tile__lock { background: #fff; color: #0E1C1E; }
.sn-logo-tile__lock-label { font-size: 13px; font-weight: 700; }
.sn-logo-tile--inv { position: relative; border-radius: 18px; min-height: 180px; overflow: hidden; cursor: pointer; }
.sn-brand__logos-note { font-size: 13px; color: #8A9999; margin-top: 12px; }

/* Domains */
.sn-brand__domains-card {
	border: 1px solid #E6EDED; border-radius: 18px;
	padding: 24px;
}
.sn-brand__domains-row {
	display: flex; align-items: center; justify-content: space-between;
	gap: 12px;
	background: #fff;
	border: 1px solid #E6EDED;
	border-radius: 12px;
	padding: 13px 15px;
}
.sn-brand__domains-row.is-recommended { border-color: #7DD3D8; background: #F6FCFC; }
.sn-brand__domain-name {
	font-size: 15px; font-weight: 700;
	color: #0E1C1E; font-family: 'Space Grotesk', sans-serif;
	white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.sn-brand__domain-tag {
	font-size: 11px; font-weight: 700; color: #1F7B81;
	background: #EAF8F8; border: 1px solid #C7E9EB;
	padding: 2px 8px; border-radius: 6px; white-space: nowrap;
}
.sn-brand__domain-price { font-size: 14px; font-weight: 700; color: #0E1C1E; }
.sn-brand__domain-price-unit { font-size: 12px; color: #8A9999; font-weight: 500; }
.sn-brand__domain-avail {
	display: inline-flex; align-items: center; gap: 5px;
	font-size: 12.5px; font-weight: 700; color: #15803D;
}
.sn-brand__domain-avail-dot {
	width: 6px; height: 6px; border-radius: 50%;
	background: #22C55E; display: inline-block;
}
.sn-brand__domain-taken {
	font-size: 12.5px; font-weight: 700; color: #9FB0B0;
	background: #F0F5F5;
	padding: 4px 10px; border-radius: 999px;
}
.sn-brand__domains-list { display: flex; flex-direction: column; gap: 10px; }
.sn-brand__domains-secure {
	width: 100%;
	display: inline-flex; align-items: center; justify-content: center; gap: 8px;
	margin-top: 14px;
	background: #0E1C1E; color: #fff;
	font-weight: 700; font-size: 14.5px;
	padding: 13px 20px; border-radius: 12px;
	transition: opacity .15s;
	border: none;
}
.sn-brand__domains-secure:hover { opacity: .9; }
.sn-brand__live-badge {
	font-size: 12.5px; color: #15803D; font-weight: 700;
	background: #EAF7EE; padding: 4px 10px; border-radius: 999px;
}

/* Palette + Typography */
.sn-brand__split {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
	gap: 16px;
	margin-bottom: clamp(20px, 3vw, 28px);
}
.sn-brand__panel {
	border: 1px solid #E6EDED; border-radius: 18px;
	padding: 24px;
}
.sn-swatches { display: flex; flex-direction: column; gap: 10px; }
.sn-swatch { display: flex; align-items: center; gap: 13px; }
.sn-swatch__chip {
	width: 42px; height: 42px; border-radius: 10px;
	flex: 0 0 auto;
	border: 1px solid rgba(14, 28, 30, .06);
}
.sn-swatch__name { font-size: 14px; font-weight: 600; color: #0E1C1E; }
.sn-swatch__hex {
	font-size: 12.5px; color: #8A9999;
	font-family: ui-monospace, monospace; letter-spacing: .02em;
}
.sn-locked-panel {
	margin-top: 14px;
	border-top: 1px dashed #E6EDED;
	padding-top: 14px;
	cursor: pointer;
}
.sn-locked-panel__head {
	display: flex; align-items: center; justify-content: space-between;
	gap: 8px; margin-bottom: 10px;
}
.sn-locked-panel__title { font-size: 12px; font-weight: 700; color: #0E1C1E; }
.sn-locked-panel__strip {
	display: flex; gap: 8px;
	filter: blur(3px);
}
.sn-locked-panel__strip span {
	flex: 1; height: 30px; border-radius: 8px;
}
.sn-locked-panel__caption {
	font-size: 12px; color: #8A9999;
	margin-top: 8px; line-height: 1.5;
}
.sn-type-block { margin-bottom: 20px; }
.sn-type-block__label { font-size: 12px; color: #8A9999; margin-bottom: 6px; font-weight: 500; }
.sn-type-heading { font-weight: 700; font-size: 30px; line-height: 1.1; letter-spacing: -0.02em; }
.sn-type-body { font-size: 15px; line-height: 1.6; color: #5E7172; }
.sn-locked-type {
	border-top: 1px dashed #E6EDED;
	padding-top: 14px; cursor: pointer;
}
.sn-locked-type__head {
	display: flex; align-items: center; justify-content: space-between;
	gap: 8px; margin-bottom: 8px;
}
.sn-locked-type__bars { filter: blur(3px); }
.sn-locked-type__bar1 { height: 22px; width: 80%; border-radius: 6px; background: #EEF3F3; margin-bottom: 8px; }
.sn-locked-type__bar2 { height: 13px; width: 95%; border-radius: 5px; background: #F3F8F8; margin-bottom: 5px; }
.sn-locked-type__bar3 { height: 13px; width: 88%; border-radius: 5px; background: #F3F8F8; }
.sn-locked-type__caption {
	font-size: 12px; color: #8A9999; margin-top: 8px; line-height: 1.5;
}

/* Voice */
.sn-brand__voice-tags { display: flex; flex-wrap: wrap; gap: 9px; margin-bottom: 14px; }
.sn-brand__voice-tag {
	font-size: 14px; font-weight: 600;
	padding: 7px 15px; border-radius: 999px;
}
.sn-brand__voice-line { font-size: 15.5px; line-height: 1.6; color: #5E7172; }

/* Website mockup */
.sn-brand__mock {
	position: relative;
	border: 1px solid #E6EDED;
	border-radius: 18px;
	overflow: hidden;
	box-shadow: 0 24px 60px -28px rgba(14, 28, 30, .3);
}
.sn-brand__mock-bar {
	display: flex; align-items: center; gap: 7px;
	padding: 12px 16px;
	background: #F3F8F8;
	border-bottom: 1px solid #E6EDED;
}
.sn-brand__mock-bar span.sn-traffic { width: 11px; height: 11px; border-radius: 50%; display: inline-block; }
.sn-brand__mock-bar .sn-traffic--r { background: #FF5F57; }
.sn-brand__mock-bar .sn-traffic--y { background: #FEBC2E; }
.sn-brand__mock-bar .sn-traffic--g { background: #28C840; }
.sn-brand__mock-url {
	margin-left: 12px; font-size: 12px; color: #8A9999;
	font-family: ui-monospace, monospace;
}
.sn-brand__mock-hero {
	padding: clamp(36px, 6vw, 64px) clamp(24px, 5vw, 56px);
	text-align: center;
}
.sn-brand__mock-logo {
	display: inline-flex; align-items: center; gap: 9px;
	margin-bottom: 26px;
}
.sn-brand__mock-mono {
	width: 24px; height: 24px; border-radius: 7px;
	display: inline-flex; align-items: center; justify-content: center;
	font-weight: 700; font-size: 13px;
}
.sn-brand__mock-name { font-weight: 700; font-size: 18px; letter-spacing: -0.02em; }
.sn-brand__mock-h {
	font-weight: 700;
	font-size: clamp(26px, 4.5vw, 42px);
	letter-spacing: -0.025em;
	line-height: 1.08;
	max-width: 560px;
	margin: 0 auto 16px;
}
.sn-brand__mock-p {
	font-size: 16px; line-height: 1.55;
	max-width: 420px; margin: 0 auto 28px;
}
.sn-brand__mock-btn {
	display: inline-block;
	font-weight: 600; font-size: 15px;
	padding: 13px 28px; border-radius: 11px;
}
.sn-brand__mock-badge {
	position: absolute; top: 46px; right: 14px;
	display: inline-flex; align-items: center; gap: 6px;
	background: rgba(14, 28, 30, .86);
	color: #fff;
	font-size: 12px; font-weight: 700;
	padding: 7px 12px; border-radius: 999px;
	backdrop-filter: blur(4px);
	-webkit-backdrop-filter: blur(4px);
}
.sn-brand__mock-cover {
	position: absolute; left: 0; right: 0; bottom: 0;
	padding: 34px 16px 16px;
	background: linear-gradient(to top, rgba(14, 28, 30, .9), rgba(14, 28, 30, 0));
	display: flex; align-items: center; justify-content: space-between;
	flex-wrap: wrap; gap: 10px; cursor: pointer;
}
.sn-brand__mock-cover-text {
	font-size: 13.5px; color: #fff;
	font-weight: 600; line-height: 1.4;
	max-width: 60%;
}
.sn-brand__mock-cover-btn {
	display: inline-flex; align-items: center; gap: 7px;
	background: #7DD3D8; color: #08292B;
	font-weight: 700; font-size: 13.5px;
	padding: 10px 16px; border-radius: 10px;
}

/* Social skeleton */
.sn-brand__social {
	position: relative;
	border: 1px solid #E6EDED; border-radius: 18px;
	padding: 24px; background: #fff;
	cursor: pointer; overflow: hidden;
}
.sn-brand__social-grid {
	display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
	gap: 14px; filter: blur(3px);
}
.sn-brand__social-card {
	border: 1px solid #EEF3F3;
	border-radius: 14px; overflow: hidden;
}
.sn-brand__social-card-img { height: 120px; }
.sn-brand__social-card-body { padding: 13px; }
.sn-brand__social-line {
	height: 11px; border-radius: 5px;
	margin-bottom: 7px;
}
.sn-brand__social-line--1 { width: 88%; background: #EEF3F3; }
.sn-brand__social-line--2 { width: 64%; background: #F3F8F8; margin-bottom: 12px; }
.sn-brand__social-meta { display: flex; gap: 10px; }
.sn-brand__social-meta span { height: 9px; width: 24px; border-radius: 4px; background: #EEF3F3; }
.sn-brand__social-overlay {
	position: absolute; inset: 0;
	background: rgba(255, 255, 255, .5);
	display: flex; flex-direction: column;
	align-items: center; justify-content: center;
	text-align: center; padding: 20px;
}
.sn-brand__social-overlay-icon {
	width: 44px; height: 44px; border-radius: 50%;
	background: #0E1C1E; color: #fff;
	display: inline-flex; align-items: center; justify-content: center;
	margin-bottom: 12px;
}
.sn-brand__social-overlay-title {
	font-family: 'Space Grotesk', sans-serif;
	font-weight: 700; font-size: 17px;
	color: #0E1C1E; margin-bottom: 5px;
}
.sn-brand__social-overlay-sub {
	font-size: 13.5px; color: #5E7172;
	max-width: 340px; line-height: 1.5;
}

/* What's in Pro */
.sn-brand__pro-section { margin-bottom: clamp(28px, 4vw, 40px); animation: sn-rise .5s ease both; animation-delay: .32s; }
.sn-brand__pro-eyebrow {
	display: inline-flex; align-items: center; gap: 8px;
	font-size: 13px; font-weight: 700;
	text-transform: uppercase; letter-spacing: .08em;
	color: #8A9999; margin-bottom: 6px;
}
.sn-brand__pro-title {
	font-family: 'Space Grotesk', sans-serif;
	font-weight: 700;
	font-size: clamp(22px, 3.5vw, 30px);
	letter-spacing: -0.025em;
	margin-bottom: 8px;
}
.sn-brand__pro-sub {
	font-size: 15.5px; line-height: 1.55;
	color: #5E7172; max-width: 560px;
	margin-bottom: 22px;
}
.sn-brand__pro-sub strong { color: #0E1C1E; }
.sn-brand__pro-grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
	gap: 14px;
}
.sn-pro-card {
	position: relative;
	border: 1px solid #E6EDED; border-radius: 16px;
	padding: 20px; background: #fff;
}
.sn-pro-card__lock {
	position: absolute; top: 16px; right: 16px;
	color: #C2CFCF;
}
.sn-pro-card__icon {
	width: 42px; height: 42px; border-radius: 12px;
	background: #EAF8F8; color: #1F7B81;
	display: inline-flex; align-items: center; justify-content: center;
	margin-bottom: 14px;
}
.sn-pro-card__title {
	font-family: 'Space Grotesk', sans-serif;
	font-weight: 600; font-size: 16px;
	letter-spacing: -0.01em;
	margin-bottom: 6px;
	padding-right: 22px;
}
.sn-pro-card__body { font-size: 13.5px; line-height: 1.55; color: #5E7172; }
.sn-brand__pro-actions {
	display: flex; align-items: center; justify-content: center;
	gap: 14px; flex-wrap: wrap;
	margin-top: 22px;
}
.sn-brand__pro-actions .sn-btn-primary { padding: 14px 26px; }
.sn-brand__pro-actions-note { font-size: 13.5px; color: #8A9999; font-weight: 500; }
.sn-brand__pro-actions-note .sn-strike { text-decoration: line-through; }

/* Social proof */
.sn-brand__social-proof { margin-bottom: clamp(28px, 4vw, 40px); animation: sn-rise .5s ease both; animation-delay: .34s; }
.sn-brand__stats-grid {
	display: grid; grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
	gap: 14px; margin-bottom: 24px;
}
.sn-brand__stat {
	border: 1px solid #E6EDED; border-radius: 16px;
	padding: 20px 18px; text-align: center; background: #fff;
}
.sn-brand__stat-num {
	font-family: 'Space Grotesk', sans-serif;
	font-weight: 700;
	font-size: clamp(24px, 4vw, 30px);
	letter-spacing: -0.02em;
	color: #0E1C1E;
}
.sn-brand__stat-label {
	font-size: 12.5px; color: #5E7172;
	font-weight: 500; margin-top: 4px;
}
.sn-brand__rating-row { text-align: center; margin-bottom: 20px; }
.sn-brand__rating-stars {
	display: inline-flex; align-items: center; gap: 4px;
	margin-bottom: 8px; color: #F5A623;
}
.sn-brand__rating-text { font-size: 14px; color: #5E7172; font-weight: 500; }
.sn-brand__rating-text strong { color: #0E1C1E; }
.sn-brand__testimonials {
	display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
	gap: 14px;
}
.sn-testimonial {
	border: 1px solid #E6EDED; border-radius: 16px;
	padding: 22px; background: #fff;
	display: flex; flex-direction: column; gap: 14px;
}
.sn-testimonial__stars { display: flex; gap: 3px; color: #F5A623; }
.sn-testimonial__quote { font-size: 14.5px; line-height: 1.6; color: #0E1C1E; }
.sn-testimonial__author { display: flex; align-items: center; gap: 10px; margin-top: auto; }
.sn-testimonial__avatar {
	width: 34px; height: 34px; border-radius: 50%;
	background: #EAF8F8; color: #1F7B81;
	display: inline-flex; align-items: center; justify-content: center;
	font-weight: 700; font-size: 14px;
	font-family: 'Space Grotesk', sans-serif;
}
.sn-testimonial__name { font-size: 13.5px; font-weight: 700; color: #0E1C1E; }
.sn-testimonial__role { font-size: 12.5px; color: #8A9999; }

/* Band at the bottom of brand view */
.sn-brand__band {
	border-radius: 24px;
	padding: clamp(36px, 5vw, 56px) clamp(28px, 5vw, 48px);
	text-align: center;
	animation: sn-rise .5s ease both;
	animation-delay: .35s;
}
.sn-brand__band-title {
	font-weight: 700;
	font-size: clamp(26px, 4.5vw, 38px);
	letter-spacing: -0.025em;
	margin-bottom: 12px;
}
.sn-brand__band-sub {
	font-size: 16px; line-height: 1.5;
	margin-bottom: 28px;
	max-width: 480px;
	margin-left: auto; margin-right: auto;
}
.sn-brand__band-actions {
	display: flex; align-items: center; justify-content: center;
	gap: 18px; flex-wrap: wrap;
}
.sn-brand__band-cta {
	font-weight: 600; font-size: 16px;
	padding: 15px 32px; border-radius: 12px;
	border: none; cursor: pointer;
}
.sn-brand__band-back {
	font-weight: 600; font-size: 15px;
	background: transparent;
}
.sn-brand__band-launched-icon {
	display: inline-flex; align-items: center; justify-content: center;
	width: 56px; height: 56px; border-radius: 50%;
	background: rgba(255, 255, 255, .16);
	margin-bottom: 18px;
}

/* ---------- Generic page layouts ---------- */
.sn-pricing__inner,
.sn-faq__inner,
.sn-about__inner,
.sn-page__inner,
.sn-404__inner {
	max-width: 1080px; margin: 0 auto;
	padding: clamp(48px, 7vw, 88px) clamp(20px, 5vw, 40px) clamp(40px, 6vw, 72px);
}
.sn-faq__inner { max-width: 760px; }
.sn-page__inner { max-width: 800px; }
.sn-404__inner { max-width: 640px; text-align: center; position: relative; }

.sn-eyebrow {
	display: inline-flex; align-items: center; gap: 7px;
	font-size: 13px; font-weight: 700;
	text-transform: uppercase; letter-spacing: .1em;
	color: #1F7B81;
	margin-bottom: 14px;
}
.sn-page-title {
	font-family: 'Space Grotesk', sans-serif;
	font-weight: 700;
	font-size: clamp(34px, 6vw, 52px);
	letter-spacing: -0.03em;
	line-height: 1.05;
	margin-bottom: 14px;
	text-wrap: balance;
}
.sn-page-title--lg {
	font-size: clamp(34px, 6vw, 54px);
	line-height: 1.04;
	margin-bottom: 18px;
}
.sn-page-lede {
	font-size: 17px; line-height: 1.55; color: #5E7172;
}
.sn-page-lede--lg { font-size: 18px; line-height: 1.6; }

/* Pricing */
.sn-pricing__intro {
	text-align: center;
	max-width: 620px;
	margin: 0 auto clamp(36px, 5vw, 52px);
}
.sn-pricing__grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
	gap: 18px;
	max-width: 780px; margin: 0 auto;
}
.sn-plan {
	border: 1px solid #E6EDED;
	border-radius: 22px;
	padding: clamp(26px, 3vw, 34px);
	background: #fff;
	display: flex; flex-direction: column;
	position: relative;
}
.sn-plan--pro {
	border: 2px solid #7DD3D8;
	box-shadow: 0 24px 60px -30px rgba(125, 211, 216, .9);
}
.sn-plan__popular {
	position: absolute; top: -13px; left: 50%;
	transform: translateX(-50%);
	background: #7DD3D8; color: #08292B;
	font-size: 12px; font-weight: 700;
	padding: 5px 14px; border-radius: 999px;
	white-space: nowrap;
}
.sn-plan__name {
	font-family: 'Space Grotesk', sans-serif;
	font-weight: 700; font-size: 20px;
	letter-spacing: -0.01em;
	margin-bottom: 6px;
}
.sn-plan__desc { font-size: 14px; color: #5E7172; margin-bottom: 18px; }
.sn-plan__price {
	display: flex; align-items: baseline; gap: 6px;
	margin-bottom: 4px;
}
.sn-plan__amount {
	font-family: 'Space Grotesk', sans-serif;
	font-weight: 700; font-size: 40px;
	letter-spacing: -0.02em;
}
.sn-plan__period { font-size: 15px; color: #8A9999; font-weight: 500; }
.sn-plan__compare {
	font-size: 13px; color: #8A9999; margin-bottom: 22px;
}
.sn-plan__strike { text-decoration: line-through; }
.sn-plan--free .sn-plan__price { margin-bottom: 22px; }
.sn-plan__features {
	display: flex; flex-direction: column; gap: 11px;
	margin-bottom: 24px;
}
.sn-plan__feature {
	display: flex; align-items: flex-start; gap: 10px;
	font-size: 14px; line-height: 1.5;
	color: #0E1C1E;
}
.sn-plan--pro .sn-plan__feature { font-weight: 500; }
.sn-plan__check-free {
	flex: 0 0 auto; color: #1F7B81; margin-top: 1px;
}
.sn-plan__check-pro {
	flex: 0 0 auto;
	width: 20px; height: 20px; border-radius: 6px;
	background: #EAF8F8; color: #1F7B81;
	display: inline-flex; align-items: center; justify-content: center;
	margin-top: 1px;
}
.sn-plan__cta {
	margin-top: auto; width: 100%;
	display: inline-flex; align-items: center; justify-content: center; gap: 8px;
	font-weight: 700; font-size: 15px;
	padding: 14px 20px; border-radius: 12px;
	transition: background .15s;
}
.sn-plan__cta--free { background: #F0F5F5; color: #0E1C1E; }
.sn-plan__cta--free:hover { background: #E5EDED; }
.sn-plan__cta--pro {
	background: #7DD3D8; color: #08292B;
	padding: 15px 20px;
	box-shadow: 0 12px 26px -12px rgba(125, 211, 216, .95);
}
.sn-plan__cta--pro:hover { background: #6BCBD0; }
.sn-pricing__faq-link {
	text-align: center; margin-top: 32px;
	font-size: 14px; color: #8A9999;
}
.sn-pricing__faq-link a {
	color: #1F7B81; font-weight: 700;
}

/* FAQ */
.sn-faq__intro { text-align: center; max-width: 560px; margin: 0 auto clamp(32px, 5vw, 48px); }
.sn-faq__list { display: flex; flex-direction: column; gap: 12px; }
.sn-faq-item {
	border: 1px solid #E6EDED;
	border-radius: 16px;
	padding: 22px 24px;
	background: #fff;
}
.sn-faq-item__q {
	font-family: 'Space Grotesk', sans-serif;
	font-weight: 600; font-size: 17px;
	letter-spacing: -0.01em;
	margin-bottom: 8px;
}
.sn-faq-item__a { font-size: 14.5px; line-height: 1.6; color: #5E7172; }
.sn-faq__cta {
	text-align: center; margin-top: 36px;
	background: #F6FBFB;
	border: 1px solid #E6EDED;
	border-radius: 18px;
	padding: 32px 24px;
}
.sn-faq__cta-title {
	font-family: 'Space Grotesk', sans-serif;
	font-weight: 700; font-size: 22px;
	letter-spacing: -0.02em;
	margin-bottom: 8px;
}
.sn-faq__cta-sub { font-size: 15px; color: #5E7172; margin-bottom: 20px; }
.sn-faq__cta-btn { padding: 14px 26px; }
.sn-faq__cta-btn:hover { background: #6BCBD0; }

/* About */
.sn-about__inner { max-width: 880px; }
.sn-about__intro {
	text-align: center; max-width: 680px;
	margin: 0 auto clamp(36px, 5vw, 52px);
}
.sn-about__stats {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
	gap: 14px;
	margin-bottom: clamp(36px, 5vw, 52px);
}
.sn-stat {
	border: 1px solid #E6EDED;
	border-radius: 16px;
	padding: 22px 18px;
	text-align: center;
	background: #fff;
}
.sn-stat__num {
	font-family: 'Space Grotesk', sans-serif;
	font-weight: 700;
	font-size: clamp(26px, 4vw, 32px);
	letter-spacing: -0.02em;
	color: #0E1C1E;
}
.sn-stat__label { font-size: 13px; color: #5E7172; font-weight: 500; margin-top: 4px; }
.sn-about__values {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
	gap: 16px;
	margin-bottom: clamp(40px, 5vw, 56px);
}
.sn-value {
	border: 1px solid #E6EDED;
	border-radius: 18px;
	padding: 26px;
	background: #fff;
}
.sn-value__icon {
	width: 46px; height: 46px; border-radius: 13px;
	background: #EAF8F8; color: #1F7B81;
	display: inline-flex; align-items: center; justify-content: center;
	margin-bottom: 16px;
}
.sn-value__title {
	font-family: 'Space Grotesk', sans-serif;
	font-weight: 600; font-size: 18px;
	margin-bottom: 8px; letter-spacing: -0.01em;
}
.sn-value__body { font-size: 14.5px; line-height: 1.6; color: #5E7172; }
.sn-about__cta {
	text-align: center;
	background: #0E1C1E;
	border-radius: 24px;
	padding: clamp(40px, 5vw, 60px) clamp(24px, 5vw, 48px);
	position: relative; overflow: hidden;
}
.sn-about__cta-bg {
	position: absolute; inset: 0;
	background: radial-gradient(560px 280px at 50% 0%, rgba(125, 211, 216, .32), transparent 70%);
}
.sn-about__cta-inner { position: relative; }
.sn-about__cta-title {
	font-family: 'Space Grotesk', sans-serif;
	font-weight: 700;
	font-size: clamp(26px, 4.5vw, 40px);
	letter-spacing: -0.025em;
	color: #fff;
	margin-bottom: 14px;
	text-wrap: balance;
}
.sn-about__cta-sub {
	font-size: 16px; line-height: 1.55;
	color: #AFC2C2;
	max-width: 460px;
	margin: 0 auto 28px;
}
.sn-about__cta-btn { padding: 15px 30px; }
.sn-about__cta-btn:hover { background: #8FDADE; }

/* ---------- Generic page content (when editor adds free text) ---------- */
.sn-page-content {
	font-size: 16px; line-height: 1.7; color: #2A3C3D;
	margin-top: 28px;
}
.sn-page-content h2 {
	font-family: 'Space Grotesk', sans-serif;
	font-weight: 700; font-size: 28px;
	letter-spacing: -0.02em;
	margin: 36px 0 14px;
}
.sn-page-content h3 {
	font-family: 'Space Grotesk', sans-serif;
	font-weight: 600; font-size: 20px;
	letter-spacing: -0.015em;
	margin: 28px 0 10px;
}
.sn-page-content p { margin-bottom: 16px; }
.sn-page-content ul, .sn-page-content ol { margin: 0 0 16px 22px; }
.sn-page-content ul { list-style: disc; }
.sn-page-content ol { list-style: decimal; }
.sn-page-content li { margin-bottom: 6px; }
.sn-page-content a { color: #1F7B81; text-decoration: underline; text-underline-offset: 3px; }
.sn-page-content a:hover { color: #0E4D52; }
.sn-page-content blockquote {
	border-left: 3px solid #7DD3D8;
	padding: 4px 16px;
	margin: 20px 0;
	color: #5E7172; font-style: italic;
}
.sn-page-content code {
	background: #F0F5F5; padding: 2px 6px;
	border-radius: 6px; font-family: ui-monospace, monospace;
	font-size: 14px;
}
.sn-page-content pre {
	background: #F6FBFB; border: 1px solid #E6EDED;
	padding: 16px; border-radius: 12px;
	overflow: auto; margin-bottom: 16px;
}
.sn-page-content img { border-radius: 14px; margin: 16px 0; }

/* ---------- Blog ---------- */
.sn-blog__inner {
	max-width: 1080px; margin: 0 auto;
	padding: clamp(48px, 7vw, 88px) clamp(20px, 5vw, 40px) clamp(40px, 6vw, 72px);
}
.sn-blog__header {
	text-align: center;
	max-width: 620px;
	margin: 0 auto clamp(36px, 5vw, 56px);
}
.sn-blog__list {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
	gap: 22px;
}
.sn-post-card {
	border: 1px solid #E6EDED;
	border-radius: 18px;
	background: #fff;
	overflow: hidden;
	transition: border-color .18s, transform .18s, box-shadow .18s;
	display: flex; flex-direction: column;
}
.sn-post-card:hover {
	border-color: #C7E9EB;
	transform: translateY(-3px);
	box-shadow: 0 20px 44px -22px rgba(14, 28, 30, .12);
}
.sn-post-card__thumb {
	display: block; aspect-ratio: 16/9;
	overflow: hidden; background: #F6FBFB;
}
.sn-post-card__thumb img {
	width: 100%; height: 100%;
	object-fit: cover;
	transition: transform .4s;
}
.sn-post-card:hover .sn-post-card__thumb img { transform: scale(1.03); }
.sn-post-card__body { padding: 22px; display: flex; flex-direction: column; gap: 10px; flex: 1; }
.sn-post-card__meta {
	font-size: 12.5px; color: #8A9999; font-weight: 600;
	display: flex; align-items: center; gap: 6px;
	text-transform: uppercase; letter-spacing: .06em;
}
.sn-post-card__cat { color: #1F7B81; }
.sn-post-card__title {
	font-family: 'Space Grotesk', sans-serif;
	font-weight: 700; font-size: 22px;
	letter-spacing: -0.02em;
	line-height: 1.18;
}
.sn-post-card__title a { color: #0E1C1E; transition: color .15s; }
.sn-post-card__title a:hover { color: #1F7B81; }
.sn-post-card__excerpt { font-size: 14.5px; line-height: 1.6; color: #5E7172; }
.sn-post-card__more {
	display: inline-flex; align-items: center; gap: 6px;
	margin-top: auto;
	font-size: 14px; font-weight: 700;
	color: #1F7B81;
	transition: gap .15s;
}
.sn-post-card__more:hover { gap: 10px; }
.sn-blog__empty {
	text-align: center;
	max-width: 480px; margin: 0 auto;
	padding: 60px 20px;
}
.sn-blog__empty-title {
	font-family: 'Space Grotesk', sans-serif;
	font-weight: 700; font-size: 24px;
	letter-spacing: -0.02em;
	margin-bottom: 8px;
}
.sn-blog__empty-sub { font-size: 15px; color: #5E7172; margin-bottom: 24px; }

/* Pagination */
.sn-pagination {
	margin-top: 48px;
	display: flex; justify-content: center;
}
.sn-pagination ul {
	display: flex; gap: 6px; flex-wrap: wrap;
	justify-content: center;
}
.sn-pagination ul li a,
.sn-pagination ul li span {
	display: inline-flex; align-items: center; justify-content: center;
	min-width: 38px; height: 38px;
	padding: 0 12px;
	border-radius: 10px;
	border: 1px solid #E6EDED;
	background: #fff;
	font-size: 14px; font-weight: 600;
	color: #5E7172;
	transition: border-color .15s, color .15s, background .15s;
}
.sn-pagination ul li a:hover { border-color: #7DD3D8; color: #1F7B81; }
.sn-pagination ul li span.current { background: #0E1C1E; color: #fff; border-color: #0E1C1E; }
.sn-pagination ul li span.dots { border: none; background: transparent; }

/* ---------- Single post ---------- */
.sn-single__inner {
	max-width: 760px; margin: 0 auto;
	padding: clamp(48px, 7vw, 88px) clamp(20px, 5vw, 40px) clamp(40px, 6vw, 72px);
}
.sn-article__meta { margin-bottom: 16px; }
.sn-article__back {
	display: inline-flex; align-items: center; gap: 6px;
	font-size: 13px; font-weight: 700;
	color: #5E7172;
	text-transform: uppercase; letter-spacing: .06em;
	transition: color .15s;
}
.sn-article__back:hover { color: #1F7B81; }
.sn-article__title {
	font-family: 'Space Grotesk', sans-serif;
	font-weight: 700;
	font-size: clamp(32px, 5vw, 48px);
	letter-spacing: -0.025em;
	line-height: 1.08;
	margin-bottom: 22px;
	text-wrap: balance;
}
.sn-article__byline {
	display: flex; align-items: center; gap: 12px;
	margin-bottom: 30px;
	padding-bottom: 24px;
	border-bottom: 1px solid #EBF1F1;
}
.sn-article__avatar img {
	width: 36px; height: 36px; border-radius: 50%;
	object-fit: cover;
}
.sn-article__author { font-size: 14px; font-weight: 700; color: #0E1C1E; }
.sn-article__date { font-size: 13px; color: #8A9999; }
.sn-article__hero {
	margin: 0 0 32px;
	border-radius: 18px;
	overflow: hidden;
}
.sn-article__hero img { width: 100%; height: auto; display: block; }
.sn-article__content {
	font-size: 17px; line-height: 1.75; color: #2A3C3D;
}
.sn-article__content > * + * { margin-top: 18px; }
.sn-article__content h2 {
	font-family: 'Space Grotesk', sans-serif;
	font-weight: 700; font-size: 28px;
	letter-spacing: -0.02em;
	margin-top: 36px;
}
.sn-article__content h3 {
	font-family: 'Space Grotesk', sans-serif;
	font-weight: 600; font-size: 22px;
	letter-spacing: -0.015em;
	margin-top: 28px;
}
.sn-article__content p { margin-bottom: 0; }
.sn-article__content a { color: #1F7B81; text-decoration: underline; text-underline-offset: 3px; }
.sn-article__content a:hover { color: #0E4D52; }
.sn-article__content blockquote {
	border-left: 3px solid #7DD3D8;
	padding: 6px 18px;
	color: #5E7172; font-style: italic;
	font-size: 18px;
}
.sn-article__content ul, .sn-article__content ol { margin-left: 22px; }
.sn-article__content ul { list-style: disc; }
.sn-article__content ol { list-style: decimal; }
.sn-article__content li { margin-bottom: 6px; }
.sn-article__content img { border-radius: 14px; }
.sn-article__content code {
	background: #F0F5F5; padding: 2px 6px;
	border-radius: 6px; font-family: ui-monospace, monospace; font-size: 15px;
}
.sn-article__content pre {
	background: #F6FBFB; border: 1px solid #E6EDED;
	padding: 18px; border-radius: 12px;
	overflow: auto;
}
.sn-article__tags {
	display: flex; flex-wrap: wrap; gap: 8px;
	margin-top: 36px;
}
.sn-article__tag {
	font-size: 12.5px; font-weight: 600;
	color: #1F7B81; background: #EAF8F8;
	padding: 5px 11px; border-radius: 999px;
	transition: background .15s;
}
.sn-article__tag:hover { background: #DCF3F4; }
.sn-article__nav {
	margin-top: 48px;
	display: grid; grid-template-columns: 1fr 1fr;
	gap: 14px;
}
.sn-article__nav-next { text-align: right; }
.sn-article__nav a {
	display: block;
	padding: 16px 18px;
	border: 1px solid #E6EDED;
	border-radius: 14px;
	transition: border-color .15s, background .15s;
}
.sn-article__nav a:hover { border-color: #7DD3D8; background: #F6FCFC; }
.sn-article__nav-label {
	display: block;
	font-size: 12px; font-weight: 700;
	color: #8A9999;
	text-transform: uppercase; letter-spacing: .06em;
	margin-bottom: 6px;
}
.sn-article__nav-title {
	display: block;
	font-family: 'Space Grotesk', sans-serif;
	font-weight: 700; font-size: 16px;
	color: #0E1C1E;
	line-height: 1.3;
}

/* Comments */
.sn-comments {
	margin-top: 56px;
	padding-top: 40px;
	border-top: 1px solid #EBF1F1;
}
.sn-comments__title {
	font-family: 'Space Grotesk', sans-serif;
	font-weight: 700; font-size: 22px;
	letter-spacing: -0.02em;
	margin-bottom: 24px;
}
.sn-comments__list { list-style: none; }
.sn-comments__list .children { list-style: none; padding-left: 28px; margin-top: 16px; }
.sn-comment { margin-bottom: 20px; }
.sn-comment__inner {
	background: #F6FBFB;
	border: 1px solid #E6EDED;
	border-radius: 16px;
	padding: 20px;
}
.sn-comment__meta {
	display: flex; align-items: center; gap: 12px;
	margin-bottom: 12px;
}
.sn-comment__avatar { border-radius: 50%; }
.sn-comment__author { font-size: 14.5px; font-weight: 700; color: #0E1C1E; }
.sn-comment__author a { color: inherit; }
.sn-comment__date { font-size: 12.5px; color: #8A9999; }
.sn-comment__body { font-size: 15px; line-height: 1.6; color: #2A3C3D; }
.sn-comment__body p { margin-bottom: 10px; }
.sn-comment__body p:last-child { margin-bottom: 0; }
.sn-comment__actions {
	margin-top: 12px;
	display: flex; gap: 14px;
	font-size: 13px; font-weight: 600;
}
.sn-comment__actions a { color: #1F7B81; }
.sn-comments__closed {
	color: #8A9999; font-size: 14px; margin: 16px 0;
}
.sn-comment-form {
	margin-top: 32px;
	background: #fff;
	border: 1px solid #E6EDED;
	border-radius: 18px;
	padding: 24px;
}
.sn-comment-form__title {
	font-family: 'Space Grotesk', sans-serif;
	font-weight: 700; font-size: 20px;
	letter-spacing: -0.02em;
	margin-bottom: 18px;
}
.sn-comment-form p { margin-bottom: 14px; }
.sn-comment-form label { display: block; font-size: 13px; font-weight: 600; color: #0E1C1E; margin-bottom: 6px; }
.sn-comment-form input[type="text"],
.sn-comment-form input[type="email"],
.sn-comment-form input[type="url"],
.sn-comment-form textarea {
	width: 100%;
	border: 1px solid #DCE7E7;
	border-radius: 12px;
	outline: none;
	font-family: inherit;
	font-size: 15px;
	padding: 12px 14px;
	color: #0E1C1E;
	background: #fff;
	transition: border-color .15s;
}
.sn-comment-form input:focus,
.sn-comment-form textarea:focus { border-color: #7DD3D8; }
.sn-comment-form .sn-btn-primary {
	margin-top: 8px;
	padding: 12px 22px; font-size: 14.5px;
}

/* ---------- 404 ---------- */
.sn-404 { position: relative; overflow: hidden; }
.sn-404__blur {
	position: absolute; top: -100px; left: 50%; transform: translateX(-50%);
	width: 380px; height: 380px;
	background: radial-gradient(closest-side, rgba(125, 211, 216, .25), transparent 70%);
	pointer-events: none;
	z-index: 0;
}
.sn-404__badge {
	display: inline-flex; align-items: center; gap: 7px;
	padding: 7px 15px; border-radius: 999px;
	background: #EAF8F8; border: 1px solid #C7E9EB;
	color: #1F7B81;
	font-size: 13px; font-weight: 600;
	margin-bottom: 26px;
	position: relative;
}
.sn-404__title {
	font-family: 'Space Grotesk', sans-serif;
	font-weight: 700;
	font-size: clamp(72px, 16vw, 140px);
	letter-spacing: -0.04em;
	line-height: 1;
	margin-bottom: 16px;
	position: relative;
}
.sn-404__sub {
	font-size: 17px; line-height: 1.55;
	color: #5E7172;
	max-width: 480px;
	margin: 0 auto 32px;
	position: relative;
}
.sn-404__search {
	max-width: 440px; margin: 0 auto 30px;
	position: relative;
}
.sn-404__actions {
	display: flex; align-items: center; justify-content: center;
	gap: 14px; flex-wrap: wrap;
	position: relative;
}

/* Search form */
.sn-searchform__wrap {
	position: relative;
	display: flex; align-items: center;
	background: #fff;
	border: 1px solid #DCE7E7;
	border-radius: 14px;
	padding: 6px 6px 6px 16px;
	box-shadow: 0 10px 30px -16px rgba(14, 28, 30, .12);
	transition: border-color .15s;
}
.sn-searchform__wrap:focus-within { border-color: #7DD3D8; }
.sn-searchform__icon { color: #8A9999; flex: 0 0 auto; }
.sn-searchform__input {
	flex: 1;
	border: none; outline: none;
	font-size: 15px;
	padding: 11px 12px;
	color: #0E1C1E; background: transparent;
}
.sn-searchform__submit {
	flex: 0 0 auto;
	background: #7DD3D8; color: #08292B;
	font-weight: 700; font-size: 14px;
	padding: 10px 18px; border-radius: 10px;
	transition: background .15s;
}
.sn-searchform__submit:hover { background: #6BCBD0; }

/* ---------- Footer ---------- */
.sn-footer {
	border-top: 1px solid #EBF1F1;
	background: #FBFDFD;
}
.sn-footer__inner {
	max-width: 1080px; margin: 0 auto;
	padding: clamp(40px, 5vw, 56px) clamp(20px, 5vw, 40px) 28px;
}
.sn-footer__cols {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
	gap: 32px;
	margin-bottom: 36px;
}
.sn-footer__col--brand { min-width: 180px; }
.sn-footer__logo {
	display: flex; align-items: center; gap: 10px;
	font-family: 'Space Grotesk', sans-serif;
	font-weight: 700; font-size: 19px;
	letter-spacing: -0.02em;
	margin-bottom: 12px;
}
.sn-footer__badge {
	width: 28px; height: 28px; border-radius: 8px;
	background: #7DD3D8;
	display: inline-flex; align-items: center; justify-content: center;
	color: #08292B; font-size: 15px; font-weight: 700;
}
.sn-footer__tld { color: #2A8E94; }
.sn-footer__tagline {
	font-size: 13.5px; line-height: 1.6;
	color: #8A9999; max-width: 240px;
}
.sn-footer__heading {
	font-size: 12px; font-weight: 700;
	text-transform: uppercase; letter-spacing: .07em;
	color: #0E1C1E; margin-bottom: 14px;
}
.sn-footer__list { display: flex; flex-direction: column; gap: 10px; align-items: flex-start; }
.sn-footer__list li a,
.sn-footer__list li span {
	font-size: 13.5px; color: #5E7172; font-weight: 500;
	background: transparent;
	padding: 0;
	transition: color .15s;
	text-decoration: none;
}
.sn-footer__list li a:hover { color: #1F7B81; }
.sn-footer__bottom {
	border-top: 1px solid #EBF1F1;
	padding-top: 22px;
	display: flex; align-items: center; justify-content: space-between;
	flex-wrap: wrap; gap: 12px;
	font-size: 13px; color: #9FB0B0;
}

/* ---------- Widgets ---------- */
.sn-widget {
	margin-bottom: 26px;
	background: #fff;
	border: 1px solid #E6EDED;
	border-radius: 16px;
	padding: 20px;
}
.sn-widget__title {
	font-family: 'Space Grotesk', sans-serif;
	font-weight: 700; font-size: 16px;
	letter-spacing: -0.01em;
	margin-bottom: 12px;
}
.sn-widget ul li { padding: 5px 0; font-size: 14px; }
.sn-widget ul li a { color: #5E7172; transition: color .15s; }
.sn-widget ul li a:hover { color: #1F7B81; }

/* ---------- Responsive tweaks ---------- */
@media (max-width: 640px) {
	.sn-header__inner { padding: 10px 18px; gap: 10px; }
	.sn-logo { font-size: 18px; }
	.sn-nav__list > li > a, .sn-nav__link { font-size: 13px; padding: 6px 8px; }
	.sn-nav__cta { padding: 8px 13px; font-size: 13px; }
	.sn-result-card__name { padding-right: 96px; }
	.sn-shortlist-bar__inner { padding: 12px 16px; }
	.sn-article__nav { grid-template-columns: 1fr; }
}
@media (max-width: 480px) {
	.sn-form__row { flex-wrap: wrap; gap: 8px; }
	.sn-form__submit { width: 100%; justify-content: center; }
	.sn-shortlist-bar__cta { width: 100%; justify-content: center; }
}

/* ---------- Misc utility ---------- */
.sn-dot { color: #C2CFCF; }
[hidden] { display: none !important; }

/* ---------- Compatibility patches (final) ---------- */
.sn-home { display: block; }
.sn-how__step { display: flex; flex-direction: column; }
.sn-modal__inner--small { max-width: 440px; }

/* ---------- Brand view as full-screen overlay ---------- */
.sn-brand {
	position: fixed;
	inset: 0;
	z-index: 90;
	overflow-y: auto;
	-webkit-overflow-scrolling: touch;
}
body.sn-brand-open { overflow: hidden; }
body.sn-brand-open .sn-header,
body.sn-brand-open .sn-shortlist-bar,
body.sn-brand-open .sn-footer { display: none !important; }
