/* ==========================================================================
   SHANGCAI Clothing — 东方极简高级成衣 / Oriental Minimal Couture
   Design tokens first, then layout, then components.
   All spacing uses logical properties so RTL Arabic needs no overrides.
   ========================================================================== */

:root {
	/* palette — anchored on the badge */
	--sc-bg: #F5F0E8;          /* 暖米白 */
	--sc-ivory: #FAF7F1;       /* 象牙白 */
	--sc-ink: #1A1A1A;         /* 墨黑 */
	--sc-accent: #C0392B;      /* 徽章红 */
	--sc-gray: #8A8378;        /* 暖灰 */
	--sc-line: rgba(26, 26, 26, .12);
	--sc-line-soft: rgba(26, 26, 26, .07);
	--sc-grad-a: #E9689F;      /* accent gradient, weak areas only */
	--sc-grad-b: #7C4DD1;

	/* type — the first family in each stack is self-hosted (assets/fonts/) */
	--sc-font-display: "Noto Serif SC", "Source Han Serif SC", "Songti SC", "STSong", "SimSun", Georgia, "Times New Roman", serif;
	--sc-font-body: "Inter", "Source Han Sans SC", "Noto Sans SC", -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Microsoft YaHei", sans-serif;
	--sc-font-ar: "Cairo", "Noto Kufi Arabic", "Segoe UI", Tahoma, sans-serif;

	--sc-fs-hero: clamp(2.4rem, 5.2vw, 4.4rem);
	--sc-fs-h2: clamp(1.6rem, 3vw, 2.5rem);
	--sc-fs-h3: clamp(1.15rem, 1.8vw, 1.4rem);
	--sc-fs-body: 1rem;
	--sc-fs-small: .875rem;
	--sc-fs-micro: .78rem;

	--sc-lh-tight: 1.15;
	--sc-lh-body: 1.85;

	/* rhythm — Swiss editorial grid, generous whitespace */
	--sc-wrap: 1240px;
	--sc-gutter: clamp(1.25rem, 4vw, 3.5rem);
	--sc-section-y: clamp(3.25rem, 6.2vw, 6.25rem);
	--sc-gap: clamp(1.25rem, 2.5vw, 2.25rem);

	--sc-radius: 2px;
	--sc-transition: 220ms cubic-bezier(.22, .61, .36, 1);
}

/* --------------------------------------------------------------- base ---- */

*,
*::before,
*::after {
	box-sizing: border-box;
}

html {
	-webkit-text-size-adjust: 100%;
	scroll-behavior: smooth;
	/* the header is sticky, so anchored sections need to sit clear of it */
	scroll-padding-top: 96px;
}

body {
	margin: 0;
	background: var(--sc-bg);
	color: var(--sc-ink);
	font-family: var(--sc-font-body);
	font-size: var(--sc-fs-body);
	line-height: var(--sc-lh-body);
	-webkit-font-smoothing: antialiased;
	text-rendering: optimizeLegibility;
	overflow-x: hidden;
}

html[dir="rtl"] body {
	font-family: var(--sc-font-ar);
}

img {
	max-width: 100%;
	height: auto;
	display: block;
}

a {
	color: inherit;
	text-decoration: none;
}

a:hover {
	color: var(--sc-accent);
}

h1, h2, h3, h4 {
	margin: 0;
	font-family: var(--sc-font-display);
	font-weight: 600;
	line-height: var(--sc-lh-tight);
	letter-spacing: .01em;
}

h1 { font-size: var(--sc-fs-hero); }
h2 { font-size: var(--sc-fs-h2); }
h3 { font-size: var(--sc-fs-h3); }

p { margin: 0 0 1.1em; }
p:last-child { margin-block-end: 0; }

ul, ol { margin: 0; padding: 0; list-style: none; }

button { font: inherit; color: inherit; }

::selection {
	background: var(--sc-accent);
	color: #fff;
}

