/* DU Worldview Wall — brick wall hero with a magnifying-glass cursor */

/* ---- Enfold section integration: let the wall run edge to edge ---- */
#top .du-wall-hero .container {
	max-width: none;
	width: 100%;
	padding: 0;
}
#top .du-wall-hero .content,
#top .du-wall-hero .avia_codeblock_section,
#top .du-wall-hero .avia_codeblock {
	padding: 0;
	margin: 0;
}
#top .du-wall-hero .avia_codeblock p:empty {
	display: none;
}

/* ---- Root ---- */
#top .duww {
	--duww-bw: 196px;   /* brick width  */
	--duww-bh: 82px;    /* brick height */
	--duww-gap: 7px;    /* mortar       */
	--duww-fs: 17px;    /* writing size */
	--duww-lens: 230px; /* lens diameter */
	--duww-brass-hi: #e3c169;
	--duww-brass: #b98d3a;
	--duww-brass-lo: #5e4315;
	--duww-navy: #0b1f45;
	--duww-orange: #f39c2b;

	position: relative;
	overflow: hidden;
	width: 100%;
	height: clamp(340px, 42vw, 580px);
	background: #2b2220;
	color: #fff;
	user-select: none;
	-webkit-user-select: none;
	isolation: isolate;
}
@media (pointer: fine) {
	#top .duww:hover { cursor: none; }
}
@media (max-width: 760px) {
	#top .duww {
		--duww-bw: 128px;
		--duww-bh: 54px;
		--duww-gap: 5px;
		--duww-fs: 11.5px;
		--duww-lens: 170px;
		height: clamp(380px, 110vw, 560px);
	}
}

/* ---- The wall ---- */
#top .duww__wall {
	position: absolute;
	inset: 0;
	background:
		radial-gradient(ellipse at 20% 0%, rgba(255, 230, 200, 0.10), transparent 55%),
		linear-gradient(180deg, #3a2f2c, #2c2321);
}
#top .duww__wall::after {
	/* grit + vignette */
	content: "";
	position: absolute;
	inset: 0;
	pointer-events: none;
	background:
		radial-gradient(ellipse at center, transparent 55%, rgba(0, 0, 0, 0.45) 100%),
		url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='160' height='160'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 0  0 0 0 0 0  0 0 0 0 0  0 0 0 0.18 0'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>");
}
#top .duww__brick {
	position: absolute;
	box-sizing: border-box;
	border-radius: 3px;
	padding: 0 12px;
	display: flex;
	align-items: center;
	justify-content: center;
	text-align: center;
	background:
		linear-gradient(135deg,
			hsl(var(--h) var(--s) calc(var(--l) + 7%)) 0%,
			hsl(var(--h) var(--s) var(--l)) 55%,
			hsl(var(--h) var(--s) calc(var(--l) - 6%)) 100%);
	box-shadow:
		inset 0 1px 0 rgba(255, 255, 255, 0.14),
		inset 0 -2px 0 rgba(0, 0, 0, 0.30),
		inset 1px 0 0 rgba(255, 255, 255, 0.05),
		0 1px 2px rgba(0, 0, 0, 0.45);
	font: 400 var(--duww-fs) / 1.08 "Permanent Marker", "Segoe Print", "Bradley Hand", cursive;
	letter-spacing: 0.01em;
	color: #f7efe2;
	text-shadow: 0 1px 0 rgba(0, 0, 0, 0.35);
}
#top .duww__brick span {
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 3;
	overflow: hidden;
	transform: rotate(var(--rot, 0deg));
	opacity: 0.30;
	filter: blur(0.7px);
}

/* Magnified copy inside the lens: sharp writing, lit bricks */
#top .duww__wall--mag .duww__brick { filter: brightness(1.14) saturate(1.06); }
#top .duww__wall--mag .duww__brick span { opacity: 1; filter: none; }
#top .duww__wall--mag::after { background: none; }

/* Faint navy wash across the top so the plate feels part of the scene */
#top .duww__shade {
	position: absolute;
	inset: 0;
	pointer-events: none;
	background: linear-gradient(180deg, rgba(11, 31, 69, 0.38) 0%, rgba(11, 31, 69, 0) 45%);
}

