/* =========================================================================
   SUMBRA — Nosotros (5.5.0 final architecture)
   Every rule is scoped under .sumbra-nosotros so no other template changes.
   Width limits go on child elements, never on .sumbra-container itself
   (that narrows and re-centres the whole block).
   ========================================================================= */

/* Hero: two real paragraphs instead of one lead. */
.sumbra-nosotros .sumbra-hero__copy .sumbra-lead { margin-bottom: var(--sumbra-space-xs); }
.sumbra-nosotros .sumbra-hero__copy .sumbra-lead:last-child { margin-bottom: 0; }

/* Shared editorial split: heading column + comfortable reading column.
   minmax(0,1fr) so a long word can never widen the page. */
.sumbra-nos-split {
	display: grid;
	grid-template-columns: minmax(0, 5fr) minmax(0, 7fr);
	gap: var(--sumbra-space-xl);
	align-items: start;
}
.sumbra-nos-split > * { min-width: 0; }
.sumbra-nos-split__head .sumbra-h2,
.sumbra-nos-split__head .sumbra-display { margin-bottom: 0; }
.sumbra-nos-split__media { margin-top: var(--sumbra-space-md); aspect-ratio: 4/3; overflow: hidden; }
.sumbra-nos-split__media--portrait { aspect-ratio: 4/5; }
.sumbra-nos-split__media .sumbra-media__img { width: 100%; height: 100%; object-fit: cover; display: block; }

/* Reading column: ~62ch paragraphs, steady rhythm. */
.sumbra-nos-prose-col > .sumbra-body { margin: 0 0 var(--sumbra-space-sm); }
.sumbra-nos-prose-col > .sumbra-body:last-child { margin-bottom: 0; }
.sumbra-nos-prose-col > .sumbra-body:first-child { margin-top: 6px; }

/* Profile: the name is the loudest voice of its section. */
.sumbra-nosotros .sumbra-nos-profile { border-top: 1px solid var(--sumbra-lino); }
.sumbra-nos-profile__name { max-width: 9ch; }
.sumbra-nos-profile__lead { max-width: 28ch; margin: 0 0 var(--sumbra-space-md); }
/* Without a photo the lead sits under the name, so the left column is anchored by type. */
.sumbra-nos-split__head .sumbra-nos-profile__lead { margin: var(--sumbra-space-sm) 0 0; max-width: 22ch; }

/* Cómo miramos un espacio — Carbón interruption; type + hairlines only. */
.sumbra-nos-lenses { background-color: var(--sumbra-carbon); padding-block: var(--sumbra-space-xl); }
.sumbra-nos-lenses .sumbra-h2 { max-width: 16ch; margin-bottom: var(--sumbra-space-lg); }
.sumbra-nos-lenses__list {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: var(--sumbra-space-md);
	margin: 0;
}
.sumbra-nos-lenses__item { border-top: 1px solid var(--sumbra-piedra); padding-top: var(--sumbra-space-sm); min-width: 0; }
.sumbra-nos-lenses__item dt {
	font-family: var(--sumbra-font-body);
	font-size: 0.75rem;
	font-weight: 600;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: var(--sumbra-lino);
	margin: 0 0 var(--sumbra-space-xs);
}
.sumbra-nos-lenses__item dd {
	margin: 0;
	font-family: var(--sumbra-font-display);
	font-size: clamp(1.45rem, 1.2rem + 0.8vw, 1.85rem);
	line-height: 1.2;
	color: var(--sumbra-marfil);
	overflow-wrap: break-word;
}