.sc-sr {
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0 0 0 0);
	white-space: nowrap;
	border: 0;
}

.sc-skip {
	position: absolute;
	inset-block-start: -100px;
	inset-inline-start: 1rem;
	z-index: 999;
	padding: .6rem 1rem;
	background: var(--sc-ink);
	color: var(--sc-ivory);
	transition: inset-block-start var(--sc-transition);
}

.sc-skip:focus {
	inset-block-start: 1rem;
	color: var(--sc-ivory);
}

:focus-visible {
	outline: 2px solid var(--sc-accent);
	outline-offset: 3px;
}

/* ------------------------------------------------------------- layout ---- */

.sc-wrap {
	width: 100%;
	max-width: var(--sc-wrap);
	margin-inline: auto;
	padding-inline: var(--sc-gutter);
}

.sc-main {
	display: block;
	min-height: 40vh;
}

.sc-section {
	padding-block: var(--sc-section-y);
}

.sc-section--ivory { background: var(--sc-ivory); }

.sc-section__head {
	max-width: 46rem;
	margin-block-end: clamp(2rem, 4vw, 3.5rem);
}

.sc-section__eyebrow {
	display: block;
	margin-block-end: .9rem;
	font-family: var(--sc-font-body);
	font-size: var(--sc-fs-micro);
	font-weight: 500;
	letter-spacing: .22em;
	text-transform: uppercase;
	color: var(--sc-gray);
}

.sc-section__title {
	font-size: var(--sc-fs-h2);
}

.sc-section__lead {
	margin-block-start: 1.1rem;
	color: var(--sc-gray);
	max-width: 40rem;
}

.sc-rule {
	height: 1px;
	border: 0;
	margin: 0;
	background: var(--sc-line);
}

.sc-grid {
	display: grid;
	gap: var(--sc-gap);
}

.sc-grid--cards { grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); }

/* ------------------------------------------------------------ buttons ---- */

.sc-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: .5rem;
	padding: .95rem 1.9rem;
	border: 1px solid var(--sc-ink);
	background: transparent;
	text-align: center;
	font-size: var(--sc-fs-small);
	font-weight: 500;
	letter-spacing: .06em;
	line-height: 1.2;
	cursor: pointer;
	transition: background var(--sc-transition), color var(--sc-transition), border-color var(--sc-transition);
}

.sc-btn--primary {
	background: var(--sc-accent);
	border-color: var(--sc-accent);
	color: #fff;
}

.sc-btn--primary:hover {
	background: var(--sc-ink);
	border-color: var(--sc-ink);
	color: var(--sc-ivory);
}

.sc-btn--ghost:hover {
	background: var(--sc-ink);
	color: var(--sc-ivory);
}

.sc-btn--quiet {
	border-color: var(--sc-line);
	padding: .7rem 1.3rem;
}

.sc-btn--quiet:hover {
	border-color: var(--sc-accent);
	color: var(--sc-accent);
}

/* ------------------------------------------------------------- header ---- */

.sc-header {
	position: sticky;
	inset-block-start: 0;
	z-index: 60;
	background: color-mix(in srgb, var(--sc-bg) 88%, transparent);
	backdrop-filter: saturate(140%) blur(10px);
	border-block-end: 1px solid var(--sc-line-soft);
}

.sc-header__inner {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--sc-gap);
	min-height: 84px;
}

.sc-header__brand { flex: 0 0 auto; }

.sc-brand {
	display: inline-flex;
	align-items: center;
	gap: .8rem;
}

.sc-brand__badge {
	flex: 0 0 auto;
	width: auto;
}

.sc-brand__name {
	font-family: var(--sc-font-display);
	font-size: 1rem;
	font-weight: 600;
	letter-spacing: .08em;
	white-space: nowrap;
}

.sc-nav { flex: 1 1 auto; min-width: 0; }

