/* AGENTS-ARCHITECTURE-01: self-contained request path and transport map. */
.landing-catalog .agents-architecture {
	--agents-border-soft: rgba(var(--l-text-rgb), 0.12);
	--agents-muted: rgba(var(--l-text-rgb), 0.64);
	--agents-dim: rgba(var(--l-text-rgb), 0.42);
	position: relative;
	padding: clamp(76px, 8vw, 124px) 0;
	border-top: 1px solid rgba(var(--l-text-rgb), 0.08);
	background: linear-gradient(180deg, rgba(var(--l-gold-rgb), 0.05), transparent 42%), var(--l-deep-surface);
}

.landing-catalog .agents-architecture .agents-section-head {
	display: grid;
	grid-template-columns: minmax(0, 1.1fr) minmax(260px, 0.7fr);
	align-items: end;
	gap: 50px;
	margin-bottom: 50px;
}

.landing-catalog .agents-architecture .agents-section-head > p,
.landing-catalog .agents-architecture .agents-transport p {
	color: var(--agents-muted);
	font-size: 13px;
	line-height: 1.65;
}

.landing-catalog .agents-architecture .agents-eyebrow,
.landing-catalog .agents-architecture .agents-panel-label {
	margin: 0 0 18px;
	color: var(--l-gold);
	font-size: 10px;
	font-weight: 720;
	letter-spacing: 0.18em;
	line-height: 1.3;
	text-transform: uppercase;
}

.landing-catalog .agents-architecture .agents-panel-label {
	display: block;
	margin-bottom: 11px;
	font-family: var(--shd-font-mono, ui-monospace, SFMono-Regular, Consolas, monospace);
	font-size: 9px;
	font-weight: 600;
	letter-spacing: 0.12em;
}

.landing-catalog .agents-path {
	position: relative;
	display: grid;
	grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr) auto minmax(0, 1fr) auto minmax(0, 1fr) auto minmax(0, 1fr);
	align-items: stretch;
	gap: 10px;
}

.landing-catalog .agents-path::before {
	position: absolute;
	top: 54px;
	right: 8%;
	left: 8%;
	height: 1px;
	content: '';
	background: linear-gradient(90deg, transparent, rgba(var(--l-gold-rgb), 0.36), var(--l-accent), rgba(var(--l-gold-rgb), 0.36), transparent);
	box-shadow: 0 0 15px rgba(var(--l-accent-rgb), 0.2);
}

.landing-catalog .agents-path__node {
	position: relative;
	z-index: 1;
	display: flex;
	min-width: 0;
	min-height: 168px;
	padding: 18px;
	flex-direction: column;
	align-items: flex-start;
	border: 1px solid var(--agents-border-soft);
	border-radius: 17px;
	background: linear-gradient(145deg, rgba(var(--l-surface-soft-rgb), 0.84), rgba(var(--l-surface-rgb), 0.66));
	box-shadow: inset 0 1px 0 rgba(var(--l-text-rgb), 0.06);
}

.landing-catalog .agents-path__node--accent {
	border-color: rgba(var(--l-accent-rgb), 0.54);
	background: linear-gradient(145deg, rgba(var(--l-accent-rgb), 0.14), rgba(var(--l-text-rgb), 0.03));
}

.landing-catalog .agents-path__number {
	display: grid;
	width: 32px;
	height: 32px;
	place-items: center;
	color: var(--l-gold);
	border: 1px solid rgba(var(--l-gold-rgb), 0.42);
	border-radius: 50%;
	background: rgba(var(--l-gold-rgb), 0.07);
	font-family: var(--shd-font-mono, ui-monospace, SFMono-Regular, Consolas, monospace);
	font-size: 10px;
	font-weight: 700;
	letter-spacing: 0.08em;
	line-height: 1;
}

.landing-catalog .agents-path__icon {
	display: grid;
	width: 20px;
	height: 20px;
	margin: 18px 0 0;
	color: var(--l-accent);
}

