/*
 * Stone Cliff Digital — Homepage
 * Page-specific layout/decoration only. Colors, type, spacing, radii, and
 * motion all come from tokens.css; surfaces/typography/eyebrow/CTA come
 * from components.css. Loaded only on front-page.php.
 */

.home-main {
	overflow-x: hidden;
}

.home-section {
	position: relative;
	overflow: hidden;
}

.home-section__inner {
	position: relative;
	z-index: 2;
}

/* Gradient-text number/accent treatment shared by the credibility numerals
   and the service-card index numerals. */
.home-gradient-text {
	background: linear-gradient(160deg, var(--sc-blue-light), var(--sc-blue));
	-webkit-background-clip: text;
	background-clip: text;
	color: transparent;
}

/* -------------------------------------------------------------------- */
/* Hero                                                                  */
/* -------------------------------------------------------------------- */

.home-hero {
	background: linear-gradient(160deg, var(--sc-ink) 0%, #171B1F 55%, var(--sc-ink) 100%);
	padding: 118px 0 70px;
	clip-path: polygon(0 0, 100% 0, 100% 100%, 0 calc(100% - 84px));
}

.home-hero::before {
	content: "";
	position: absolute;
	right: -200px;
	top: -220px;
	width: 820px;
	height: 820px;
	border-radius: 50%;
	background: radial-gradient(circle, var(--sc-blue) 0%, transparent 70%);
	opacity: 0.3;
}

.home-hero::after {
	content: "";
	position: absolute;
	left: -180px;
	bottom: -280px;
	width: 520px;
	height: 520px;
	border-radius: 50%;
	background: radial-gradient(circle, var(--sc-blue-light) 0%, transparent 70%);
	opacity: 0.12;
}

.home-hero__body {
	display: flex;
	align-items: flex-start;
	gap: 20px;
}

.home-hero__copy {
	max-width: 600px;
	flex-shrink: 0;
	padding-top: 20px;
}

.home-hero__title {
	margin: 0 0 30px;
	font-size: 62px;
	letter-spacing: -2.2px;
	line-height: 1.06;
	color: var(--sc-text-ondark);
}

.home-hero__lede {
	max-width: 460px;
	margin: 0 0 36px;
	font-size: 18px;
	line-height: 1.65;
	color: var(--sc-text-ondark-mute);
}

.home-hero__actions {
	display: flex;
	align-items: center;
	gap: 18px;
	margin-bottom: 34px;
}

.home-hero__meta {
	display: flex;
	gap: 28px;
	padding-top: 22px;
	border-top: 1px solid rgba(255, 255, 255, 0.09);
}

.home-hero__meta-item {
	font-family: var(--sc-font-mono);
	font-size: 11px;
	letter-spacing: 1px;
	color: var(--sc-slate-300);
}

.home-hero__art {
	flex: 1;
	min-width: 0;
	position: relative;
}

.home-hero__art img {
	width: 820px;
	max-width: none;
	position: relative;
	left: -30px;
	top: -30px;
	filter: drop-shadow(0 40px 70px rgba(0, 0, 0, 0.55));
}

/* -------------------------------------------------------------------- */
/* Credibility / "Why it matters"                                       */
/* -------------------------------------------------------------------- */

.home-credibility {
	padding: 130px 0 156px;
	clip-path: polygon(0 0, 100% 0, 100% calc(100% - 64px), 0 100%);
}

.home-credibility__bg-1,
.home-credibility__bg-2 {
	position: absolute;
	max-width: none;
	pointer-events: none;
	filter: saturate(0.7) brightness(1.08) contrast(0.95) hue-rotate(18deg) saturate(1.3);
}

.home-credibility__bg-1 {
	left: -160px;
	bottom: -180px;
	width: 1750px;
	opacity: 0.85;
	-webkit-mask-image: radial-gradient(ellipse 1000px 560px at 50% 100%, black 60%, transparent 95%);
	mask-image: radial-gradient(ellipse 1000px 560px at 50% 100%, black 60%, transparent 95%);
}

.home-credibility__bg-2 {
	right: -420px;
	top: -260px;
	width: 1750px;
	opacity: 0.9;
	-webkit-mask-image: radial-gradient(ellipse 1050px 850px at 68% 32%, black 45%, transparent 90%);
	mask-image: radial-gradient(ellipse 1050px 850px at 68% 32%, black 45%, transparent 90%);
}

.home-credibility__heading {
	max-width: 620px;
	margin: 0 0 22px;
	font-size: 44px;
	line-height: 1.16;
	letter-spacing: -1.2px;
}

.home-credibility__lede {
	max-width: 520px;
	margin: 0 0 110px;
	font-size: 17px;
	line-height: 1.75;
	color: var(--sc-text-onlight-mute);
}

.home-credibility__grid {
	display: flex;
	position: relative;
}

.home-credibility__grid::before {
	content: "";
	position: absolute;
	top: 17px;
	left: 0;
	right: 0;
	height: 1px;
	background: linear-gradient(90deg, transparent 0%, var(--sc-blue) 15%, var(--sc-blue-light) 50%, var(--sc-blue) 85%, transparent 100%);
	opacity: 0.5;
}

.home-credibility__item {
	flex: 1;
	position: relative;
	padding-right: 40px;
}

.home-credibility__item:last-child {
	padding-right: 0;
}

.home-credibility__dot {
	width: 34px;
	height: 34px;
	border-radius: 50%;
	background: linear-gradient(135deg, var(--sc-blue), var(--sc-blue-dark));
	box-shadow: 0 0 0 6px var(--sc-paper), 0 0 22px rgba(42, 76, 255, 0.4);
	margin-bottom: 30px;
}

.home-credibility__num {
	font-size: 56px;
	font-weight: 800;
	line-height: 1;
	margin-bottom: 14px;
}

.home-credibility__item h3 {
	font-size: 19px;
	margin: 0 0 10px;
}

.home-credibility__item p {
	max-width: 280px;
	margin: 0;
	font-size: 14.5px;
	line-height: 1.65;
	color: var(--sc-text-onlight-mute);
}

/* -------------------------------------------------------------------- */
/* Core services                                                        */
/* -------------------------------------------------------------------- */

.home-services {
	padding: 126px 0 140px;
}

.home-services::before {
	content: "";
	position: absolute;
	left: -140px;
	top: 200px;
	width: 380px;
	height: 380px;
	border-radius: 50%;
	background: radial-gradient(circle, var(--sc-blue) 0%, transparent 70%);
	opacity: 0.06;
}

.home-services__header {
	display: flex;
	justify-content: space-between;
	align-items: flex-end;
	margin-bottom: 64px;
}

.home-services__header h2 {
	margin: 0;
}

.home-services__header p {
	max-width: 320px;
	margin: 0;
	font-size: 15px;
	color: var(--sc-text-onlight-mute);
	text-align: right;
}

.home-services__track {
	position: relative;
}

.home-services__track::before {
	content: "";
	position: absolute;
	left: -30px;
	top: 6%;
	bottom: 6%;
	width: 2px;
	background: linear-gradient(180deg, var(--sc-blue) 0%, var(--sc-blue-light) 35%, var(--sc-blue-light) 65%, var(--sc-blue) 100%);
	opacity: 0.35;
}

.home-services__track-dot {
	position: absolute;
	left: -34px;
	width: 9px;
	height: 9px;
	border-radius: 50%;
}

.service-card {
	display: flex;
	align-items: center;
	position: relative;
	overflow: hidden;
	background: linear-gradient(150deg, var(--sc-ink) 0%, #171B1F 100%);
	border-radius: var(--sc-radius-2xl);
	padding: 60px;
	margin-bottom: 28px;
	min-height: 420px;
	color: inherit;
	box-shadow: 0 0 0 1px rgba(108, 134, 255, 0.14), 0 40px 90px -50px rgba(20, 23, 26, 0.55);
	transition: transform var(--sc-transition-base), box-shadow var(--sc-transition-base);
}

.service-card:last-child {
	margin-bottom: 0;
}

.service-card--alt {
	background: linear-gradient(150deg, #1A1C1F 0%, #212529 100%);
}

.service-card:hover,
.service-card:focus-visible {
	transform: translateY(-4px);
	box-shadow: 0 0 0 1px rgba(108, 134, 255, 0.45), 0 46px 100px -50px rgba(20, 23, 26, 0.6);
}

.service-card__glow {
	position: absolute;
	right: -80px;
	top: -120px;
	width: 420px;
	height: 420px;
	border-radius: 50%;
	background: radial-gradient(circle, var(--sc-blue) 0%, transparent 70%);
	opacity: 0.32;
	transition: opacity var(--sc-transition-base);
}

.service-card:hover .service-card__glow,
.service-card:focus-visible .service-card__glow {
	opacity: 0.42;
}

.service-card__row {
	display: flex;
	align-items: center;
	gap: 20px;
	position: relative;
	width: 100%;
}

.service-card__copy {
	flex: 1;
	min-width: 0;
	max-width: 440px;
}

.service-card__index {
	font-size: 76px;
	font-weight: 800;
	line-height: 1;
	margin-bottom: 8px;
}

.service-card__kicker {
	font-family: var(--sc-font-mono);
	font-size: 11.5px;
	letter-spacing: 1.6px;
	color: var(--sc-blue-light);
	text-transform: uppercase;
	margin-bottom: 14px;
}

.service-card__title {
	font-size: 32px;
	letter-spacing: -0.6px;
	color: var(--sc-text-ondark);
	margin: 0 0 16px;
}

.service-card__desc {
	font-size: 16px;
	line-height: 1.7;
	color: var(--sc-text-ondark-mute);
	margin: 0;
}

.service-card__cta {
	margin-top: 28px;
	font-size: 15px;
	font-weight: 600;
	color: var(--sc-text-ondark);
	display: inline-flex;
	align-items: center;
	gap: 8px;
}

.service-card__cta-text {
	transition: color var(--sc-transition-fast);
}

.service-card__cta-arrow {
	display: inline-block;
	transition: transform var(--sc-transition-fast), color var(--sc-transition-fast);
}

.service-card:hover .service-card__cta-text,
.service-card:focus-visible .service-card__cta-text,
.service-card:focus-within .service-card__cta-text {
	color: var(--sc-blue-light);
}

.service-card:hover .service-card__cta-arrow,
.service-card:focus-visible .service-card__cta-arrow,
.service-card:focus-within .service-card__cta-arrow {
	color: var(--sc-blue-light);
	transform: translateX(7px);
}

.service-card__art {
	flex-shrink: 0;
	position: relative;
	display: flex;
	justify-content: center;
}

.service-card__art img {
	max-width: none;
	transition: filter var(--sc-transition-base), transform var(--sc-transition-base);
}

.service-card:hover .service-card__art img,
.service-card:focus-visible .service-card__art img {
	transform: scale(1.02);
}

.service-card--01 .service-card__art { width: 460px; }
.service-card--01 .service-card__art img { width: 440px; filter: drop-shadow(0 30px 50px rgba(0, 0, 0, 0.5)); }
.service-card--01:hover .service-card__art img { filter: drop-shadow(0 34px 60px rgba(0, 0, 0, 0.6)); }

.service-card--02 .service-card__art { width: 420px; }
.service-card--02 .service-card__art img { width: 400px; filter: drop-shadow(0 24px 44px rgba(20, 23, 26, 0.25)); }
.service-card--02:hover .service-card__art img { filter: drop-shadow(0 28px 54px rgba(20, 23, 26, 0.35)); }

.service-card--03 .service-card__art { width: 440px; }
.service-card--03 .service-card__art img { width: 420px; filter: drop-shadow(0 30px 50px rgba(0, 0, 0, 0.5)); }
.service-card--03:hover .service-card__art img { filter: drop-shadow(0 34px 60px rgba(0, 0, 0, 0.6)); }

.service-card--04 .service-card__art { width: 440px; }
.service-card--04 .service-card__art img { width: 420px; filter: drop-shadow(0 24px 44px rgba(20, 23, 26, 0.25)); }
.service-card--04:hover .service-card__art img { filter: drop-shadow(0 28px 54px rgba(20, 23, 26, 0.35)); }

/* -------------------------------------------------------------------- */
/* Why Stone Cliff Digital                                              */
/* -------------------------------------------------------------------- */

.home-why {
	padding: 140px 0;
}

.home-why__bg {
	position: absolute;
	right: 0;
	top: 0;
	height: 100%;
	width: auto;
	max-width: none;
	opacity: 0.5;
	mix-blend-mode: screen;
	pointer-events: none;
}

.home-why::after {
	content: "";
	position: absolute;
	inset: 0;
	background: linear-gradient(90deg, var(--sc-ink) 20%, transparent 60%);
}

.home-why__intro {
	max-width: 600px;
	margin-bottom: 80px;
}

.home-why__intro h2 {
	margin: 0;
}

.home-why__grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	max-width: 900px;
}

.home-why__item {
	padding: 42px 56px 42px 0;
	border-right: 1px solid var(--sc-slate-700);
	border-bottom: 1px solid var(--sc-slate-700);
}

.home-why__item:nth-child(2n) {
	padding-left: 56px;
	padding-right: 0;
	border-right: 0;
}

.home-why__item:nth-child(3),
.home-why__item:nth-child(4) {
	padding-bottom: 0;
	border-bottom: 0;
}

.home-why__item:nth-child(3) {
	padding-top: 42px;
}

.home-why__item:nth-child(4) {
	padding-top: 42px;
}

.home-why__bar {
	width: 28px;
	height: 2px;
	background: linear-gradient(90deg, var(--sc-blue), var(--sc-blue-light));
	margin-bottom: 24px;
}

.home-why__item h3 {
	font-size: 20.5px;
	margin: 0 0 12px;
}

.home-why__item p {
	font-size: 15px;
	line-height: 1.7;
	color: var(--sc-text-ondark-mute);
	margin: 0;
}

/* -------------------------------------------------------------------- */
/* Process                                                              */
/* -------------------------------------------------------------------- */

.home-process {
	padding: 140px 0;
}

.home-process::before {
	content: "";
	position: absolute;
	left: -160px;
	bottom: -160px;
	width: 460px;
	height: 460px;
	border-radius: 50%;
	background: radial-gradient(circle, var(--sc-blue) 0%, transparent 70%);
	opacity: 0.07;
}

.home-process::after {
	content: "";
	position: absolute;
	right: -120px;
	top: -160px;
	width: 520px;
	height: 520px;
	border-radius: 50%;
	background: radial-gradient(circle, var(--sc-blue-light) 0%, transparent 70%);
	opacity: 0.08;
}

.home-process__heading {
	margin: 0 0 16px;
}

.home-process__lede {
	max-width: 600px;
	margin: 0 0 84px;
	font-size: 17px;
	line-height: 1.7;
	color: var(--sc-text-onlight-mute);
}

/* -------------------------------------------------------------------- */
/* After launch                                                         */
/* -------------------------------------------------------------------- */

.home-after {
	padding: 150px 0 160px;
}

.home-after::before {
	content: "";
	position: absolute;
	left: -120px;
	top: 60%;
	width: 360px;
	height: 360px;
	border-radius: 50%;
	background: radial-gradient(circle, var(--sc-blue) 0%, transparent 70%);
	opacity: 0.08;
}

.home-after::after {
	content: "";
	position: absolute;
	right: -260px;
	top: -220px;
	width: 1000px;
	height: 1000px;
	border-radius: 50%;
	background: radial-gradient(circle, var(--sc-blue) 0%, transparent 62%);
	opacity: 0.28;
	mix-blend-mode: screen;
	pointer-events: none;
}

.home-after__glow {
	position: absolute;
	right: 40px;
	bottom: -180px;
	width: 640px;
	height: 640px;
	border-radius: 50%;
	background: radial-gradient(circle, var(--sc-blue-light) 0%, transparent 68%);
	opacity: 0.16;
	mix-blend-mode: screen;
	pointer-events: none;
}

.home-after__body {
	display: flex;
	align-items: center;
	gap: 36px;
}

.home-after__copy {
	max-width: 480px;
	flex-shrink: 0;
}

.home-after__heading {
	margin: 0 0 22px;
	font-size: 44px;
	letter-spacing: -1.1px;
}

.home-after__lede {
	max-width: 420px;
	margin: 0 0 44px;
	font-size: 16px;
	line-height: 1.7;
	color: var(--sc-text-ondark-mute);
}

.home-after__grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 1px;
	background: var(--sc-slate-700);
	max-width: 440px;
}

.home-after__item {
	background: var(--sc-ink);
	padding: 22px 24px 22px 0;
	transition: background var(--sc-transition-base);
}

.home-after__item:nth-child(2n) {
	padding-left: 24px;
	padding-right: 0;
}

.home-after__item:hover {
	background: var(--sc-ink-2);
}

.home-after__item-num {
	font-family: var(--sc-font-mono);
	font-size: 11px;
	color: var(--sc-blue-light);
	margin-bottom: 8px;
}

.home-after__item h3 {
	font-size: 15.5px;
	margin: 0 0 6px;
}

.home-after__item p {
	font-size: 13px;
	line-height: 1.55;
	color: var(--sc-text-ondark-mute);
	margin: 0;
}

.home-after__art {
	flex: 1;
	min-width: 0;
	display: flex;
	justify-content: center;
}

.home-after__art img {
	width: 640px;
	max-width: none;
	margin-right: -70px;
	filter: drop-shadow(0 40px 70px rgba(0, 0, 0, 0.55));
}

/* -------------------------------------------------------------------- */
/* Portfolio / Our Work                                                 */
/* -------------------------------------------------------------------- */

.home-work {
	padding: 140px 0;
}

.home-work::before {
	content: "";
	position: absolute;
	left: -140px;
	top: 120px;
	width: 380px;
	height: 380px;
	border-radius: 50%;
	background: radial-gradient(circle, var(--sc-blue) 0%, transparent 70%);
	opacity: 0.06;
}

.home-work__header {
	display: flex;
	justify-content: space-between;
	align-items: flex-end;
	margin-bottom: 24px;
}

.home-work__header h2 {
	max-width: 560px;
	margin: 0;
	font-size: 46px;
	letter-spacing: -1.2px;
}

.home-work__header p {
	max-width: 300px;
	margin: 0 0 6px;
	font-size: 15px;
	color: var(--sc-text-onlight-mute);
	text-align: right;
}

.home-work__feature {
	display: block;
	color: inherit;
	margin-top: 56px;
}

.home-work__browser {
	border-radius: var(--sc-radius-xl);
	overflow: hidden;
	margin-bottom: 36px;
	box-shadow: 0 0 0 1px var(--sc-slate-200), 0 44px 100px -50px rgba(20, 23, 26, 0.45);
	transition: box-shadow var(--sc-transition-base);
}

.home-work__feature:hover .home-work__browser,
.home-work__feature:focus-visible .home-work__browser {
	box-shadow: 0 0 0 1px var(--sc-blue-light), 0 48px 110px -50px rgba(20, 23, 26, 0.5);
}

.home-work__browser-bar {
	height: 36px;
	background: var(--sc-ink);
	display: flex;
	align-items: center;
	gap: 6px;
	padding: 0 18px;
}

.home-work__browser-dot {
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background: var(--sc-slate-700);
}

.home-work__browser-url {
	margin-left: 14px;
	font-family: var(--sc-font-mono);
	font-size: 11px;
	color: var(--sc-slate-300);
}

.home-work__shot {
	width: 100%;
	aspect-ratio: 21 / 9;
	overflow: hidden;
}

.home-work__shot img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: top;
	transition: transform 0.35s ease;
}