.sc-nav__list {
	display: flex;
	flex-wrap: nowrap;
	align-items: center;
	justify-content: center;
	gap: clamp(.6rem, 1.35vw, 1.4rem);
}

.sc-nav__list a {
	position: relative;
	display: inline-block;
	padding-block: .4rem;
	font-size: var(--sc-fs-small);
	letter-spacing: .02em;
	white-space: nowrap;
	color: var(--sc-ink);
}

.sc-nav__list a::after {
	content: "";
	position: absolute;
	inset-block-end: 0;
	inset-inline-start: 0;
	width: 0;
	height: 1px;
	background: var(--sc-accent);
	transition: width var(--sc-transition);
}

.sc-nav__list a:hover::after,
.sc-nav__list .current-menu-item > a::after {
	width: 100%;
}

.sc-header__actions {
	display: flex;
	align-items: center;
	gap: 1rem;
	flex: 0 0 auto;
}

.sc-header__cta { padding: .7rem 1.25rem; white-space: nowrap; }

/* language switcher */
.sc-lang {
	position: relative;
	font-size: var(--sc-fs-micro);
	letter-spacing: .08em;
	text-transform: uppercase;
}

.sc-lang__toggle {
	display: inline-flex;
	align-items: center;
	gap: .4rem;
	padding: .45rem .6rem;
	border: 1px solid var(--sc-line);
	background: transparent;
	cursor: pointer;
	color: var(--sc-ink);
	transition: border-color var(--sc-transition);
}

.sc-lang__toggle:hover { border-color: var(--sc-accent); }

.sc-lang__chev {
	width: 0;
	height: 0;
	border-inline-start: 4px solid transparent;
	border-inline-end: 4px solid transparent;
	border-block-start: 4px solid currentColor;
}

.sc-lang__list {
	position: absolute;
	inset-block-start: calc(100% + .4rem);
	inset-inline-end: 0;
	z-index: 70;
	min-width: 10rem;
	padding: .4rem 0;
	background: var(--sc-ivory);
	border: 1px solid var(--sc-line);
	box-shadow: 0 18px 36px -28px rgba(26, 26, 26, .6);
	display: none;
}

.sc-lang.is-open .sc-lang__list { display: block; }

.sc-lang__item a {
	display: block;
	padding: .5rem .9rem;
	color: var(--sc-gray);
	white-space: nowrap;
}

.sc-lang__item a:hover { background: var(--sc-bg); color: var(--sc-accent); }

.sc-lang__item.is-current a { color: var(--sc-ink); font-weight: 600; }

/* Arabic runs right-to-left: flip the dropdown anchor */
html[dir="rtl"] .sc-lang__list { inset-inline-end: auto; inset-inline-start: 0; }

/* mobile nav */
.sc-burger {
	display: none;
	flex-direction: column;
	justify-content: center;
	gap: 5px;
	width: 40px;
	height: 40px;
	padding: 0;
	border: 1px solid var(--sc-line);
	background: transparent;
	cursor: pointer;
}

.sc-burger__bar {
	display: block;
	width: 18px;
	height: 1px;
	margin-inline: auto;
	background: var(--sc-ink);
}

.sc-nav-mobile {
	border-block-start: 1px solid var(--sc-line-soft);
	background: var(--sc-bg);
}

.sc-nav-mobile__list {
	padding: 1rem var(--sc-gutter) 1.5rem;
}

.sc-nav-mobile__list li { border-block-end: 1px solid var(--sc-line-soft); }

.sc-nav-mobile__list a {
	display: block;
	padding-block: .85rem;
	font-size: var(--sc-fs-small);
}

/* ------------------------------------------------------------ archive ---- */

.sc-archive { padding-block: clamp(3rem, 6vw, 5.5rem); }

.sc-archive__head { margin-block-end: clamp(2rem, 4vw, 3rem); }

.sc-card__media { display: block; margin-block-end: 1.2rem; overflow: hidden; }