/* ---- Headline plate ---- */
#top .duww__plate {
	position: absolute;
	left: clamp(16px, 4vw, 64px);
	top: clamp(16px, 4vw, 56px);
	max-width: min(540px, 72%);
	padding: clamp(14px, 2vw, 24px) clamp(18px, 2.4vw, 30px);
	background: rgba(9, 27, 66, 0.86);
	border-left: 5px solid var(--duww-orange);
	box-shadow: 0 24px 60px rgba(0, 0, 0, 0.45);
	backdrop-filter: blur(2px);
	-webkit-backdrop-filter: blur(2px);
	z-index: 2;
}
#top .duww__kicker {
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.24em;
	text-transform: uppercase;
	color: #f5b95d !important;
	margin: 0 0 8px;
}
#top .duww__plate h2 {
	margin: 0 0 8px;
	color: #fff !important;
	font-weight: 900;
	font-size: clamp(22px, 3.2vw, 42px);
	line-height: 0.98;
	text-transform: uppercase;
	letter-spacing: 0.01em;
}
#top .duww__plate p {
	margin: 0;
	color: #e8eefc;
	font-size: clamp(13px, 1.25vw, 17px);
	line-height: 1.45;
}

/* ---- Hint ---- */
#top .duww__hint {
	position: absolute;
	right: clamp(12px, 2.5vw, 28px);
	bottom: clamp(12px, 2.5vw, 24px);
	display: flex;
	align-items: center;
	gap: 8px;
	max-width: 62%;
	padding: 8px 14px 8px 10px;
	border-radius: 999px;
	background: rgba(9, 27, 66, 0.82);
	color: #e8eefc;
	font-size: 12.5px;
	line-height: 1.3;
	box-shadow: 0 10px 30px rgba(0, 0, 0, 0.4);
	z-index: 6;
	transition: opacity 0.6s ease;
}
#top .duww__hint svg { flex: 0 0 auto; width: 18px; height: 18px; }
#top .duww.is-explored .duww__hint { opacity: 0.55; }
@media (max-width: 760px) {
	#top .duww__hint { font-size: 11.5px; max-width: 78%; }
}

/* ---- Magnifying glass ---- */
#top .duww__glass {
	position: absolute;
	left: 0;
	top: 0;
	width: var(--duww-lens);
	height: var(--duww-lens);
	pointer-events: none;
	z-index: 5;
	will-change: transform;
	filter: drop-shadow(0 26px 30px rgba(0, 0, 0, 0.55));
	opacity: 0;
	transition: opacity 0.5s ease;
}
#top .duww.is-ready .duww__glass { opacity: 1; }
#top .duww__handle {
	position: absolute;
	width: 30px;
	height: 128px;
	left: calc(50% + var(--duww-lens) * 0.3535 + 6px - 15px);
	top: calc(50% + var(--duww-lens) * 0.3535 + 6px - 4px);
	transform-origin: 15px 4px;
	transform: rotate(-45deg);
	border-radius: 15px;
	background:
		linear-gradient(90deg, #2a1c0a 0%, #6e4f1e 22%, #a67c34 48%, #6e4f1e 76%, #2a1c0a 100%);
	box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.5);
}
#top .duww__handle::after {
	/* brass ferrule where the handle meets the rim */
	content: "";
	position: absolute;
	left: -2px;
	right: -2px;
	top: 0;
	height: 22px;
	border-radius: 15px 15px 6px 6px;
	background: linear-gradient(90deg, var(--duww-brass-lo), var(--duww-brass-hi) 50%, var(--duww-brass-lo));
}
#top .duww__lens {
	position: absolute;
	inset: 0;
	border-radius: 50%;
	overflow: hidden;
	background: #33282a;
	transform: translateZ(0);
}
#top .duww__lens-inner {
	position: absolute;
	left: 0;
	top: 0;
	transform-origin: 0 0;
	will-change: transform;
}
#top .duww__lens::after {
	/* glass reflection + edge darkening */
	content: "";
	position: absolute;
	inset: 0;
	border-radius: 50%;
	pointer-events: none;
	background:
		radial-gradient(circle at 30% 24%, rgba(255, 255, 255, 0.36) 0%, rgba(255, 255, 255, 0.08) 30%, rgba(255, 255, 255, 0) 52%),
		radial-gradient(circle at 50% 50%, rgba(0, 0, 0, 0) 66%, rgba(0, 0, 0, 0.30) 100%);
}
#top .duww__rim {
	position: absolute;
	inset: -10px;
	border-radius: 50%;
	border: 10px solid;
	border-color: var(--duww-brass-hi) var(--duww-brass-lo) var(--duww-brass-lo) var(--duww-brass);
	box-shadow:
		0 0 0 1px #3b2a0c,
		inset 0 0 0 1px rgba(255, 255, 255, 0.35),
		inset 0 0 0 2px rgba(0, 0, 0, 0.25);
}

/* Screen-reader list of the ideas on the wall */
#top .duww__sr {
	position: absolute !important;
	width: 1px;
	height: 1px;
	margin: -1px;
	padding: 0;
	overflow: hidden;
	clip: rect(0 0 0 0);
	white-space: nowrap;
	border: 0;
}