.home-work__feature:hover .home-work__shot img,
.home-work__feature:focus-visible .home-work__shot img {
	transform: scale(1.02);
}

.home-work__meta {
	display: flex;
	gap: 20px;
	padding: 0 4px;
}

.home-work__index {
	font-family: var(--sc-font-mono);
	font-size: 13px;
	color: var(--sc-slate-300);
	padding-top: 2px;
}

.home-work__kicker {
	font-family: var(--sc-font-mono);
	font-size: 11.5px;
	font-weight: 500;
	letter-spacing: 1px;
	color: var(--sc-blue);
	text-transform: uppercase;
	margin-bottom: 10px;
}

.home-work__title {
	font-size: 24px;
	margin: 0 0 10px;
	color: var(--sc-text-onlight);
	transition: color var(--sc-transition-fast);
}

.home-work__feature:hover .home-work__title,
.home-work__feature:focus-visible .home-work__title {
	color: var(--sc-blue);
}

.home-work__desc {
	max-width: 560px;
	margin: 0;
	font-size: 14.5px;
	line-height: 1.6;
	color: var(--sc-text-onlight-mute);
}

.home-work__cta-row {
	display: flex;
	justify-content: flex-end;
	margin-top: 20px;
	padding: 0 4px;
}

.home-work__cta {
	display: flex;
	align-items: center;
	gap: 8px;
	font-size: 13.5px;
	font-weight: 600;
	color: var(--sc-text-onlight);
	white-space: nowrap;
	padding: 10px 20px;
	border: 1px solid var(--sc-slate-200);
	border-radius: 30px;
}