.sc-card__media img { transition: transform 520ms cubic-bezier(.22, .61, .36, 1); }

.sc-card:hover .sc-card__media img { transform: scale(1.03); }

.sc-card__title { font-size: var(--sc-fs-h3); }

.sc-card__text { margin-block-start: .7rem; color: var(--sc-gray); font-size: var(--sc-fs-small); }

.sc-empty { color: var(--sc-gray); }

/* ------------------------------------------------------------- footer ---- */

.sc-footer {
	padding-block-start: clamp(3rem, 6vw, 5rem);
	background: var(--sc-ink);
	color: rgba(250, 247, 241, .78);
}

.sc-footer__rule {
	height: 2px;
	margin-block-end: clamp(3rem, 6vw, 5rem);
	background: linear-gradient(90deg, var(--sc-grad-a), var(--sc-grad-b));
	opacity: .5;
}

.sc-footer__grid {
	display: grid;
	grid-template-columns: minmax(240px, 1.4fr) repeat(auto-fit, minmax(180px, 1fr));
	gap: var(--sc-gap);
	padding-block-end: clamp(2.5rem, 5vw, 4rem);
}

.sc-brand--footer .sc-brand__name { color: var(--sc-ivory); }

.sc-footer__blurb {
	margin-block-start: 1.2rem;
	max-width: 30rem;
	font-size: var(--sc-fs-small);
	line-height: 1.9;
	color: rgba(250, 247, 241, .62);
}

.sc-footer__title {
	margin-block-end: 1.1rem;
	font-family: var(--sc-font-body);
	font-size: var(--sc-fs-micro);
	font-weight: 600;
	letter-spacing: .2em;
	text-transform: uppercase;
	color: var(--sc-ivory);
}

.sc-footer__list li { margin-block-end: .6rem; font-size: var(--sc-fs-small); }

.sc-footer__list a { color: rgba(250, 247, 241, .78); }
.sc-footer__list a:hover { color: var(--sc-grad-a); }

.sc-footer__address { white-space: pre-line; }

.sc-footer__certs {
	display: flex;
	flex-wrap: wrap;
	gap: 1rem;
	align-items: center;
}

.sc-footer__cert {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: .4rem;
	font-size: var(--sc-fs-micro);
	color: rgba(250, 247, 241, .6);
}

.sc-footer__cert img { max-height: 44px; width: auto; }

.sc-footer__bottom {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 1rem;
	padding-block: 1.6rem;
	border-block-start: 1px solid rgba(250, 247, 241, .12);
}

.sc-footer__copy {
	margin: 0;
	font-size: var(--sc-fs-micro);
	color: rgba(250, 247, 241, .55);
}

.sc-footer__nav {
	display: flex;
	flex-wrap: wrap;
	gap: 1.2rem;
	font-size: var(--sc-fs-micro);
}

/* --------------------------------------------------------- responsive ---- */

@media (max-width: 1120px) {
	.sc-nav { display: none; }
	.sc-burger { display: flex; }
	.sc-header__inner { min-height: 72px; }
	.sc-brand__name { font-size: .98rem; }
}

@media (max-width: 560px) {
	.sc-header__cta { display: none; }
	.sc-footer__grid { grid-template-columns: 1fr; }
	.sc-footer__bottom { flex-direction: column; align-items: flex-start; }
}

/* ------------------------------------------------------------- blocks ---- */

.sc-block { position: relative; }

.sc-block--hero { padding-block: 0; }

.sc-block--interactive_cta { background: var(--sc-ivory); }

.sc-block--founder_quote { background: var(--sc-ivory); }

.sc-grid--3 { grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); }
.sc-grid--4 { grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); }

/* --------------------------------------------------------------- hero ---- */