.landing-catalog .agents-path__node--accent .agents-path__icon { color: var(--l-gold); }
.landing-catalog .agents-path__icon .shd-svg-icon { width: 100%; height: 100%; }

.landing-catalog .agents-path__node h3 {
	margin: 13px 0 0;
	color: var(--l-text);
	font-size: 16px;
	font-weight: 620;
	line-height: 1.2;
}

.landing-catalog .agents-path__node p {
	margin: 8px 0 0;
	color: var(--agents-muted);
	font-size: 11px;
	line-height: 1.55;
}

.landing-catalog .agents-path__arrow {
	position: relative;
	z-index: 2;
	display: grid;
	width: 24px;
	height: 24px;
	align-self: center;
	place-items: center;
	margin-inline: -17px;
	color: var(--l-accent);
	border: 1px solid rgba(var(--l-accent-rgb), 0.32);
	border-radius: 50%;
	background: var(--l-deep-surface);
	line-height: 0;
}

.landing-catalog .agents-path__arrow .shd-svg-icon { width: 14px; height: 14px; }

.landing-catalog .agents-transport-grid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 13px;
	margin-top: 26px;
}

.landing-catalog .agents-transport {
	min-width: 0;
	padding: 23px 24px 25px;
	border: 1px solid var(--agents-border-soft);
	border-top: 2px solid var(--l-gold);
	border-radius: var(--l-radius-md);
	background: linear-gradient(145deg, rgba(var(--l-surface-soft-rgb), 0.68), rgba(var(--l-surface-rgb), 0.42));
	box-shadow: var(--l-shadow-soft), inset 0 1px 0 rgba(var(--l-text-rgb), 0.07);
	transition: transform 0.28s cubic-bezier(0.22, 1, 0.36, 1), border-color 0.28s ease, box-shadow 0.28s ease;
}

.landing-catalog .agents-transport--p2p { border-top-color: var(--l-positive); }
.landing-catalog .agents-transport--relay { border-top-color: var(--l-accent); }
.landing-catalog .agents-transport:hover { transform: translateY(-5px); border-color: rgba(var(--l-gold-rgb), 0.56); box-shadow: var(--l-shadow-hover), inset 0 1px 0 rgba(var(--l-text-rgb), 0.09); }

.landing-catalog .agents-transport h3 {
	margin: 0;
	color: var(--l-text);
	font-size: 20px;
	font-weight: 620;
	letter-spacing: -0.03em;
	line-height: 1.15;
}

.landing-catalog .agents-caption {
	margin: 19px 0 0;
	color: var(--agents-dim);
	font-size: 11px;
	line-height: 1.55;
}

@container landing-catalog-preview (max-width: 1120px) {
	.landing-catalog .agents-path__node { padding: 16px; }
	.landing-catalog .agents-path__node h3 { font-size: 15px; }
	.landing-catalog .agents-path__node p { font-size: 10px; }
}

@container landing-catalog-preview (max-width: 900px) {
	.landing-catalog .agents-architecture .agents-section-head { grid-template-columns: 1fr; align-items: start; gap: 22px; margin-bottom: 38px; }
	.landing-catalog .agents-path { grid-template-columns: 1fr; gap: 10px; }
	.landing-catalog .agents-path::before { top: 8%; right: auto; bottom: 8%; left: 15px; width: 1px; height: auto; background: linear-gradient(180deg, transparent, rgba(var(--l-gold-rgb), 0.36), var(--l-accent), rgba(var(--l-gold-rgb), 0.36), transparent); }
	.landing-catalog .agents-path__node { min-height: 0; padding: 20px; }
	.landing-catalog .agents-path__icon { position: absolute; top: 20px; right: 20px; margin: 0; }
	.landing-catalog .agents-path__arrow { margin: -2px 0 -2px 3px; transform: rotate(90deg); }
	.landing-catalog .agents-transport-grid { grid-template-columns: 1fr; }
}