/* Trabajo real — image-led, asymmetric, alternating. */
.sumbra-nos-work__heading { max-width: 18ch; margin-bottom: var(--sumbra-space-lg); }
.sumbra-nos-case {
	display: grid;
	grid-template-columns: minmax(0, 7fr) minmax(0, 5fr);
	gap: var(--sumbra-space-lg);
	align-items: center;
}
.sumbra-nos-case + .sumbra-nos-case { margin-top: var(--sumbra-space-xl); }
.sumbra-nos-case--flip { grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); }
.sumbra-nos-case--flip .sumbra-nos-case__media { order: 2; }
.sumbra-nos-case__media { aspect-ratio: 4/3; overflow: hidden; }
.sumbra-nos-case__media .sumbra-media__img { width: 100%; height: 100%; object-fit: cover; display: block; }
.sumbra-nos-case__copy { min-width: 0; }
.sumbra-nos-case__title {
	font-family: var(--sumbra-font-display);
	font-weight: 500;
	font-size: clamp(1.7rem, 1.4rem + 1.2vw, 2.4rem);
	line-height: 1.15;
	margin: 0 0 var(--sumbra-space-sm);
	color: var(--sumbra-carbon);
	overflow-wrap: break-word;
}
.sumbra-nos-case__copy .sumbra-body { margin-bottom: var(--sumbra-space-sm); }
/* No real photo yet: an editorial split (name + title left, text + link right)
   under a hairline, the same pattern as Nuestra historia. It stays
   intentional with one or two projects, never an empty image frame. When a
   verified photo becomes available the alternating image layout returns by itself. */
.sumbra-nos-case--text-only { grid-template-columns: minmax(0, 1fr); border-top: 1px solid var(--sumbra-lino); padding-top: var(--sumbra-space-md); }
.sumbra-nos-case--text-only + .sumbra-nos-case { margin-top: var(--sumbra-space-lg); }
.sumbra-nos-case--text-only .sumbra-nos-case__copy {
	display: grid;
	grid-template-columns: minmax(0, 5fr) minmax(0, 7fr);
	column-gap: var(--sumbra-space-xl);
	align-items: start;
}
.sumbra-nos-case--text-only .sumbra-nos-case__copy > .sumbra-eyebrow { grid-column: 1; grid-row: 1; }
.sumbra-nos-case--text-only .sumbra-nos-case__title { grid-column: 1; grid-row: 2 / span 2; margin: 0; }
.sumbra-nos-case--text-only .sumbra-nos-case__copy > .sumbra-body { grid-column: 2; grid-row: 1 / span 2; margin: 6px 0 var(--sumbra-space-sm); }
.sumbra-nos-case--text-only .sumbra-nos-case__copy > .sumbra-link-arrow { grid-column: 2; grid-row: 3; justify-self: start; }
.sumbra-nos-work__all { margin: var(--sumbra-space-lg) 0 0; }

/* Final CTA: heading + one sentence, one button. */
.sumbra-nos-cta__copy { min-width: 0; flex: 1 1 320px; }
.sumbra-nos-cta__copy .sumbra-display { margin-bottom: var(--sumbra-space-sm); }
.sumbra-nos-cta__copy .sumbra-body { margin-bottom: 0; max-width: 46ch; }

@media (max-width: 1024px) {
	.sumbra-nos-lenses__list { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--sumbra-space-lg) var(--sumbra-space-md); }
}
@media (max-width: 900px) {
	.sumbra-nos-split,
	.sumbra-nos-case,
	.sumbra-nos-case--flip { grid-template-columns: minmax(0, 1fr); gap: var(--sumbra-space-md); }
	.sumbra-nos-case--flip .sumbra-nos-case__media { order: 0; }
	.sumbra-nos-profile__name { max-width: none; }
	.sumbra-nos-case--text-only .sumbra-nos-case__copy { display: block; }
	.sumbra-nos-case--text-only .sumbra-nos-case__title { margin: 0 0 var(--sumbra-space-sm); }
	.sumbra-nos-case--text-only .sumbra-nos-case__copy > .sumbra-body { margin: 0 0 var(--sumbra-space-sm); }
	.sumbra-nos-case + .sumbra-nos-case { margin-top: var(--sumbra-space-lg); }
	.sumbra-nos-lenses { padding-block: var(--sumbra-space-lg); }
}
@media (max-width: 600px) {
	.sumbra-nos-lenses__list { grid-template-columns: minmax(0, 1fr); gap: var(--sumbra-space-md); }
	.sumbra-nos-lenses .sumbra-h2 { margin-bottom: var(--sumbra-space-md); }
}

/* 5.9.47 — match the 13px micro-label size (this sheet loads after sumbra.css). */
.sumbra-nos-lenses__item dt { font-size: 0.8125rem; }