.sc-hero {
	position: relative;
	display: flex;
	align-items: center;
	min-height: clamp(400px, 56vh, 600px);
	padding-block: clamp(4rem, 10vw, 8rem);
	background-color: var(--sc-ivory);
	background-image: var(--sc-hero-image, none);
	background-size: cover;
	background-position: center;
}

.sc-hero::after {
	content: "";
	position: absolute;
	inset: 0;
	background: linear-gradient(180deg, rgba(245, 240, 232, .55), rgba(245, 240, 232, .88));
	pointer-events: none;
}

.sc-hero__inner {
	position: relative;
	z-index: 1;
	max-width: 62rem;
}

.sc-hero__title {
	max-width: 22ch;
	font-size: var(--sc-fs-hero);
	letter-spacing: -.01em;
}

.sc-hero__subtitle {
	max-width: 44ch;
	margin-block: 1.4rem 2.4rem;
	color: #4a463f;
	font-size: clamp(1rem, 1.4vw, 1.15rem);
}

.sc-buttons {
	display: flex;
	flex-wrap: wrap;
	gap: .9rem;
}

/* ------------------------------------------------------------- entries --- */

.sc-entries { margin-block-start: .5rem; }

.sc-entry {
	position: relative;
	display: flex;
	flex-direction: column;
	gap: .6rem;
	padding: 1.9rem 1.6rem 2.2rem;
	background: var(--sc-ivory);
	border: 1px solid var(--sc-line-soft);
	transition: border-color var(--sc-transition), transform var(--sc-transition);
}

.sc-entry:hover {
	border-color: var(--sc-accent);
	transform: translateY(-3px);
}

.sc-entry__icon img { max-height: 44px; width: auto; }

.sc-entry__label {
	font-family: var(--sc-font-display);
	font-size: 1.12rem;
	font-weight: 600;
}

.sc-entry__text {
	color: var(--sc-gray);
	font-size: var(--sc-fs-small);
}

.sc-entry__more {
	position: absolute;
	inset-block-end: 1.4rem;
	inset-inline-end: 1.6rem;
	color: var(--sc-accent);
	transition: transform var(--sc-transition);
}

.sc-entry:hover .sc-entry__more { transform: translateX(4px); }

html[dir="rtl"] .sc-entry:hover .sc-entry__more { transform: translateX(-4px); }

/* --------------------------------------------------------------- intro --- */

.sc-intro {
	display: grid;
	grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr);
	gap: clamp(2rem, 5vw, 4.5rem);
	align-items: start;
}

/* When a two-column block has no media yet, the text must not sit beside an
   empty half. */
.sc-intro--no-media,
.sc-materials--no-media,
.sc-founder--no-media {
	grid-template-columns: 1fr;
}