.home-work__cta-arrow {
	display: inline-block;
	transition: transform var(--sc-transition-fast);
}

.home-work__cta:hover,
.home-work__cta:focus-visible {
	color: #fff;
	background: var(--sc-blue);
	border-color: var(--sc-blue);
}

.home-work__cta:hover .home-work__cta-arrow,
.home-work__cta:focus-visible .home-work__cta-arrow {
	transform: translateX(4px);
}

.home-work__grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 40px;
	margin-top: 76px;
}

.home-work__card {
	display: block;
	color: inherit;
}

.home-work__card .home-work__browser {
	margin-bottom: 24px;
	box-shadow: 0 0 0 1px var(--sc-slate-200), 0 34px 80px -45px rgba(20, 23, 26, 0.45);
}

.home-work__card:hover .home-work__browser,
.home-work__card:focus-visible .home-work__browser {
	box-shadow: 0 0 0 1px var(--sc-blue-light), 0 38px 90px -45px rgba(20, 23, 26, 0.5);
}

.home-work__card .home-work__browser-bar {
	height: 32px;
}

.home-work__card .home-work__browser-dot {
	width: 7px;
	height: 7px;
}

.home-work__card .home-work__shot {
	aspect-ratio: 4 / 3;
}

.home-work__card .home-work__shot img {
	object-position: left top;
}

