/* Croma – Pagina Studio */
.croma-studio-page,
.croma-studio-page * { box-sizing: border-box; }

.croma-studio-page {
	--croma-ink: #24211f;
	--croma-muted: #6c655f;
	--croma-warm: #faf8f4;
	--croma-stone: #ece7df;
	--croma-line: rgba(36,33,31,.16);
	--croma-max: 1180px;
	background: var(--croma-warm);
	color: var(--croma-ink);
	overflow: hidden;
}

.croma-studio-page img { display:block; width:100%; }
.croma-studio-wrap { width:min(calc(100% - 40px), var(--croma-max)); margin:0 auto; }
.croma-studio-section { padding:92px 0; }
.croma-studio-rule { height:1px; background:var(--croma-line); }

.croma-studio-page h1,
.croma-studio-page h2,
.croma-studio-page h3 { color:var(--croma-ink); font-weight:500; }

.croma-studio-page h1 {
	margin:0 0 28px;
	max-width:980px;
	font-size:clamp(52px,8vw,112px);
	line-height:.92;
	letter-spacing:-.05em;
}

.croma-studio-page h2 {
	margin:0 0 28px;
	max-width:760px;
	font-size:clamp(34px,5vw,68px);
	line-height:1;
	letter-spacing:-.035em;
}

.croma-studio-page h3 {
	margin:0 0 16px;
	font-size:clamp(26px,3vw,40px);
	line-height:1.05;
	letter-spacing:-.025em;
}

.croma-studio-eyebrow {
	margin:0 0 18px;
	font-size:12px;
	line-height:1;
	letter-spacing:.18em;
	text-transform:uppercase;
	font-weight:600;
}

.croma-studio-hero { padding:82px 0 68px; }
.croma-studio-hero-grid {
	display:grid;
	grid-template-columns:1.05fr .95fr;
	gap:70px;
	align-items:end;
}
.croma-studio-lead {
	max-width:760px;
	margin:0;
	font-size:clamp(20px,2.3vw,29px);
	line-height:1.5;
	color:var(--croma-muted);
}
.croma-studio-note {
	max-width:430px;
	margin:28px 0 0 auto;
	padding-top:20px;
	border-top:1px solid var(--croma-line);
	font-size:15px;
	line-height:1.7;
	color:var(--croma-muted);
}

.croma-studio-intro-grid {
	display:grid;
	grid-template-columns:.92fr 1.08fr;
	gap:72px;
	align-items:start;
}
.croma-studio-image {
	margin:0;
	aspect-ratio:4/5;
	overflow:hidden;
	background:var(--croma-stone);
}
.croma-studio-image img { height:100%; object-fit:cover; }
.croma-studio-caption {
	margin:12px 0 0;
	font-size:12px;
	line-height:1.5;
	letter-spacing:.11em;
	text-transform:uppercase;
	color:var(--croma-muted);
}
.croma-studio-intro-text { padding-top:18px; }
.croma-studio-copy { font-size:18px; line-height:1.78; color:var(--croma-muted); }
.croma-studio-copy p { margin:0 0 22px; }
.croma-studio-copy p:last-child { margin-bottom:0; }