.sc-intro__body { color: #3d3a35; }

.sc-intro__countries {
	display: flex;
	flex-wrap: wrap;
	gap: .5rem;
	margin-block-start: 1.8rem;
	padding-block-start: 1.4rem;
	border-block-start: 1px solid var(--sc-line);
}

.sc-intro__countries li {
	padding: .3rem .8rem;
	border: 1px solid var(--sc-line);
	font-size: var(--sc-fs-micro);
	letter-spacing: .04em;
	color: var(--sc-gray);
}

.sc-intro__media { position: relative; }

.sc-mini-card {
	margin: 0;
	margin-block-start: -3rem;
	margin-inline-start: clamp(1rem, 4vw, 3.5rem);
	padding: 1.4rem;
	background: var(--sc-ivory);
	border-inline-start: 2px solid var(--sc-accent);
	box-shadow: 0 18px 40px -32px rgba(26, 26, 26, .55);
}

.sc-mini-card img {
	width: 56px;
	height: 56px;
	object-fit: cover;
	border-radius: 50%;
	margin-block-end: .8rem;
}

.sc-mini-card blockquote {
	margin: 0 0 .7rem;
	font-family: var(--sc-font-display);
	font-size: 1rem;
}

.sc-mini-card__name { display: block; font-weight: 600; font-size: var(--sc-fs-small); }
.sc-mini-card__role { display: block; color: var(--sc-gray); font-size: var(--sc-fs-micro); }

/* --------------------------------------------------------------- tiles --- */

.sc-tile__media {
	display: block;
	margin-block-end: 1.1rem;
	overflow: hidden;
}

.sc-tile__media img { transition: transform 620ms cubic-bezier(.22, .61, .36, 1); }

.sc-tile:hover .sc-tile__media img { transform: scale(1.04); }

.sc-tile__title { font-size: var(--sc-fs-h3); }

.sc-tile__text { margin-block-start: .55rem; color: var(--sc-gray); font-size: var(--sc-fs-small); }

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

.sc-service {
	padding-block-start: 1.6rem;
	border-block-start: 2px solid var(--sc-ink);
}

.sc-service__icon { display: block; margin-block-end: 1rem; }
.sc-service__icon img { max-height: 40px; width: auto; }

.sc-service__title { font-size: 1.1rem; }

.sc-service__text { margin-block-start: .55rem; color: var(--sc-gray); font-size: var(--sc-fs-small); }

/* --------------------------------------------------------------- icta ---- */

.sc-icta { text-align: center; }

.sc-icta__inner { max-width: 40rem; margin-inline: auto; }

.sc-icta__title { font-size: var(--sc-fs-h2); }

.sc-icta__subtitle { margin-block: 1rem 2rem; color: var(--sc-gray); }

.sc-icta .sc-buttons { justify-content: center; }

.sc-icta__learn {
	display: inline-block;
	margin-block-start: 1.4rem;
	font-size: var(--sc-fs-small);
	color: var(--sc-gray);
	border-block-end: 1px solid var(--sc-line);
}

.sc-icta__learn:hover { color: var(--sc-accent); border-color: var(--sc-accent); }

/* --------------------------------------------------------------- tabs ---- */

.sc-tabs { margin-block-start: 1rem; }

.sc-tabs__nav {
	display: flex;
	flex-wrap: wrap;
	gap: clamp(1rem, 2.5vw, 2.2rem);
	padding-block-end: 1rem;
	border-block-end: 1px solid var(--sc-line);
}

.sc-tabs__tab {
	padding: 0 0 .5rem;
	border: 0;
	border-block-end: 2px solid transparent;
	background: none;
	font-size: var(--sc-fs-small);
	letter-spacing: .04em;
	color: var(--sc-gray);
	cursor: pointer;
	transition: color var(--sc-transition), border-color var(--sc-transition);
}

.sc-tabs__tab[aria-selected="true"] {
	color: var(--sc-ink);
	border-block-end-color: var(--sc-accent);
}

.sc-tabs__panel { padding-block-start: clamp(1.8rem, 3vw, 3rem); }

/* --------------------------------------------------------------- wall ---- */

.sc-wall__item { margin: 0; }

.sc-wall__item img { margin-block-end: .8rem; }

.sc-wall__item figcaption {
	font-family: var(--sc-font-display);
	font-size: var(--sc-fs-small);
}

/* -------------------------------------------------------------- steps ---- */

.sc-steps {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(148px, 1fr));
	gap: var(--sc-gap);
	counter-reset: sc-step;
}

.sc-step {
	position: relative;
	padding-block-start: 2.4rem;
	border-block-start: 1px solid var(--sc-line);
}

.sc-step::before {
	content: "";
	position: absolute;
	inset-block-start: -3px;
	inset-inline-start: 0;
	width: 5px;
	height: 5px;
	background: var(--sc-accent);
	border-radius: 50%;
}

.sc-step__no {
	display: block;
	font-family: var(--sc-font-display);
	font-size: 1.6rem;
	color: var(--sc-accent);
	line-height: 1;
	margin-block-end: .6rem;
}

.sc-step__label { display: block; font-weight: 600; }