.home-work__card:hover .home-work__shot img,
.home-work__card:focus-visible .home-work__shot img {
	transform: scale(1.02);
}

.home-work__card .home-work__meta {
	gap: 16px;
	padding: 0;
}

.home-work__card .home-work__index {
	font-size: 12px;
}

.home-work__card .home-work__title {
	font-size: 20px;
	margin-bottom: 8px;
}

.home-work__card .home-work__desc {
	font-size: 14px;
	max-width: none;
}

/* -------------------------------------------------------------------- */
/* Final CTA                                                            */
/* -------------------------------------------------------------------- */

.home-cta {
	padding: 164px 0;
	text-align: center;
}

.home-cta__bg {
	position: absolute;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%) scaleX(-1);
	width: 1600px;
	max-width: none;
	opacity: 0.4;
	mix-blend-mode: screen;
	pointer-events: none;
}

.home-cta::after {
	content: "";
	position: absolute;
	left: 50%;
	top: 50%;
	width: 800px;
	height: 800px;
	transform: translate(-50%, -50%);
	border-radius: 50%;
	background: radial-gradient(circle, var(--sc-blue) 0%, transparent 70%);
	opacity: 0.28;
}

.home-cta .cta-final__headline {
	max-width: 720px;
	margin-left: auto;
	margin-right: auto;
	font-size: 52px;
	font-weight: 800;
	letter-spacing: -1.4px;
	line-height: 1.06;
}