.croma-studio-signature { padding:72px 0; background:var(--croma-ink); color:#fff; }
.croma-studio-signature p {
	margin:0;
	max-width:1050px;
	font-size:clamp(38px,6vw,82px);
	line-height:1.02;
	letter-spacing:-.04em;
}

.croma-studio-method-head {
	display:grid;
	grid-template-columns:.8fr 1.2fr;
	gap:70px;
	align-items:start;
	margin-bottom:62px;
}
.croma-studio-method-intro {
	max-width:620px;
	margin:0 0 0 auto;
	font-size:19px;
	line-height:1.75;
	color:var(--croma-muted);
}
.croma-studio-method-grid {
	display:grid;
	grid-template-columns:repeat(3,1fr);
	border-top:1px solid var(--croma-line);
	border-left:1px solid var(--croma-line);
}
.croma-studio-method-grid article {
	min-height:280px;
	padding:32px;
	border-right:1px solid var(--croma-line);
	border-bottom:1px solid var(--croma-line);
}
.croma-studio-method-grid span {
	display:block;
	margin-bottom:50px;
	font-size:12px;
	letter-spacing:.15em;
}
.croma-studio-method-grid p {
	margin:0;
	font-size:16px;
	line-height:1.7;
	color:var(--croma-muted);
}

.croma-studio-profiles { background:var(--croma-stone); }
.croma-studio-profiles-head {
	display:grid;
	grid-template-columns:1fr 1fr;
	gap:70px;
	align-items:end;
	margin-bottom:48px;
}
.croma-studio-profiles-head > p {
	max-width:560px;
	margin:0 0 0 auto;
	font-size:18px;
	line-height:1.75;
	color:var(--croma-muted);
}
.croma-studio-profile-grid { display:grid; grid-template-columns:1fr 1fr; gap:22px; }
.croma-studio-profile {
	position:relative;
	min-height:460px;
	padding:40px;
	display:flex;
	flex-direction:column;
	justify-content:space-between;
	background:var(--croma-warm);
	border:1px solid var(--croma-line);
	overflow:hidden;
}
.croma-studio-profile-letter {
	position:absolute;
	right:20px;
	top:-34px;
	font-size:clamp(150px,22vw,300px);
	line-height:1;
	font-weight:500;
	color:rgba(36,33,31,.045);
	pointer-events:none;
}
.croma-studio-profile > div,
.croma-studio-profile > a { position:relative; z-index:1; }
.croma-studio-profile-role {
	margin:0 0 14px;
	font-size:12px;
	letter-spacing:.16em;
	text-transform:uppercase;
}
.croma-studio-profile p:not(.croma-studio-profile-role) {
	max-width:500px;
	margin:0;
	font-size:17px;
	line-height:1.72;
	color:var(--croma-muted);
}
.croma-studio-profile a {
	display:inline-flex;
	align-items:center;
	gap:12px;
	margin-top:28px;
	color:var(--croma-ink);
	font-size:14px;
	font-weight:600;
	letter-spacing:.04em;
	text-decoration:none;
}
.croma-studio-profile a::after { content:"→"; transition:transform .2s ease; }
.croma-studio-profile a:hover::after { transform:translateX(5px); }

.croma-studio-services-grid {
	display:grid;
	grid-template-columns:.72fr 1.28fr;
	gap:74px;
}
.croma-studio-services {
	margin:0;
	padding:0;
	list-style:none;
	counter-reset:croma-services;
	border-top:1px solid var(--croma-line);
}
.croma-studio-services li {
	counter-increment:croma-services;
	display:grid;
	grid-template-columns:48px 1fr;
	gap:16px;
	padding:20px 0;
	border-bottom:1px solid var(--croma-line);
	font-size:clamp(19px,2.2vw,29px);
	line-height:1.25;
}
.croma-studio-services li::before {
	content:counter(croma-services, decimal-leading-zero);
	padding-top:4px;
	font-size:11px;
	letter-spacing:.14em;
	color:var(--croma-muted);
}

.croma-studio-cta { padding:92px 0; background:var(--croma-ink); color:#fff; }
.croma-studio-cta h2 { margin-bottom:0; color:#fff; }
.croma-studio-cta-grid {
	display:grid;
	grid-template-columns:1.12fr .88fr;
	gap:70px;
	align-items:end;
}
.croma-studio-cta-grid > div:last-child { max-width:480px; margin-left:auto; }
.croma-studio-cta-grid > div:last-child p {
	margin:0 0 28px;
	font-size:18px;
	line-height:1.75;
	color:rgba(255,255,255,.72);
}
.croma-studio-button {
	display:inline-flex;
	align-items:center;
	justify-content:center;
	min-height:52px;
	padding:14px 26px;
	border:1px solid rgba(255,255,255,.7);
	color:#fff !important;
	text-decoration:none !important;
	font-size:14px;
	font-weight:600;
	letter-spacing:.05em;
	transition:background .2s ease,color .2s ease;
}
.croma-studio-button:hover { background:#fff; color:var(--croma-ink) !important; }

@media (max-width:920px) {
	.croma-studio-section { padding:72px 0; }
	.croma-studio-hero-grid,
	.croma-studio-intro-grid,
	.croma-studio-method-head,
	.croma-studio-profiles-head,
	.croma-studio-services-grid,
	.croma-studio-cta-grid { grid-template-columns:1fr; gap:38px; }

	.croma-studio-note,
	.croma-studio-method-intro,
	.croma-studio-profiles-head > p,
	.croma-studio-cta-grid > div:last-child { margin-left:0; }

	.croma-studio-method-grid,
	.croma-studio-profile-grid { grid-template-columns:1fr; }

	.croma-studio-image { aspect-ratio:16/10; }
}

@media (max-width:600px) {
	.croma-studio-wrap { width:min(calc(100% - 28px), var(--croma-max)); }
	.croma-studio-hero { padding:58px 0 46px; }
	.croma-studio-section,
	.croma-studio-cta { padding:56px 0; }
	.croma-studio-signature { padding:52px 0; }
	.croma-studio-profile,
	.croma-studio-method-grid article { padding:28px 22px; }
	.croma-studio-profile { min-height:0; }
}