.sc-step__text { display: block; margin-block-start: .4rem; color: var(--sc-gray); font-size: var(--sc-fs-small); }

/* ---------------------------------------------------------- materials ---- */

.sc-materials {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr);
	gap: clamp(1.5rem, 3vw, 3rem);
	align-items: center;
}

.sc-materials__media img { width: 100%; }

.sc-materials__text { color: #3d3a35; }

.sc-tags {
	display: flex;
	flex-wrap: wrap;
	gap: .5rem;
	margin-block-start: 1.2rem;
}

.sc-tag {
	padding: .3rem .85rem;
	border: 1px solid var(--sc-line);
	font-size: var(--sc-fs-micro);
	color: var(--sc-gray);
}

.sc-hook {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 1.5rem;
	margin-block-start: clamp(2rem, 4vw, 3.5rem);
	padding: clamp(1.5rem, 3vw, 2.4rem);
	background: var(--sc-ivory);
	border: 1px solid var(--sc-line-soft);
	border-inline-start: 3px solid var(--sc-accent);
}

.sc-hook__title { font-size: 1.15rem; }

.sc-hook__text { margin-block-start: .6rem; max-width: 48ch; color: var(--sc-gray); font-size: var(--sc-fs-small); }

/* ------------------------------------------------------------ rich text -- */

.sc-rich {
	display: grid;
	grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr);
	gap: clamp(2rem, 5vw, 4rem);
	align-items: center;
}

.sc-rich--text-only {
	grid-template-columns: minmax(0, 1fr);
	max-width: 52rem;
}

/* Image on the left: the media column is declared first in source order, so a
   logical "start" placement needs no markup change. */
.sc-rich--image-start .sc-rich__media { order: -1; }

.sc-rich__body { color: #3d3a35; margin-block-start: 1.1rem; }

.sc-rich__body h3 {
	margin-block: 1.6rem .6rem;
	font-size: 1.15rem;
}

.sc-rich__body ul {
	margin-block-end: 1.1em;
	padding-inline-start: 1.1rem;
	list-style: none;
}

.sc-rich__body li {
	position: relative;
	margin-block-end: .45rem;
	padding-inline-start: 1rem;
}

.sc-rich__body li::before {
	content: "";
	position: absolute;
	inset-block-start: .72em;
	inset-inline-start: 0;
	width: 5px;
	height: 5px;
	background: var(--sc-accent);
	border-radius: 50%;
}

.sc-rich__media img { width: 100%; }

.sc-rich .sc-buttons { margin-block-start: 1.6rem; }

@media (max-width: 900px) {
	.sc-rich { grid-template-columns: 1fr; }
	.sc-rich--image-start .sc-rich__media { order: 0; }
}

/* --------------------------------------------------------- contact form -- */

.sc-contact {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1.15fr);
	gap: clamp(2rem, 5vw, 4rem);
	align-items: start;
}

.sc-contact__details {
	margin-block-start: 1.6rem;
	border-block-start: 1px solid var(--sc-line);
}

.sc-contact__details li {
	display: flex;
	flex-wrap: wrap;
	gap: .3rem 1rem;
	padding-block: .8rem;
	border-block-end: 1px solid var(--sc-line-soft);
	font-size: var(--sc-fs-small);
}

.sc-contact__label {
	min-width: 4rem;
	color: var(--sc-gray);
	font-size: var(--sc-fs-micro);
	letter-spacing: .1em;
	text-transform: uppercase;
}

.sc-contact__value { white-space: pre-line; }

.sc-contact__map { margin-block-start: 1.8rem; }
.sc-contact__map iframe { width: 100%; min-height: 260px; border: 0; }

/* form */
.sc-form {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 1.1rem 1.2rem;
	padding: clamp(1.5rem, 3vw, 2.4rem);
	background: var(--sc-ivory);
	border: 1px solid var(--sc-line-soft);
}

.sc-form__row { display: flex; flex-direction: column; gap: .35rem; }