.home-cta .cta-final__copy {
	max-width: 560px;
}

/* -------------------------------------------------------------------- */
/* Responsive — tablet (<=1024px)                                       */
/* -------------------------------------------------------------------- */

@media (max-width: 1024px) {
	/* Hero */
	.home-hero {
		padding: 96px 0 56px;
		clip-path: polygon(0 0, 100% 0, 100% 100%, 0 calc(100% - 48px));
	}

	.home-hero__body {
		flex-direction: column;
		gap: 48px;
	}

	.home-hero__copy {
		max-width: 100%;
		padding-top: 0;
	}

	.home-hero__title {
		font-size: 46px;
		letter-spacing: -1.4px;
	}

	.home-hero__lede {
		max-width: 100%;
	}

	.home-hero__art {
		width: 100%;
		display: flex;
		justify-content: center;
	}

	.home-hero__art img {
		width: 100%;
		max-width: 560px;
		left: 0;
		top: 0;
	}

	/* Credibility / Why it matters */
	.home-credibility {
		padding: 96px 0 100px;
		clip-path: polygon(0 0, 100% 0, 100% calc(100% - 40px), 0 100%);
	}

	.home-credibility__heading {
		font-size: 34px;
		max-width: 100%;
	}

	.home-credibility__lede {
		max-width: 100%;
		margin-bottom: 64px;
	}

	.home-credibility__grid {
		flex-direction: column;
		gap: 48px;
	}

	.home-credibility__grid::before {
		display: none;
	}

	.home-credibility__item {
		padding-right: 0;
		padding-top: 24px;
		border-top: 1px solid var(--sc-slate-200);
	}

	.home-credibility__item p {
		max-width: 420px;
	}

	.home-credibility__bg-1,
	.home-credibility__bg-2 {
		opacity: 0.5;
	}

	/* Core services */
	.home-services {
		padding: 96px 0 100px;
	}

	.home-services__header {
		flex-direction: column;
		align-items: flex-start;
		gap: 16px;
		margin-bottom: 48px;
	}

	.home-services__header p {
		max-width: 100%;
		text-align: left;
	}

	.home-services__track::before,
	.home-services__track-dot {
		display: none;
	}

	.service-card {
		padding: 40px;
		margin-bottom: 20px;
		min-height: 0;
	}

	.service-card__row {
		flex-direction: column;
		align-items: flex-start;
		gap: 32px;
	}

	.service-card__copy {
		max-width: 100%;
	}

	.service-card__index {
		font-size: 56px;
	}

	.service-card__title {
		font-size: 26px;
	}

	.service-card--01 .service-card__art,
	.service-card--02 .service-card__art,
	.service-card--03 .service-card__art,
	.service-card--04 .service-card__art {
		width: 100%;
		justify-content: center;
	}

	.service-card--01 .service-card__art img,
	.service-card--02 .service-card__art img,
	.service-card--03 .service-card__art img,
	.service-card--04 .service-card__art img {
		width: 100%;
		max-width: 360px;
	}

	/* Why Stone Cliff Digital */
	.home-why {
		padding: 96px 0;
	}

	.home-why__intro {
		max-width: 100%;
		margin-bottom: 48px;
	}

	.home-why__grid {
		grid-template-columns: 1fr;
		max-width: 100%;
	}

	.home-why__item,
	.home-why__item:nth-child(2n) {
		padding: 32px 0;
		border-right: 0;
		border-bottom: 1px solid var(--sc-slate-700);
	}

	.home-why__item:nth-child(3) {
		padding-top: 32px;
	}

	.home-why__item:nth-child(4) {
		padding-bottom: 0;
		border-bottom: 0;
	}

	.home-why__bg {
		opacity: 0.25;
	}

	/* Process */
	.home-process {
		padding: 96px 0;
	}

	.home-process__lede {
		max-width: 100%;
		margin-bottom: 56px;
	}

	/* After launch */
	.home-after {
		padding: 96px 0 100px;
	}

	.home-after__body {
		flex-direction: column;
		gap: 48px;
	}

	.home-after__copy {
		max-width: 100%;
	}

	.home-after__heading {
		font-size: 34px;
	}

	.home-after__lede {
		max-width: 100%;
	}

	.home-after__art {
		width: 100%;
	}

	.home-after__art img {
		width: 100%;
		max-width: 480px;
		margin-right: 0;
	}

	/* Portfolio / Our Work */
	.home-work {
		padding: 96px 0;
	}

	.home-work__header {
		flex-direction: column;
		align-items: flex-start;
		gap: 12px;
		margin-bottom: 32px;
	}

	.home-work__header h2 {
		font-size: 36px;
		max-width: 100%;
	}

	.home-work__header p {
		max-width: 100%;
		text-align: left;
	}

	.home-work__feature {
		margin-top: 40px;
	}

	.home-work__cta-row {
		justify-content: flex-start;
	}

	.home-work__grid {
		grid-template-columns: 1fr;
		gap: 32px;
		margin-top: 48px;
	}

	/* Final CTA */
	.home-cta {
		padding: 100px 0;
	}

	.home-cta .cta-final__headline {
		font-size: 38px;
	}
}