.sc-form__row--wide { grid-column: 1 / -1; }

.sc-form__label {
	font-size: var(--sc-fs-micro);
	letter-spacing: .1em;
	text-transform: uppercase;
	color: var(--sc-gray);
}

.sc-form__req { color: var(--sc-accent); }

.sc-form .sc-input {
	width: 100%;
	padding: .7rem .8rem;
	background: #fff;
	border: 1px solid var(--sc-line);
	border-radius: var(--sc-radius);
	font-family: inherit;
	font-size: var(--sc-fs-small);
	color: var(--sc-ink);
}

.sc-form .sc-input:focus {
	border-color: var(--sc-accent);
	outline: none;
}

.sc-form .sc-input:invalid:not(:placeholder-shown) { border-color: var(--sc-accent); }

.sc-form textarea.sc-input { resize: vertical; min-height: 7rem; }

.sc-form__hint { color: var(--sc-gray); font-size: var(--sc-fs-micro); }

.sc-form__error { color: var(--sc-accent); font-size: var(--sc-fs-micro); }

.sc-form__submit { grid-column: 1 / -1; justify-self: start; }

.sc-form__fine {
	grid-column: 1 / -1;
	margin: 0;
	color: var(--sc-gray);
	font-size: var(--sc-fs-micro);
}

/* honeypot — off-screen, never shown to people */
.sc-hp {
	position: absolute !important;
	inset-inline-start: -9999px;
	width: 1px;
	height: 1px;
	overflow: hidden;
}

/* status notice */
.sc-notice {
	grid-column: 1 / -1;
	margin: 0;
	padding: .85rem 1rem;
	border-inline-start: 3px solid;
	font-size: var(--sc-fs-small);
}

.sc-notice--ok { border-color: #1f8a5b; background: rgba(31, 138, 91, .07); }
.sc-notice--err { border-color: var(--sc-accent); background: rgba(192, 57, 43, .06); }

@media (max-width: 900px) {
	.sc-contact { grid-template-columns: 1fr; }
	.sc-form { grid-template-columns: 1fr; }
}

/* ------------------------------------------------------------ founder ---- */

.sc-founder {
	display: grid;
	grid-template-columns: minmax(0, .8fr) minmax(0, 1.4fr);
	gap: clamp(1.5rem, 4vw, 3.5rem);
	align-items: center;
}

.sc-founder__media img { width: 100%; }

.sc-founder__quote { margin: 0; }

.sc-founder__text {
	margin-block-end: 1.6rem;
	font-family: var(--sc-font-display);
	font-size: clamp(1.4rem, 2.6vw, 2.1rem);
	line-height: 1.5;
}

.sc-founder__meta { display: flex; flex-wrap: wrap; gap: .6rem 1rem; align-items: baseline; }

.sc-founder__name { font-weight: 600; }

.sc-founder__role { color: var(--sc-gray); font-size: var(--sc-fs-small); }

/* --------------------------------------------------------------- page ---- */

.sc-page { padding-block: clamp(3rem, 7vw, 6rem); }

.sc-page__title { margin-block-end: 1.5rem; }

/* ------------------------------------------------------ block responsive -- */

@media (max-width: 900px) {
	.sc-intro,
	.sc-materials,
	.sc-founder {
		grid-template-columns: 1fr;
	}

	.sc-mini-card {
		margin-block-start: 1.5rem;
		margin-inline-start: 0;
	}

	/* Capped, not a bare vh: on a very tall viewport a percentage-only height
	   would stretch the hero into empty space. */
	.sc-hero { min-height: clamp(320px, 52vh, 440px); }
}

/* --------------------------------------------------------------- a11y ---- */

@media (prefers-reduced-motion: reduce) {
	html { scroll-behavior: auto; }
	*, *::before, *::after {
		animation-duration: .001ms !important;
		transition-duration: .001ms !important;
	}
}