/* -------------------------------------------------------------------- */
/* Responsive — phone (<=600px)                                         */
/* -------------------------------------------------------------------- */

@media (max-width: 600px) {
	/* Hero */
	.home-hero {
		padding: 80px 0 48px;
		clip-path: polygon(0 0, 100% 0, 100% 100%, 0 calc(100% - 32px));
	}

	.home-hero__title {
		font-size: 36px;
		letter-spacing: -1px;
	}

	.home-hero__lede {
		font-size: 16px;
		margin-bottom: 28px;
	}

	.home-hero__actions {
		flex-wrap: wrap;
		gap: 14px;
	}

	.home-hero__meta {
		flex-wrap: wrap;
		gap: 14px 24px;
	}

	.home-hero__art img {
		max-width: 380px;
	}

	/* Credibility / Why it matters */
	.home-credibility {
		padding: 72px 0 80px;
	}

	.home-credibility__heading {
		font-size: 28px;
	}

	.home-credibility__num {
		font-size: 44px;
	}

	/* Core services */
	.home-services {
		padding: 72px 0 80px;
	}

	.service-card {
		padding: 28px;
		border-radius: var(--sc-radius-xl);
	}

	.service-card__index {
		font-size: 44px;
	}

	.service-card__title {
		font-size: 22px;
	}

	.service-card__desc {
		font-size: 15px;
	}

	.service-card--01 .service-card__art img,
	.service-card--02 .service-card__art img,
	.service-card--03 .service-card__art img,
	.service-card--04 .service-card__art img {
		max-width: 280px;
	}

	/* Why Stone Cliff Digital */
	.home-why {
		padding: 72px 0;
	}

	/* Process */
	.home-process {
		padding: 72px 0;
	}

	/* After launch */
	.home-after {
		padding: 72px 0 80px;
	}

	.home-after__heading {
		font-size: 28px;
	}

	.home-after__grid {
		grid-template-columns: 1fr;
		max-width: 100%;
	}

	.home-after__item,
	.home-after__item:nth-child(2n) {
		padding: 20px 0;
	}

	/* Portfolio / Our Work */
	.home-work {
		padding: 72px 0;
	}

	.home-work__header h2 {
		font-size: 28px;
	}

	.home-work__shot {
		aspect-ratio: 16 / 9;
	}

	/* Final CTA */
	.home-cta {
		padding: 72px 0;
	}

	.home-cta__bg {
		width: 1000px;
	}

	.home-cta .cta-final__headline {
		font-size: 30px;
		letter-spacing: -0.6px;
	}
}

/* -------------------------------------------------------------------- */
/* Responsive — small phone (<=480px)                                   */
/* -------------------------------------------------------------------- */

@media (max-width: 480px) {
	.home-hero__title {
		font-size: 32px;
	}

	.home-hero__meta {
		gap: 10px 18px;
	}

	.home-credibility__heading {
		font-size: 25px;
	}

	.service-card__index {
		font-size: 36px;
	}

	.service-card__title {
		font-size: 20px;
	}

	.home-work__header h2 {
		font-size: 24px;
	}

	.home-cta .cta-final__headline {
		font-size: 26px;
	}
}